@simplysm/angular 14.0.8 → 14.0.9

package/README.md

@@ -1,6 +1,6 @@
 # @simplysm/angular
 
-Simplysm Angular 21 UI component library. Provides configuration, providers, directives, pipes, setup functions, hooks, layout components, form controls, navigation, data display, overlays, and visual components -- all designed for zoneless Angular with signal-based APIs.
+Angular 21 UI component library for Simplysm applications. Provides zoneless, signal-based components covering layout, forms, navigation, data display, overlays, theming, and application infrastructure.
 
 ## Installation
 
@@ -10,265 +10,261 @@ npm install @simplysm/angular
 
 ## API Overview
 
-### Commons & Configuration
+### Core
 
-| API | Type | Description |
-|-----|------|-------------|
-| `provideSdAngular` | function | Bootstrap function that registers all core providers, event plugins, error handler, and zoneless change detection |
-| `TXT_CHANGE_IGNORE_CONFIRM` | const string | Confirmation message text for discarding unsaved changes |
-
--> See [docs/commons-and-configuration.md](./docs/commons-and-configuration.md) for details.
-
-### Providers / Services
-
-| API | Type | Description |
-|-----|------|-------------|
-| `SdThemeProvider` | Injectable | Manages dark/light theme toggle via signal |
-| `SdAngularConfigProvider` | Injectable | Holds client application name |
-| `SdSystemLogProvider` | Injectable | Writes log messages to console and optional custom handler |
-| `SdNavigateWindowProvider` | Injectable | Opens navigation links in new windows/tabs |
-| `SdLocalStorageProvider` | Injectable | Typed localStorage wrapper scoped by client name |
-| `SdSystemConfigProvider` | Injectable | Persists/retrieves system configuration (localStorage or custom backend) |
-| `SdFileDialogProvider` | Injectable | Opens native file picker dialogs |
-| `SdServiceClientFactoryProvider` | Injectable | Manages WebSocket service client connections |
-| `SdAppStructureProvider` | Injectable (abstract) | Provides app menu/permission structure |
-| `SdAppStructureUtils` | abstract class | Static utilities for menu/permission computation |
-| `SdSharedDataProvider` | Injectable (abstract) | Real-time shared data with event-driven partial updates |
-| `SdModalProvider` | Injectable | Programmatically creates and shows modal dialogs |
-| `SdActivatedModalProvider` | Injectable | Injected inside a modal to access modal context |
-| `SdToastProvider` | Injectable | Shows toast notifications with severity levels |
-| `SdBusyProvider` | Injectable | Manages global busy/loading overlay |
-| `SdPrintProvider` | Injectable | Prints components or generates PDF buffers |
-
--> See [docs/providers.md](./docs/providers.md) for details.
-
-### Event Plugins
+Providers, plugins, directives, pipes, and utility functions that form the framework foundation.
 
 | API | Type | Description |
 |-----|------|-------------|
