@rt-tools/ui-kit-v2 0.23.3 → 0.23.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/rt-tools-ui-kit-v2-accordion.mjs +142 -71
- package/fesm2022/rt-tools-ui-kit-v2-accordion.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-action-bar.mjs +467 -231
- package/fesm2022/rt-tools-ui-kit-v2-action-bar.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-ai-run-status.mjs +260 -91
- package/fesm2022/rt-tools-ui-kit-v2-ai-run-status.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-aside-section.mjs +80 -46
- package/fesm2022/rt-tools-ui-kit-v2-aside-section.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-aside.mjs +984 -697
- package/fesm2022/rt-tools-ui-kit-v2-aside.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-autocomplete.mjs +452 -210
- package/fesm2022/rt-tools-ui-kit-v2-autocomplete.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-bar-list.mjs +143 -52
- package/fesm2022/rt-tools-ui-kit-v2-bar-list.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-bottom-sheet.mjs +158 -83
- package/fesm2022/rt-tools-ui-kit-v2-bottom-sheet.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-breadcrumbs.mjs +335 -0
- package/fesm2022/rt-tools-ui-kit-v2-breadcrumbs.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-button.mjs +437 -363
- package/fesm2022/rt-tools-ui-kit-v2-button.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-calendar.mjs +430 -149
- package/fesm2022/rt-tools-ui-kit-v2-calendar.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-card.mjs +155 -71
- package/fesm2022/rt-tools-ui-kit-v2-card.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-carousel.mjs +155 -0
- package/fesm2022/rt-tools-ui-kit-v2-carousel.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-checkbox.mjs +215 -110
- package/fesm2022/rt-tools-ui-kit-v2-checkbox.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-collapsible-text.mjs +158 -75
- package/fesm2022/rt-tools-ui-kit-v2-collapsible-text.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-color-palette.mjs +769 -0
- package/fesm2022/rt-tools-ui-kit-v2-color-palette.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-confirm-popover.mjs +462 -253
- package/fesm2022/rt-tools-ui-kit-v2-confirm-popover.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-container.mjs +1276 -1316
- package/fesm2022/rt-tools-ui-kit-v2-container.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-copy-value.mjs +185 -80
- package/fesm2022/rt-tools-ui-kit-v2-copy-value.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-core.mjs +2309 -2619
- package/fesm2022/rt-tools-ui-kit-v2-core.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-counter-row.mjs +100 -44
- package/fesm2022/rt-tools-ui-kit-v2-counter-row.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-counter.mjs +290 -155
- package/fesm2022/rt-tools-ui-kit-v2-counter.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-data-list.mjs +2097 -858
- package/fesm2022/rt-tools-ui-kit-v2-data-list.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-data-table.mjs +2247 -1176
- package/fesm2022/rt-tools-ui-kit-v2-data-table.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-date-picker.mjs +1043 -705
- package/fesm2022/rt-tools-ui-kit-v2-date-picker.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-date-range.mjs +810 -525
- package/fesm2022/rt-tools-ui-kit-v2-date-range.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-delta-view.mjs +158 -138
- package/fesm2022/rt-tools-ui-kit-v2-delta-view.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-detail-list.mjs +177 -67
- package/fesm2022/rt-tools-ui-kit-v2-detail-list.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-dialog.mjs +550 -477
- package/fesm2022/rt-tools-ui-kit-v2-dialog.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-dot-field.mjs +185 -168
- package/fesm2022/rt-tools-ui-kit-v2-dot-field.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-download-link.mjs +116 -43
- package/fesm2022/rt-tools-ui-kit-v2-download-link.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-draggable-tree.mjs +585 -0
- package/fesm2022/rt-tools-ui-kit-v2-draggable-tree.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-dynamic-list.mjs +755 -259
- package/fesm2022/rt-tools-ui-kit-v2-dynamic-list.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-dynamic-selector.mjs +3266 -1115
- package/fesm2022/rt-tools-ui-kit-v2-dynamic-selector.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-empty-state.mjs +190 -55
- package/fesm2022/rt-tools-ui-kit-v2-empty-state.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-expansion-panel.mjs +283 -103
- package/fesm2022/rt-tools-ui-kit-v2-expansion-panel.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-field.mjs +393 -177
- package/fesm2022/rt-tools-ui-kit-v2-field.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-file-card.mjs +399 -207
- package/fesm2022/rt-tools-ui-kit-v2-file-card.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-file-drop.mjs +288 -212
- package/fesm2022/rt-tools-ui-kit-v2-file-drop.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-file-input.mjs +262 -116
- package/fesm2022/rt-tools-ui-kit-v2-file-input.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-file-list.mjs +57 -31
- package/fesm2022/rt-tools-ui-kit-v2-file-list.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-filter-control.mjs +258 -90
- package/fesm2022/rt-tools-ui-kit-v2-filter-control.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-form-control.mjs +249 -215
- package/fesm2022/rt-tools-ui-kit-v2-form-control.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-header.mjs +199 -71
- package/fesm2022/rt-tools-ui-kit-v2-header.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-hybrid-tree-selector.mjs +231 -0
- package/fesm2022/rt-tools-ui-kit-v2-hybrid-tree-selector.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-hybrid-tree.mjs +336 -0
- package/fesm2022/rt-tools-ui-kit-v2-hybrid-tree.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-icon-button.mjs +451 -162
- package/fesm2022/rt-tools-ui-kit-v2-icon-button.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-icon.mjs +931 -686
- package/fesm2022/rt-tools-ui-kit-v2-icon.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-image-cropper.mjs +664 -491
- package/fesm2022/rt-tools-ui-kit-v2-image-cropper.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-image-upload.mjs +574 -222
- package/fesm2022/rt-tools-ui-kit-v2-image-upload.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-info-item.mjs +150 -36
- package/fesm2022/rt-tools-ui-kit-v2-info-item.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-inline-edit.mjs +606 -0
- package/fesm2022/rt-tools-ui-kit-v2-inline-edit.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-input-number.mjs +461 -355
- package/fesm2022/rt-tools-ui-kit-v2-input-number.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-input.mjs +338 -143
- package/fesm2022/rt-tools-ui-kit-v2-input.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-live-badge.mjs +135 -48
- package/fesm2022/rt-tools-ui-kit-v2-live-badge.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-logo.mjs +166 -92
- package/fesm2022/rt-tools-ui-kit-v2-logo.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-markdown-text.mjs +118 -56
- package/fesm2022/rt-tools-ui-kit-v2-markdown-text.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-menu.mjs +1054 -527
- package/fesm2022/rt-tools-ui-kit-v2-menu.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-message.mjs +230 -104
- package/fesm2022/rt-tools-ui-kit-v2-message.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-money-list.mjs +210 -70
- package/fesm2022/rt-tools-ui-kit-v2-money-list.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-multiselect.mjs +532 -311
- package/fesm2022/rt-tools-ui-kit-v2-multiselect.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-night-grid.mjs +125 -50
- package/fesm2022/rt-tools-ui-kit-v2-night-grid.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-note.mjs +73 -43
- package/fesm2022/rt-tools-ui-kit-v2-note.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-notifications-bell.mjs +161 -53
- package/fesm2022/rt-tools-ui-kit-v2-notifications-bell.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-page-header.mjs +491 -310
- package/fesm2022/rt-tools-ui-kit-v2-page-header.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-pagination.mjs +374 -174
- package/fesm2022/rt-tools-ui-kit-v2-pagination.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-photo-viewer.mjs +202 -159
- package/fesm2022/rt-tools-ui-kit-v2-photo-viewer.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-popover.mjs +438 -309
- package/fesm2022/rt-tools-ui-kit-v2-popover.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-prompt-suggestion.mjs +135 -45
- package/fesm2022/rt-tools-ui-kit-v2-prompt-suggestion.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-radio-button.mjs +293 -171
- package/fesm2022/rt-tools-ui-kit-v2-radio-button.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-radius.mjs +62 -55
- package/fesm2022/rt-tools-ui-kit-v2-radius.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-rich-editor.mjs +3379 -1466
- package/fesm2022/rt-tools-ui-kit-v2-rich-editor.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-ripple.mjs +114 -116
- package/fesm2022/rt-tools-ui-kit-v2-ripple.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-scroll-area.mjs +406 -299
- package/fesm2022/rt-tools-ui-kit-v2-scroll-area.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-section-nav.mjs +137 -36
- package/fesm2022/rt-tools-ui-kit-v2-section-nav.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-select.mjs +687 -468
- package/fesm2022/rt-tools-ui-kit-v2-select.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-side-menu.mjs +2195 -1569
- package/fesm2022/rt-tools-ui-kit-v2-side-menu.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-skeleton-wrapper.mjs +187 -48
- package/fesm2022/rt-tools-ui-kit-v2-skeleton-wrapper.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-skeleton.mjs +242 -122
- package/fesm2022/rt-tools-ui-kit-v2-skeleton.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-speed-menu.mjs +439 -0
- package/fesm2022/rt-tools-ui-kit-v2-speed-menu.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-spinner.mjs +218 -69
- package/fesm2022/rt-tools-ui-kit-v2-spinner.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-split-button.mjs +292 -91
- package/fesm2022/rt-tools-ui-kit-v2-split-button.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-stat-tile.mjs +225 -138
- package/fesm2022/rt-tools-ui-kit-v2-stat-tile.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-stepper.mjs +150 -116
- package/fesm2022/rt-tools-ui-kit-v2-stepper.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-table.mjs +2462 -1583
- package/fesm2022/rt-tools-ui-kit-v2-table.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-tabs.mjs +647 -346
- package/fesm2022/rt-tools-ui-kit-v2-tabs.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-tag.mjs +335 -121
- package/fesm2022/rt-tools-ui-kit-v2-tag.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-textarea.mjs +217 -84
- package/fesm2022/rt-tools-ui-kit-v2-textarea.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-theme-toggle.mjs +151 -72
- package/fesm2022/rt-tools-ui-kit-v2-theme-toggle.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-thread-list.mjs +697 -226
- package/fesm2022/rt-tools-ui-kit-v2-thread-list.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-timeline.mjs +92 -38
- package/fesm2022/rt-tools-ui-kit-v2-timeline.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-toast.mjs +752 -338
- package/fesm2022/rt-tools-ui-kit-v2-toast.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-toggle-button-group.mjs +310 -129
- package/fesm2022/rt-tools-ui-kit-v2-toggle-button-group.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-toggle-switch.mjs +286 -158
- package/fesm2022/rt-tools-ui-kit-v2-toggle-switch.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-toolbar.mjs +270 -134
- package/fesm2022/rt-tools-ui-kit-v2-toolbar.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-tooltip.mjs +322 -202
- package/fesm2022/rt-tools-ui-kit-v2-tooltip.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-tree-selector.mjs +908 -0
- package/fesm2022/rt-tools-ui-kit-v2-tree-selector.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-tree.mjs +785 -0
- package/fesm2022/rt-tools-ui-kit-v2-tree.mjs.map +1 -0
- package/fesm2022/rt-tools-ui-kit-v2-welcome-dialog.mjs +118 -63
- package/fesm2022/rt-tools-ui-kit-v2-welcome-dialog.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-workspace-details.mjs +783 -262
- package/fesm2022/rt-tools-ui-kit-v2-workspace-details.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-workspace.mjs +633 -294
- package/fesm2022/rt-tools-ui-kit-v2-workspace.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2.mjs +100 -103
- package/package.json +41 -1
- package/src/assets/icons/collapse-all.svg +9 -0
- package/src/assets/icons/expand-all.svg +9 -0
- package/src/assets/icons-material/collapse-all.fill.svg +5 -0
- package/src/assets/icons-material/collapse-all.svg +5 -0
- package/src/assets/icons-material/expand-all.fill.svg +5 -0
- package/src/assets/icons-material/expand-all.svg +5 -0
- package/src/assets/icons-material/undo.fill.svg +5 -0
- package/src/assets/icons-material/undo.svg +5 -0
- package/src/lib/components/bottom-sheet/CONTEXT.md +20 -2
- package/src/lib/components/bottom-sheet/rt-bottom-sheet.component.scss +35 -1
- package/src/lib/components/breadcrumbs/CONTEXT.md +37 -0
- package/src/lib/components/breadcrumbs/rt-breadcrumbs.component.scss +205 -0
- package/src/lib/components/carousel/CONTEXT.md +42 -0
- package/src/lib/components/carousel/rt-carousel.component.scss +117 -0
- package/src/lib/components/checkbox/CONTEXT.md +3 -0
- package/src/lib/components/checkbox/rt-checkbox.component.scss +9 -3
- package/src/lib/components/color-palette/CONTEXT.md +49 -0
- package/src/lib/components/color-palette/picker/rt-color-picker.component.scss +161 -0
- package/src/lib/components/color-palette/rt-color-palette.component.scss +132 -0
- package/src/lib/components/draggable-tree/CONTEXT.md +54 -0
- package/src/lib/components/draggable-tree/rt-draggable-tree.component.scss +219 -0
- package/src/lib/components/hybrid-tree/CONTEXT.md +31 -0
- package/src/lib/components/hybrid-tree-selector/CONTEXT.md +25 -0
- package/src/lib/components/icon-button/CONTEXT.md +3 -0
- package/src/lib/components/inline-edit/CONTEXT.md +41 -0
- package/src/lib/components/inline-edit/rt-inline-edit.component.scss +274 -0
- package/src/lib/components/popover/CONTEXT.md +3 -0
- package/src/lib/components/speed-menu/CONTEXT.md +34 -0
- package/src/lib/components/speed-menu/rt-speed-menu.component.scss +118 -0
- package/src/lib/components/tag/rt-tag.component.scss +12 -0
- package/src/lib/components/thread-list/CONTEXT.md +1 -0
- package/src/lib/components/thread-list/rt-thread-list.component.scss +2 -1
- package/src/lib/components/toolbar/CONTEXT.md +9 -4
- package/src/lib/components/toolbar/rt-toolbar.component.scss +10 -2
- package/src/lib/components/tooltip/CONTEXT.md +8 -1
- package/src/lib/components/tree/CONTEXT.md +66 -0
- package/src/lib/components/tree/rt-tree.component.scss +313 -0
- package/src/lib/components/tree-selector/CONTEXT.md +47 -0
- package/src/lib/components/tree-selector/rt-tree-selector.component.scss +121 -0
- package/src/styles/_primitives.scss +4 -0
- package/styles/tokens.css +3 -0
- package/types/rt-tools-ui-kit-v2-accordion.d.ts +31 -24
- package/types/rt-tools-ui-kit-v2-action-bar.d.ts +112 -91
- package/types/rt-tools-ui-kit-v2-ai-run-status.d.ts +64 -40
- package/types/rt-tools-ui-kit-v2-aside-section.d.ts +13 -10
- package/types/rt-tools-ui-kit-v2-aside.d.ts +268 -206
- package/types/rt-tools-ui-kit-v2-autocomplete.d.ts +102 -61
- package/types/rt-tools-ui-kit-v2-bar-list.d.ts +39 -27
- package/types/rt-tools-ui-kit-v2-bottom-sheet.d.ts +31 -20
- package/types/rt-tools-ui-kit-v2-breadcrumbs.d.ts +89 -0
- package/types/rt-tools-ui-kit-v2-button.d.ts +119 -59
- package/types/rt-tools-ui-kit-v2-calendar.d.ts +151 -86
- package/types/rt-tools-ui-kit-v2-card.d.ts +42 -21
- package/types/rt-tools-ui-kit-v2-carousel.d.ts +76 -0
- package/types/rt-tools-ui-kit-v2-checkbox.d.ts +48 -24
- package/types/rt-tools-ui-kit-v2-collapsible-text.d.ts +28 -20
- package/types/rt-tools-ui-kit-v2-color-palette.d.ts +208 -0
- package/types/rt-tools-ui-kit-v2-confirm-popover.d.ts +104 -47
- package/types/rt-tools-ui-kit-v2-container.d.ts +278 -221
- package/types/rt-tools-ui-kit-v2-copy-value.d.ts +39 -24
- package/types/rt-tools-ui-kit-v2-core.d.ts +856 -865
- package/types/rt-tools-ui-kit-v2-counter-row.d.ts +20 -12
- package/types/rt-tools-ui-kit-v2-counter.d.ts +70 -38
- package/types/rt-tools-ui-kit-v2-data-list.d.ts +429 -264
- package/types/rt-tools-ui-kit-v2-data-table.d.ts +500 -351
- package/types/rt-tools-ui-kit-v2-date-picker.d.ts +164 -138
- package/types/rt-tools-ui-kit-v2-date-range.d.ts +102 -84
- package/types/rt-tools-ui-kit-v2-delta-view.d.ts +16 -13
- package/types/rt-tools-ui-kit-v2-detail-list.d.ts +23 -16
- package/types/rt-tools-ui-kit-v2-dialog.d.ts +130 -101
- package/types/rt-tools-ui-kit-v2-dot-field.d.ts +10 -13
- package/types/rt-tools-ui-kit-v2-download-link.d.ts +22 -17
- package/types/rt-tools-ui-kit-v2-draggable-tree.d.ts +132 -0
- package/types/rt-tools-ui-kit-v2-dynamic-list.d.ts +185 -96
- package/types/rt-tools-ui-kit-v2-dynamic-selector.d.ts +904 -404
- package/types/rt-tools-ui-kit-v2-empty-state.d.ts +48 -19
- package/types/rt-tools-ui-kit-v2-expansion-panel.d.ts +67 -39
- package/types/rt-tools-ui-kit-v2-field.d.ts +90 -49
- package/types/rt-tools-ui-kit-v2-file-card.d.ts +115 -75
- package/types/rt-tools-ui-kit-v2-file-drop.d.ts +75 -48
- package/types/rt-tools-ui-kit-v2-file-input.d.ts +53 -36
- package/types/rt-tools-ui-kit-v2-file-list.d.ts +5 -8
- package/types/rt-tools-ui-kit-v2-filter-control.d.ts +83 -49
- package/types/rt-tools-ui-kit-v2-form-control.d.ts +102 -74
- package/types/rt-tools-ui-kit-v2-header.d.ts +40 -22
- package/types/rt-tools-ui-kit-v2-hybrid-tree-selector.d.ts +14 -0
- package/types/rt-tools-ui-kit-v2-hybrid-tree.d.ts +72 -0
- package/types/rt-tools-ui-kit-v2-icon-button.d.ts +190 -90
- package/types/rt-tools-ui-kit-v2-icon.d.ts +160 -129
- package/types/rt-tools-ui-kit-v2-image-cropper.d.ts +151 -111
- package/types/rt-tools-ui-kit-v2-image-upload.d.ts +159 -85
- package/types/rt-tools-ui-kit-v2-info-item.d.ts +26 -13
- package/types/rt-tools-ui-kit-v2-inline-edit.d.ts +194 -0
- package/types/rt-tools-ui-kit-v2-input-number.d.ts +102 -53
- package/types/rt-tools-ui-kit-v2-input.d.ts +82 -43
- package/types/rt-tools-ui-kit-v2-live-badge.d.ts +30 -17
- package/types/rt-tools-ui-kit-v2-logo.d.ts +49 -32
- package/types/rt-tools-ui-kit-v2-markdown-text.d.ts +26 -17
- package/types/rt-tools-ui-kit-v2-menu.d.ts +272 -155
- package/types/rt-tools-ui-kit-v2-message.d.ts +59 -33
- package/types/rt-tools-ui-kit-v2-money-list.d.ts +36 -18
- package/types/rt-tools-ui-kit-v2-multiselect.d.ts +114 -80
- package/types/rt-tools-ui-kit-v2-night-grid.d.ts +34 -25
- package/types/rt-tools-ui-kit-v2-note.d.ts +12 -9
- package/types/rt-tools-ui-kit-v2-notifications-bell.d.ts +37 -16
- package/types/rt-tools-ui-kit-v2-page-header.d.ts +218 -150
- package/types/rt-tools-ui-kit-v2-pagination.d.ts +99 -63
- package/types/rt-tools-ui-kit-v2-photo-viewer.d.ts +61 -66
- package/types/rt-tools-ui-kit-v2-popover.d.ts +116 -55
- package/types/rt-tools-ui-kit-v2-prompt-suggestion.d.ts +26 -16
- package/types/rt-tools-ui-kit-v2-radio-button.d.ts +85 -43
- package/types/rt-tools-ui-kit-v2-radius.d.ts +18 -15
- package/types/rt-tools-ui-kit-v2-rich-editor.d.ts +931 -590
- package/types/rt-tools-ui-kit-v2-ripple.d.ts +28 -25
- package/types/rt-tools-ui-kit-v2-scroll-area.d.ts +60 -58
- package/types/rt-tools-ui-kit-v2-section-nav.d.ts +32 -22
- package/types/rt-tools-ui-kit-v2-select.d.ts +182 -139
- package/types/rt-tools-ui-kit-v2-side-menu.d.ts +452 -349
- package/types/rt-tools-ui-kit-v2-skeleton-wrapper.d.ts +53 -20
- package/types/rt-tools-ui-kit-v2-skeleton.d.ts +55 -26
- package/types/rt-tools-ui-kit-v2-speed-menu.d.ts +131 -0
- package/types/rt-tools-ui-kit-v2-spinner.d.ts +56 -28
- package/types/rt-tools-ui-kit-v2-split-button.d.ts +96 -55
- package/types/rt-tools-ui-kit-v2-stat-tile.d.ts +88 -60
- package/types/rt-tools-ui-kit-v2-stepper.d.ts +50 -37
- package/types/rt-tools-ui-kit-v2-table.d.ts +631 -480
- package/types/rt-tools-ui-kit-v2-tabs.d.ts +198 -113
- package/types/rt-tools-ui-kit-v2-tag.d.ts +106 -53
- package/types/rt-tools-ui-kit-v2-textarea.d.ts +48 -25
- package/types/rt-tools-ui-kit-v2-theme-toggle.d.ts +28 -26
- package/types/rt-tools-ui-kit-v2-thread-list.d.ts +154 -94
- package/types/rt-tools-ui-kit-v2-timeline.d.ts +30 -28
- package/types/rt-tools-ui-kit-v2-toast.d.ts +174 -98
- package/types/rt-tools-ui-kit-v2-toggle-button-group.d.ts +132 -86
- package/types/rt-tools-ui-kit-v2-toggle-switch.d.ts +88 -50
- package/types/rt-tools-ui-kit-v2-toolbar.d.ts +30 -27
- package/types/rt-tools-ui-kit-v2-tooltip.d.ts +65 -41
- package/types/rt-tools-ui-kit-v2-tree-selector.d.ts +257 -0
- package/types/rt-tools-ui-kit-v2-tree.d.ts +282 -0
- package/types/rt-tools-ui-kit-v2-welcome-dialog.d.ts +21 -24
- package/types/rt-tools-ui-kit-v2-workspace-details.d.ts +195 -124
- package/types/rt-tools-ui-kit-v2-workspace.d.ts +122 -79
- package/types/rt-tools-ui-kit-v2.d.ts +100 -90
- package/fesm2022/rt-tools-ui-kit-v2.mjs.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rt-tools-ui-kit-v2-calendar.mjs","sources":["../../../projects/ui-kit-v2/src/lib/components/calendar/rt-calendar.model.ts","../../../projects/ui-kit-v2/src/lib/components/calendar/rt-calendar.component.ts","../../../projects/ui-kit-v2/src/lib/components/calendar/rt-calendar.component.html","../../../projects/ui-kit-v2/src/lib/components/calendar/rt-tools-ui-kit-v2-calendar.ts"],"sourcesContent":["/**\n * Контракты `rt-calendar` — презентационный месячный грид с range-выбором.\n *\n * Компонент домен-агностичен: состояния/цены/доступность дней вычисляет\n * consumer и передаёт готовые view-модели месяцев. Клики по дням и навигация\n * по месяцам эмитятся наружу; никакой доменной логики внутри нет.\n */\n\n/** Состояние ячейки дня — модификатор `data-state` на кнопке дня. */\nexport enum ERtCalendarDayState {\n Free = 'free',\n Busy = 'busy',\n Past = 'past',\n Blocked = 'blocked',\n Start = 'start',\n End = 'end',\n InRange = 'in-range',\n /** Выбранный день одиночного выбора — залит. */\n Chosen = 'chosen',\n}\n\nexport namespace IRtCalendar {\n /** View-модель дня. `key` — стабильный ключ (ISO-дата). */\n export interface Day {\n key: string;\n dayOfMonth: number;\n /** Подпись под числом (цена за ночь и т.п.); пустая строка не рендерится. */\n sublabel: string;\n state: ERtCalendarDayState;\n disabled: boolean;\n /** Сегодняшний день — обведён рамкой поверх любого состояния. */\n today?: boolean;\n }\n\n /** Клавиша сетки, нажатая на дне. */\n export interface GridKey {\n key: string;\n day: Day;\n }\n\n /** View-модель месяца: подпись, пустые ячейки до первого дня, дни. */\n export interface Month {\n key: string;\n label: string;\n leadingBlanks: readonly number[];\n days: readonly Day[];\n }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n afterRenderEffect,\n booleanAttribute,\n computed,\n signal,\n viewChildren,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n InputSignal,\n InputSignalWithTransform,\n output,\n OutputEmitterRef,\n Signal,\n ViewEncapsulation,\n WritableSignal,\n} from '@angular/core';\n\n// rt-tools\nimport { BlockDirective, ElemDirective } from '@rt-tools/core';\n\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\nimport { RtSkeletonComponent } from '@rt-tools/ui-kit-v2/skeleton';\nimport { ERtCalendarDayState, IRtCalendar } from './rt-calendar.model';\n\nconst BEM_BLOCK: string = 'rt-calendar';\n\n/** Клавиши, что календарь в режиме сетки отдаёт наружу вместо прокрутки страницы. */\nconst GRID_KEYS: ReadonlySet<string> = new Set(['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'PageUp', 'PageDown', 'Home', 'End']);\n\n@Component({\n selector: 'rt-calendar',\n templateUrl: './rt-calendar.component.html',\n styleUrl: './rt-calendar.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n imports: [\n // angular\n NgTemplateOutlet,\n\n // rt-tools\n BlockDirective,\n ElemDirective,\n\n // components\n RtIconButtonComponent,\n RtSkeletonComponent,\n ],\n hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n host: {\n class: BEM_BLOCK,\n },\n})\nexport class RtCalendarComponent {\n /** Фокус двигала клавиша: только тогда календарь переводит фокус на `activeKey`. */\n readonly #keyed: WritableSignal<boolean> = signal(false);\n\n protected readonly sublabelSkeletonHeight: string = '12px';\n protected readonly chosenState: ERtCalendarDayState = ERtCalendarDayState.Chosen;\n\n protected readonly dayButtons: Signal<readonly ElementRef<HTMLButtonElement>[]> =\n viewChildren<ElementRef<HTMLButtonElement>>('dayButton');\n\n /**\n * День, что стоит в порядке обхода Tab в режиме сетки: `activeKey`, иначе выбранный, иначе\n * сегодняшний, иначе первый доступный. Вне режима сетки — `null`, и каждый день обходится Tab.\n */\n protected readonly rovingKey: Signal<string | null> = computed((): string | null => {\n if (!this.grid()) {\n return null;\n }\n const days: IRtCalendar.Day[] = this.months().flatMap((month: IRtCalendar.Month): IRtCalendar.Day[] => [...month.days]);\n const active: string | null = this.activeKey();\n const pick: IRtCalendar.Day | undefined =\n days.find((day: IRtCalendar.Day): boolean => day.key === active) ??\n days.find((day: IRtCalendar.Day): boolean => day.state === ERtCalendarDayState.Chosen) ??\n days.find((day: IRtCalendar.Day): boolean => day.today === true) ??\n days.find((day: IRtCalendar.Day): boolean => !day.disabled);\n return pick?.key ?? null;\n });\n\n public readonly months: InputSignal<readonly IRtCalendar.Month[]> = input.required<readonly IRtCalendar.Month[]>();\n public readonly weekdayLabels: InputSignal<readonly string[]> = input.required<readonly string[]>();\n public readonly canPrev: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n public readonly canNext: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n /** Локализованные aria-подписи кнопок навигации — задаёт consumer. */\n public readonly prevAriaLabel: InputSignal<string> = input<string>('');\n public readonly nextAriaLabel: InputSignal<string> = input<string>('');\n public readonly sublabelsLoading: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n\n /**\n * Режим сетки: один день в обходе Tab, клавиши стрелок, PageUp/PageDown, Home и End уходят\n * наружу событием `gridKey`, а фокус встаёт на `activeKey`. Выключен — поведение прежнее.\n */\n public readonly grid: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n /** День с фокусом в режиме сетки, ключ `YYYY-MM-DD`; его ставит consumer по `gridKey`. */\n public readonly activeKey: InputSignal<string | null> = input<string | null>(null);\n /** Заголовок месяца — кнопка, что шлёт `titleClick`: так consumer открывает выбор месяца. */\n public readonly titleAction: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n /** Заголовок первого месяца стоит в шапке между стрелками, а не над сеткой. */\n public readonly headerTitle: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n\n public readonly prevMonth: OutputEmitterRef<void> = output<void>();\n public readonly nextMonth: OutputEmitterRef<void> = output<void>();\n public readonly dayClick: OutputEmitterRef<IRtCalendar.Day> = output<IRtCalendar.Day>();\n /** Клавиша сетки на дне: куда перевести фокус, решает consumer. */\n public readonly gridKey: OutputEmitterRef<IRtCalendar.GridKey> = output<IRtCalendar.GridKey>();\n public readonly titleClick: OutputEmitterRef<IRtCalendar.Month> = output<IRtCalendar.Month>();\n /** День под указателем или с фокусом; `null` — указатель ушёл с месяцев. По нему рисуется будущий диапазон. */\n public readonly dayHover: OutputEmitterRef<IRtCalendar.Day | null> = output<IRtCalendar.Day | null>();\n\n constructor() {\n afterRenderEffect((): void => {\n const key: string | null = this.rovingKey();\n if (!this.#keyed() || key === null) {\n return;\n }\n this.dayButtons()\n .find((button: ElementRef<HTMLButtonElement>): boolean => button.nativeElement.dataset['iso'] === key)\n ?.nativeElement.focus();\n });\n }\n\n protected onDayKey(event: KeyboardEvent, day: IRtCalendar.Day): void {\n if (!this.grid() || !GRID_KEYS.has(event.key)) {\n return;\n }\n event.preventDefault();\n this.#keyed.set(true);\n this.gridKey.emit({ key: event.key, day });\n }\n\n protected onDayHover(day: IRtCalendar.Day): void {\n if (!day.disabled) {\n this.dayHover.emit(day);\n }\n }\n\n protected onDayClick(day: IRtCalendar.Day): void {\n if (!day.disabled) {\n this.dayClick.emit(day);\n }\n }\n}\n","<ng-container rtBlock=\"rt-calendar\">\n <div rtElem=\"header\">\n <rt-icon-button\n rtElem=\"nav\"\n qa-dataid=\"calendar-prev-month\"\n icon=\"chevron-left\"\n variant=\"secondary\"\n radius=\"full\"\n [ariaLabel]=\"prevAriaLabel()\"\n [disabled]=\"!canPrev()\"\n (clicked)=\"prevMonth.emit()\" />\n @if (headerTitle() && months()[0]; as first) {\n <ng-container *ngTemplateOutlet=\"titleTpl; context: { $implicit: first }\" />\n }\n <ng-content select=\"[calendarHint]\" />\n <rt-icon-button\n rtElem=\"nav\"\n qa-dataid=\"calendar-next-month\"\n icon=\"chevron-right\"\n variant=\"secondary\"\n radius=\"full\"\n [ariaLabel]=\"nextAriaLabel()\"\n [disabled]=\"!canNext()\"\n (clicked)=\"nextMonth.emit()\" />\n </div>\n\n <div rtElem=\"months\" qa-dataid=\"calendar-months\" (mouseleave)=\"dayHover.emit(null)\">\n @for (month of months(); track month.key) {\n <div rtElem=\"month\" qa-dataid=\"calendar-month\">\n @if (!headerTitle()) {\n <ng-container *ngTemplateOutlet=\"titleTpl; context: { $implicit: month }\" />\n }\n <div rtElem=\"grid\" qa-dataid=\"calendar-grid\">\n @for (weekday of weekdayLabels(); track $index) {\n <span rtElem=\"weekday\" qa-dataid=\"calendar-weekday\">{{ weekday }}</span>\n }\n @for (blank of month.leadingBlanks; track blank) {\n <!-- Пустая ячейка сетки до первого дня месяца: занимает место и ничего не красит. -->\n <span qa-dataid=\"calendar-blank\" aria-hidden=\"true\"></span>\n }\n @for (day of month.days; track day.key) {\n <button\n #dayButton\n rtElem=\"day\"\n qa-dataid=\"calendar-day\"\n type=\"button\"\n [attr.data-iso]=\"day.key\"\n [attr.data-state]=\"day.state\"\n [attr.data-today]=\"day.today ? '' : null\"\n [attr.aria-current]=\"day.today ? 'date' : null\"\n [attr.aria-pressed]=\"day.state === chosenState ? true : null\"\n [attr.tabindex]=\"rovingKey() === null ? null : day.key === rovingKey() ? 0 : -1\"\n [disabled]=\"day.disabled\"\n (keydown)=\"onDayKey($event, day)\"\n (mouseenter)=\"onDayHover(day)\"\n (focus)=\"onDayHover(day)\"\n (click)=\"onDayClick(day)\">\n <span rtElem=\"day-num\" qa-dataid=\"calendar-day-num\">{{ day.dayOfMonth }}</span>\n @if (sublabelsLoading()) {\n <rt-skeleton\n rtElem=\"day-sublabel\"\n qa-dataid=\"calendar-day-price-skeleton\"\n width=\"80%\"\n radius=\"sm\"\n [height]=\"sublabelSkeletonHeight\" />\n } @else if (day.sublabel) {\n <span rtElem=\"day-sublabel\" qa-dataid=\"calendar-day-price\">{{ day.sublabel }}</span>\n }\n </button>\n }\n </div>\n </div>\n }\n </div>\n\n <ng-content />\n\n <ng-template #titleTpl let-month>\n @if (titleAction()) {\n <button rtElem=\"month-title\" qa-dataid=\"calendar-month-title\" type=\"button\" (click)=\"titleClick.emit(month)\">\n {{ month.label }}\n </button>\n } @else {\n <p rtElem=\"month-title\" qa-dataid=\"calendar-month-title\">{{ month.label }}</p>\n }\n </ng-template>\n</ng-container>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"rt-tools-ui-kit-v2-calendar.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/calendar/rt-calendar.model.ts","../../../projects/ui-kit-v2/src/lib/components/calendar/rt-calendar.component.ts","../../../projects/ui-kit-v2/src/lib/components/calendar/rt-calendar.component.html"],"sourcesContent":["/**\n * Контракты `rt-calendar` — презентационный месячный грид с range-выбором.\n *\n * Компонент домен-агностичен: состояния/цены/доступность дней вычисляет\n * consumer и передаёт готовые view-модели месяцев. Клики по дням и навигация\n * по месяцам эмитятся наружу; никакой доменной логики внутри нет.\n */\n\n/** Состояние ячейки дня — модификатор `data-state` на кнопке дня. */\nexport enum ERtCalendarDayState {\n Free = 'free',\n Busy = 'busy',\n Past = 'past',\n Blocked = 'blocked',\n Start = 'start',\n End = 'end',\n InRange = 'in-range',\n /** Выбранный день одиночного выбора — залит. */\n Chosen = 'chosen',\n}\n\nexport namespace IRtCalendar {\n /** View-модель дня. `key` — стабильный ключ (ISO-дата). */\n export interface Day {\n key: string;\n dayOfMonth: number;\n /** Подпись под числом (цена за ночь и т.п.); пустая строка не рендерится. */\n sublabel: string;\n state: ERtCalendarDayState;\n disabled: boolean;\n /** Сегодняшний день — обведён рамкой поверх любого состояния. */\n today?: boolean;\n }\n\n /** Клавиша сетки, нажатая на дне. */\n export interface GridKey {\n key: string;\n day: Day;\n }\n\n /** View-модель месяца: подпись, пустые ячейки до первого дня, дни. */\n export interface Month {\n key: string;\n label: string;\n leadingBlanks: readonly number[];\n days: readonly Day[];\n }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n afterRenderEffect,\n booleanAttribute,\n computed,\n signal,\n viewChildren,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n InputSignal,\n InputSignalWithTransform,\n output,\n OutputEmitterRef,\n Signal,\n ViewEncapsulation,\n WritableSignal,\n} from '@angular/core';\n\n// rt-tools\nimport { BlockDirective, ElemDirective } from '@rt-tools/core';\n\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\nimport { RtSkeletonComponent } from '@rt-tools/ui-kit-v2/skeleton';\nimport { ERtCalendarDayState, IRtCalendar } from './rt-calendar.model';\n\nconst BEM_BLOCK: string = 'rt-calendar';\n\n/** Клавиши, что календарь в режиме сетки отдаёт наружу вместо прокрутки страницы. */\nconst GRID_KEYS: ReadonlySet<string> = new Set(['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'PageUp', 'PageDown', 'Home', 'End']);\n\n@Component({\n selector: 'rt-calendar',\n templateUrl: './rt-calendar.component.html',\n styleUrl: './rt-calendar.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n imports: [\n // angular\n NgTemplateOutlet,\n\n // rt-tools\n BlockDirective,\n ElemDirective,\n\n // components\n RtIconButtonComponent,\n RtSkeletonComponent,\n ],\n hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n host: {\n class: BEM_BLOCK,\n },\n})\nexport class RtCalendarComponent {\n /** Фокус двигала клавиша: только тогда календарь переводит фокус на `activeKey`. */\n readonly #keyed: WritableSignal<boolean> = signal(false);\n\n protected readonly sublabelSkeletonHeight: string = '12px';\n protected readonly chosenState: ERtCalendarDayState = ERtCalendarDayState.Chosen;\n\n protected readonly dayButtons: Signal<readonly ElementRef<HTMLButtonElement>[]> =\n viewChildren<ElementRef<HTMLButtonElement>>('dayButton');\n\n /**\n * День, что стоит в порядке обхода Tab в режиме сетки: `activeKey`, иначе выбранный, иначе\n * сегодняшний, иначе первый доступный. Вне режима сетки — `null`, и каждый день обходится Tab.\n */\n protected readonly rovingKey: Signal<string | null> = computed((): string | null => {\n if (!this.grid()) {\n return null;\n }\n const days: IRtCalendar.Day[] = this.months().flatMap((month: IRtCalendar.Month): IRtCalendar.Day[] => [...month.days]);\n const active: string | null = this.activeKey();\n const pick: IRtCalendar.Day | undefined =\n days.find((day: IRtCalendar.Day): boolean => day.key === active) ??\n days.find((day: IRtCalendar.Day): boolean => day.state === ERtCalendarDayState.Chosen) ??\n days.find((day: IRtCalendar.Day): boolean => day.today === true) ??\n days.find((day: IRtCalendar.Day): boolean => !day.disabled);\n return pick?.key ?? null;\n });\n\n public readonly months: InputSignal<readonly IRtCalendar.Month[]> = input.required<readonly IRtCalendar.Month[]>();\n public readonly weekdayLabels: InputSignal<readonly string[]> = input.required<readonly string[]>();\n public readonly canPrev: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n public readonly canNext: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n /** Локализованные aria-подписи кнопок навигации — задаёт consumer. */\n public readonly prevAriaLabel: InputSignal<string> = input<string>('');\n public readonly nextAriaLabel: InputSignal<string> = input<string>('');\n public readonly sublabelsLoading: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n\n /**\n * Режим сетки: один день в обходе Tab, клавиши стрелок, PageUp/PageDown, Home и End уходят\n * наружу событием `gridKey`, а фокус встаёт на `activeKey`. Выключен — поведение прежнее.\n */\n public readonly grid: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n /** День с фокусом в режиме сетки, ключ `YYYY-MM-DD`; его ставит consumer по `gridKey`. */\n public readonly activeKey: InputSignal<string | null> = input<string | null>(null);\n /** Заголовок месяца — кнопка, что шлёт `titleClick`: так consumer открывает выбор месяца. */\n public readonly titleAction: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n /** Заголовок первого месяца стоит в шапке между стрелками, а не над сеткой. */\n public readonly headerTitle: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n\n public readonly prevMonth: OutputEmitterRef<void> = output<void>();\n public readonly nextMonth: OutputEmitterRef<void> = output<void>();\n public readonly dayClick: OutputEmitterRef<IRtCalendar.Day> = output<IRtCalendar.Day>();\n /** Клавиша сетки на дне: куда перевести фокус, решает consumer. */\n public readonly gridKey: OutputEmitterRef<IRtCalendar.GridKey> = output<IRtCalendar.GridKey>();\n public readonly titleClick: OutputEmitterRef<IRtCalendar.Month> = output<IRtCalendar.Month>();\n /** День под указателем или с фокусом; `null` — указатель ушёл с месяцев. По нему рисуется будущий диапазон. */\n public readonly dayHover: OutputEmitterRef<IRtCalendar.Day | null> = output<IRtCalendar.Day | null>();\n\n constructor() {\n afterRenderEffect((): void => {\n const key: string | null = this.rovingKey();\n if (!this.#keyed() || key === null) {\n return;\n }\n this.dayButtons()\n .find((button: ElementRef<HTMLButtonElement>): boolean => button.nativeElement.dataset['iso'] === key)\n ?.nativeElement.focus();\n });\n }\n\n protected onDayKey(event: KeyboardEvent, day: IRtCalendar.Day): void {\n if (!this.grid() || !GRID_KEYS.has(event.key)) {\n return;\n }\n event.preventDefault();\n this.#keyed.set(true);\n this.gridKey.emit({ key: event.key, day });\n }\n\n protected onDayHover(day: IRtCalendar.Day): void {\n if (!day.disabled) {\n this.dayHover.emit(day);\n }\n }\n\n protected onDayClick(day: IRtCalendar.Day): void {\n if (!day.disabled) {\n this.dayClick.emit(day);\n }\n }\n}\n","<ng-container rtBlock=\"rt-calendar\">\n <div rtElem=\"header\">\n <rt-icon-button\n rtElem=\"nav\"\n qa-dataid=\"calendar-prev-month\"\n icon=\"chevron-left\"\n variant=\"secondary\"\n radius=\"full\"\n [ariaLabel]=\"prevAriaLabel()\"\n [disabled]=\"!canPrev()\"\n (clicked)=\"prevMonth.emit()\" />\n @if (headerTitle() && months()[0]; as first) {\n <ng-container *ngTemplateOutlet=\"titleTpl; context: { $implicit: first }\" />\n }\n <ng-content select=\"[calendarHint]\" />\n <rt-icon-button\n rtElem=\"nav\"\n qa-dataid=\"calendar-next-month\"\n icon=\"chevron-right\"\n variant=\"secondary\"\n radius=\"full\"\n [ariaLabel]=\"nextAriaLabel()\"\n [disabled]=\"!canNext()\"\n (clicked)=\"nextMonth.emit()\" />\n </div>\n\n <div rtElem=\"months\" qa-dataid=\"calendar-months\" (mouseleave)=\"dayHover.emit(null)\">\n @for (month of months(); track month.key) {\n <div rtElem=\"month\" qa-dataid=\"calendar-month\">\n @if (!headerTitle()) {\n <ng-container *ngTemplateOutlet=\"titleTpl; context: { $implicit: month }\" />\n }\n <div rtElem=\"grid\" qa-dataid=\"calendar-grid\">\n @for (weekday of weekdayLabels(); track $index) {\n <span rtElem=\"weekday\" qa-dataid=\"calendar-weekday\">{{ weekday }}</span>\n }\n @for (blank of month.leadingBlanks; track blank) {\n <!-- Пустая ячейка сетки до первого дня месяца: занимает место и ничего не красит. -->\n <span qa-dataid=\"calendar-blank\" aria-hidden=\"true\"></span>\n }\n @for (day of month.days; track day.key) {\n <button\n #dayButton\n rtElem=\"day\"\n qa-dataid=\"calendar-day\"\n type=\"button\"\n [attr.data-iso]=\"day.key\"\n [attr.data-state]=\"day.state\"\n [attr.data-today]=\"day.today ? '' : null\"\n [attr.aria-current]=\"day.today ? 'date' : null\"\n [attr.aria-pressed]=\"day.state === chosenState ? true : null\"\n [attr.tabindex]=\"rovingKey() === null ? null : day.key === rovingKey() ? 0 : -1\"\n [disabled]=\"day.disabled\"\n (keydown)=\"onDayKey($event, day)\"\n (mouseenter)=\"onDayHover(day)\"\n (focus)=\"onDayHover(day)\"\n (click)=\"onDayClick(day)\">\n <span rtElem=\"day-num\" qa-dataid=\"calendar-day-num\">{{ day.dayOfMonth }}</span>\n @if (sublabelsLoading()) {\n <rt-skeleton\n rtElem=\"day-sublabel\"\n qa-dataid=\"calendar-day-price-skeleton\"\n width=\"80%\"\n radius=\"sm\"\n [height]=\"sublabelSkeletonHeight\" />\n } @else if (day.sublabel) {\n <span rtElem=\"day-sublabel\" qa-dataid=\"calendar-day-price\">{{ day.sublabel }}</span>\n }\n </button>\n }\n </div>\n </div>\n }\n </div>\n\n <ng-content />\n\n <ng-template #titleTpl let-month>\n @if (titleAction()) {\n <button rtElem=\"month-title\" qa-dataid=\"calendar-month-title\" type=\"button\" (click)=\"titleClick.emit(month)\">\n {{ month.label }}\n </button>\n } @else {\n <p rtElem=\"month-title\" qa-dataid=\"calendar-month-title\">{{ month.label }}</p>\n }\n </ng-template>\n</ng-container>\n"],"mappings":"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"}
|
|
@@ -1,72 +1,156 @@
|
|
|
1
|
-
import * as i0 from
|
|
2
|
-
import {
|
|
3
|
-
import { BlockDirective, ElemDirective, ModDirective } from
|
|
4
|
-
import * as i1 from
|
|
5
|
-
import { RtRadiusDirective } from
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
import { ChangeDetectionStrategy, Component, ViewEncapsulation, booleanAttribute, input, output } from "@angular/core";
|
|
3
|
+
import { BlockDirective, ElemDirective, ModDirective } from "@rt-tools/core";
|
|
4
|
+
import * as i1 from "@rt-tools/ui-kit-v2/radius";
|
|
5
|
+
import { RtRadiusDirective } from "@rt-tools/ui-kit-v2/radius";
|
|
6
|
+
const BEM_BLOCK = "rt-card";
|
|
7
|
+
var RtCardComponent = class RtCardComponent {
|
|
8
|
+
constructor() {
|
|
9
|
+
this.header = input(null, ...ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []);
|
|
10
|
+
this.ariaLabel = input(null, ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
|
|
11
|
+
this.clickable = input(false, {
|
|
12
|
+
...ngDevMode ? { debugName: "clickable" } : /* istanbul ignore next */ {},
|
|
13
|
+
transform: booleanAttribute
|
|
14
|
+
});
|
|
15
|
+
this.cardClick = output();
|
|
16
|
+
}
|
|
17
|
+
onClick(event) {
|
|
18
|
+
if (this.clickable()) this.cardClick.emit(event);
|
|
19
|
+
}
|
|
20
|
+
onKeyActivate(event) {
|
|
21
|
+
if (!this.clickable()) return;
|
|
22
|
+
event.preventDefault();
|
|
23
|
+
this.cardClick.emit(event);
|
|
24
|
+
}
|
|
25
|
+
static {
|
|
26
|
+
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
27
|
+
minVersion: "12.0.0",
|
|
28
|
+
version: "22.2.2",
|
|
29
|
+
ngImport: i0,
|
|
30
|
+
type: RtCardComponent,
|
|
31
|
+
deps: [],
|
|
32
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
static {
|
|
36
|
+
this.ɵcmp = i0.ɵɵngDeclareComponent({
|
|
37
|
+
minVersion: "17.0.0",
|
|
38
|
+
version: "22.2.2",
|
|
39
|
+
type: RtCardComponent,
|
|
40
|
+
isStandalone: true,
|
|
41
|
+
selector: "rt-card",
|
|
42
|
+
inputs: {
|
|
43
|
+
header: {
|
|
44
|
+
classPropertyName: "header",
|
|
45
|
+
publicName: "header",
|
|
46
|
+
isSignal: true,
|
|
47
|
+
isRequired: false,
|
|
48
|
+
transformFunction: null
|
|
49
|
+
},
|
|
50
|
+
ariaLabel: {
|
|
51
|
+
classPropertyName: "ariaLabel",
|
|
52
|
+
publicName: "ariaLabel",
|
|
53
|
+
isSignal: true,
|
|
54
|
+
isRequired: false,
|
|
55
|
+
transformFunction: null
|
|
56
|
+
},
|
|
57
|
+
clickable: {
|
|
58
|
+
classPropertyName: "clickable",
|
|
59
|
+
publicName: "clickable",
|
|
60
|
+
isSignal: true,
|
|
61
|
+
isRequired: false,
|
|
62
|
+
transformFunction: null
|
|
63
|
+
}
|
|
64
|
+
},
|
|
65
|
+
outputs: { cardClick: "cardClick" },
|
|
66
|
+
host: { classAttribute: "rt-card" },
|
|
67
|
+
hostDirectives: [{
|
|
68
|
+
directive: i1.RtRadiusDirective,
|
|
69
|
+
inputs: ["radius", "radius"]
|
|
70
|
+
}],
|
|
71
|
+
ngImport: i0,
|
|
72
|
+
template: "<article\n rtBlock=\"rt-card\"\n qa-dataid=\"card\"\n [rtMod]=\"{ clickable: clickable() }\"\n [attr.role]=\"clickable() ? 'button' : null\"\n [attr.tabindex]=\"clickable() ? 0 : null\"\n [attr.aria-label]=\"ariaLabel()\"\n (click)=\"onClick($event)\"\n (keydown.enter)=\"onKeyActivate($event)\"\n (keydown.space)=\"onKeyActivate($event)\">\n <header rtElem=\"header\">\n @if (header(); as h) {\n <h3 rtElem=\"title\" qa-dataid=\"card-title\">{{ h }}</h3>\n }\n <ng-content select=\"[rtCardHeader]\" />\n </header>\n <div rtElem=\"content\">\n <ng-content />\n </div>\n <footer rtElem=\"footer\">\n <ng-content select=\"[rtCardFooter]\" />\n </footer>\n</article>\n",
|
|
73
|
+
styles: ["@charset \"UTF-8\";@layer rt-kit.components{rt-card{display:block}rt-card .rt-card{--rt-card-radius: var(--rt-radius-xl);--rt-card-shadow: var(--rt-shadow-card);--rt-card-shadow-hover: var(--rt-shadow-lg);--rt-card-focus-shadow: var(--rt-shadow-focus-ring);--rt-card-transition-duration: var(--rt-duration-fast);display:block;padding:var(--rt-space-lg);border-radius:var(--rt-card-radius);background:var(--rt-color-bg-surface);box-shadow:var(--rt-card-shadow);color:var(--rt-color-text-primary)}rt-card .rt-card--clickable{cursor:pointer;transition:box-shadow var(--rt-card-transition-duration) ease,transform var(--rt-card-transition-duration) ease}rt-card .rt-card--clickable:hover{box-shadow:var(--rt-card-shadow-hover)}rt-card .rt-card--clickable:focus-visible{box-shadow:var(--rt-card-focus-shadow);outline:2px solid transparent;outline-offset:2px}rt-card .rt-card__header{margin-block-end:var(--rt-space-md)}rt-card .rt-card__header:empty{display:none}rt-card .rt-card__title{margin:0;font-size:var(--rt-text-lg);line-height:var(--rt-leading-snug)}rt-card .rt-card__content{display:block}rt-card .rt-card__footer{margin-block-start:var(--rt-space-md)}rt-card .rt-card__footer:empty{display:none}rt-card[data-rt-radius=none]>.rt-card{--rt-card-radius: var(--rt-radius-none)}rt-card[data-rt-radius=xs]>.rt-card{--rt-card-radius: var(--rt-radius-xs)}rt-card[data-rt-radius=sm]>.rt-card{--rt-card-radius: var(--rt-radius-sm)}rt-card[data-rt-radius=ms]>.rt-card{--rt-card-radius: var(--rt-radius-ms)}rt-card[data-rt-radius=md]>.rt-card{--rt-card-radius: var(--rt-radius-md)}rt-card[data-rt-radius=lg]>.rt-card{--rt-card-radius: var(--rt-radius-lg)}rt-card[data-rt-radius=xl]>.rt-card{--rt-card-radius: var(--rt-radius-xl)}rt-card[data-rt-radius=\"2xl\"]>.rt-card{--rt-card-radius: var(--rt-radius-2xl)}rt-card[data-rt-radius=full]>.rt-card{--rt-card-radius: var(--rt-radius-full)}}\n"],
|
|
74
|
+
dependencies: [
|
|
75
|
+
{
|
|
76
|
+
kind: "directive",
|
|
77
|
+
type: BlockDirective,
|
|
78
|
+
selector: "[rtBlock]",
|
|
79
|
+
inputs: ["rtMod"]
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
kind: "directive",
|
|
83
|
+
type: ElemDirective,
|
|
84
|
+
selector: "[rtElem]",
|
|
85
|
+
inputs: ["rtMod"]
|
|
86
|
+
},
|
|
87
|
+
{
|
|
88
|
+
kind: "directive",
|
|
89
|
+
type: ModDirective,
|
|
90
|
+
selector: "[rtMod]"
|
|
91
|
+
}
|
|
92
|
+
],
|
|
93
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
94
|
+
encapsulation: i0.ViewEncapsulation.None
|
|
95
|
+
});
|
|
96
|
+
}
|
|
97
|
+
};
|
|
98
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
99
|
+
minVersion: "12.0.0",
|
|
100
|
+
version: "22.2.2",
|
|
101
|
+
ngImport: i0,
|
|
102
|
+
type: RtCardComponent,
|
|
103
|
+
decorators: [{
|
|
104
|
+
type: Component,
|
|
105
|
+
args: [{
|
|
106
|
+
selector: "rt-card",
|
|
107
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
108
|
+
encapsulation: ViewEncapsulation.None,
|
|
109
|
+
imports: [
|
|
110
|
+
BlockDirective,
|
|
111
|
+
ElemDirective,
|
|
112
|
+
ModDirective
|
|
113
|
+
],
|
|
114
|
+
hostDirectives: [{
|
|
115
|
+
directive: RtRadiusDirective,
|
|
116
|
+
inputs: ["radius"]
|
|
117
|
+
}],
|
|
118
|
+
host: { class: BEM_BLOCK },
|
|
119
|
+
template: "<article\n rtBlock=\"rt-card\"\n qa-dataid=\"card\"\n [rtMod]=\"{ clickable: clickable() }\"\n [attr.role]=\"clickable() ? 'button' : null\"\n [attr.tabindex]=\"clickable() ? 0 : null\"\n [attr.aria-label]=\"ariaLabel()\"\n (click)=\"onClick($event)\"\n (keydown.enter)=\"onKeyActivate($event)\"\n (keydown.space)=\"onKeyActivate($event)\">\n <header rtElem=\"header\">\n @if (header(); as h) {\n <h3 rtElem=\"title\" qa-dataid=\"card-title\">{{ h }}</h3>\n }\n <ng-content select=\"[rtCardHeader]\" />\n </header>\n <div rtElem=\"content\">\n <ng-content />\n </div>\n <footer rtElem=\"footer\">\n <ng-content select=\"[rtCardFooter]\" />\n </footer>\n</article>\n",
|
|
120
|
+
styles: ["@charset \"UTF-8\";@layer rt-kit.components{rt-card{display:block}rt-card .rt-card{--rt-card-radius: var(--rt-radius-xl);--rt-card-shadow: var(--rt-shadow-card);--rt-card-shadow-hover: var(--rt-shadow-lg);--rt-card-focus-shadow: var(--rt-shadow-focus-ring);--rt-card-transition-duration: var(--rt-duration-fast);display:block;padding:var(--rt-space-lg);border-radius:var(--rt-card-radius);background:var(--rt-color-bg-surface);box-shadow:var(--rt-card-shadow);color:var(--rt-color-text-primary)}rt-card .rt-card--clickable{cursor:pointer;transition:box-shadow var(--rt-card-transition-duration) ease,transform var(--rt-card-transition-duration) ease}rt-card .rt-card--clickable:hover{box-shadow:var(--rt-card-shadow-hover)}rt-card .rt-card--clickable:focus-visible{box-shadow:var(--rt-card-focus-shadow);outline:2px solid transparent;outline-offset:2px}rt-card .rt-card__header{margin-block-end:var(--rt-space-md)}rt-card .rt-card__header:empty{display:none}rt-card .rt-card__title{margin:0;font-size:var(--rt-text-lg);line-height:var(--rt-leading-snug)}rt-card .rt-card__content{display:block}rt-card .rt-card__footer{margin-block-start:var(--rt-space-md)}rt-card .rt-card__footer:empty{display:none}rt-card[data-rt-radius=none]>.rt-card{--rt-card-radius: var(--rt-radius-none)}rt-card[data-rt-radius=xs]>.rt-card{--rt-card-radius: var(--rt-radius-xs)}rt-card[data-rt-radius=sm]>.rt-card{--rt-card-radius: var(--rt-radius-sm)}rt-card[data-rt-radius=ms]>.rt-card{--rt-card-radius: var(--rt-radius-ms)}rt-card[data-rt-radius=md]>.rt-card{--rt-card-radius: var(--rt-radius-md)}rt-card[data-rt-radius=lg]>.rt-card{--rt-card-radius: var(--rt-radius-lg)}rt-card[data-rt-radius=xl]>.rt-card{--rt-card-radius: var(--rt-radius-xl)}rt-card[data-rt-radius=\"2xl\"]>.rt-card{--rt-card-radius: var(--rt-radius-2xl)}rt-card[data-rt-radius=full]>.rt-card{--rt-card-radius: var(--rt-radius-full)}}\n"]
|
|
121
|
+
}]
|
|
122
|
+
}],
|
|
123
|
+
propDecorators: {
|
|
124
|
+
header: [{
|
|
125
|
+
type: i0.Input,
|
|
126
|
+
args: [{
|
|
127
|
+
isSignal: true,
|
|
128
|
+
alias: "header",
|
|
129
|
+
required: false
|
|
130
|
+
}]
|
|
131
|
+
}],
|
|
132
|
+
ariaLabel: [{
|
|
133
|
+
type: i0.Input,
|
|
134
|
+
args: [{
|
|
135
|
+
isSignal: true,
|
|
136
|
+
alias: "ariaLabel",
|
|
137
|
+
required: false
|
|
138
|
+
}]
|
|
139
|
+
}],
|
|
140
|
+
clickable: [{
|
|
141
|
+
type: i0.Input,
|
|
142
|
+
args: [{
|
|
143
|
+
isSignal: true,
|
|
144
|
+
alias: "clickable",
|
|
145
|
+
required: false
|
|
146
|
+
}]
|
|
147
|
+
}],
|
|
148
|
+
cardClick: [{
|
|
149
|
+
type: i0.Output,
|
|
150
|
+
args: ["cardClick"]
|
|
151
|
+
}]
|
|
152
|
+
}
|
|
153
|
+
});
|
|
71
154
|
export { RtCardComponent };
|
|
72
|
-
|
|
155
|
+
|
|
156
|
+
//# sourceMappingURL=rt-tools-ui-kit-v2-card.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rt-tools-ui-kit-v2-card.mjs","sources":["../../../projects/ui-kit-v2/src/lib/components/card/rt-card.component.ts","../../../projects/ui-kit-v2/src/lib/components/card/rt-card.component.html"
|
|
1
|
+
{"version":3,"file":"rt-tools-ui-kit-v2-card.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/card/rt-card.component.ts","../../../projects/ui-kit-v2/src/lib/components/card/rt-card.component.html"],"sourcesContent":["import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n input,\n InputSignal,\n InputSignalWithTransform,\n output,\n OutputEmitterRef,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\n\nconst BEM_BLOCK: string = 'rt-card';\n\n/**\n * Контейнер-карточка с опциональным header (текст ИЛИ projected slot) и footer\n * (projected slot). Default content проецируется в основную область. Поддерживает\n * clickable mode для card-as-button сценариев: при `clickable=true` корневой\n * `<article>` получает `role=\"button\"`, `tabindex=\"0\"` и эмиттит `cardClick`\n * MouseEvent на клик и Enter/Space с клавиатуры.\n *\n * Две стратегии header:\n * 1. Текстом через `header=\"...\"` input — рендерит `<h3 class=\"rt-card__title\">`.\n * 2. Произвольный контент через attribute-selector slot `[rtCardHeader]`.\n *\n * Footer — только через slot `[rtCardFooter]`. Пустые header/footer слоты\n * визуально скрываются через `:empty` CSS-селектор.\n *\n * Все цвета и размеры — через семантические `--rt-*` токены; BEM-разметка через\n * директивы `rtBlock` / `rtElem` / `rtMod` из `@rt-tools/core`.\n */\n@Component({\n selector: 'rt-card',\n templateUrl: './rt-card.component.html',\n styleUrl: './rt-card.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n imports: [\n // standalone components / directives\n BlockDirective,\n ElemDirective,\n ModDirective,\n ],\n hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n host: {\n class: BEM_BLOCK,\n },\n})\nexport class RtCardComponent {\n /** Заголовок-текст; если задан — рендерится `<h3 class=\"rt-card__title\">`. */\n public readonly header: InputSignal<string | null> = input<string | null>(null);\n\n /** ARIA-label на корневом `<article>`. */\n public readonly ariaLabel: InputSignal<string | null> = input<string | null>(null);\n\n /** Делает карточку интерактивной: `role=\"button\"`, `tabindex=\"0\"`, клавиатура. */\n public readonly clickable: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n\n /** Эмиттит MouseEvent при клике (или Enter/Space) — только если `clickable=true`. */\n public readonly cardClick: OutputEmitterRef<MouseEvent> = output<MouseEvent>();\n\n protected onClick(event: MouseEvent): void {\n if (this.clickable()) {\n this.cardClick.emit(event);\n }\n }\n\n protected onKeyActivate(event: Event): void {\n if (!this.clickable()) {\n return;\n }\n event.preventDefault();\n this.cardClick.emit(event as unknown as MouseEvent);\n }\n}\n","<article\n rtBlock=\"rt-card\"\n qa-dataid=\"card\"\n [rtMod]=\"{ clickable: clickable() }\"\n [attr.role]=\"clickable() ? 'button' : null\"\n [attr.tabindex]=\"clickable() ? 0 : null\"\n [attr.aria-label]=\"ariaLabel()\"\n (click)=\"onClick($event)\"\n (keydown.enter)=\"onKeyActivate($event)\"\n (keydown.space)=\"onKeyActivate($event)\">\n <header rtElem=\"header\">\n @if (header(); as h) {\n <h3 rtElem=\"title\" qa-dataid=\"card-title\">{{ h }}</h3>\n }\n <ng-content select=\"[rtCardHeader]\" />\n </header>\n <div rtElem=\"content\">\n <ng-content />\n </div>\n <footer rtElem=\"footer\">\n <ng-content select=\"[rtCardFooter]\" />\n </footer>\n</article>\n"],"mappings":";;;;;AAiBA,MAAM,YAAoB;AAoC1B,IAAa,kBAAb,MAAa,gBAAe;CAjB5B,cAAA;EAmBoB,KAAA,SAAqC,MAAqB,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;EAG/D,KAAA,YAAwC,MAAqB,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;EAGlE,KAAA,YAA6D,MAA6B,OAAK;GAAA,GAAA,YAAA,EAAA,WAAA,YAAA,+BAAA,CAAA;GAC3G,WAAW;EAAgB,CAAA;EAIf,KAAA,YAA0C,OAAM;CAenE;CAba,QAAQ,OAAiB;EAC/B,IAAI,KAAK,UAAS,GACd,KAAK,UAAU,KAAK,KAAK;CAEjC;CAEU,cAAc,OAAY;EAChC,IAAI,CAAC,KAAK,UAAS,GACf;EAEJ,MAAM,eAAc;EACpB,KAAK,UAAU,KAAK,KAA8B;CACtD;CA3BS;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAe,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAf;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAe,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,QAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,WAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,WAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;GAAA;GAAA,SAAA,EAAA,WAAA,YAAA;GAAA,MAAA,EAAA,gBAAA,UAAA;GAAA,gBAAA,CAAA;IAAA,WAAA,GAAA;IAAA,QAAA,CAAA,UAAA,QAAA;GAAA,CAAA;GAAA,UAAA;GAAA,UCrD5B;GAuBA,QAAA,CAAA,81DAAA;GAAA,cAAA;IAAA;KAAA,MAAA;KAAA,MDqBQ;KAAc,UAAA;KAAA,QAAA,CAAA,OAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACd;KAAa,UAAA;KAAA,QAAA,CAAA,OAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACb;KAAY,UAAA;IAAA;GAAA;GAAA,iBAAA,GAAA,wBAAA;GAAA,eAAA,GAAA,kBAAA;EAAA,CAAA;CAAA;;AAOP,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAe,YAAA,CAAA;EAjB3B,MAAA;EACa,MAAA,CAAA;GAAA,UAAA;GAAS,iBAGF,wBAAwB;GAAM,eAChC,kBAAkB;GAAI,SAC5B;IAEL;IACA;IACA;GACH;GAAA,gBACe,CAAC;IAAE,WAAW;IAAmB,QAAQ,CAAC,QAAQ;GAAC,CAAE;GAAC,MAChE,EACF,OAAO,UACV;GAAA,UAAA;GAAA,QAAA,CAAA,81DAAA;EAAA,CAAA"}
|
|
@@ -0,0 +1,155 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
import { ChangeDetectionStrategy, Component, ViewEncapsulation, computed, input } from "@angular/core";
|
|
3
|
+
import { BlockDirective, ElemDirective, ModDirective } from "@rt-tools/core";
|
|
4
|
+
const HEX_PATTERN = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i;
|
|
5
|
+
const BRIGHTNESS_LIMIT = 186;
|
|
6
|
+
function carouselHex(color) {
|
|
7
|
+
const value = (color ?? "").trim();
|
|
8
|
+
if (!HEX_PATTERN.test(value)) return null;
|
|
9
|
+
const digits = value.slice(1).toLowerCase();
|
|
10
|
+
return digits.length === 3 ? `#${[...digits].map((digit) => digit + digit).join("")}` : `#${digits}`;
|
|
11
|
+
}
|
|
12
|
+
function carouselTone(hex) {
|
|
13
|
+
if (hex === null) return null;
|
|
14
|
+
const channel = (from) => parseInt(hex.slice(from, from + 2), 16);
|
|
15
|
+
return .299 * channel(1) + .587 * channel(3) + .114 * channel(5) > BRIGHTNESS_LIMIT ? "dark" : "light";
|
|
16
|
+
}
|
|
17
|
+
function carouselLabel(label, labelCase) {
|
|
18
|
+
if (labelCase === "as-is") return label;
|
|
19
|
+
return label.replace(/\S+/g, (word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase());
|
|
20
|
+
}
|
|
21
|
+
function carouselViews(cards, labelCase = "as-is") {
|
|
22
|
+
return cards.map((card) => {
|
|
23
|
+
const color = carouselHex(card.color);
|
|
24
|
+
return {
|
|
25
|
+
color,
|
|
26
|
+
label: carouselLabel(card.label, labelCase),
|
|
27
|
+
tone: carouselTone(color)
|
|
28
|
+
};
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
const BEM_BLOCK = "rt-carousel";
|
|
32
|
+
function toCards(value) {
|
|
33
|
+
return value ?? [];
|
|
34
|
+
}
|
|
35
|
+
var RtCarouselComponent = class RtCarouselComponent {
|
|
36
|
+
constructor() {
|
|
37
|
+
this.views = computed(() => carouselViews(this.cards(), this.labelCase()), ...ngDevMode ? [{ debugName: "views" }] : /* istanbul ignore next */ []);
|
|
38
|
+
this.cards = input([], {
|
|
39
|
+
...ngDevMode ? { debugName: "cards" } : /* istanbul ignore next */ {},
|
|
40
|
+
transform: toCards
|
|
41
|
+
});
|
|
42
|
+
this.labelCase = input("as-is", ...ngDevMode ? [{ debugName: "labelCase" }] : /* istanbul ignore next */ []);
|
|
43
|
+
}
|
|
44
|
+
static {
|
|
45
|
+
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
46
|
+
minVersion: "12.0.0",
|
|
47
|
+
version: "22.2.2",
|
|
48
|
+
ngImport: i0,
|
|
49
|
+
type: RtCarouselComponent,
|
|
50
|
+
deps: [],
|
|
51
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
52
|
+
});
|
|
53
|
+
}
|
|
54
|
+
static {
|
|
55
|
+
this.ɵcmp = i0.ɵɵngDeclareComponent({
|
|
56
|
+
minVersion: "17.0.0",
|
|
57
|
+
version: "22.2.2",
|
|
58
|
+
type: RtCarouselComponent,
|
|
59
|
+
isStandalone: true,
|
|
60
|
+
selector: "rt-carousel",
|
|
61
|
+
inputs: {
|
|
62
|
+
cards: {
|
|
63
|
+
classPropertyName: "cards",
|
|
64
|
+
publicName: "cards",
|
|
65
|
+
isSignal: true,
|
|
66
|
+
isRequired: false,
|
|
67
|
+
transformFunction: null
|
|
68
|
+
},
|
|
69
|
+
labelCase: {
|
|
70
|
+
classPropertyName: "labelCase",
|
|
71
|
+
publicName: "labelCase",
|
|
72
|
+
isSignal: true,
|
|
73
|
+
isRequired: false,
|
|
74
|
+
transformFunction: null
|
|
75
|
+
}
|
|
76
|
+
},
|
|
77
|
+
host: {
|
|
78
|
+
attributes: { "role": "list" },
|
|
79
|
+
properties: { "style.--rt-carousel-count": "views().length" },
|
|
80
|
+
classAttribute: "rt-carousel"
|
|
81
|
+
},
|
|
82
|
+
ngImport: i0,
|
|
83
|
+
template: "<ng-container rtBlock=\"rt-carousel\">\n @for (card of views(); track $index) {\n <span\n rtElem=\"card\"\n role=\"listitem\"\n tabindex=\"0\"\n qa-dataid=\"carousel-card\"\n [rtMod]=\"{ tone: card.tone }\"\n [style.--rt-carousel-card-fill]=\"card.color\">\n <span rtElem=\"label\" qa-dataid=\"carousel-card-label\">{{ card.label }}</span>\n </span>\n }\n</ng-container>\n",
|
|
84
|
+
styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-carousel{--rt-carousel-count: 0;--rt-carousel-card-width: var(--rt-size-16);--rt-carousel-card-padding-inline: var(--rt-space-2);--rt-carousel-card-radius: var(--rt-radius-ms);--rt-carousel-card-shadow: var(--rt-shadow-sm);--rt-carousel-card-bg: var(--rt-color-bg-subtle);--rt-carousel-card-color: var(--rt-color-text-primary);--rt-carousel-tone-dark: var(--rt-neutral-950);--rt-carousel-tone-light: var(--rt-neutral-0);--rt-carousel-overlap: calc(var(--rt-size-16) / 2);--rt-carousel-lift: var(--rt-space-1);--rt-carousel-shift: var(--rt-space-4);--rt-carousel-label-size: var(--rt-text-xs);--rt-carousel-label-weight: var(--rt-font-weight-medium);--rt-carousel-label-height: var(--rt-size-6);--rt-carousel-label-transform: none;--rt-carousel-duration: var(--rt-duration-base);display:inline-flex;align-items:center;inline-size:calc(var(--rt-carousel-count) * var(--rt-carousel-card-width) - max(var(--rt-carousel-count) - 1,0) * var(--rt-carousel-overlap));isolation:isolate}:is(.rt-preset-material,[data-preset=material]) .rt-carousel{--rt-carousel-card-radius: var(--rt-radius-sm);--rt-carousel-card-shadow: var(--rt-shadow-lg);--rt-carousel-tone-dark: var(--rt-mat-neutral-100);--rt-carousel-label-weight: var(--rt-font-weight-regular);--rt-carousel-label-transform: capitalize;--rt-carousel-duration: calc(var(--rt-duration-base) * 1.5)}.rt-carousel__card{--rt-carousel-card-fill: var(--rt-carousel-card-bg);position:relative;display:flex;box-sizing:border-box;flex-shrink:0;border-radius:var(--rt-carousel-card-radius);background:var(--rt-carousel-card-fill);box-shadow:var(--rt-carousel-card-shadow);color:var(--rt-carousel-card-color);inline-size:var(--rt-carousel-card-width);min-inline-size:var(--rt-carousel-card-width);outline:2px solid transparent;padding-inline:var(--rt-carousel-card-padding-inline);transition:transform var(--rt-carousel-duration) ease-out}.rt-carousel__card+.rt-carousel__card{margin-inline-start:calc(-1 * var(--rt-carousel-overlap))}.rt-carousel__card--tone--dark{color:var(--rt-carousel-tone-dark)}.rt-carousel__card--tone--light{color:var(--rt-carousel-tone-light)}.rt-carousel__card:is(:hover,:focus,:focus-visible){z-index:1;inline-size:max-content;transform:translateY(calc(-1 * var(--rt-carousel-lift)))}.rt-carousel__card:is(:hover,:focus,:focus-visible)~.rt-carousel__card{transform:translate(var(--rt-carousel-shift))}.rt-carousel__card:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}@media(prefers-reduced-motion:reduce){.rt-carousel__card{transition:none}}.rt-carousel__label{overflow:hidden;font-size:var(--rt-carousel-label-size);font-weight:var(--rt-carousel-label-weight);inline-size:100%;line-height:var(--rt-carousel-label-height);text-align:center;text-overflow:ellipsis;text-transform:var(--rt-carousel-label-transform);white-space:nowrap}}\n"],
|
|
85
|
+
dependencies: [
|
|
86
|
+
{
|
|
87
|
+
kind: "directive",
|
|
88
|
+
type: BlockDirective,
|
|
89
|
+
selector: "[rtBlock]",
|
|
90
|
+
inputs: ["rtMod"]
|
|
91
|
+
},
|
|
92
|
+
{
|
|
93
|
+
kind: "directive",
|
|
94
|
+
type: ElemDirective,
|
|
95
|
+
selector: "[rtElem]",
|
|
96
|
+
inputs: ["rtMod"]
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
kind: "directive",
|
|
100
|
+
type: ModDirective,
|
|
101
|
+
selector: "[rtMod]"
|
|
102
|
+
}
|
|
103
|
+
],
|
|
104
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
105
|
+
encapsulation: i0.ViewEncapsulation.None
|
|
106
|
+
});
|
|
107
|
+
}
|
|
108
|
+
};
|
|
109
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
110
|
+
minVersion: "12.0.0",
|
|
111
|
+
version: "22.2.2",
|
|
112
|
+
ngImport: i0,
|
|
113
|
+
type: RtCarouselComponent,
|
|
114
|
+
decorators: [{
|
|
115
|
+
type: Component,
|
|
116
|
+
args: [{
|
|
117
|
+
selector: "rt-carousel",
|
|
118
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
119
|
+
encapsulation: ViewEncapsulation.None,
|
|
120
|
+
imports: [
|
|
121
|
+
BlockDirective,
|
|
122
|
+
ElemDirective,
|
|
123
|
+
ModDirective
|
|
124
|
+
],
|
|
125
|
+
host: {
|
|
126
|
+
class: BEM_BLOCK,
|
|
127
|
+
role: "list",
|
|
128
|
+
"[style.--rt-carousel-count]": "views().length"
|
|
129
|
+
},
|
|
130
|
+
template: "<ng-container rtBlock=\"rt-carousel\">\n @for (card of views(); track $index) {\n <span\n rtElem=\"card\"\n role=\"listitem\"\n tabindex=\"0\"\n qa-dataid=\"carousel-card\"\n [rtMod]=\"{ tone: card.tone }\"\n [style.--rt-carousel-card-fill]=\"card.color\">\n <span rtElem=\"label\" qa-dataid=\"carousel-card-label\">{{ card.label }}</span>\n </span>\n }\n</ng-container>\n",
|
|
131
|
+
styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-carousel{--rt-carousel-count: 0;--rt-carousel-card-width: var(--rt-size-16);--rt-carousel-card-padding-inline: var(--rt-space-2);--rt-carousel-card-radius: var(--rt-radius-ms);--rt-carousel-card-shadow: var(--rt-shadow-sm);--rt-carousel-card-bg: var(--rt-color-bg-subtle);--rt-carousel-card-color: var(--rt-color-text-primary);--rt-carousel-tone-dark: var(--rt-neutral-950);--rt-carousel-tone-light: var(--rt-neutral-0);--rt-carousel-overlap: calc(var(--rt-size-16) / 2);--rt-carousel-lift: var(--rt-space-1);--rt-carousel-shift: var(--rt-space-4);--rt-carousel-label-size: var(--rt-text-xs);--rt-carousel-label-weight: var(--rt-font-weight-medium);--rt-carousel-label-height: var(--rt-size-6);--rt-carousel-label-transform: none;--rt-carousel-duration: var(--rt-duration-base);display:inline-flex;align-items:center;inline-size:calc(var(--rt-carousel-count) * var(--rt-carousel-card-width) - max(var(--rt-carousel-count) - 1,0) * var(--rt-carousel-overlap));isolation:isolate}:is(.rt-preset-material,[data-preset=material]) .rt-carousel{--rt-carousel-card-radius: var(--rt-radius-sm);--rt-carousel-card-shadow: var(--rt-shadow-lg);--rt-carousel-tone-dark: var(--rt-mat-neutral-100);--rt-carousel-label-weight: var(--rt-font-weight-regular);--rt-carousel-label-transform: capitalize;--rt-carousel-duration: calc(var(--rt-duration-base) * 1.5)}.rt-carousel__card{--rt-carousel-card-fill: var(--rt-carousel-card-bg);position:relative;display:flex;box-sizing:border-box;flex-shrink:0;border-radius:var(--rt-carousel-card-radius);background:var(--rt-carousel-card-fill);box-shadow:var(--rt-carousel-card-shadow);color:var(--rt-carousel-card-color);inline-size:var(--rt-carousel-card-width);min-inline-size:var(--rt-carousel-card-width);outline:2px solid transparent;padding-inline:var(--rt-carousel-card-padding-inline);transition:transform var(--rt-carousel-duration) ease-out}.rt-carousel__card+.rt-carousel__card{margin-inline-start:calc(-1 * var(--rt-carousel-overlap))}.rt-carousel__card--tone--dark{color:var(--rt-carousel-tone-dark)}.rt-carousel__card--tone--light{color:var(--rt-carousel-tone-light)}.rt-carousel__card:is(:hover,:focus,:focus-visible){z-index:1;inline-size:max-content;transform:translateY(calc(-1 * var(--rt-carousel-lift)))}.rt-carousel__card:is(:hover,:focus,:focus-visible)~.rt-carousel__card{transform:translate(var(--rt-carousel-shift))}.rt-carousel__card:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}@media(prefers-reduced-motion:reduce){.rt-carousel__card{transition:none}}.rt-carousel__label{overflow:hidden;font-size:var(--rt-carousel-label-size);font-weight:var(--rt-carousel-label-weight);inline-size:100%;line-height:var(--rt-carousel-label-height);text-align:center;text-overflow:ellipsis;text-transform:var(--rt-carousel-label-transform);white-space:nowrap}}\n"]
|
|
132
|
+
}]
|
|
133
|
+
}],
|
|
134
|
+
propDecorators: {
|
|
135
|
+
cards: [{
|
|
136
|
+
type: i0.Input,
|
|
137
|
+
args: [{
|
|
138
|
+
isSignal: true,
|
|
139
|
+
alias: "cards",
|
|
140
|
+
required: false
|
|
141
|
+
}]
|
|
142
|
+
}],
|
|
143
|
+
labelCase: [{
|
|
144
|
+
type: i0.Input,
|
|
145
|
+
args: [{
|
|
146
|
+
isSignal: true,
|
|
147
|
+
alias: "labelCase",
|
|
148
|
+
required: false
|
|
149
|
+
}]
|
|
150
|
+
}]
|
|
151
|
+
}
|
|
152
|
+
});
|
|
153
|
+
export { RtCarouselComponent, carouselHex, carouselLabel, carouselTone, carouselViews };
|
|
154
|
+
|
|
155
|
+
//# sourceMappingURL=rt-tools-ui-kit-v2-carousel.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"rt-tools-ui-kit-v2-carousel.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/carousel/rt-carousel.logic.ts","../../../projects/ui-kit-v2/src/lib/components/carousel/rt-carousel.component.ts","../../../projects/ui-kit-v2/src/lib/components/carousel/rt-carousel.component.html"],"sourcesContent":["import { IRtCarousel } from './rt-carousel.model';\n\n/** Цвет записью `#rgb` или `#rrggbb`, в любом регистре. */\nconst HEX_PATTERN: RegExp = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i;\n\n/** Порог яркости правила приложения: выше него подпись тёмная. */\nconst BRIGHTNESS_LIMIT: number = 186;\n\n/**\n * Цвет карточки как `#rrggbb` строчными. Трёхзначная запись разворачивается до шести знаков; всё,\n * что не цвет такой записью, — `null`, и карточка остаётся на фоне кита.\n */\nexport function carouselHex(color: string | null | undefined): string | null {\n const value: string = (color ?? '').trim();\n if (!HEX_PATTERN.test(value)) {\n return null;\n }\n const digits: string = value.slice(1).toLowerCase();\n return digits.length === 3 ? `#${[...digits].map((digit: string): string => digit + digit).join('')}` : `#${digits}`;\n}\n\n/**\n * Тон подписи по яркости цвета — то же правило, каким приложение выбирало цвет текста:\n * `0.299·R + 0.587·G + 0.114·B` выше 186 даёт тёмную подпись, иначе светлую.\n */\nexport function carouselTone(hex: string | null): IRtCarousel.Tone | null {\n if (hex === null) {\n return null;\n }\n const channel: (from: number) => number = (from: number): number => parseInt(hex.slice(from, from + 2), 16);\n const brightness: number = 0.299 * channel(1) + 0.587 * channel(3) + 0.114 * channel(5);\n return brightness > BRIGHTNESS_LIMIT ? 'dark' : 'light';\n}\n\n/**\n * Подпись в нужном регистре. `title` пишет каждое слово с заглавной и строчными дальше: «AI tools»\n * становится «Ai Tools». Разделители между словами остаются как пришли.\n */\nexport function carouselLabel(label: string, labelCase: IRtCarousel.LabelCase): string {\n if (labelCase === 'as-is') {\n return label;\n }\n return label.replace(/\\S+/g, (word: string): string => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase());\n}\n\n/** Карточки входа в том виде, какой рисует шаблон. */\nexport function carouselViews(cards: readonly IRtCarousel.Card[], labelCase: IRtCarousel.LabelCase = 'as-is'): readonly IRtCarousel.View[] {\n return cards.map((card: IRtCarousel.Card): IRtCarousel.View => {\n const color: string | null = carouselHex(card.color);\n return { color, label: carouselLabel(card.label, labelCase), tone: carouselTone(color) };\n });\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n computed,\n input,\n InputSignal,\n InputSignalWithTransform,\n Signal,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { carouselViews } from './rt-carousel.logic';\nimport { IRtCarousel } from './rt-carousel.model';\n\nconst BEM_BLOCK: string = 'rt-carousel';\n\n/** Пустой вход и `null` значат одно — стопку без карточек. */\nfunction toCards(value: readonly IRtCarousel.Card[] | null | undefined): readonly IRtCarousel.Card[] {\n return value ?? [];\n}\n\n/**\n * Стопка цветных карточек с короткой подписью: роли, права, метки записи в узкой ячейке.\n *\n * Карточки наезжают одна на другую; под указателем и в фокусе карточка приподнимается, растёт до\n * всей подписи и встаёт поверх соседей, а следующие отходят в сторону. Каждая карточка стоит в\n * порядке Tab, поэтому подпись целиком видна и с клавиатуры. Подпись на цвете карточки — тёмная или\n * светлая по яркости цвета.\n *\n * Размеры, наезд, подъём, сдвиг, скругление, тень, кегль, регистр и длительность — свойства\n * `--rt-carousel-*`; материальный набор задаёт ими вид приложения.\n *\n * Договорённость — `docs/specs/ui-kit-v2/carousel/`.\n */\n@Component({\n selector: 'rt-carousel',\n templateUrl: './rt-carousel.component.html',\n styleUrls: ['./rt-carousel.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n imports: [\n // standalone components / directives\n BlockDirective,\n ElemDirective,\n ModDirective,\n ],\n host: {\n class: BEM_BLOCK,\n role: 'list',\n '[style.--rt-carousel-count]': 'views().length',\n },\n})\nexport class RtCarouselComponent {\n /** Карточки, какими их рисует шаблон: цвет приведён к записи, тон подписи посчитан. */\n protected readonly views: Signal<readonly IRtCarousel.View[]> = computed((): readonly IRtCarousel.View[] =>\n carouselViews(this.cards(), this.labelCase())\n );\n\n /** Карточки стопки в порядке показа. */\n public readonly cards: InputSignalWithTransform<readonly IRtCarousel.Card[], readonly IRtCarousel.Card[] | null | undefined> = input<\n readonly IRtCarousel.Card[],\n readonly IRtCarousel.Card[] | null | undefined\n >([], { transform: toCards });\n\n /** Регистр подписей: как пришли или каждое слово с заглавной и строчными дальше. */\n public readonly labelCase: InputSignal<IRtCarousel.LabelCase> = input<IRtCarousel.LabelCase>('as-is');\n}\n","<ng-container rtBlock=\"rt-carousel\">\n @for (card of views(); track $index) {\n <span\n rtElem=\"card\"\n role=\"listitem\"\n tabindex=\"0\"\n qa-dataid=\"carousel-card\"\n [rtMod]=\"{ tone: card.tone }\"\n [style.--rt-carousel-card-fill]=\"card.color\">\n <span rtElem=\"label\" qa-dataid=\"carousel-card-label\">{{ card.label }}</span>\n </span>\n }\n</ng-container>\n"],"mappings":"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"}
|