Export value-cell component#133
Conversation
Signed-off-by: Grzegorz Krajniak <grzegorz.krajniak@sap.com>
📝 WalkthroughWalkthroughThis PR documents the ValueCell Angular component as a public API, exposes it through the package's public surface, and updates module imports to align with a restructured module layout. ValueCell renders field values with configurable display modes and styling. ChangesValueCell Documentation and Public API
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Suggested labels
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@docs/value-cell.md`:
- Line 3: The intro line incorrectly states "seven display modes" for ValueCell
but the doc lists eight (plain text/unset, secret, boolIcon, link, tooltip,
alert, img, button); update the sentence to "eight display modes" (or otherwise
enumerate eight modes) and search for any other references to "seven display
modes" in the ValueCell docs to update them as well; ensure the description for
the component (ValueCell / value-cell) consistently reflects the eight modes.
- Around line 18-19: The imports for ValueCell and FieldDefinition are using the
bare alias '`@openmfp/webcomponents`' which doesn't resolve; update the two import
statements that reference ValueCell and FieldDefinition to import from
'`@openmfp/webcomponents/declarative-ui`' instead so they use the configured
tsconfig path mapping.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 8ee5c43b-83db-459e-be2b-441b1fee2129
📒 Files selected for processing (22)
docs/value-cell.mdprojects/ngx/declarative-ui/public-api.tsprojects/ngx/declarative-ui/table/declarative-table/declarative-table.component.spec.tsprojects/ngx/declarative-ui/table/declarative-table/declarative-table.component.tsprojects/ngx/declarative-ui/value-cell/boolean-value/boolean-cell.constants.tsprojects/ngx/declarative-ui/value-cell/boolean-value/boolean-value.component.htmlprojects/ngx/declarative-ui/value-cell/boolean-value/boolean-value.component.scssprojects/ngx/declarative-ui/value-cell/boolean-value/boolean-value.component.spec.tsprojects/ngx/declarative-ui/value-cell/boolean-value/boolean-value.component.tsprojects/ngx/declarative-ui/value-cell/index.tsprojects/ngx/declarative-ui/value-cell/link-value/link-value.component.htmlprojects/ngx/declarative-ui/value-cell/link-value/link-value.component.scssprojects/ngx/declarative-ui/value-cell/link-value/link-value.component.spec.tsprojects/ngx/declarative-ui/value-cell/link-value/link-value.component.tsprojects/ngx/declarative-ui/value-cell/secret-value/secret-value.component.htmlprojects/ngx/declarative-ui/value-cell/secret-value/secret-value.component.scssprojects/ngx/declarative-ui/value-cell/secret-value/secret-value.component.spec.tsprojects/ngx/declarative-ui/value-cell/secret-value/secret-value.component.tsprojects/ngx/declarative-ui/value-cell/value-cell.component.htmlprojects/ngx/declarative-ui/value-cell/value-cell.component.scssprojects/ngx/declarative-ui/value-cell/value-cell.component.spec.tsprojects/ngx/declarative-ui/value-cell/value-cell.component.ts
| @@ -0,0 +1,345 @@ | |||
| # ValueCell | |||
|
|
|||
| A standalone cell renderer that displays a single field value from a resource object. Supports seven display modes (plain text, secret, boolean icon, link, tooltip, alert, image, button), conditional CSS rules, static CSS overrides, a copy-to-clipboard button, and a label badge mode. Used internally by `DeclarativeTable` and available for direct use in custom layouts. | |||
There was a problem hiding this comment.
Correct the display mode count.
The introduction states "seven display modes" but the documentation describes eight modes: plain text (unset), secret, boolIcon, link, tooltip, alert, img, and button.
📝 Proposed fix
-A standalone cell renderer that displays a single field value from a resource object. Supports seven display modes (plain text, secret, boolean icon, link, tooltip, alert, image, button), conditional CSS rules, static CSS overrides, a copy-to-clipboard button, and a label badge mode. Used internally by `DeclarativeTable` and available for direct use in custom layouts.
+A standalone cell renderer that displays a single field value from a resource object. Supports eight display modes (plain text, secret, boolean icon, link, tooltip, alert, image, button), conditional CSS rules, static CSS overrides, a copy-to-clipboard button, and a label badge mode. Used internally by `DeclarativeTable` and available for direct use in custom layouts.📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| A standalone cell renderer that displays a single field value from a resource object. Supports seven display modes (plain text, secret, boolean icon, link, tooltip, alert, image, button), conditional CSS rules, static CSS overrides, a copy-to-clipboard button, and a label badge mode. Used internally by `DeclarativeTable` and available for direct use in custom layouts. | |
| A standalone cell renderer that displays a single field value from a resource object. Supports eight display modes (plain text, secret, boolean icon, link, tooltip, alert, image, button), conditional CSS rules, static CSS overrides, a copy-to-clipboard button, and a label badge mode. Used internally by `DeclarativeTable` and available for direct use in custom layouts. |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@docs/value-cell.md` at line 3, The intro line incorrectly states "seven
display modes" for ValueCell but the doc lists eight (plain text/unset, secret,
boolIcon, link, tooltip, alert, img, button); update the sentence to "eight
display modes" (or otherwise enumerate eight modes) and search for any other
references to "seven display modes" in the ValueCell docs to update them as
well; ensure the description for the component (ValueCell / value-cell)
consistently reflects the eight modes.
| import { ValueCell } from '@openmfp/webcomponents'; | ||
| import { FieldDefinition } from '@openmfp/webcomponents'; |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Verify the package.json exports configuration to determine the correct import path
# Check the package.json in the declarative-ui project for exports mapping
fd -t f '^package\.json$' projects/ngx/declarative-ui --exec cat {} \; | jq '.exports // .name // empty'
# Also check the root package.json for path alias configuration
cat package.json | jq '.exports // empty'
# Check tsconfig for path mappings
fd -t f 'tsconfig.*\.json$' --exec sh -c 'echo "=== {} ===" && cat {} | jq ".compilerOptions.paths // empty"' \;Repository: openmfp/webcomponents
Length of output: 628
🏁 Script executed:
#!/bin/bash
# Check the root package.json exports configuration
cat package.json | jq '.exports'Repository: openmfp/webcomponents
Length of output: 70
🏁 Script executed:
#!/bin/bash
# Search for actual import patterns used in the codebase to see what's standard
rg "from\s+['\"]`@openmfp/webcomponents`" --no-heading -A 0 -c | head -50Repository: openmfp/webcomponents
Length of output: 270
🏁 Script executed:
#!/bin/bash
# Check what's actually exported from the declarative-ui public API
cat projects/ngx/declarative-ui/public-api.ts | head -50Repository: openmfp/webcomponents
Length of output: 203
🏁 Script executed:
#!/bin/bash
# Check the main entry point in package.json
cat package.json | jq '{main, name}'Repository: openmfp/webcomponents
Length of output: 120
🏁 Script executed:
#!/bin/bash
# View the actual imports in docs/value-cell.md around lines 18-19
cat -n docs/value-cell.md | head -25Repository: openmfp/webcomponents
Length of output: 1124
🏁 Script executed:
#!/bin/bash
# Find and check what `@openmfp/webcomponents` main entry point exports
fd -t f 'index.ts' projects/ngx --exec sh -c 'echo "=== {} ===" && cat {} | head -30' \;Repository: openmfp/webcomponents
Length of output: 2179
Update import paths to use the configured alias.
The imports from @openmfp/webcomponents (bare alias) cannot resolve because the package has no main entry point (main: null in package.json) and the tsconfig only defines the path mapping @openmfp/webcomponents/declarative-ui. Update lines 18-19 to:
import { ValueCell } from '`@openmfp/webcomponents/declarative-ui`';
import { FieldDefinition } from '`@openmfp/webcomponents/declarative-ui`';🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@docs/value-cell.md` around lines 18 - 19, The imports for ValueCell and
FieldDefinition are using the bare alias '`@openmfp/webcomponents`' which doesn't
resolve; update the two import statements that reference ValueCell and
FieldDefinition to import from '`@openmfp/webcomponents/declarative-ui`' instead
so they use the configured tsconfig path mapping.
Summary by CodeRabbit
Documentation
New Features