-| `SdOptionEventPlugin` | EventManagerPlugin | Adds `.capture`, `.passive`, `.once` modifiers to native events |
-| `SdResizeEventPlugin` | EventManagerPlugin | Provides `(sdResize)` event via ResizeObserver |
-| `ISdResizeEvent` | interface | Payload for sdResize event |
-| `SdIntersectionEventPlugin` | EventManagerPlugin | Provides `(sdIntersection)` event via IntersectionObserver |
-| `ISdIntersectionEvent` | interface | Payload for sdIntersection event |
-| `SdSaveCommandEventPlugin` | EventManagerPlugin | Provides `(sdSaveCommand)` event (Ctrl+S) |
-| `SdRefreshCommandEventPlugin` | EventManagerPlugin | Provides `(sdRefreshCommand)` event (Ctrl+Alt+L) |
-| `SdInsertCommandEventPlugin` | EventManagerPlugin | Provides `(sdInsertCommand)` event (Ctrl+Insert) |
-| `SdGlobalErrorHandlerPlugin` | ErrorHandler | Global error handler that displays errors and logs them |
-
--> See [docs/event-plugins.md](./docs/event-plugins.md) for details.
-
-### Directives
+| `provideSdAngular` | function | Bootstraps all core providers, plugins, error handler, and zoneless change detection |
+| `TXT_CHANGE_IGNORE_CONFIRM` | const | Confirmation message text for discarding unsaved changes |
+| `SdAngularConfigProvider` | provider | Holds client application name |
+| `SdThemeProvider` | provider | Dark/light theme toggle via signal |
+| `SdSystemLogProvider` | provider | Centralized logging with optional custom handler |
+| `SdAppStructureProvider` | abstract provider | Maps app structure to menus and permissions |
+| `SdAppStructureUtils` | class | Static utility methods for app structure operations |
+| `usePermsSignal` | function | Reactive permission checker as computed signal |
+| `SdFileDialogProvider` | provider | Native file picker dialog |
+| `SdLocalStorageProvider` | provider | Typed localStorage wrapper scoped by client name |
+| `SdSystemConfigProvider` | provider | Async config storage abstraction |
+| `SdServiceClientFactoryProvider` | provider | Manages ServiceClient connections by key |
+| `SdSharedDataProvider` | abstract provider | Event-driven shared data cache |
+| `SdSharedDataChangeEvent` | const | Event definition for shared data change notifications |
+| `SdNavigateWindowProvider` | provider | New-window navigation with auto-close |
+| `SdPrintProvider` | provider | Dynamic component rendering for print/PDF |
+| `SdGlobalErrorHandlerPlugin` | plugin | Global error handler with overlay |
+| `SdOptionEventPlugin` | plugin | `.capture`, `.passive`, `.once` event suffix support |
+| `SdResizeEventPlugin` | plugin | `sdResize` event via ResizeObserver |
+| `SdIntersectionEventPlugin` | plugin | `sdIntersection` event via IntersectionObserver |
+| `SdSaveCommandEventPlugin` | plugin | `sdSaveCommand` event (Ctrl+S) |
+| `SdRefreshCommandEventPlugin` | plugin | `sdRefreshCommand` event (Ctrl+Alt+L) |
+| `SdInsertCommandEventPlugin` | plugin | `sdInsertCommand` event (Ctrl+Insert) |
+| `SdEventsDirective` | directive | Exposes captured/passive/once events and custom events as outputs |
+| `SdRippleDirective` | directive | Material-style ripple effect |
+| `SdShowEffectDirective` | directive | Viewport entrance animation |
+| `SdInvalidDirective` | directive | Validation indicator |
+| `SdTypedTemplateDirective` | directive | Type-safe template context guard |
+| `SdItemOfTemplateDirective` | directive | Typed item iteration template |
+| `SdRouterLinkDirective` | directive | Enhanced router link with window/tab support |
+| `FormatPipe` | pipe | Formats DateTime, DateOnly, or string values |
+| `setSafeStyle` | function | Applies multiple CSS styles via Renderer2 |
+| `setupBgTheme` | function | Sets body background to theme color |
+| `setupRipple` | function | Attaches ripple effect to host element |
+| `setupRevealOnShow` | function | IntersectionObserver entrance animation |
+| `setupInvalid` | function | Validation indicator injection |
+| `setupModelHook` | function | Guards WritableSignal.set with predicate |
+| `setupCanDeactivate` | function | Deactivation guard for modal/route |
+| `setupCumulateSelectedKeys` | function | Syncs selectedItems and selectedItemKeys |
+| `setupCloserWhenSingleSelectionChange` | function | Auto-close on single selection change |
+| `useSdSystemConfigResource` | function | Angular resource backed by system config |
+| `useCurrentPageCodeSignal` | function | Current route page code signal |
+| `useFullPageCodeSignal` | function | Full URL page code signal |
+| `useViewTitleSignal` | function | Current view title signal |
+| `useViewTypeSignal` | function | View context type signal (page/modal/control) |
+| `useExpandingManager` | function | Tree expand/collapse state manager |
+| `useSelectionManager` | function | Item selection state manager |
+| `useSortingManager` | function | Multi-column sorting state manager |
+| `injectParent` | function | Finds parent component instance |
+| `TSdAppStructureItem` | type | Discriminated union for app structure nodes |
+| `ISdMenu` | interface | Menu tree node |
+| `ISdFlatMenu` | interface | Flattened menu entry |
+| `ISdPermission` | interface | Permission tree node |
+| `ISdFlatPermission` | interface | Flattened permission entry |
+| `ISharedDataBase` | interface | Base interface for shared data items |
+| `ISharedDataInfo` | interface | Shared data source registration descriptor |
+| `SharedDataHandle` | interface | Read handle for shared data |
+| `ISdResizeEvent` | interface | Resize event payload |
+| `ISdIntersectionEvent` | interface | Intersection event payload |
+| `ISdPrint` | interface | Printable component contract |
+| `ISdPrintInput` | interface | Print template input descriptor |
+| `SdItemOfTemplateContext` | interface | Template context for item iteration |
+| `ISortingDef` | interface | Sort definition (key + direction) |
+| `ISdStatePreset` | interface | Named state preset |
+| `TSdViewType` | type | `"page" \| "modal" \| "control"` |
+| `TDirectiveInputSignals` | type | Extracts input signal value types from component |
+| `TUndefToOptional` | type | Converts undefined-accepting props to optional |
 
-| API | Type | Description |
-|-----|------|-------------|
-| `SdEventsDirective` | Directive | Exposes capture/passive/once event outputs for template binding |
-| `SdRippleDirective` | Directive | Adds material-style ripple effect on pointer interaction |
-| `SdShowEffectDirective` | Directive | Animates element reveal on intersection |
-| `SdInvalidDirective` | Directive | Shows validation indicator with custom message |
-| `SdTypedTemplateDirective` | Directive | Provides type-safe ng-template context guard |
-| `SdItemOfTemplateDirective` | Directive | Provides typed iteration context for ng-template |
-| `SdItemOfTemplateContext` | interface | Context type for SdItemOfTemplateDirective |
-| `SdRouterLinkDirective` | Directive | Navigation directive with window/tab/outlet support |
-| `SdCardDirective` | Directive | Applies card styling class |
-| `SdPaneDirective` | Directive | Applies fill pane styling |
+→ See [docs/core.md](./docs/core.md) for details.
 
--> See [docs/directives.md](./docs/directives.md) for details.
+### Features
 
-### Pipes
+High-level feature components: address search, base container, data views, and shared-data controls.
 
 | API | Type | Description |
 |-----|------|-------------|
-| `FormatPipe` | Pipe | Formats DateTime, DateOnly, or string values using pattern |
-
--> See [docs/pipes.md](./docs/pipes.md) for details.
-
-### Setup Functions
+| `SdAddressSearchModal` | component | Korean address search via Daum Postcode widget |
+| `SdBaseContainerControl` | component | Page/modal layout shell with busy state and access restriction |
+| `SdDataSheetControl` | component | Presentation layer for data sheet views |
+| `AbsSdDataSheet` | abstract directive | Base for data sheet screens (CRUD, pagination, sorting) |
+| `SdDataSheetColumnDirective` | directive | Column definition extending SdSheetColumnDirective |
+| `SdDataDetailControl` | component | Presentation layer for detail/form screens |
+| `AbsSdDataDetail` | abstract directive | Base for detail screens (load, save, delete) |
+| `SdDataSelectButtonControl` | component | Modal-backed select button presentation |
+| `AbsSdDataSelectButton` | abstract directive | Base for select buttons backed by modal |
+| `SdSharedDataSelectControl` | component | Dropdown select backed by shared data |
+| `SdSharedDataSelectButtonControl` | component | Select button for shared data with numeric keys |
+| `SdSharedDataSelectListControl` | component | List-style selection for shared data |
+| `IAddress` | interface | Korean postal address |
+| `ISdDataSheetItemPropInfo` | interface | Metadata column property names |
+| `ISdDataSheetItemInfo` | interface | Per-item capability flags |
+| `ISdDataSheetSearchResult` | interface | Search result shape |
+| `ISdDataDetailDataInfo` | interface | Detail record metadata |
+
+→ See [docs/features.md](./docs/features.md) for details.
+
+### UI Layout
 
 | API | Type | Description |
 |-----|------|-------------|
-| `setupBgTheme` | function | Sets body background CSS variable based on theme |
-| `setupRipple` | function | Adds ripple effect to host element |
-| `setupRevealOnShow` | function | Animates element visibility on intersection |
-| `setupInvalid` | function | Adds form validation indicator to host element |
-| `setupModelHook` | function | Intercepts model signal set with async guard |
-| `setupCanDeactivate` | function | Registers route/modal can-deactivate guard |
-
--> See [docs/setup-functions.md](./docs/setup-functions.md) for details.
-
-### Hooks & Utilities
+| `SdDockContainerControl` | component | Flex container with dockable side panels |
+| `SdDockControl` | component | Dockable panel (top/bottom/left/right) with optional resize |
+| `SdPaneDirective` | directive | Fill-container scrollable pane |
+| `SdGapControl` | component | Configurable spacer element |
+| `SdViewControl` | component | Value-matched view container |
+| `SdViewItemControl` | component | Single view panel within SdViewControl |
+| `SdCardDirective` | directive | Card styling (shadow, border-radius) |
+| `SdKanbanBoardControl` | component | Kanban board with drag-and-drop and multi-selection |
+| `SdKanbanControl` | component | Individual kanban card |
+| `SdKanbanLaneControl` | component | Kanban lane (column) |
+| `ISdKanbanBoardDropInfo` | interface | Drop event payload |
+| `ISdKanbanDragRef` | interface | Dragged card reference |
+| `ISdKanbanDropTarget` | interface | Drop target reference |
+
+→ See [docs/ui-layout.md](./docs/ui-layout.md) for details.
+
+### UI Form
 
 | API | Type | Description |
 |-----|------|-------------|
-| `usePermsSignal` | function | Returns signal of permitted keys for given view codes |
-| `useSdSystemConfigResource` | function | Creates a resource for reading/writing system config |
-| `useCurrentPageCodeSignal` | function | Returns signal of current page code from activated route |
-| `useFullPageCodeSignal` | function | Returns signal of full page code from router URL |
-| `useViewTitleSignal` | function | Returns signal of current view title |
-| `useViewTypeSignal` | function | Returns signal of view type (page/modal/control) |
-| `TSdViewType` | type | `"page" \| "modal" \| "control"` |
-| `useExpandingManager` | function | Manages tree expand/collapse state |
-| `IExpandItemDef` | interface | Tree item definition with depth and parent |
-| `useSelectionManager` | function | Manages item selection state (single/multi) |
-| `useSortingManager` | function | Manages column sorting state |
-| `ISortingDef` | interface | Sort definition with key and direction |
-| `setSafeStyle` | function | Safely sets multiple CSS styles via Renderer2 |
-| `TDirectiveInputSignals` | type | Extracts InputSignal value types from component |
-| `TUndefToOptional` | type | Converts undefined-containing properties to optional |
+| `SdButtonControl` | component | Themed button with ripple |
+| `SdAnchorControl` | component | Inline anchor/link element |
+| `SdAdditionalButtonControl` | component | Content + button side-by-side layout |
+| `SdModalSelectButtonControl` | component | Button that opens a selection modal |
+| `SdTextfieldControl` | component | Multi-type text input (text, number, date, color, etc.) |
+| `SdTextareaControl` | component | Auto-growing multi-line text input |
+| `SdNumpadControl` | component | On-screen numeric keypad |
+| `SdRangeControl` | component | From/to range input |
+| `SdDateRangePicker` | component | Date range picker with period types |
+| `SdStatePresetControl` | component | Save/restore named state presets |
+| `SdCheckboxControl` | component | Checkbox with optional radio style and async guard |
+| `SdSwitchControl` | component | Toggle switch |
+| `SdCheckboxGroupControl` | component | Checkbox group container |
+| `SdCheckboxGroupItemControl` | component | Individual checkbox group item |
+| `SdTiptapEditorControl` | component | Rich text editor (TipTap) |
+| `SdSelectControl` | component | Dropdown select (single/multi, tree) |
+| `SdSelectItemControl` | component | Select option item |
+| `SdSelectButtonControl` | component | Button slot inside select |
+| `SdFormControl` | component | Form container with submit/invalid events |
+| `ISdSelectModal` | interface | Modal contract for select buttons |
+| `ISelectModalOutputResult` | interface | Selection modal output |
+| `TSdSelectModalInfo` | type | Modal info for select modals |
+| `TSdTextfieldTypes` | type | Maps type keys to value types |
+| `sdTextfieldTypes` | const | Array of all textfield type keys |
+| `TSelectModeValue` | type | `T \| T[] \| undefined` |
 
--> See [docs/hooks-and-utilities.md](./docs/hooks-and-utilities.md) for details.
+→ See [docs/ui-form.md](./docs/ui-form.md) for details.
 
-### App Structure Types
+### UI Navigation
 
 | API | Type | Description |
 |-----|------|-------------|
-| `TSdAppStructureItem` | type | Union of group and leaf structure items |
-| `ISdMenu` | interface | Menu tree node |
-| `ISdFlatMenu` | interface | Flattened menu entry |
-| `ISdPermission` | interface | Permission tree node |
-| `ISdFlatPermission` | interface | Flattened permission entry |
-
--> See [docs/providers.md](./docs/providers.md) for details (under SdAppStructureProvider).
-
-### Layout Components
+| `SdCollapseControl` | component | Animated collapse/expand container |
+| `SdCollapseIconControl` | component | Animated chevron icon |
+| `SdTabControl` | component | Tab bar container |
+| `SdTabItemControl` | component | Tab button |
+| `SdTabviewControl` | component | Combined tab bar + content panels |
+| `SdTabviewItemControl` | component | Tab content panel |
+| `SdPaginationControl` | component | Pagination bar with navigation |
+| `SdSidebarContainerControl` | component | Sidebar + content layout |
+| `SdSidebarControl` | component | Sidebar panel |
+| `SdSidebarMenuControl` | component | Recursive sidebar menu |
+| `SdSidebarUserControl` | component | Sidebar user section with dropdown |
+| `SdTopbarContainerControl` | component | Topbar + content layout |
+| `SdTopbarControl` | component | Top navigation bar |
+| `SdTopbarMenuControl` | component | Horizontal topbar menu |
+| `SdTopbarUserControl` | component | Topbar user dropdown |
+| `ISdSidebarMenu` | interface | Sidebar menu item |
+| `ISidebarUserMenu` | interface | Sidebar user menu |
+| `ISdTopbarMenu` | interface | Topbar menu item |
+| `ISdTopbarUserMenu` | interface | Topbar user menu item |
+
+→ See [docs/ui-navigation.md](./docs/ui-navigation.md) for details.
+
+### UI Data
 
 | API | Type | Description |
 |-----|------|-------------|
-| `SdDockContainerControl` | Component | Container for docked panels |
-| `SdDockControl` | Component | Dockable panel (top/bottom/left/right) with optional resize |
-| `SdPaneDirective` | Directive | Fill-area pane |
-| `SdGapControl` | Component | Spacing element with preset or pixel sizes |
-| `SdViewControl` | Component | View container for tab-like content switching |
-| `SdViewItemControl` | Component | Individual view item, shown when value matches parent |
-| `SdCardDirective` | Directive | Card styling |
-| `SdKanbanBoardControl` | Component | Kanban board with drag-and-drop support |
-| `SdKanbanLaneControl` | Component | Kanban lane (column) |
-| `SdKanbanControl` | Component | Kanban card item |
-
--> See [docs/layout-components.md](./docs/layout-components.md) for details.
-
-### Form Components
+| `SdListControl` | component | Simple list container |
+| `SdListItemControl` | component | List item with accordion/flat layout |
+| `SdSheetControl` | component | Full-featured data grid/spreadsheet |
+| `SdSheetColumnDirective` | directive | Sheet column definition |
+| `SdSheetConfigModal` | component | Sheet column configuration modal |
+| `ISdSheetColumnDef` | interface | Runtime column definition |
+| `ISdSheetHeaderDef` | interface | Header cell definition |
+| `ISdSheetConfig` | interface | Persisted sheet configuration |
+| `ISdSheetItemKeydownEventParam` | interface | Sheet keydown event payload |
 
-| API | Type | Description |
-|-----|------|-------------|
-| `SdButtonControl` | Component | Themed button with ripple effect |
-| `SdAnchorControl` | Component | Inline clickable anchor element |
-| `SdAdditionalButtonControl` | Component | Content with adjacent action buttons |
-| `SdModalSelectButtonControl` | Component | Button that opens a modal for selection |
-| `SdTextfieldControl` | Component | Text/number/date/time input field |
-| `SdTextareaControl` | Component | Multi-line text input |
-| `SdNumpadControl` | Component | On-screen numeric keypad |
-| `SdRangeControl` | Component | From-to range input pair |
-| `SdDateRangePicker` | Component | Date range picker with period type selector |
-| `SdCheckboxControl` | Component | Checkbox with optional radio mode |
-| `SdSwitchControl` | Component | Toggle switch |
-| `SdCheckboxGroupControl` | Component | Group container for checkbox items |
-| `SdCheckboxGroupItemControl` | Component | Individual item in checkbox group |
-| `SdSelectControl` | Component | Dropdown select (single/multi) |
-| `SdSelectItemControl` | Component | Item inside SdSelectControl |
-| `SdSelectButtonControl` | Component | Additional button slot inside SdSelectControl |
-| `SdTiptapEditorControl` | Component | Rich text editor powered by Tiptap |
-| `SdStatePresetControl` | Component | Save/load named state presets |
-| `SdFormControl` | Component | Form wrapper with submit/validation |
-
--> See [docs/form-components.md](./docs/form-components.md) for details.
-
-### Navigation Components
+→ See [docs/ui-data.md](./docs/ui-data.md) for details.
 
-| API | Type | Description |
-|-----|------|-------------|
-| `SdCollapseControl` | Component | Animated collapsible content |
-| `SdCollapseIconControl` | Component | Rotating chevron icon for collapse state |
-| `SdTabControl` | Component | Tab header container |
-| `SdTabItemControl` | Component | Individual tab header item |
-| `SdTabviewControl` | Component | Combined tab header + content view |
-| `SdTabviewItemControl` | Component | Tab content panel |
-| `SdPaginationControl` | Component | Page navigation with group support |
-| `SdSidebarContainerControl` | Component | Layout container with sidebar toggle |
-| `SdSidebarControl` | Component | Sidebar panel |
-| `SdSidebarMenuControl` | Component | Menu renderer for sidebar |
-| `ISdSidebarMenu` | interface | Sidebar menu item definition |
-| `SdSidebarUserControl` | Component | User info section in sidebar |
-| `ISidebarUserMenu` | interface | User menu definition |
-| `SdTopbarContainerControl` | Component | Layout container for topbar |
-| `SdTopbarControl` | Component | Top navigation bar |
-| `SdTopbarMenuControl` | Component | Menu renderer for topbar with dropdowns |
-| `ISdTopbarMenu` | interface | Topbar menu item definition |
-| `SdTopbarUserControl` | Component | User dropdown in topbar |
-| `ISdTopbarUserMenu` | interface | Topbar user menu definition |
-
--> See [docs/navigation-components.md](./docs/navigation-components.md) for details.
-
-### Data Display Components
+### UI Visual
 
 | API | Type | Description |
 |-----|------|-------------|
-| `SdListControl` | Component | List container |
-| `SdListItemControl` | Component | List item with accordion/flat layout |
-| `SdSheetControl` | Component | Data grid with sorting, selection, expanding, pagination |
-| `SdSheetColumnDirective` | Directive | Column definition for SdSheetControl |
-| `SdSheetConfigModal` | Component | Sheet column configuration modal |
-| `ISdSheetColumnDef` | interface | Column definition fields |
-| `ISdSheetConfig` | interface | Sheet configuration (column widths, ordering, visibility) |
-| `ISdSheetHeaderDef` | interface | Header cell definition |
-| `ISdSheetItemKeydownEventParam` | interface | Keydown event parameter for sheet items |
+| `SdLabelControl` | component | Inline badge/tag label |
+| `SdNoteControl` | component | Block-level note/callout |
+| `SdProgressControl` | component | Progress bar |
+| `SdCalendarControl` | component | Month calendar grid |
+| `SdBarcodeControl` | component | Barcode renderer (bwip-js) |
+| `SdEchartsControl` | component | Apache ECharts wrapper |
+| `TBarcodeType` | type | Union of ~100 barcode format strings |
 
--> See [docs/data-display-components.md](./docs/data-display-components.md) for details.
+→ See [docs/ui-visual.md](./docs/ui-visual.md) for details.
 
-### Overlay Components
+### UI Overlay
 
 | API | Type | Description |
 |-----|------|-------------|
-| `SdDropdownControl` | Component | Dropdown trigger container |
-| `SdDropdownPopupControl` | Component | Dropdown popup content |
-| `SdModalControl` | Component | Modal dialog with header, close, resize, drag |
-| `SdPromptModalControl` | Component | Built-in prompt modal (text input + confirm/cancel) |
-| `SdConfirmModalControl` | Component | Built-in confirm modal (confirm/cancel) |
-| `ISdModal` | interface | Interface for modal content components |
-| `ISdModalInfo` | interface | Modal creation info (title, type, inputs) |
-| `ISdModalOptions` | interface | Modal display options |
-| `SdToastControl` | Component | Individual toast notification |
-| `SdToastContainerControl` | Component | Toast container (fixed position) |
-| `ISdToast` | interface | Interface for custom toast content components |
-| `ISdToastInput` | interface | Toast creation info |
+| `SdDropdownControl` | component | Dropdown trigger with popup positioning |
+| `SdDropdownPopupControl` | component | Dropdown popup container |
+| `SdModalControl` | component | Modal dialog shell (drag, resize, focus-trap) |
+| `SdModalProvider` | provider | Programmatic modal creation |
+| `SdActivatedModalProvider` | provider | Access modal shell from content component |
+| `SdPromptModalControl` | component | Built-in text input prompt modal |
+| `SdConfirmModalControl` | component | Built-in confirm/cancel modal |
+| `SdToastControl` | component | Toast notification element |
+| `SdToastContainerControl` | component | Toast stacking container |
+| `SdToastProvider` | provider | Programmatic toast creation |
+| `SdBusyContainerControl` | component | Busy overlay with animation |
+| `SdBusyProvider` | provider | Global busy state manager |
+| `ISdModal` | interface | Modal content component contract |
+| `ISdModalInfo` | interface | Modal creation input descriptor |
+| `ISdModalOptions` | interface | Modal display/behavior options |
+| `ISdToast` | interface | Custom toast component contract |
+| `ISdToastInput` | interface | Toast creation input descriptor |
 | `TSdToastSeverity` | type | `"info" \| "success" \| "warning" \| "danger"` |
-| `TSdToastTheme` | type | Toast theme including severity and color themes |
-| `SdBusyContainerControl` | Component | Busy/loading overlay container |
+| `TSdToastTheme` | type | Toast theme options |
 | `TSdBusyType` | type | `"spinner" \| "bar" \| "cube"` |
 
--> See [docs/overlay-components.md](./docs/overlay-components.md) for details.
+→ See [docs/ui-overlay.md](./docs/ui-overlay.md) for details.
 
-### Visual Components
+### Styling
 
-| API | Type | Description |
-|-----|------|-------------|
-| `SdLabelControl` | Component | Colored label/badge |
-| `SdNoteControl` | Component | Note/callout block |
-| `SdProgressControl` | Component | Progress bar with percentage display |
-| `SdCalendarControl` | Component | Monthly calendar grid with item slots |
-| `SdBarcodeControl` | Component | Barcode/QR code renderer (bwip-js) |
-| `TBarcodeType` | type | Barcode type identifier |
-| `SdEchartsControl` | Component | ECharts wrapper component |
-
--> See [docs/visual-components.md](./docs/visual-components.md) for details.
-
-### Shared Data Types
+CSS classes, custom properties, themes, and SCSS mixins.
 
 | API | Type | Description |
 |-----|------|-------------|
-| `ISharedDataBase` | interface | Base interface for shared data items |
-| `ISharedDataInfo` | interface | Registration info for shared data |
-| `SharedDataHandle` | interface | Handle for accessing shared data items signal |
-| `SdSharedDataChangeEvent` | const | Event definition for shared data change notifications |
-| `ISdSelectModal` | interface | Interface for select modal components |
-| `ISelectModalOutputResult` | interface | Result from modal select |
-| `TSdSelectModalInfo` | type | Modal info type excluding select-specific inputs |
-| `TSelectModeValue` | type | `T \| T[] \| undefined` |
-| `TSdTextfieldTypes` | type | Map of textfield type names to value types |
-| `sdTextfieldTypes` | const | Array of all textfield type names |
-| `ISdStatePreset` | interface | Named state preset |
-
--> See [docs/form-components.md](./docs/form-components.md) for details.
+| `.flex-row`, `.flex-column`, `.flex-fill` | CSS class | Flex layout utilities |
+| `.grid`, `.grid-{1…12}` | CSS class | 12-column CSS grid |
+| `.card` | CSS class | Card styling (shadow, animation) |
+| `.bg-theme-*`, `.tx-trans-*`, `.bd-*` | CSS class | Color/border/background utilities |
+| `.p-*`, `.m-*`, `.gap-*` | CSS class | Spacing utilities |
+| `.form-control`, `.form-box`, `.table` | CSS class | Form and table layouts |
+| `--theme-{group}-{shade}` | CSS custom property | Theme color tokens |
+| `--gap-{key}` | CSS custom property | Spacing scale tokens |
+| `--font-size-{key}` | CSS custom property | Font size tokens |
+| `.sd-theme-dark` | theme class | Dark mode theme |
+
+→ See [docs/styling.md](./docs/styling.md) for details.
 
 ## Usage Examples
 
@@ -278,41 +274,33 @@ npm install @simplysm/angular
 import { provideSdAngular } from "@simplysm/angular";
 
 bootstrapApplication(AppComponent, {
-  providers: [
-    provideSdAngular({ clientName: "my-app" }),
-    provideRouter(routes),
-  ],
+  providers: [provideSdAngular({ clientName: "my-app" })],
 });
 ```
 
-### Modal Dialog
+### Data Sheet with CRUD
 
 ```typescript
-import { SdModalProvider, SdConfirmModalControl } from "@simplysm/angular";
-
-const modal = inject(SdModalProvider);
-
-const confirmed = await modal.showAsync(
-  {
-    title: "Confirm Action",
-    type: SdConfirmModalControl,
-    inputs: { message: "Are you sure?" },
-  },
-  { useCloseByBackdrop: false },
-);
+@Component({
+  selector: "my-data-sheet",
+  template: `
+    <sd-data-sheet>
+      <sd-data-sheet-column key="name" header="Name">
+        <ng-template #cellTpl let-item>{{ item.name }}</ng-template>
+      </sd-data-sheet-column>
+    </sd-data-sheet>
+  `,
+})
+class MyDataSheet extends AbsSdDataSheet<IFilter, IItem, number> {
+  // implement abstract members...
+}
 ```
 
-### Toast Notification
+### Show a Modal Programmatically
 
 ```typescript
-import { SdToastProvider } from "@simplysm/angular";
-
-const toast = inject(SdToastProvider);
-toast.success("Operation completed successfully");
-toast.danger("An error occurred");
-
-// With progress
-const progress = toast.info("Uploading...", true);
-progress.set(50); // 50%
-progress.set(100); // auto-dismiss after 1s
+const result = await this.modalProvider.showAsync(
+  { title: "Select Item", type: MySelectModal, inputs: {} },
+  { resizable: true },
+);
 ```

package/dist/core/commons.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"commons.d.ts","sourceRoot":"","sources":["..\\..\\src\\core\\commons.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,yBAAyB,QAGC,CAAC"}
+{"version":3,"file":"commons.d.ts","sourceRoot":"","sources":["../../src/core/commons.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,yBAAyB,QAGC,CAAC"}

package/dist/core/directives/sd-events.directive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sd-events.directive.d.ts","sourceRoot":"","sources":["..\\..\\..\\src\\core\\directives\\sd-events.directive.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;;AAE/E,qBAmBa,iBAAiB;IAE5B,eAAe,uDAAwB;IACvC,YAAY,uDAAwB;IACpC,oBAAoB,uDAAwB;IAG5C,mBAAmB,uDAAwB;IAC3C,iBAAiB,uDAAwB;IACzC,mBAAmB,uDAAwB;IAC3C,kBAAkB,uDAAwB;IAG1C,iBAAiB,0DAA2B;IAC5C,eAAe,0DAA2B;IAG1C,eAAe,uDAAwB;IACvC,cAAc,uDAAwB;IAGtC,iBAAiB,kDAAmB;IAGpC,gBAAgB,kDAAmB;IACnC,gBAAgB,kDAAmB;IACnC,wBAAwB,kDAAmB;IAG3C,eAAe,uDAAwB;IACvC,uBAAuB,uDAAwB;IAG/C,oBAAoB,uDAAwB;IAC5C,4BAA4B,uDAAwB;IACpD,mBAAmB,uDAAwB;IAC3C,2BAA2B,uDAAwB;IACnD,kBAAkB,uDAAwB;IAG1C,kBAAkB,sDAAuB;IACzC,mBAAmB,sDAAuB;IAC1C,mBAAmB,sDAAuB;IAC1C,cAAc,sDAAuB;IAGrC,oBAAoB,4DAA6B;IACjD,mBAAmB,2DAA4B;IAG/C,UAAU,2DAA4B;IAGtC,kBAAkB,0DAA2B;IAC7C,eAAe,0DAA2B;IAC1C,iBAAiB,0DAA2B;yCAvDjC,iBAAiB;2CAAjB,iBAAiB;CAwD7B"}
+{"version":3,"file":"sd-events.directive.d.ts","sourceRoot":"","sources":["../../../src/core/directives/sd-events.directive.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;;AAE/E,qBAmBa,iBAAiB;IAE5B,eAAe,uDAAwB;IACvC,YAAY,uDAAwB;IACpC,oBAAoB,uDAAwB;IAG5C,mBAAmB,uDAAwB;IAC3C,iBAAiB,uDAAwB;IACzC,mBAAmB,uDAAwB;IAC3C,kBAAkB,uDAAwB;IAG1C,iBAAiB,0DAA2B;IAC5C,eAAe,0DAA2B;IAG1C,eAAe,uDAAwB;IACvC,cAAc,uDAAwB;IAGtC,iBAAiB,kDAAmB;IAGpC,gBAAgB,kDAAmB;IACnC,gBAAgB,kDAAmB;IACnC,wBAAwB,kDAAmB;IAG3C,eAAe,uDAAwB;IACvC,uBAAuB,uDAAwB;IAG/C,oBAAoB,uDAAwB;IAC5C,4BAA4B,uDAAwB;IACpD,mBAAmB,uDAAwB;IAC3C,2BAA2B,uDAAwB;IACnD,kBAAkB,uDAAwB;IAG1C,kBAAkB,sDAAuB;IACzC,mBAAmB,sDAAuB;IAC1C,mBAAmB,sDAAuB;IAC1C,cAAc,sDAAuB;IAGrC,oBAAoB,4DAA6B;IACjD,mBAAmB,2DAA4B;IAG/C,UAAU,2DAA4B;IAGtC,kBAAkB,0DAA2B;IAC7C,eAAe,0DAA2B;IAC1C,iBAAiB,0DAA2B;yCAvDjC,iBAAiB;2CAAjB,iBAAiB;CAwD7B"}

package/dist/core/directives/sd-invalid.directive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sd-invalid.directive.d.ts","sourceRoot":"","sources":["..\\..\\..\\src\\core\\directives\\sd-invalid.directive.ts"],"names":[],"mappings":";AAGA,qBAIa,kBAAkB;IAC7B,cAAc,8CAAmD;;yCADtD,kBAAkB;2CAAlB,kBAAkB;CAM9B"}
+{"version":3,"file":"sd-invalid.directive.d.ts","sourceRoot":"","sources":["../../../src/core/directives/sd-invalid.directive.ts"],"names":[],"mappings":";AAGA,qBAIa,kBAAkB;IAC7B,cAAc,8CAAmD;;yCADtD,kBAAkB;2CAAlB,kBAAkB;CAM9B"}

package/dist/core/directives/sd-item-of-template.directive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sd-item-of-template.directive.d.ts","sourceRoot":"","sources":["..\\..\\..\\src\\core\\directives\\sd-item-of-template.directive.ts"],"names":[],"mappings":";AAEA,qBAIa,yBAAyB,CAAC,KAAK;IAC1C,MAAM,+CAA6B;IAEnC,MAAM,CAAC,sBAAsB,CAAC,YAAY,EACxC,IAAI,EAAE,yBAAyB,CAAC,YAAY,CAAC,EAC7C,IAAI,EAAE,OAAO,GACZ,IAAI,IAAI,uBAAuB,CAAC,YAAY,CAAC;yCANrC,yBAAyB;2CAAzB,yBAAyB;CASrC;AAED,MAAM,WAAW,uBAAuB,CAAC,KAAK;IAC5C,SAAS,EAAE,KAAK,CAAC;IACjB,IAAI,EAAE,KAAK,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf"}
+{"version":3,"file":"sd-item-of-template.directive.d.ts","sourceRoot":"","sources":["../../../src/core/directives/sd-item-of-template.directive.ts"],"names":[],"mappings":";AAEA,qBAIa,yBAAyB,CAAC,KAAK;IAC1C,MAAM,+CAA6B;IAEnC,MAAM,CAAC,sBAAsB,CAAC,YAAY,EACxC,IAAI,EAAE,yBAAyB,CAAC,YAAY,CAAC,EAC7C,IAAI,EAAE,OAAO,GACZ,IAAI,IAAI,uBAAuB,CAAC,YAAY,CAAC;yCANrC,yBAAyB;2CAAzB,yBAAyB;CASrC;AAED,MAAM,WAAW,uBAAuB,CAAC,KAAK;IAC5C,SAAS,EAAE,KAAK,CAAC;IACjB,IAAI,EAAE,KAAK,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf"}

package/dist/core/directives/sd-ripple.directive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sd-ripple.directive.d.ts","sourceRoot":"","sources":["..\\..\\..\\src\\core\\directives\\sd-ripple.directive.ts"],"names":[],"mappings":";AAGA,qBAIa,iBAAiB;IAC5B,OAAO,qEAAuE;;yCADnE,iBAAiB;2CAAjB,iBAAiB;CAM7B"}
+{"version":3,"file":"sd-ripple.directive.d.ts","sourceRoot":"","sources":["../../../src/core/directives/sd-ripple.directive.ts"],"names":[],"mappings":";AAGA,qBAIa,iBAAiB;IAC5B,OAAO,qEAAuE;;yCADnE,iBAAiB;2CAAjB,iBAAiB;CAM7B"}

package/dist/core/directives/sd-router-link.directive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sd-router-link.directive.d.ts","sourceRoot":"","sources":["..\\..\\..\\src\\core\\directives\\sd-router-link.directive.ts"],"names":[],"mappings":";AAIA,qBAQa,qBAAqB;IAChC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAkB;IAC1C,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAoC;IAE/D,MAAM;cAEM,MAAM;iBACH,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;iBACtB;YACP,KAAK,CAAC,EAAE,MAAM,CAAC;YACf,MAAM,CAAC,EAAE,MAAM,CAAC;SACjB;qBACY,MAAM;sBACL,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;mBAGA;IAEpC,OAAO,CAAC,KAAK,EAAE,UAAU,GAAG,OAAO,CAAC,IAAI,CAAC;yCAlBpC,qBAAqB;2CAArB,qBAAqB;CA4DjC"}
+{"version":3,"file":"sd-router-link.directive.d.ts","sourceRoot":"","sources":["../../../src/core/directives/sd-router-link.directive.ts"],"names":[],"mappings":";AAIA,qBAQa,qBAAqB;IAChC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAkB;IAC1C,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAoC;IAE/D,MAAM;cAEM,MAAM;iBACH,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;iBACtB;YACP,KAAK,CAAC,EAAE,MAAM,CAAC;YACf,MAAM,CAAC,EAAE,MAAM,CAAC;SACjB;qBACY,MAAM;sBACL,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;mBAGA;IAEpC,OAAO,CAAC,KAAK,EAAE,UAAU,GAAG,OAAO,CAAC,IAAI,CAAC;yCAlBpC,qBAAqB;2CAArB,qBAAqB;CA4DjC"}

package/dist/core/directives/sd-show-effect.directive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sd-show-effect.directive.d.ts","sourceRoot":"","sources":["..\\..\\..\\src\\core\\directives\\sd-show-effect.directive.ts"],"names":[],"mappings":";AAGA,qBAIa,qBAAqB;IAChC,OAAO,qEAA4E;IACnF,gBAAgB,qDAA+B;;yCAFpC,qBAAqB;2CAArB,qBAAqB;CAUjC"}
+{"version":3,"file":"sd-show-effect.directive.d.ts","sourceRoot":"","sources":["../../../src/core/directives/sd-show-effect.directive.ts"],"names":[],"mappings":";AAGA,qBAIa,qBAAqB;IAChC,OAAO,qEAA4E;IACnF,gBAAgB,qDAA+B;;yCAFpC,qBAAqB;2CAArB,qBAAqB;CAUjC"}

package/dist/core/directives/sd-typed-template.directive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sd-typed-template.directive.d.ts","sourceRoot":"","sources":["..\\..\\..\\src\\core\\directives\\sd-typed-template.directive.ts"],"names":[],"mappings":";AAEA,qBAIa,wBAAwB,CAAC,CAAC;IACrC,KAAK,yCAAuB;IAE5B,MAAM,CAAC,sBAAsB,CAAC,SAAS,EACrC,IAAI,EAAE,wBAAwB,CAAC,SAAS,CAAC,EACzC,IAAI,EAAE,OAAO,GACZ,IAAI,IAAI,SAAS;yCANT,wBAAwB;2CAAxB,wBAAwB;CASpC"}
+{"version":3,"file":"sd-typed-template.directive.d.ts","sourceRoot":"","sources":["../../../src/core/directives/sd-typed-template.directive.ts"],"names":[],"mappings":";AAEA,qBAIa,wBAAwB,CAAC,CAAC;IACrC,KAAK,yCAAuB;IAE5B,MAAM,CAAC,sBAAsB,CAAC,SAAS,EACrC,IAAI,EAAE,wBAAwB,CAAC,SAAS,CAAC,EACzC,IAAI,EAAE,OAAO,GACZ,IAAI,IAAI,SAAS;yCANT,wBAAwB;2CAAxB,wBAAwB;CASpC"}

package/dist/core/pipes/format.pipe.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"format.pipe.d.ts","sourceRoot":"","sources":["..\\..\\..\\src\\core\\pipes\\format.pipe.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;;AAE3D,qBAIa,UAAW,YAAW,aAAa;IAC9C,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM;yCADvE,UAAU;uCAAV,UAAU;CA6BtB"}
+{"version":3,"file":"format.pipe.d.ts","sourceRoot":"","sources":["../../../src/core/pipes/format.pipe.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;;AAE3D,qBAIa,UAAW,YAAW,aAAa;IAC9C,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM;yCADvE,UAAU;uCAAV,UAAU;CA6BtB"}

package/dist/core/plugins/commands/findTopOpenModalEl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"findTopOpenModalEl.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\core\\plugins\\commands\\findTopOpenModalEl.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,wBAAgB,kBAAkB,IAAI,WAAW,GAAG,IAAI,CAgBvD"}
+{"version":3,"file":"findTopOpenModalEl.d.ts","sourceRoot":"","sources":["../../../../src/core/plugins/commands/findTopOpenModalEl.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,wBAAgB,kBAAkB,IAAI,WAAW,GAAG,IAAI,CAgBvD"}