@yewdiel21/motion-kit 0.10.0 → 0.15.0
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/README.md +81 -0
- package/bin/motion-kit.mjs +3 -3
- package/dist/auto/index.d.ts +56 -3
- package/dist/auto/index.js +107 -3
- package/dist/auto/index.js.map +1 -1
- package/dist/{chunk-XAKC2QY7.js → chunk-6IRJYXJU.js} +3 -28
- package/dist/chunk-6IRJYXJU.js.map +1 -0
- package/dist/chunk-A6QQCF6V.js +21333 -0
- package/dist/chunk-A6QQCF6V.js.map +1 -0
- package/dist/chunk-JXRS3OEA.js +3638 -0
- package/dist/chunk-JXRS3OEA.js.map +1 -0
- package/dist/chunk-QP4QJOEN.js +72 -0
- package/dist/chunk-QP4QJOEN.js.map +1 -0
- package/dist/css/components/activity-feed.css +240 -0
- package/dist/css/components/add-to-cart.css +72 -0
- package/dist/css/components/attachment.css +266 -0
- package/dist/css/components/bidirectional-slider.css +168 -0
- package/dist/css/components/breadcrumb.css +110 -0
- package/dist/css/components/chart-tooltip.css +168 -0
- package/dist/css/components/chart.css +296 -0
- package/dist/css/components/code-block.css +264 -0
- package/dist/css/components/color-area.css +82 -0
- package/dist/css/components/color-field.css +67 -0
- package/dist/css/components/color-picker.css +131 -0
- package/dist/css/components/color-slider.css +113 -0
- package/dist/css/components/command-search.css +252 -0
- package/dist/css/components/context-menu.css +23 -0
- package/dist/css/components/credit-card.css +288 -0
- package/dist/css/components/data-table.css +686 -0
- package/dist/css/components/date-range-picker.css +168 -0
- package/dist/css/components/date-time-picker.css +178 -0
- package/dist/css/components/drawer.css +58 -0
- package/dist/css/components/editable-table.css +201 -0
- package/dist/css/components/empty-state.css +61 -0
- package/dist/css/components/file-explorer.css +633 -0
- package/dist/css/components/filter-builder.css +227 -0
- package/dist/css/components/heatmap-chart.css +391 -0
- package/dist/css/components/hold-confirm.css +87 -0
- package/dist/css/components/hover-card.css +19 -7
- package/dist/css/components/image-preview.css +283 -0
- package/dist/css/components/json-viewer.css +304 -0
- package/dist/css/components/like-button.css +78 -0
- package/dist/css/components/link-preview.css +275 -0
- package/dist/css/components/loading-button.css +77 -0
- package/dist/css/components/multi-select.css +267 -0
- package/dist/css/components/nav.css +102 -102
- package/dist/css/components/notification-bell.css +127 -0
- package/dist/css/components/orbit-menu.css +130 -0
- package/dist/css/components/pagination.css +10 -5
- package/dist/css/components/password-strength.css +183 -0
- package/dist/css/components/pie-chart.css +390 -0
- package/dist/css/components/pill-button.css +135 -0
- package/dist/css/components/popover.css +25 -0
- package/dist/css/components/progress.css +140 -0
- package/dist/css/components/questionnaire.css +217 -0
- package/dist/css/components/radar-chart.css +370 -0
- package/dist/css/components/radial-chart.css +398 -0
- package/dist/css/components/range-calendar.css +186 -0
- package/dist/css/components/range-slider.css +192 -0
- package/dist/css/components/resizable-panel.css +243 -0
- package/dist/css/components/rich-text-editor.css +284 -0
- package/dist/css/components/sankey-chart.css +358 -0
- package/dist/css/components/scratch-card.css +75 -0
- package/dist/css/components/scroll-island.css +111 -0
- package/dist/css/components/select.css +136 -0
- package/dist/css/components/skeleton.css +108 -0
- package/dist/css/components/split-view.css +19 -0
- package/dist/css/components/star-rating.css +80 -0
- package/dist/css/components/stat-card.css +164 -0
- package/dist/css/components/swipe-actions.css +105 -0
- package/dist/css/components/tag-input.css +244 -0
- package/dist/css/components/time-field.css +88 -0
- package/dist/css/components/timeline.css +219 -0
- package/dist/css/components/toolbar.css +122 -0
- package/dist/css/components/tooltip.css +79 -0
- package/dist/css/components/tree-view.css +289 -0
- package/dist/css/components/virtual-list.css +195 -0
- package/dist/css/components/voice-dots.css +70 -0
- package/dist/css/tokens.css +185 -181
- package/dist/elements/index.d.ts +849 -7
- package/dist/elements/index.js +1642 -8
- package/dist/elements/index.js.map +1 -1
- package/dist/{engine-GDGwQnJE.d.ts → engine-5zRIssTO.d.ts} +11 -1
- package/dist/engine-QECQnGz1.d.ts +33 -0
- package/dist/index.css +10890 -311
- package/dist/index.d.ts +89 -5
- package/dist/index.js +273 -9
- package/dist/index.js.map +1 -1
- package/dist/react/index.d.ts +686 -24
- package/dist/react/index.js +2345 -9
- package/dist/react/index.js.map +1 -1
- package/dist/{reduced-BmBzKH94.d.ts → reduced-6X_bns60.d.ts} +9 -2
- package/dist/reveal-BfyKKsw4.d.ts +2474 -0
- package/dist/store-CA2Qcun_.d.ts +453 -0
- package/package.json +9 -16
- package/registry.json +1096 -543
- package/src/auto/auto-init.ts +104 -0
- package/src/components/activity-feed/README.md +56 -0
- package/src/components/activity-feed/activity-feed.css +239 -0
- package/src/components/activity-feed/element.ts +36 -0
- package/src/components/activity-feed/engine.ts +351 -0
- package/src/components/activity-feed/react.tsx +32 -0
- package/src/components/add-to-cart/README.md +34 -0
- package/src/components/add-to-cart/add-to-cart.css +71 -0
- package/src/components/add-to-cart/element.ts +20 -0
- package/src/components/add-to-cart/engine.ts +206 -0
- package/src/components/add-to-cart/react.tsx +29 -0
- package/src/components/attachment/README.md +27 -0
- package/src/components/attachment/attachment.css +265 -0
- package/src/components/attachment/element.ts +50 -0
- package/src/components/attachment/engine.ts +469 -0
- package/src/components/attachment/react.tsx +65 -0
- package/src/components/bidirectional-slider/README.md +46 -0
- package/src/components/bidirectional-slider/bidirectional-slider.css +167 -0
- package/src/components/bidirectional-slider/element.ts +42 -0
- package/src/components/bidirectional-slider/engine.ts +289 -0
- package/src/components/bidirectional-slider/react.tsx +45 -0
- package/src/components/breadcrumb/README.md +38 -0
- package/src/components/breadcrumb/breadcrumb.css +109 -0
- package/src/components/breadcrumb/element.ts +27 -0
- package/src/components/breadcrumb/engine.ts +249 -0
- package/src/components/breadcrumb/react.tsx +30 -0
- package/src/components/chart/README.md +34 -0
- package/src/components/chart/chart.css +295 -0
- package/src/components/chart/element.ts +43 -0
- package/src/components/chart/engine.ts +838 -0
- package/src/components/chart/parts.ts +237 -0
- package/src/components/chart/react.tsx +50 -0
- package/src/components/chart/use-chart.ts +55 -0
- package/src/components/chart-tooltip/README.md +53 -0
- package/src/components/chart-tooltip/chart-tooltip.css +167 -0
- package/src/components/chart-tooltip/element.ts +37 -0
- package/src/components/chart-tooltip/engine.ts +442 -0
- package/src/components/chart-tooltip/react.tsx +47 -0
- package/src/components/code-block/README.md +19 -0
- package/src/components/code-block/code-block.css +263 -0
- package/src/components/code-block/element.ts +34 -0
- package/src/components/code-block/engine.ts +254 -0
- package/src/components/code-block/highlight.ts +244 -0
- package/src/components/code-block/react.tsx +94 -0
- package/src/components/color-area/README.md +50 -0
- package/src/components/color-area/color-area.css +81 -0
- package/src/components/color-area/element.ts +26 -0
- package/src/components/color-area/engine.ts +246 -0
- package/src/components/color-area/react.tsx +42 -0
- package/src/components/color-field/README.md +43 -0
- package/src/components/color-field/color-field.css +66 -0
- package/src/components/color-field/element.ts +26 -0
- package/src/components/color-field/engine.ts +174 -0
- package/src/components/color-field/react.tsx +42 -0
- package/src/components/color-picker/README.md +45 -0
- package/src/components/color-picker/color-picker.css +130 -0
- package/src/components/color-picker/element.ts +45 -0
- package/src/components/color-picker/engine.ts +314 -0
- package/src/components/color-picker/react.tsx +47 -0
- package/src/components/color-slider/README.md +55 -0
- package/src/components/color-slider/color-slider.css +112 -0
- package/src/components/color-slider/element.ts +26 -0
- package/src/components/color-slider/engine.ts +234 -0
- package/src/components/color-slider/react.tsx +45 -0
- package/src/components/command-search/README.md +15 -0
- package/src/components/command-search/command-search.css +251 -0
- package/src/components/command-search/element.ts +36 -0
- package/src/components/command-search/engine.ts +356 -0
- package/src/components/command-search/match.ts +53 -0
- package/src/components/command-search/react.tsx +66 -0
- package/src/components/context-menu/README.md +31 -0
- package/src/components/context-menu/context-menu.css +22 -0
- package/src/components/context-menu/element.ts +40 -0
- package/src/components/context-menu/engine.ts +153 -0
- package/src/components/context-menu/react.tsx +57 -0
- package/src/components/credit-card/README.md +20 -0
- package/src/components/credit-card/card.ts +77 -0
- package/src/components/credit-card/credit-card.css +287 -0
- package/src/components/credit-card/element.ts +33 -0
- package/src/components/credit-card/engine.ts +410 -0
- package/src/components/credit-card/react.tsx +36 -0
- package/src/components/data-table/README.md +83 -0
- package/src/components/data-table/data-table.css +685 -0
- package/src/components/data-table/element.ts +54 -0
- package/src/components/data-table/engine.ts +1111 -0
- package/src/components/data-table/react.tsx +94 -0
- package/src/components/date-range-picker/README.md +51 -0
- package/src/components/date-range-picker/date-range-picker.css +167 -0
- package/src/components/date-range-picker/element.ts +52 -0
- package/src/components/date-range-picker/engine.ts +352 -0
- package/src/components/date-range-picker/react.tsx +57 -0
- package/src/components/date-time-picker/README.md +48 -0
- package/src/components/date-time-picker/date-time-picker.css +177 -0
- package/src/components/date-time-picker/element.ts +47 -0
- package/src/components/date-time-picker/engine.ts +350 -0
- package/src/components/date-time-picker/react.tsx +54 -0
- package/src/components/dialog/README.md +103 -102
- package/src/components/dialog/element.ts +123 -118
- package/src/components/dialog/engine.ts +449 -432
- package/src/components/drawer/README.md +28 -0
- package/src/components/drawer/drawer.css +57 -0
- package/src/components/drawer/element.ts +21 -0
- package/src/components/drawer/engine.ts +56 -0
- package/src/components/drawer/react.tsx +85 -0
- package/src/components/editable-table/README.md +67 -0
- package/src/components/editable-table/editable-table.css +200 -0
- package/src/components/editable-table/element.ts +45 -0
- package/src/components/editable-table/engine.ts +831 -0
- package/src/components/editable-table/react.tsx +79 -0
- package/src/components/empty-state/README.md +41 -0
- package/src/components/empty-state/element.ts +23 -0
- package/src/components/empty-state/empty-state.css +60 -0
- package/src/components/empty-state/engine.ts +232 -0
- package/src/components/empty-state/react.tsx +34 -0
- package/src/components/file-explorer/README.md +67 -0
- package/src/components/file-explorer/element.ts +39 -0
- package/src/components/file-explorer/engine.ts +1307 -0
- package/src/components/file-explorer/file-explorer.css +632 -0
- package/src/components/file-explorer/react.tsx +77 -0
- package/src/components/filter-builder/README.md +47 -0
- package/src/components/filter-builder/element.ts +34 -0
- package/src/components/filter-builder/engine.ts +396 -0
- package/src/components/filter-builder/filter-builder.css +226 -0
- package/src/components/filter-builder/react.tsx +36 -0
- package/src/components/heatmap-chart/README.md +48 -0
- package/src/components/heatmap-chart/element.ts +21 -0
- package/src/components/heatmap-chart/engine.ts +281 -0
- package/src/components/heatmap-chart/heatmap-chart.css +93 -0
- package/src/components/heatmap-chart/react.tsx +14 -0
- package/src/components/hold-confirm/README.md +13 -0
- package/src/components/hold-confirm/element.ts +24 -0
- package/src/components/hold-confirm/engine.ts +216 -0
- package/src/components/hold-confirm/hold-confirm.css +86 -0
- package/src/components/hold-confirm/react.tsx +28 -0
- package/src/components/hover-card/README.md +6 -2
- package/src/components/hover-card/engine.ts +98 -7
- package/src/components/hover-card/hover-card.css +19 -7
- package/src/components/image-preview/README.md +16 -0
- package/src/components/image-preview/element.ts +26 -0
- package/src/components/image-preview/engine.ts +405 -0
- package/src/components/image-preview/image-preview.css +282 -0
- package/src/components/image-preview/react.tsx +43 -0
- package/src/components/json-viewer/README.md +56 -0
- package/src/components/json-viewer/element.ts +37 -0
- package/src/components/json-viewer/engine.ts +449 -0
- package/src/components/json-viewer/json-viewer.css +303 -0
- package/src/components/json-viewer/react.tsx +56 -0
- package/src/components/like-button/README.md +13 -0
- package/src/components/like-button/element.ts +47 -0
- package/src/components/like-button/engine.ts +145 -0
- package/src/components/like-button/like-button.css +77 -0
- package/src/components/like-button/react.tsx +39 -0
- package/src/components/link-preview/README.md +19 -0
- package/src/components/link-preview/element.ts +29 -0
- package/src/components/link-preview/engine.ts +192 -0
- package/src/components/link-preview/link-preview.css +274 -0
- package/src/components/link-preview/react.tsx +101 -0
- package/src/components/loading-button/README.md +45 -0
- package/src/components/loading-button/element.ts +34 -0
- package/src/components/loading-button/engine.ts +201 -0
- package/src/components/loading-button/loading-button.css +76 -0
- package/src/components/loading-button/react.tsx +43 -0
- package/src/components/multi-select/README.md +48 -0
- package/src/components/multi-select/element.ts +28 -0
- package/src/components/multi-select/engine.ts +294 -0
- package/src/components/multi-select/multi-select.css +266 -0
- package/src/components/multi-select/react.tsx +39 -0
- package/src/components/nav/README.md +12 -10
- package/src/components/nav/element.ts +5 -5
- package/src/components/nav/engine.ts +21 -14
- package/src/components/nav/nav.css +102 -102
- package/src/components/nav/react.tsx +4 -4
- package/src/components/notification-bell/README.md +14 -0
- package/src/components/notification-bell/element.ts +48 -0
- package/src/components/notification-bell/engine.ts +202 -0
- package/src/components/notification-bell/notification-bell.css +126 -0
- package/src/components/notification-bell/react.tsx +57 -0
- package/src/components/orbit-menu/README.md +46 -0
- package/src/components/orbit-menu/element.ts +27 -0
- package/src/components/orbit-menu/engine.ts +179 -0
- package/src/components/orbit-menu/orbit-menu.css +129 -0
- package/src/components/orbit-menu/react.tsx +44 -0
- package/src/components/pagination/README.md +1 -1
- package/src/components/pagination/engine.ts +50 -4
- package/src/components/pagination/pagination.css +10 -5
- package/src/components/password-strength/README.md +17 -0
- package/src/components/password-strength/element.ts +22 -0
- package/src/components/password-strength/engine.ts +212 -0
- package/src/components/password-strength/password-strength.css +182 -0
- package/src/components/password-strength/react.tsx +36 -0
- package/src/components/password-strength/score.ts +62 -0
- package/src/components/pie-chart/README.md +48 -0
- package/src/components/pie-chart/element.ts +30 -0
- package/src/components/pie-chart/engine.ts +283 -0
- package/src/components/pie-chart/pie-chart.css +92 -0
- package/src/components/pie-chart/react.tsx +14 -0
- package/src/components/pill-button/README.md +46 -0
- package/src/components/pill-button/element.ts +16 -0
- package/src/components/pill-button/engine.ts +77 -0
- package/src/components/pill-button/pill-button.css +134 -0
- package/src/components/pill-button/react.tsx +32 -0
- package/src/components/popover/README.md +44 -0
- package/src/components/popover/element.ts +31 -0
- package/src/components/popover/engine.ts +114 -0
- package/src/components/popover/popover.css +24 -0
- package/src/components/popover/react.tsx +50 -0
- package/src/components/progress/README.md +17 -0
- package/src/components/progress/element.ts +30 -0
- package/src/components/progress/engine.ts +173 -0
- package/src/components/progress/progress.css +139 -0
- package/src/components/progress/react.tsx +35 -0
- package/src/components/questionnaire/README.md +32 -0
- package/src/components/questionnaire/element.ts +118 -0
- package/src/components/questionnaire/engine.ts +255 -0
- package/src/components/questionnaire/questionnaire.css +216 -0
- package/src/components/questionnaire/react.tsx +140 -0
- package/src/components/radar-chart/README.md +48 -0
- package/src/components/radar-chart/element.ts +30 -0
- package/src/components/radar-chart/engine.ts +327 -0
- package/src/components/radar-chart/radar-chart.css +72 -0
- package/src/components/radar-chart/react.tsx +14 -0
- package/src/components/radial-chart/README.md +48 -0
- package/src/components/radial-chart/element.ts +30 -0
- package/src/components/radial-chart/engine.ts +290 -0
- package/src/components/radial-chart/radial-chart.css +100 -0
- package/src/components/radial-chart/react.tsx +14 -0
- package/src/components/range-calendar/README.md +58 -0
- package/src/components/range-calendar/element.ts +42 -0
- package/src/components/range-calendar/engine.ts +390 -0
- package/src/components/range-calendar/range-calendar.css +185 -0
- package/src/components/range-calendar/react.tsx +56 -0
- package/src/components/range-slider/README.md +23 -0
- package/src/components/range-slider/element.ts +53 -0
- package/src/components/range-slider/engine.ts +316 -0
- package/src/components/range-slider/range-slider.css +191 -0
- package/src/components/range-slider/react.tsx +66 -0
- package/src/components/resizable-panel/README.md +61 -0
- package/src/components/resizable-panel/element.ts +36 -0
- package/src/components/resizable-panel/engine.ts +551 -0
- package/src/components/resizable-panel/react.tsx +74 -0
- package/src/components/resizable-panel/resizable-panel.css +242 -0
- package/src/components/rich-text-editor/README.md +57 -0
- package/src/components/rich-text-editor/element.ts +34 -0
- package/src/components/rich-text-editor/engine.ts +673 -0
- package/src/components/rich-text-editor/react.tsx +60 -0
- package/src/components/rich-text-editor/rich-text-editor.css +283 -0
- package/src/components/sankey-chart/README.md +48 -0
- package/src/components/sankey-chart/element.ts +31 -0
- package/src/components/sankey-chart/engine.ts +401 -0
- package/src/components/sankey-chart/react.tsx +14 -0
- package/src/components/sankey-chart/sankey-chart.css +60 -0
- package/src/components/scratch-card/README.md +15 -0
- package/src/components/scratch-card/element.ts +30 -0
- package/src/components/scratch-card/engine.ts +257 -0
- package/src/components/scratch-card/react.tsx +40 -0
- package/src/components/scratch-card/scratch-card.css +74 -0
- package/src/components/scroll-island/README.md +34 -0
- package/src/components/scroll-island/element.ts +16 -0
- package/src/components/scroll-island/engine.ts +252 -0
- package/src/components/scroll-island/react.tsx +26 -0
- package/src/components/scroll-island/scroll-island.css +110 -0
- package/src/components/select/README.md +34 -0
- package/src/components/select/element.ts +26 -0
- package/src/components/select/engine.ts +267 -0
- package/src/components/select/react.tsx +33 -0
- package/src/components/select/select.css +135 -0
- package/src/components/skeleton/README.md +15 -0
- package/src/components/skeleton/element.ts +32 -0
- package/src/components/skeleton/engine.ts +104 -0
- package/src/components/skeleton/react.tsx +41 -0
- package/src/components/skeleton/skeleton.css +107 -0
- package/src/components/split-view/README.md +50 -0
- package/src/components/split-view/element.ts +34 -0
- package/src/components/split-view/engine.ts +114 -0
- package/src/components/split-view/react.tsx +63 -0
- package/src/components/split-view/split-view.css +18 -0
- package/src/components/star-rating/README.md +14 -0
- package/src/components/star-rating/element.ts +26 -0
- package/src/components/star-rating/engine.ts +217 -0
- package/src/components/star-rating/react.tsx +33 -0
- package/src/components/star-rating/star-rating.css +79 -0
- package/src/components/stat-card/README.md +42 -0
- package/src/components/stat-card/element.ts +40 -0
- package/src/components/stat-card/engine.ts +283 -0
- package/src/components/stat-card/react.tsx +36 -0
- package/src/components/stat-card/stat-card.css +163 -0
- package/src/components/swipe-actions/README.md +19 -0
- package/src/components/swipe-actions/element.ts +26 -0
- package/src/components/swipe-actions/engine.ts +260 -0
- package/src/components/swipe-actions/react.tsx +80 -0
- package/src/components/swipe-actions/swipe-actions.css +104 -0
- package/src/components/tag-input/README.md +42 -0
- package/src/components/tag-input/element.ts +39 -0
- package/src/components/tag-input/engine.ts +313 -0
- package/src/components/tag-input/react.tsx +54 -0
- package/src/components/tag-input/tag-input.css +243 -0
- package/src/components/time-field/README.md +54 -0
- package/src/components/time-field/element.ts +38 -0
- package/src/components/time-field/engine.ts +110 -0
- package/src/components/time-field/react.tsx +45 -0
- package/src/components/time-field/time-field.css +87 -0
- package/src/components/timeline/README.md +57 -0
- package/src/components/timeline/element.ts +31 -0
- package/src/components/timeline/engine.ts +300 -0
- package/src/components/timeline/react.tsx +59 -0
- package/src/components/timeline/timeline.css +218 -0
- package/src/components/toolbar/README.md +46 -0
- package/src/components/toolbar/element.ts +30 -0
- package/src/components/toolbar/engine.ts +230 -0
- package/src/components/toolbar/react.tsx +34 -0
- package/src/components/toolbar/toolbar.css +121 -0
- package/src/components/tooltip/README.md +46 -0
- package/src/components/tooltip/element.ts +22 -0
- package/src/components/tooltip/engine.ts +288 -0
- package/src/components/tooltip/react.tsx +30 -0
- package/src/components/tooltip/tooltip.css +78 -0
- package/src/components/tree-view/README.md +61 -0
- package/src/components/tree-view/element.ts +32 -0
- package/src/components/tree-view/engine.ts +743 -0
- package/src/components/tree-view/react.tsx +82 -0
- package/src/components/tree-view/tree-view.css +288 -0
- package/src/components/virtual-list/README.md +81 -0
- package/src/components/virtual-list/element.ts +42 -0
- package/src/components/virtual-list/engine.ts +678 -0
- package/src/components/virtual-list/react.tsx +101 -0
- package/src/components/virtual-list/virtual-list.css +194 -0
- package/src/components/voice-dots/README.md +48 -0
- package/src/components/voice-dots/element.ts +45 -0
- package/src/components/voice-dots/engine.ts +243 -0
- package/src/components/voice-dots/react.tsx +52 -0
- package/src/components/voice-dots/voice-dots.css +69 -0
- package/src/core/chips.ts +196 -0
- package/src/core/color.ts +304 -0
- package/src/core/date-range.ts +67 -0
- package/src/core/dates.ts +11 -1
- package/src/core/files.ts +107 -0
- package/src/core/filter.ts +229 -0
- package/src/core/gsap.ts +80 -65
- package/src/core/listbox.ts +332 -0
- package/src/core/mark.ts +29 -0
- package/src/core/position.ts +89 -0
- package/src/core/relative-time.ts +77 -0
- package/src/core/segment-field.ts +373 -0
- package/src/core/segments.ts +153 -0
- package/src/core/tree.ts +116 -0
- package/src/core/virtual.ts +79 -0
- package/src/css/tokens.css +186 -182
- package/src/elements/index.ts +186 -0
- package/src/index.ts +88 -0
- package/src/motion/liquid.ts +14 -4
- package/src/motion/micro.ts +248 -0
- package/src/motion/sheet.ts +88 -65
- package/src/motion/surface.ts +9 -0
- package/src/react/index.ts +71 -1
- package/dist/chunk-IKQ5FODN.js +0 -1617
- package/dist/chunk-IKQ5FODN.js.map +0 -1
- package/dist/chunk-J6OCFNGU.js +0 -177
- package/dist/chunk-J6OCFNGU.js.map +0 -1
- package/dist/chunk-TFNRIZHU.js +0 -3977
- package/dist/chunk-TFNRIZHU.js.map +0 -1
- package/dist/chunk-XAKC2QY7.js.map +0 -1
- package/dist/reveal-jsX-uwUz.d.ts +0 -625
- package/dist/store-DYb3tTsZ.d.ts +0 -195
|
@@ -0,0 +1,2474 @@
|
|
|
1
|
+
import { I as Instance } from './types-BkS_raL8.js';
|
|
2
|
+
|
|
3
|
+
/** drawer: slides in from its side (data-mk-drawer="left|right", see createDrawer). */
|
|
4
|
+
type DialogVariant = 'morph' | 'liquid' | 'sheet' | 'drawer';
|
|
5
|
+
type DialogPlacement = 'center' | 'anchor' | 'side';
|
|
6
|
+
interface DialogLabels {
|
|
7
|
+
close?: string;
|
|
8
|
+
float?: string;
|
|
9
|
+
dock?: string;
|
|
10
|
+
}
|
|
11
|
+
interface DialogOptions {
|
|
12
|
+
/** morph (default), liquid, or sheet: rises from the bottom and pushes [data-mk-underlay] back. */
|
|
13
|
+
variant?: DialogVariant;
|
|
14
|
+
placement?: DialogPlacement;
|
|
15
|
+
/** placement 'anchor': the box to place it against, read on open and resize (default: the opener's). */
|
|
16
|
+
anchor?: () => DOMRect | null | undefined;
|
|
17
|
+
/** Tinted backdrop; false leaves it transparent (menus). */
|
|
18
|
+
backdrop?: boolean;
|
|
19
|
+
closeOnBackdrop?: boolean;
|
|
20
|
+
/** Drag (or wheel) down to dismiss. */
|
|
21
|
+
drag?: boolean;
|
|
22
|
+
/** A key turns on the floating window (desktop) and remembers its place. */
|
|
23
|
+
float?: string | false;
|
|
24
|
+
autoResize?: boolean;
|
|
25
|
+
/** `[data-mk-open="<id>"]` buttons open it: true uses the dialog's id; a string names another id; false: none. */
|
|
26
|
+
triggers?: boolean | string;
|
|
27
|
+
/** Modal (default) or a non-modal dialog. */
|
|
28
|
+
modal?: boolean;
|
|
29
|
+
labels?: DialogLabels;
|
|
30
|
+
/** Grow the content with the surface (default). Menus turn it off and cascade their items instead. */
|
|
31
|
+
animateContent?: boolean;
|
|
32
|
+
onOpen?: () => void;
|
|
33
|
+
/** After it closed, whatever closed it. */
|
|
34
|
+
onClose?: () => void;
|
|
35
|
+
}
|
|
36
|
+
interface DialogInstance extends Instance {
|
|
37
|
+
/** `origin`: the control it grows from; omitted, the focused control; null, none (scale-in). */
|
|
38
|
+
open(origin?: HTMLElement | null): void;
|
|
39
|
+
close(): void;
|
|
40
|
+
toggle(origin?: HTMLElement | null): void;
|
|
41
|
+
float(): void;
|
|
42
|
+
dock(): void;
|
|
43
|
+
readonly isOpen: boolean;
|
|
44
|
+
readonly isFloating: boolean;
|
|
45
|
+
readonly element: HTMLElement;
|
|
46
|
+
}
|
|
47
|
+
declare function createDialog(dialog: HTMLElement | null, options?: DialogOptions): DialogInstance;
|
|
48
|
+
|
|
49
|
+
interface MenuOptions extends Omit<DialogOptions, 'placement' | 'backdrop' | 'drag' | 'autoResize' | 'animateContent'> {
|
|
50
|
+
ticket?: boolean;
|
|
51
|
+
/** Close after an option is chosen (default). */
|
|
52
|
+
closeOnSelect?: boolean;
|
|
53
|
+
onSelect?: (value: string, item: HTMLElement) => void;
|
|
54
|
+
}
|
|
55
|
+
interface MenuInstance extends DialogInstance {
|
|
56
|
+
readonly items: HTMLElement[];
|
|
57
|
+
}
|
|
58
|
+
declare function createMenu(dialog: HTMLElement | null, options?: MenuOptions): MenuInstance;
|
|
59
|
+
|
|
60
|
+
interface QuantityOptions {
|
|
61
|
+
min?: number;
|
|
62
|
+
max?: number;
|
|
63
|
+
step?: number;
|
|
64
|
+
value?: number;
|
|
65
|
+
disabled?: boolean;
|
|
66
|
+
onChange?: (value: number) => void;
|
|
67
|
+
}
|
|
68
|
+
interface QuantityInstance extends Instance {
|
|
69
|
+
setValue(value: number, notify?: boolean): void;
|
|
70
|
+
readonly value: number;
|
|
71
|
+
}
|
|
72
|
+
/** Bounded numeric control. Bite/rotation is CSS; buttons remain native. */
|
|
73
|
+
declare function createQuantity(root: HTMLElement | null, options?: QuantityOptions): QuantityInstance;
|
|
74
|
+
|
|
75
|
+
interface PaginationOptions {
|
|
76
|
+
totalPages?: number;
|
|
77
|
+
page?: number;
|
|
78
|
+
siblings?: number;
|
|
79
|
+
pageLabel?: (page: number) => string;
|
|
80
|
+
onChange?: (page: number) => void;
|
|
81
|
+
}
|
|
82
|
+
interface PaginationInstance extends Instance {
|
|
83
|
+
setPage(page: number, notify?: boolean): void;
|
|
84
|
+
setTotalPages(total: number): void;
|
|
85
|
+
readonly page: number;
|
|
86
|
+
readonly totalPages: number;
|
|
87
|
+
}
|
|
88
|
+
/**
|
|
89
|
+
* Renders a bounded window of pages, even when totalPages is very large. A pill
|
|
90
|
+
* ([data-mk-pagination-indicator]) glides under the current page on Melonmind's
|
|
91
|
+
* swing; when the window moves, the numbers that stay slide to their new place
|
|
92
|
+
* and the new ones pop in out of a blur; the arrows press and nudge their way.
|
|
93
|
+
*/
|
|
94
|
+
declare function createPagination(root: HTMLElement | null, options?: PaginationOptions): PaginationInstance;
|
|
95
|
+
|
|
96
|
+
interface HoverCardOptions {
|
|
97
|
+
openDelay?: number;
|
|
98
|
+
closeDelay?: number;
|
|
99
|
+
/** Preferred side; it flips when the viewport has no room there. */
|
|
100
|
+
placement?: 'top' | 'bottom';
|
|
101
|
+
onOpenChange?: (open: boolean) => void;
|
|
102
|
+
}
|
|
103
|
+
interface HoverCardInstance extends Instance {
|
|
104
|
+
open(): void;
|
|
105
|
+
close(): void;
|
|
106
|
+
/** Place the open panel again (after its content changed size). */
|
|
107
|
+
reposition(): void;
|
|
108
|
+
readonly isOpen: boolean;
|
|
109
|
+
}
|
|
110
|
+
/**
|
|
111
|
+
* Nonmodal preview: pointer, keyboard focus and tap all reveal the same panel.
|
|
112
|
+
* The panel stays inside the viewport: it flips to the other side when its own
|
|
113
|
+
* has no room and shifts sideways (--mk-hover-shift) away from the edges, again
|
|
114
|
+
* on scroll and resize. Opened from the keyboard it appears without the entrance.
|
|
115
|
+
* It grows out of the trigger's centre (--mk-hover-origin-x) and, when the
|
|
116
|
+
* pointer leaves, folds back into it (data-mk-closing, .22 s) before hiding.
|
|
117
|
+
*/
|
|
118
|
+
declare function createHoverCard(root: HTMLElement | null, options?: HoverCardOptions): HoverCardInstance;
|
|
119
|
+
|
|
120
|
+
interface InputOtpOptions {
|
|
121
|
+
length?: number;
|
|
122
|
+
value?: string;
|
|
123
|
+
mask?: boolean;
|
|
124
|
+
onChange?: (value: string) => void;
|
|
125
|
+
onComplete?: (value: string) => void;
|
|
126
|
+
}
|
|
127
|
+
interface InputOtpInstance extends Instance {
|
|
128
|
+
setValue(value: string, notify?: boolean): void;
|
|
129
|
+
focus(): void;
|
|
130
|
+
readonly value: string;
|
|
131
|
+
}
|
|
132
|
+
/** One real input preserves native editing, mobile autofill and password managers. */
|
|
133
|
+
declare function createInputOtp(root: HTMLElement | null, options?: InputOtpOptions): InputOtpInstance;
|
|
134
|
+
|
|
135
|
+
type StudioDockView = 'menu' | 'contact' | 'reel';
|
|
136
|
+
interface StudioDockState {
|
|
137
|
+
open: boolean;
|
|
138
|
+
view: StudioDockView;
|
|
139
|
+
page: number;
|
|
140
|
+
}
|
|
141
|
+
interface StudioDockOptions {
|
|
142
|
+
/** Seconds. Reference sheet: 1.3 s, outBack(.52). */
|
|
143
|
+
duration?: number;
|
|
144
|
+
ease?: string;
|
|
145
|
+
/** Move focus into a newly opened view. Defaults to true. */
|
|
146
|
+
focusOnOpen?: boolean;
|
|
147
|
+
/** Contain Tab within the open panel and its toggle. Defaults to true. */
|
|
148
|
+
trapFocus?: boolean;
|
|
149
|
+
onChange?: (state: StudioDockState) => void;
|
|
150
|
+
}
|
|
151
|
+
interface StudioDockInstance extends Instance {
|
|
152
|
+
open(view?: StudioDockView): void;
|
|
153
|
+
close(): void;
|
|
154
|
+
toggle(): void;
|
|
155
|
+
selectPage(index: number): void;
|
|
156
|
+
readonly state: StudioDockState;
|
|
157
|
+
}
|
|
158
|
+
/** A contained studio sheet. Markup remains useful without JavaScript; fixed positioning is CSS opt-in. */
|
|
159
|
+
declare function createStudioDock(root: HTMLElement | null, options?: StudioDockOptions): StudioDockInstance;
|
|
160
|
+
|
|
161
|
+
type DateInput = Date | string | number;
|
|
162
|
+
/** Local midnight of a date; "2026-10-23" is read as a local day, not UTC. */
|
|
163
|
+
declare function toDate(input: DateInput | null | undefined, fallback?: Date): Date;
|
|
164
|
+
/** YYYY-MM-DD of the local day. */
|
|
165
|
+
declare const dayKey: (date: Date) => string;
|
|
166
|
+
|
|
167
|
+
type CalendarView = 'month' | 'week';
|
|
168
|
+
type CalendarEventStatus = 'pending' | 'done' | 'cancelled';
|
|
169
|
+
interface CalendarEvent {
|
|
170
|
+
id: string | number;
|
|
171
|
+
title: string;
|
|
172
|
+
start: DateInput;
|
|
173
|
+
end?: DateInput;
|
|
174
|
+
allDay?: boolean;
|
|
175
|
+
status?: CalendarEventStatus;
|
|
176
|
+
/** Any CSS colour for the chip. */
|
|
177
|
+
color?: string;
|
|
178
|
+
}
|
|
179
|
+
interface CalendarRange {
|
|
180
|
+
start: Date;
|
|
181
|
+
end: Date;
|
|
182
|
+
view: CalendarView;
|
|
183
|
+
}
|
|
184
|
+
interface CalendarLabels {
|
|
185
|
+
more?: (count: number) => string;
|
|
186
|
+
events?: (count: number) => string;
|
|
187
|
+
status?: Partial<Record<CalendarEventStatus, string>>;
|
|
188
|
+
}
|
|
189
|
+
interface CalendarOptions {
|
|
190
|
+
/** Date the calendar opens on. */
|
|
191
|
+
date?: DateInput;
|
|
192
|
+
view?: CalendarView;
|
|
193
|
+
/** 0 = Sunday … 6 = Saturday. */
|
|
194
|
+
firstDay?: number;
|
|
195
|
+
locale?: string;
|
|
196
|
+
events?: CalendarEvent[];
|
|
197
|
+
/** Chips per day in the month view before "+N". */
|
|
198
|
+
maxEvents?: number;
|
|
199
|
+
selected?: DateInput | null;
|
|
200
|
+
/** Override "today" (tests, demos in another zone). */
|
|
201
|
+
today?: DateInput;
|
|
202
|
+
labels?: CalendarLabels;
|
|
203
|
+
onSelect?: (date: Date) => void;
|
|
204
|
+
onEventClick?: (event: CalendarEvent) => void;
|
|
205
|
+
onNavigate?: (range: CalendarRange) => void;
|
|
206
|
+
}
|
|
207
|
+
interface CalendarInstance extends Instance {
|
|
208
|
+
next(): void;
|
|
209
|
+
prev(): void;
|
|
210
|
+
goToday(): void;
|
|
211
|
+
setDate(date: DateInput): void;
|
|
212
|
+
setView(view: CalendarView): void;
|
|
213
|
+
setEvents(events: CalendarEvent[]): void;
|
|
214
|
+
select(date: DateInput | null, notify?: boolean): void;
|
|
215
|
+
readonly date: Date;
|
|
216
|
+
readonly view: CalendarView;
|
|
217
|
+
readonly selected: Date | null;
|
|
218
|
+
readonly range: CalendarRange;
|
|
219
|
+
}
|
|
220
|
+
declare function createCalendar(root: HTMLElement | null, options?: CalendarOptions): CalendarInstance;
|
|
221
|
+
|
|
222
|
+
type SlotSource = string[] | Record<string, string[]> | ((date: Date) => string[] | Promise<string[]>);
|
|
223
|
+
interface SlotValue {
|
|
224
|
+
date: Date;
|
|
225
|
+
time: string;
|
|
226
|
+
key: string;
|
|
227
|
+
value: string;
|
|
228
|
+
}
|
|
229
|
+
interface SlotPickerLabels {
|
|
230
|
+
placeholder?: string;
|
|
231
|
+
empty?: string;
|
|
232
|
+
loading?: string;
|
|
233
|
+
heading?: (date: Date) => string;
|
|
234
|
+
}
|
|
235
|
+
interface SlotPickerOptions {
|
|
236
|
+
/** Month shown first (and the selected day when `value` is not given). */
|
|
237
|
+
date?: DateInput;
|
|
238
|
+
/** Initial value: "2026-10-23T10:30" or { date, time }. */
|
|
239
|
+
value?: string | {
|
|
240
|
+
date: DateInput;
|
|
241
|
+
time: string;
|
|
242
|
+
} | null;
|
|
243
|
+
slots?: SlotSource;
|
|
244
|
+
min?: DateInput;
|
|
245
|
+
max?: DateInput;
|
|
246
|
+
/** Weekdays never available (0 = Sunday). */
|
|
247
|
+
closedDays?: number[];
|
|
248
|
+
isDisabled?: (date: Date) => boolean;
|
|
249
|
+
firstDay?: number;
|
|
250
|
+
locale?: string;
|
|
251
|
+
labels?: SlotPickerLabels;
|
|
252
|
+
onChange?: (value: SlotValue) => void;
|
|
253
|
+
onDateChange?: (date: Date) => void;
|
|
254
|
+
}
|
|
255
|
+
interface SlotPickerInstance extends Instance {
|
|
256
|
+
selectDate(date: DateInput): void;
|
|
257
|
+
selectTime(time: string | null): void;
|
|
258
|
+
setSlots(slots: SlotSource): void;
|
|
259
|
+
readonly date: Date | null;
|
|
260
|
+
readonly time: string | null;
|
|
261
|
+
readonly value: string | null;
|
|
262
|
+
}
|
|
263
|
+
declare function createSlotPicker(root: HTMLElement | null, options?: SlotPickerOptions): SlotPickerInstance;
|
|
264
|
+
|
|
265
|
+
interface TrailerOptions {
|
|
266
|
+
triggers?: boolean | string;
|
|
267
|
+
autoplay?: boolean;
|
|
268
|
+
closeOnBackdrop?: boolean;
|
|
269
|
+
onOpen?: () => void;
|
|
270
|
+
onClose?: () => void;
|
|
271
|
+
}
|
|
272
|
+
interface TrailerInstance extends Instance {
|
|
273
|
+
open(origin?: HTMLElement | null): void;
|
|
274
|
+
close(): void;
|
|
275
|
+
toggle(origin?: HTMLElement | null): void;
|
|
276
|
+
play(): Promise<boolean>;
|
|
277
|
+
pause(): void;
|
|
278
|
+
seek(seconds: number): void;
|
|
279
|
+
setVolume(volume: number): void;
|
|
280
|
+
readonly isOpen: boolean;
|
|
281
|
+
}
|
|
282
|
+
/** Native modal + consumer-owned video, with optional accessible custom transport controls. */
|
|
283
|
+
declare function createTrailer(root: HTMLElement | null, options?: TrailerOptions): TrailerInstance;
|
|
284
|
+
|
|
285
|
+
type CardBrand = 'visa' | 'mastercard' | 'amex' | 'discover' | 'unknown';
|
|
286
|
+
/** Text shown on the card for each brand (no logos). */
|
|
287
|
+
declare const BRAND_LABELS: Record<CardBrand, string>;
|
|
288
|
+
declare function detectBrand(number: string): CardBrand;
|
|
289
|
+
declare const cardLength: (brand: CardBrand) => number;
|
|
290
|
+
declare const cvcLength: (brand: CardBrand) => 4 | 3;
|
|
291
|
+
/** Digits with a space between groups. */
|
|
292
|
+
declare function formatNumber(number: string, brand?: CardBrand): string;
|
|
293
|
+
declare function luhn(number: string): boolean;
|
|
294
|
+
interface Expiry {
|
|
295
|
+
month: number;
|
|
296
|
+
year: number;
|
|
297
|
+
/** MM/YY as typed so far. */
|
|
298
|
+
text: string;
|
|
299
|
+
valid: boolean;
|
|
300
|
+
}
|
|
301
|
+
/** MM/YY from what was typed; valid when complete and not before the current month. */
|
|
302
|
+
declare function parseExpiry(text: string, now?: Date): Expiry;
|
|
303
|
+
|
|
304
|
+
type CreditCardField = 'number' | 'name' | 'expiry' | 'cvc';
|
|
305
|
+
interface CreditCardLabels {
|
|
306
|
+
number?: string;
|
|
307
|
+
name?: string;
|
|
308
|
+
expiry?: string;
|
|
309
|
+
cvc?: string;
|
|
310
|
+
namePlaceholder?: string;
|
|
311
|
+
invalidNumber?: string;
|
|
312
|
+
invalidExpiry?: string;
|
|
313
|
+
invalidCvc?: string;
|
|
314
|
+
}
|
|
315
|
+
interface CreditCardOptions {
|
|
316
|
+
labels?: CreditCardLabels;
|
|
317
|
+
/** Form names of the fields (default cc-number, cc-name, cc-exp, cc-csc). */
|
|
318
|
+
names?: Partial<Record<CreditCardField, string>>;
|
|
319
|
+
/** Tilt the card with a fine pointer (default true). */
|
|
320
|
+
tilt?: boolean;
|
|
321
|
+
onChange?: (state: {
|
|
322
|
+
brand: CardBrand;
|
|
323
|
+
complete: boolean;
|
|
324
|
+
valid: boolean;
|
|
325
|
+
}) => void;
|
|
326
|
+
onComplete?: () => void;
|
|
327
|
+
}
|
|
328
|
+
interface CreditCardValues {
|
|
329
|
+
number: string;
|
|
330
|
+
name: string;
|
|
331
|
+
expiry: string;
|
|
332
|
+
cvc: string;
|
|
333
|
+
}
|
|
334
|
+
interface CreditCardInstance extends Instance {
|
|
335
|
+
readonly values: CreditCardValues;
|
|
336
|
+
readonly brand: CardBrand;
|
|
337
|
+
readonly valid: boolean;
|
|
338
|
+
focus(field: CreditCardField): void;
|
|
339
|
+
/** Turn the card (true: the back). */
|
|
340
|
+
flip(back?: boolean): void;
|
|
341
|
+
}
|
|
342
|
+
declare function createCreditCard(root: HTMLElement | null, options?: CreditCardOptions): CreditCardInstance;
|
|
343
|
+
|
|
344
|
+
interface CommandItem {
|
|
345
|
+
id: string;
|
|
346
|
+
label: string;
|
|
347
|
+
/** Section title (e.g. 'Páginas'). */
|
|
348
|
+
group?: string;
|
|
349
|
+
/** Extra words that also match. */
|
|
350
|
+
keywords?: string[];
|
|
351
|
+
/** Small text on the right (a shortcut, a path). */
|
|
352
|
+
hint?: string;
|
|
353
|
+
/** Navigate here when chosen (unless mk:select is cancelled). */
|
|
354
|
+
href?: string;
|
|
355
|
+
/** A short glyph shown before the label (default →). */
|
|
356
|
+
icon?: string;
|
|
357
|
+
}
|
|
358
|
+
interface CommandSearchOptions {
|
|
359
|
+
items?: CommandItem[];
|
|
360
|
+
placeholder?: string;
|
|
361
|
+
emptyLabel?: string;
|
|
362
|
+
/** Accessible name of the palette. */
|
|
363
|
+
label?: string;
|
|
364
|
+
/** ⌘K / Ctrl+K opens it (default true). */
|
|
365
|
+
shortcut?: boolean;
|
|
366
|
+
/** Most results shown (default 50). */
|
|
367
|
+
limit?: number;
|
|
368
|
+
onSelect?: (item: CommandItem) => void;
|
|
369
|
+
onOpenChange?: (open: boolean) => void;
|
|
370
|
+
}
|
|
371
|
+
interface CommandSearchInstance extends Instance {
|
|
372
|
+
/** `origin`: the control it grows from; omitted, the clicked or on-screen trigger; null, none (scale-in). */
|
|
373
|
+
open(origin?: HTMLElement | null): void;
|
|
374
|
+
close(): void;
|
|
375
|
+
setItems(items: CommandItem[]): void;
|
|
376
|
+
readonly isOpen: boolean;
|
|
377
|
+
}
|
|
378
|
+
declare function createCommandSearch(root: HTMLElement | null, options?: CommandSearchOptions): CommandSearchInstance;
|
|
379
|
+
|
|
380
|
+
interface HoldConfirmOptions {
|
|
381
|
+
/** Hold time in ms (default 1200). */
|
|
382
|
+
duration?: number;
|
|
383
|
+
/** Back to the start after confirming, in ms (default 1800; 0 keeps it confirmed). */
|
|
384
|
+
resetAfter?: number;
|
|
385
|
+
holdingLabel?: string;
|
|
386
|
+
doneLabel?: string;
|
|
387
|
+
hint?: string;
|
|
388
|
+
disabled?: boolean;
|
|
389
|
+
onConfirm?: () => void;
|
|
390
|
+
}
|
|
391
|
+
interface HoldConfirmInstance extends Instance {
|
|
392
|
+
reset(): void;
|
|
393
|
+
readonly confirmed: boolean;
|
|
394
|
+
}
|
|
395
|
+
declare function createHoldConfirm(root: HTMLElement | null, options?: HoldConfirmOptions): HoldConfirmInstance;
|
|
396
|
+
|
|
397
|
+
interface ImagePreviewOptions {
|
|
398
|
+
labels?: {
|
|
399
|
+
close?: string;
|
|
400
|
+
prev?: string;
|
|
401
|
+
next?: string;
|
|
402
|
+
dialog?: string;
|
|
403
|
+
strip?: string;
|
|
404
|
+
picture?: string;
|
|
405
|
+
};
|
|
406
|
+
/** A strip of thumbnails under the picture (default true; hidden on phones and with one picture). */
|
|
407
|
+
strip?: boolean;
|
|
408
|
+
/** Loop from the last picture to the first (default true). */
|
|
409
|
+
loop?: boolean;
|
|
410
|
+
onChange?: (index: number) => void;
|
|
411
|
+
onOpenChange?: (open: boolean) => void;
|
|
412
|
+
}
|
|
413
|
+
interface ImagePreviewInstance extends Instance {
|
|
414
|
+
open(index?: number): void;
|
|
415
|
+
close(): void;
|
|
416
|
+
next(): void;
|
|
417
|
+
prev(): void;
|
|
418
|
+
readonly isOpen: boolean;
|
|
419
|
+
readonly index: number;
|
|
420
|
+
}
|
|
421
|
+
declare function createImagePreview(root: HTMLElement | null, options?: ImagePreviewOptions): ImagePreviewInstance;
|
|
422
|
+
|
|
423
|
+
interface NotificationBellOptions {
|
|
424
|
+
count?: number;
|
|
425
|
+
/** Accessible name before the count (default 'Notificaciones'). */
|
|
426
|
+
label?: string;
|
|
427
|
+
/** How long a message stays, in ms (default 3200). */
|
|
428
|
+
messageDuration?: number;
|
|
429
|
+
/** Above this the badge reads n+ (default 99). */
|
|
430
|
+
max?: number;
|
|
431
|
+
onOpen?: () => void;
|
|
432
|
+
}
|
|
433
|
+
interface NotificationBellInstance extends Instance {
|
|
434
|
+
/** Ring with a new notification (and show `message`, as text). */
|
|
435
|
+
notify(message?: string): void;
|
|
436
|
+
setCount(count: number): void;
|
|
437
|
+
clear(): void;
|
|
438
|
+
readonly count: number;
|
|
439
|
+
}
|
|
440
|
+
declare function createNotificationBell(root: HTMLElement | null, options?: NotificationBellOptions): NotificationBellInstance;
|
|
441
|
+
|
|
442
|
+
interface PasswordChecks {
|
|
443
|
+
length: boolean;
|
|
444
|
+
lower: boolean;
|
|
445
|
+
upper: boolean;
|
|
446
|
+
number: boolean;
|
|
447
|
+
symbol: boolean;
|
|
448
|
+
}
|
|
449
|
+
interface PasswordScore {
|
|
450
|
+
score: 0 | 1 | 2 | 3 | 4;
|
|
451
|
+
label: string;
|
|
452
|
+
checks: PasswordChecks;
|
|
453
|
+
}
|
|
454
|
+
declare const STRENGTH_LABELS: readonly ["Muy débil", "Débil", "Aceptable", "Fuerte", "Muy fuerte"];
|
|
455
|
+
declare function scorePassword(value: string, minLength?: number): PasswordScore;
|
|
456
|
+
|
|
457
|
+
interface PasswordStrengthOptions {
|
|
458
|
+
minLength?: number;
|
|
459
|
+
/** Replace the built-in scoring. */
|
|
460
|
+
score?: (value: string) => PasswordScore;
|
|
461
|
+
/** Below this score the field reports itself invalid (setCustomValidity). */
|
|
462
|
+
requireScore?: number;
|
|
463
|
+
labels?: {
|
|
464
|
+
show?: string;
|
|
465
|
+
hide?: string;
|
|
466
|
+
invalid?: string;
|
|
467
|
+
checks?: Partial<Record<keyof PasswordChecks, string>>;
|
|
468
|
+
};
|
|
469
|
+
onChange?: (result: PasswordScore) => void;
|
|
470
|
+
}
|
|
471
|
+
interface PasswordStrengthInstance extends Instance {
|
|
472
|
+
readonly score: number;
|
|
473
|
+
readonly value: string;
|
|
474
|
+
}
|
|
475
|
+
declare function createPasswordStrength(root: HTMLElement | null, options?: PasswordStrengthOptions): PasswordStrengthInstance;
|
|
476
|
+
|
|
477
|
+
interface ScratchCardOptions {
|
|
478
|
+
/** Share of the cover to scratch before it reveals itself (default .5). */
|
|
479
|
+
threshold?: number;
|
|
480
|
+
/** Brush radius in px (default 22). */
|
|
481
|
+
brush?: number;
|
|
482
|
+
coverLabel?: string;
|
|
483
|
+
revealLabel?: string;
|
|
484
|
+
revealedLabel?: string;
|
|
485
|
+
/** Confetti on reveal (default true). */
|
|
486
|
+
celebrate?: boolean;
|
|
487
|
+
onProgress?: (progress: number) => void;
|
|
488
|
+
onReveal?: () => void;
|
|
489
|
+
}
|
|
490
|
+
interface ScratchCardInstance extends Instance {
|
|
491
|
+
reveal(): void;
|
|
492
|
+
reset(): void;
|
|
493
|
+
readonly revealed: boolean;
|
|
494
|
+
readonly progress: number;
|
|
495
|
+
}
|
|
496
|
+
declare function createScratchCard(root: HTMLElement | null, options?: ScratchCardOptions): ScratchCardInstance;
|
|
497
|
+
|
|
498
|
+
interface StarRatingOptions {
|
|
499
|
+
max?: number;
|
|
500
|
+
value?: number;
|
|
501
|
+
/** Form name (default 'rating'). */
|
|
502
|
+
name?: string;
|
|
503
|
+
/** Accessible name of the group (default 'Valoración'). */
|
|
504
|
+
label?: string;
|
|
505
|
+
/** One text per star, shown and read for the chosen value. */
|
|
506
|
+
labels?: string[];
|
|
507
|
+
readonly?: boolean;
|
|
508
|
+
allowClear?: boolean;
|
|
509
|
+
disabled?: boolean;
|
|
510
|
+
onChange?: (value: number) => void;
|
|
511
|
+
}
|
|
512
|
+
interface StarRatingInstance extends Instance {
|
|
513
|
+
setValue(value: number, notify?: boolean): void;
|
|
514
|
+
readonly value: number;
|
|
515
|
+
}
|
|
516
|
+
declare function createStarRating(root: HTMLElement | null, options?: StarRatingOptions): StarRatingInstance;
|
|
517
|
+
|
|
518
|
+
type AttachmentStatus = 'idle' | 'uploading' | 'complete' | 'error';
|
|
519
|
+
type AttachmentRejectCode = 'type' | 'size' | 'count';
|
|
520
|
+
interface AttachmentFile {
|
|
521
|
+
id: string;
|
|
522
|
+
name: string;
|
|
523
|
+
size: number;
|
|
524
|
+
type: string;
|
|
525
|
+
/** The picked File (absent for files described by metadata only). */
|
|
526
|
+
file?: File;
|
|
527
|
+
/** 0–100 once the app reports it. */
|
|
528
|
+
progress?: number;
|
|
529
|
+
status: AttachmentStatus;
|
|
530
|
+
/** Object URL of an image preview, or a URL supplied with initialFiles. */
|
|
531
|
+
preview?: string;
|
|
532
|
+
}
|
|
533
|
+
interface AttachmentRejection {
|
|
534
|
+
file: File;
|
|
535
|
+
code: AttachmentRejectCode;
|
|
536
|
+
message: string;
|
|
537
|
+
}
|
|
538
|
+
interface AttachmentLabels {
|
|
539
|
+
choose?: string;
|
|
540
|
+
drop?: string;
|
|
541
|
+
remove?: string;
|
|
542
|
+
list?: string;
|
|
543
|
+
uploading?: string;
|
|
544
|
+
complete?: string;
|
|
545
|
+
error?: string;
|
|
546
|
+
added?: (count: number) => string;
|
|
547
|
+
removed?: (name: string) => string;
|
|
548
|
+
rejected?: (rejection: {
|
|
549
|
+
name: string;
|
|
550
|
+
code: AttachmentRejectCode;
|
|
551
|
+
limit: string;
|
|
552
|
+
}) => string;
|
|
553
|
+
}
|
|
554
|
+
interface AttachmentOptions {
|
|
555
|
+
/** Like input[accept]: extensions (.pdf), MIME types (image/png) and wildcards (image/*). */
|
|
556
|
+
accept?: string;
|
|
557
|
+
multiple?: boolean;
|
|
558
|
+
/** Most files kept (multiple only). */
|
|
559
|
+
maxFiles?: number;
|
|
560
|
+
/** Largest file, in bytes. */
|
|
561
|
+
maxSize?: number;
|
|
562
|
+
disabled?: boolean;
|
|
563
|
+
/** Form name of the file input (it carries the kept files where the browser allows). */
|
|
564
|
+
name?: string;
|
|
565
|
+
/** Files shown from the start (e.g. already uploaded). */
|
|
566
|
+
initialFiles?: Array<Partial<AttachmentFile> & {
|
|
567
|
+
name: string;
|
|
568
|
+
}>;
|
|
569
|
+
/** Visible hint under the drop text (default: the limits). */
|
|
570
|
+
hint?: string;
|
|
571
|
+
labels?: AttachmentLabels;
|
|
572
|
+
onFiles?: (added: AttachmentFile[], files: AttachmentFile[]) => void;
|
|
573
|
+
onRemove?: (removed: AttachmentFile, files: AttachmentFile[]) => void;
|
|
574
|
+
onReject?: (rejections: AttachmentRejection[]) => void;
|
|
575
|
+
}
|
|
576
|
+
interface AttachmentInstance extends Instance {
|
|
577
|
+
/** Validate and add files; returns the accepted ones. */
|
|
578
|
+
addFiles(files: Iterable<File> | ArrayLike<File>): AttachmentFile[];
|
|
579
|
+
remove(id: string): void;
|
|
580
|
+
/** Report upload progress (0–100) and, optionally, the status. */
|
|
581
|
+
setProgress(id: string, value: number, status?: AttachmentStatus): void;
|
|
582
|
+
clear(): void;
|
|
583
|
+
readonly files: AttachmentFile[];
|
|
584
|
+
}
|
|
585
|
+
/** 1 KB = 1024 B; one decimal under 10. */
|
|
586
|
+
declare function formatBytes(bytes: number): string;
|
|
587
|
+
/** Readable accept list: image/* → imágenes, .pdf → PDF, application/zip → ZIP. */
|
|
588
|
+
declare function describeAccept(accept: string | undefined): string;
|
|
589
|
+
/** Does a file match an accept list (extensions, MIME types, type/*)? */
|
|
590
|
+
declare function acceptsFile(file: {
|
|
591
|
+
name: string;
|
|
592
|
+
type: string;
|
|
593
|
+
}, accept: string | undefined): boolean;
|
|
594
|
+
declare function createAttachment(root: HTMLElement | null, options?: AttachmentOptions): AttachmentInstance;
|
|
595
|
+
|
|
596
|
+
type SkeletonShape = 'text' | 'avatar' | 'image' | 'card';
|
|
597
|
+
type SkeletonAnimation = 'pulse' | 'shimmer' | 'none';
|
|
598
|
+
interface SkeletonOptions {
|
|
599
|
+
loading?: boolean;
|
|
600
|
+
animation?: SkeletonAnimation;
|
|
601
|
+
/** Placeholder made when the markup has none. */
|
|
602
|
+
shape?: SkeletonShape;
|
|
603
|
+
/** Text lines of a generated text placeholder (default 3). */
|
|
604
|
+
lines?: number;
|
|
605
|
+
/** Announced while loading (default 'Cargando'). */
|
|
606
|
+
label?: string;
|
|
607
|
+
}
|
|
608
|
+
interface SkeletonInstance extends Instance {
|
|
609
|
+
setLoading(loading: boolean): void;
|
|
610
|
+
readonly loading: boolean;
|
|
611
|
+
}
|
|
612
|
+
/** Bones of each shape: block (image), circle (avatar), line (text). */
|
|
613
|
+
declare function skeletonBones(shape: SkeletonShape, lines?: number): Array<'block' | 'circle' | 'line' | 'short'>;
|
|
614
|
+
declare function createSkeleton(root: HTMLElement | null, options?: SkeletonOptions): SkeletonInstance;
|
|
615
|
+
|
|
616
|
+
type QuestionnaireAnswers = Record<string, string | string[]>;
|
|
617
|
+
interface QuestionnaireLabels {
|
|
618
|
+
required?: string;
|
|
619
|
+
choice?: string;
|
|
620
|
+
}
|
|
621
|
+
interface QuestionnaireOptions {
|
|
622
|
+
index?: number;
|
|
623
|
+
labels?: QuestionnaireLabels;
|
|
624
|
+
onChange?: (index: number, answers: QuestionnaireAnswers) => void;
|
|
625
|
+
onComplete?: (answers: QuestionnaireAnswers) => void;
|
|
626
|
+
}
|
|
627
|
+
interface QuestionnaireInstance extends Instance {
|
|
628
|
+
/** Validate the current step and go on (or complete on the last one). */
|
|
629
|
+
next(): Promise<boolean>;
|
|
630
|
+
prev(): Promise<void>;
|
|
631
|
+
/** Native form reset: clears answers, errors and completion. */
|
|
632
|
+
reset(): void;
|
|
633
|
+
readonly answers: QuestionnaireAnswers;
|
|
634
|
+
readonly index: number;
|
|
635
|
+
readonly count: number;
|
|
636
|
+
readonly complete: boolean;
|
|
637
|
+
}
|
|
638
|
+
/** Answers of a form keyed by field name: checkboxes and multi-selects give arrays. */
|
|
639
|
+
declare function readAnswers(form: HTMLElement): QuestionnaireAnswers;
|
|
640
|
+
declare function createQuestionnaire(root: HTMLElement | null, options?: QuestionnaireOptions): QuestionnaireInstance;
|
|
641
|
+
|
|
642
|
+
interface CodeBlockOptions {
|
|
643
|
+
/** The code; omitted, the text already in <code> is used (and read at copy time). */
|
|
644
|
+
code?: string;
|
|
645
|
+
language?: string;
|
|
646
|
+
title?: string;
|
|
647
|
+
lineNumbers?: boolean;
|
|
648
|
+
/** Colour the syntax (default: when the language is supported). */
|
|
649
|
+
highlight?: boolean;
|
|
650
|
+
/** 1-based lines to mark. */
|
|
651
|
+
highlightLines?: number[];
|
|
652
|
+
copyLabel?: string;
|
|
653
|
+
copiedLabel?: string;
|
|
654
|
+
errorLabel?: string;
|
|
655
|
+
onCopy?: (ok: boolean) => void;
|
|
656
|
+
}
|
|
657
|
+
interface CodeBlockInstance extends Instance {
|
|
658
|
+
setCode(code: string): void;
|
|
659
|
+
/** Copy the code; resolves true when the clipboard took it. */
|
|
660
|
+
copy(): Promise<boolean>;
|
|
661
|
+
readonly code: string;
|
|
662
|
+
}
|
|
663
|
+
/** Line count of a code string (a final newline does not open a line). */
|
|
664
|
+
declare const codeLines: (code: string) => number;
|
|
665
|
+
declare function createCodeBlock(root: HTMLElement | null, options?: CodeBlockOptions): CodeBlockInstance;
|
|
666
|
+
|
|
667
|
+
interface ContextMenuOptions extends Omit<MenuOptions, 'triggers' | 'anchor'> {
|
|
668
|
+
/** Replace the browser menu on inputs and editable text too. */
|
|
669
|
+
overrideEditable?: boolean;
|
|
670
|
+
/** Touch long press that opens it, in ms (0: off). Default 550. */
|
|
671
|
+
longPress?: number;
|
|
672
|
+
onOpenChange?: (open: boolean) => void;
|
|
673
|
+
}
|
|
674
|
+
interface ContextMenuInstance extends Instance {
|
|
675
|
+
/** Open at viewport coordinates; focus returns to `origin` (default: the focused element). */
|
|
676
|
+
openAt(x: number, y: number, origin?: HTMLElement | null): void;
|
|
677
|
+
/** Open beside `origin` (default: the focused element in the trigger, else the trigger). */
|
|
678
|
+
open(origin?: HTMLElement | null): void;
|
|
679
|
+
close(): void;
|
|
680
|
+
readonly isOpen: boolean;
|
|
681
|
+
readonly menu: MenuInstance | null;
|
|
682
|
+
}
|
|
683
|
+
declare function createContextMenu(root: HTMLElement | null, options?: ContextMenuOptions): ContextMenuInstance;
|
|
684
|
+
|
|
685
|
+
/** card: image on top (default); row: thumbnail beside the text; hover: a link that previews the card. */
|
|
686
|
+
type LinkPreviewVariant = 'card' | 'row' | 'hover';
|
|
687
|
+
interface LinkPreviewOptions extends Pick<HoverCardOptions, 'openDelay' | 'closeDelay' | 'placement' | 'onOpenChange'> {
|
|
688
|
+
url?: string;
|
|
689
|
+
title?: string;
|
|
690
|
+
description?: string;
|
|
691
|
+
/** Thumbnail URL (http(s), relative, data:image or blob). */
|
|
692
|
+
image?: string;
|
|
693
|
+
imageAlt?: string;
|
|
694
|
+
siteName?: string;
|
|
695
|
+
variant?: LinkPreviewVariant;
|
|
696
|
+
/** Text of the hover variant's link (default: the title). */
|
|
697
|
+
label?: string;
|
|
698
|
+
/** '_blank' opens a new tab (with rel="noopener noreferrer"). */
|
|
699
|
+
target?: string;
|
|
700
|
+
}
|
|
701
|
+
interface LinkPreviewInstance extends Instance {
|
|
702
|
+
/** The link actually used (null when the URL was refused). */
|
|
703
|
+
readonly href: string | null;
|
|
704
|
+
readonly hoverCard: HoverCardInstance | null;
|
|
705
|
+
}
|
|
706
|
+
/** http(s) or relative links; anything else (javascript:, data:, vbscript:…) is null. */
|
|
707
|
+
declare function safeHref(url: string | null | undefined): string | null;
|
|
708
|
+
/** Image sources: http(s), relative, blob: and data:image/… */
|
|
709
|
+
declare function safeImage(url: string | null | undefined): string | null;
|
|
710
|
+
/** Host without www. of an absolute link; relative links have none (same on server and client). */
|
|
711
|
+
declare function linkDomain(href: string | null): string;
|
|
712
|
+
declare function createLinkPreview(root: HTMLElement | null, options?: LinkPreviewOptions): LinkPreviewInstance;
|
|
713
|
+
|
|
714
|
+
type ProgressVariant = 'linear' | 'ring';
|
|
715
|
+
interface ProgressOptions {
|
|
716
|
+
/** Current value; null is indeterminate. Default: min. */
|
|
717
|
+
value?: number | null;
|
|
718
|
+
min?: number;
|
|
719
|
+
max?: number;
|
|
720
|
+
label?: string;
|
|
721
|
+
variant?: ProgressVariant;
|
|
722
|
+
/** Write the percentage beside the bar (inside the ring). */
|
|
723
|
+
showValue?: boolean;
|
|
724
|
+
/** Text for the value (also aria-valuetext). Default: rounded percentage. */
|
|
725
|
+
formatValue?: (value: number, ratio: number) => string;
|
|
726
|
+
/** Glide duration in seconds (default .7). */
|
|
727
|
+
duration?: number;
|
|
728
|
+
}
|
|
729
|
+
interface ProgressInstance extends Instance {
|
|
730
|
+
setValue(value: number | null): void;
|
|
731
|
+
readonly value: number | null;
|
|
732
|
+
}
|
|
733
|
+
declare function createProgress(root: HTMLElement | null, options?: ProgressOptions): ProgressInstance;
|
|
734
|
+
|
|
735
|
+
type RangeValue = number | [number, number];
|
|
736
|
+
interface RangeSliderOptions {
|
|
737
|
+
min?: number;
|
|
738
|
+
max?: number;
|
|
739
|
+
step?: number;
|
|
740
|
+
value?: RangeValue;
|
|
741
|
+
disabled?: boolean;
|
|
742
|
+
/** Form name; an interval submits name[0] and name[1]. */
|
|
743
|
+
name?: string;
|
|
744
|
+
/** Accessible name of the input(s). */
|
|
745
|
+
label?: string;
|
|
746
|
+
/** Text for the output and aria-valuetext. */
|
|
747
|
+
formatValue?: (value: number) => string;
|
|
748
|
+
onInput?: (value: RangeValue) => void;
|
|
749
|
+
onChange?: (value: RangeValue) => void;
|
|
750
|
+
}
|
|
751
|
+
interface RangeSliderInstance extends Instance {
|
|
752
|
+
setValue(value: RangeValue, notify?: boolean): void;
|
|
753
|
+
readonly value: RangeValue;
|
|
754
|
+
}
|
|
755
|
+
declare function createRangeSlider(root: HTMLElement | null, options?: RangeSliderOptions): RangeSliderInstance;
|
|
756
|
+
|
|
757
|
+
type ChartType = 'line' | 'area' | 'bar' | 'composed';
|
|
758
|
+
interface ChartPoint {
|
|
759
|
+
label: string;
|
|
760
|
+
value: number | null;
|
|
761
|
+
}
|
|
762
|
+
interface ChartSeries {
|
|
763
|
+
name: string;
|
|
764
|
+
/** One value per label; null is a gap (no data). */
|
|
765
|
+
values: Array<number | null>;
|
|
766
|
+
/** Per-series mark in a composed chart (default line). */
|
|
767
|
+
type?: 'line' | 'area' | 'bar';
|
|
768
|
+
/** An area's lower boundary; values is the upper boundary. Nulls leave gaps. */
|
|
769
|
+
lowerValues?: Array<number | null>;
|
|
770
|
+
/** Any CSS colour; default: monochrome for one series, else the --mk-chart-N slot. */
|
|
771
|
+
color?: string;
|
|
772
|
+
/** Lines: an SVG dash pattern, e.g. '5 5' (a pace or goal) or '1 6' (a projection). */
|
|
773
|
+
dash?: string;
|
|
774
|
+
}
|
|
775
|
+
interface ChartOptions {
|
|
776
|
+
type?: ChartType;
|
|
777
|
+
labels?: string[];
|
|
778
|
+
series?: ChartSeries[];
|
|
779
|
+
/** One series as label/value pairs (instead of labels + series). */
|
|
780
|
+
points?: ChartPoint[];
|
|
781
|
+
/** Bars only: stack the series. */
|
|
782
|
+
stacked?: boolean;
|
|
783
|
+
formatValue?: (value: number) => string;
|
|
784
|
+
/** Accessible name (and table caption). */
|
|
785
|
+
label?: string;
|
|
786
|
+
/** Plot height in px (default 240). */
|
|
787
|
+
height?: number;
|
|
788
|
+
emptyLabel?: string;
|
|
789
|
+
/** Legend (default: two or more series). */
|
|
790
|
+
legend?: boolean;
|
|
791
|
+
/** Value labels and hairlines on the y axis (default false: the baseline only). */
|
|
792
|
+
axis?: boolean;
|
|
793
|
+
/** Lines: the last value of the first series in a pill at its end (default true). */
|
|
794
|
+
endLabel?: boolean;
|
|
795
|
+
/** The built-in tooltip card (default true); false keeps the guide and markers for chart-tooltip. */
|
|
796
|
+
tooltip?: boolean;
|
|
797
|
+
onSelect?: (index: number | null) => void;
|
|
798
|
+
}
|
|
799
|
+
interface ChartInstance extends Instance {
|
|
800
|
+
/** Merge new options and draw again (keeps the selection when it still exists). */
|
|
801
|
+
update(options: ChartOptions): void;
|
|
802
|
+
select(index: number | null): void;
|
|
803
|
+
readonly selected: number | null;
|
|
804
|
+
}
|
|
805
|
+
declare function createChart(root: HTMLElement | null, initial?: ChartOptions): ChartInstance;
|
|
806
|
+
|
|
807
|
+
interface Hsva {
|
|
808
|
+
/** 0–360. */
|
|
809
|
+
h: number;
|
|
810
|
+
/** 0–100. */
|
|
811
|
+
s: number;
|
|
812
|
+
/** 0–100. */
|
|
813
|
+
v: number;
|
|
814
|
+
/** 0–1. */
|
|
815
|
+
a: number;
|
|
816
|
+
}
|
|
817
|
+
interface Rgba {
|
|
818
|
+
/** 0–255. */
|
|
819
|
+
r: number;
|
|
820
|
+
g: number;
|
|
821
|
+
b: number;
|
|
822
|
+
a: number;
|
|
823
|
+
}
|
|
824
|
+
interface Hsla {
|
|
825
|
+
h: number;
|
|
826
|
+
/** 0–100. */
|
|
827
|
+
s: number;
|
|
828
|
+
l: number;
|
|
829
|
+
a: number;
|
|
830
|
+
}
|
|
831
|
+
type ColorFormat = 'hex' | 'rgb' | 'hsl';
|
|
832
|
+
type ColorChannel = 'hue' | 'saturation' | 'brightness' | 'lightness' | 'red' | 'green' | 'blue' | 'alpha';
|
|
833
|
+
declare const CHANNEL_LABELS: Record<ColorChannel, string>;
|
|
834
|
+
/** HSVA → RGBA (channels 0–255, unrounded). */
|
|
835
|
+
declare function hsvToRgb({ h, s, v, a }: Hsva): Rgba;
|
|
836
|
+
/** RGBA → HSVA; a grey keeps `hue` (and black keeps `saturation`) when given. */
|
|
837
|
+
declare function rgbToHsv({ r, g, b, a }: Rgba, hue?: number, saturation?: number): Hsva;
|
|
838
|
+
/**
|
|
839
|
+
* Any colour the components accept, as HSVA; null when the text is not one.
|
|
840
|
+
* `hue` is kept for greys (no hue of their own).
|
|
841
|
+
*/
|
|
842
|
+
declare function parseColor(input: string | null | undefined, hue?: number): Hsva | null;
|
|
843
|
+
/** A colour option (text or HSVA) as HSVA; `fallback` (default red) when it cannot be read. */
|
|
844
|
+
declare function toHsva(input: string | Hsva | null | undefined, fallback?: Hsva): Hsva;
|
|
845
|
+
/** #rrggbb, or #rrggbbaa when translucent. */
|
|
846
|
+
declare function toHex(color: Hsva): string;
|
|
847
|
+
/** The colour as CSS text: hex, "rgb(255 136 0 / 0.5)" or "hsl(32 100% 50%)". */
|
|
848
|
+
declare function formatColor(color: Hsva, format?: ColorFormat): string;
|
|
849
|
+
/** Relative luminance (WCAG), 0–1, ignoring alpha. */
|
|
850
|
+
declare function luminance(color: Hsva): number;
|
|
851
|
+
/** One channel's value in its own range (CHANNEL_RANGE). */
|
|
852
|
+
declare function getChannel(color: Hsva, channel: ColorChannel): number;
|
|
853
|
+
/** A copy with one channel changed (clamped to its range); the hue survives greys. */
|
|
854
|
+
declare function setChannel(color: Hsva, channel: ColorChannel, value: number): Hsva;
|
|
855
|
+
/** What a channel's value reads as: "210°", "64 %", "136". */
|
|
856
|
+
declare function channelText(channel: ColorChannel, value: number, format?: Intl.NumberFormat): string;
|
|
857
|
+
|
|
858
|
+
interface ColorSliderOptions {
|
|
859
|
+
/** Channel this slider edits (default 'hue'). */
|
|
860
|
+
channel?: ColorChannel;
|
|
861
|
+
/** Any CSS colour parseColor reads, or HSVA (default 'hsl(0 100% 50%)'). */
|
|
862
|
+
value?: string | Hsva;
|
|
863
|
+
/** Accessible name (default: the channel's Spanish name). */
|
|
864
|
+
label?: string;
|
|
865
|
+
orientation?: 'horizontal' | 'vertical';
|
|
866
|
+
/** Default 1 (alpha .01). */
|
|
867
|
+
step?: number;
|
|
868
|
+
/** Shows the value ("210°", "64 %") in an <output>. */
|
|
869
|
+
showValue?: boolean;
|
|
870
|
+
/** Form name: a hidden input submits the hex. */
|
|
871
|
+
name?: string;
|
|
872
|
+
disabled?: boolean;
|
|
873
|
+
/** Every move. */
|
|
874
|
+
onInput?: (value: string, color: Hsva) => void;
|
|
875
|
+
/** Committed (release, key). */
|
|
876
|
+
onChange?: (value: string, color: Hsva) => void;
|
|
877
|
+
}
|
|
878
|
+
interface ColorSliderInstance extends Instance {
|
|
879
|
+
/** Another control changed the colour; `notify` false keeps callbacks quiet. */
|
|
880
|
+
setColor(color: string | Hsva, notify?: boolean): void;
|
|
881
|
+
/** Hex (#rrggbb, #rrggbbaa when translucent). */
|
|
882
|
+
readonly value: string;
|
|
883
|
+
readonly color: Hsva;
|
|
884
|
+
}
|
|
885
|
+
declare function createColorSlider(root: HTMLElement | null, options?: ColorSliderOptions): ColorSliderInstance;
|
|
886
|
+
|
|
887
|
+
interface ColorAreaOptions {
|
|
888
|
+
value?: string | Hsva;
|
|
889
|
+
/** Accessible name of the group (default 'Color'). */
|
|
890
|
+
label?: string;
|
|
891
|
+
/** Default 1. */
|
|
892
|
+
step?: number;
|
|
893
|
+
name?: string;
|
|
894
|
+
disabled?: boolean;
|
|
895
|
+
onInput?: (value: string, color: Hsva) => void;
|
|
896
|
+
onChange?: (value: string, color: Hsva) => void;
|
|
897
|
+
}
|
|
898
|
+
interface ColorAreaInstance extends Instance {
|
|
899
|
+
setColor(color: string | Hsva, notify?: boolean): void;
|
|
900
|
+
readonly value: string;
|
|
901
|
+
readonly color: Hsva;
|
|
902
|
+
}
|
|
903
|
+
declare function createColorArea(root: HTMLElement | null, options?: ColorAreaOptions): ColorAreaInstance;
|
|
904
|
+
|
|
905
|
+
interface ColorFieldOptions {
|
|
906
|
+
value?: string | Hsva;
|
|
907
|
+
format?: ColorFormat;
|
|
908
|
+
/** Keep transparency (default false: committed colours are opaque). */
|
|
909
|
+
alpha?: boolean;
|
|
910
|
+
/** aria-label when the input has no label of its own (default 'Color'). */
|
|
911
|
+
label?: string;
|
|
912
|
+
name?: string;
|
|
913
|
+
disabled?: boolean;
|
|
914
|
+
readOnly?: boolean;
|
|
915
|
+
onChange?: (value: string, color: Hsva) => void;
|
|
916
|
+
}
|
|
917
|
+
interface ColorFieldInstance extends Instance {
|
|
918
|
+
setColor(color: string | Hsva, notify?: boolean): void;
|
|
919
|
+
readonly value: string;
|
|
920
|
+
readonly color: Hsva;
|
|
921
|
+
}
|
|
922
|
+
declare function createColorField(root: HTMLElement | null, options?: ColorFieldOptions): ColorFieldInstance;
|
|
923
|
+
|
|
924
|
+
interface ColorPickerOptions {
|
|
925
|
+
value?: string | Hsva;
|
|
926
|
+
alpha?: boolean;
|
|
927
|
+
format?: ColorFormat;
|
|
928
|
+
swatches?: string[];
|
|
929
|
+
/** Accessible name; the trigger reads "<label>: <hex>". */
|
|
930
|
+
label?: string;
|
|
931
|
+
name?: string;
|
|
932
|
+
disabled?: boolean;
|
|
933
|
+
/** The panel in place, without a button or popover. */
|
|
934
|
+
inline?: boolean;
|
|
935
|
+
/** Eyedropper button where the browser has the EyeDropper API (default true). */
|
|
936
|
+
eyedropper?: boolean;
|
|
937
|
+
onInput?: (value: string, color: Hsva) => void;
|
|
938
|
+
onChange?: (value: string, color: Hsva) => void;
|
|
939
|
+
}
|
|
940
|
+
interface ColorPickerInstance extends Instance {
|
|
941
|
+
open(): void;
|
|
942
|
+
close(): void;
|
|
943
|
+
setColor(color: string | Hsva, notify?: boolean): void;
|
|
944
|
+
readonly value: string;
|
|
945
|
+
readonly color: Hsva;
|
|
946
|
+
readonly isOpen: boolean;
|
|
947
|
+
}
|
|
948
|
+
declare function createColorPicker(root: HTMLElement | null, options?: ColorPickerOptions): ColorPickerInstance;
|
|
949
|
+
|
|
950
|
+
interface TimeFieldOptions {
|
|
951
|
+
/** 'HH:MM' or 'HH:MM:SS' (24 h). */
|
|
952
|
+
value?: string | null;
|
|
953
|
+
locale?: string;
|
|
954
|
+
/** 12 or 24; default: the locale's. */
|
|
955
|
+
hourCycle?: 12 | 24;
|
|
956
|
+
seconds?: boolean;
|
|
957
|
+
/** Arrow step of the minutes (and seconds). */
|
|
958
|
+
minuteStep?: number;
|
|
959
|
+
min?: string;
|
|
960
|
+
max?: string;
|
|
961
|
+
/** Accessible name of the group (default 'Hora'). */
|
|
962
|
+
label?: string;
|
|
963
|
+
/** Hidden input with the 24 h text. */
|
|
964
|
+
name?: string;
|
|
965
|
+
disabled?: boolean;
|
|
966
|
+
readOnly?: boolean;
|
|
967
|
+
onChange?: (value: string | null) => void;
|
|
968
|
+
}
|
|
969
|
+
interface TimeFieldInstance extends Instance {
|
|
970
|
+
setValue(value: string | null, animate?: boolean): void;
|
|
971
|
+
focus(): void;
|
|
972
|
+
readonly value: string | null;
|
|
973
|
+
}
|
|
974
|
+
declare function createTimeField(root: HTMLElement | null, options?: TimeFieldOptions): TimeFieldInstance;
|
|
975
|
+
|
|
976
|
+
interface DateRange {
|
|
977
|
+
start: Date;
|
|
978
|
+
end: Date;
|
|
979
|
+
}
|
|
980
|
+
/** An ordered range from {start, end} (Dates or 'YYYY-MM-DD'); null when either end is missing or unreadable. */
|
|
981
|
+
declare function toRange(value: {
|
|
982
|
+
start?: DateInput | null;
|
|
983
|
+
end?: DateInput | null;
|
|
984
|
+
} | null | undefined): DateRange | null;
|
|
985
|
+
declare const rangeKeys: (range: DateRange) => {
|
|
986
|
+
start: string;
|
|
987
|
+
end: string;
|
|
988
|
+
};
|
|
989
|
+
/** Days from start to end, both included. */
|
|
990
|
+
declare const rangeLength: (range: DateRange) => number;
|
|
991
|
+
|
|
992
|
+
interface RangeCalendarOptions {
|
|
993
|
+
value?: {
|
|
994
|
+
start: DateInput;
|
|
995
|
+
end: DateInput;
|
|
996
|
+
} | null;
|
|
997
|
+
/** First visible month (default: the value's start, else today). */
|
|
998
|
+
month?: DateInput;
|
|
999
|
+
visibleMonths?: 1 | 2;
|
|
1000
|
+
/** 0 = Sunday … 6 = Saturday (default 1, Monday). */
|
|
1001
|
+
firstDay?: number;
|
|
1002
|
+
min?: DateInput | null;
|
|
1003
|
+
max?: DateInput | null;
|
|
1004
|
+
/** 'YYYY-MM-DD' keys or a test. */
|
|
1005
|
+
unavailable?: string[] | ((day: Date) => boolean);
|
|
1006
|
+
locale?: string;
|
|
1007
|
+
/** Override "today" (demos, tests). */
|
|
1008
|
+
today?: DateInput;
|
|
1009
|
+
labels?: {
|
|
1010
|
+
prev?: string;
|
|
1011
|
+
next?: string;
|
|
1012
|
+
};
|
|
1013
|
+
/** 'range' (default): two clicks; 'single': one click picks a day (date-time-picker). */
|
|
1014
|
+
selection?: 'range' | 'single';
|
|
1015
|
+
onChange?: (range: DateRange) => void;
|
|
1016
|
+
}
|
|
1017
|
+
interface RangeCalendarInstance extends Instance {
|
|
1018
|
+
setValue(range: {
|
|
1019
|
+
start: DateInput;
|
|
1020
|
+
end: DateInput;
|
|
1021
|
+
} | null, animate?: boolean): void;
|
|
1022
|
+
next(): void;
|
|
1023
|
+
prev(): void;
|
|
1024
|
+
/** Move the focus to `day`, changing month if needed (`animate` false: no slide). */
|
|
1025
|
+
focusDay(day: DateInput, animate?: boolean): void;
|
|
1026
|
+
readonly value: DateRange | null;
|
|
1027
|
+
readonly month: Date;
|
|
1028
|
+
}
|
|
1029
|
+
/** Seconds a finished range of `days` takes to settle: its band draws in while its end day pops (.3 s). */
|
|
1030
|
+
declare const bandDuration: (days: number) => number;
|
|
1031
|
+
declare function createRangeCalendar(root: HTMLElement | null, options?: RangeCalendarOptions): RangeCalendarInstance;
|
|
1032
|
+
|
|
1033
|
+
interface DateRangePreset {
|
|
1034
|
+
label: string;
|
|
1035
|
+
start: DateInput;
|
|
1036
|
+
end: DateInput;
|
|
1037
|
+
}
|
|
1038
|
+
interface DateRangePickerOptions {
|
|
1039
|
+
value?: {
|
|
1040
|
+
start: DateInput;
|
|
1041
|
+
end: DateInput;
|
|
1042
|
+
} | null;
|
|
1043
|
+
min?: DateInput | null;
|
|
1044
|
+
max?: DateInput | null;
|
|
1045
|
+
unavailable?: string[] | ((day: Date) => boolean);
|
|
1046
|
+
firstDay?: number;
|
|
1047
|
+
locale?: string;
|
|
1048
|
+
today?: DateInput;
|
|
1049
|
+
/** Accessible name of the field (default 'Fechas'). */
|
|
1050
|
+
label?: string;
|
|
1051
|
+
/** Hidden inputs name[start] and name[end] (YYYY-MM-DD). */
|
|
1052
|
+
name?: string;
|
|
1053
|
+
presets?: DateRangePreset[];
|
|
1054
|
+
disabled?: boolean;
|
|
1055
|
+
onChange?: (range: DateRange | null) => void;
|
|
1056
|
+
}
|
|
1057
|
+
interface DateRangePickerInstance extends Instance {
|
|
1058
|
+
open(): void;
|
|
1059
|
+
close(): void;
|
|
1060
|
+
setValue(range: {
|
|
1061
|
+
start: DateInput;
|
|
1062
|
+
end: DateInput;
|
|
1063
|
+
} | null): void;
|
|
1064
|
+
readonly value: DateRange | null;
|
|
1065
|
+
readonly isOpen: boolean;
|
|
1066
|
+
}
|
|
1067
|
+
declare function createDateRangePicker(root: HTMLElement | null, options?: DateRangePickerOptions): DateRangePickerInstance;
|
|
1068
|
+
|
|
1069
|
+
type Side = 'top' | 'bottom' | 'left' | 'right';
|
|
1070
|
+
type Placement = Side | 'auto';
|
|
1071
|
+
interface Box {
|
|
1072
|
+
left: number;
|
|
1073
|
+
top: number;
|
|
1074
|
+
width: number;
|
|
1075
|
+
height: number;
|
|
1076
|
+
}
|
|
1077
|
+
interface PlaceOptions {
|
|
1078
|
+
placement?: Placement;
|
|
1079
|
+
/** Space between anchor and box (default 8). */
|
|
1080
|
+
gap?: number;
|
|
1081
|
+
/** Distance kept from the viewport edges (default 8). */
|
|
1082
|
+
edge?: number;
|
|
1083
|
+
/** Along the edge: centred on the anchor (default) or flush with its start or end. */
|
|
1084
|
+
align?: 'center' | 'start' | 'end';
|
|
1085
|
+
/** The arrow stays this far from the box's corners (default 12). */
|
|
1086
|
+
arrowPad?: number;
|
|
1087
|
+
viewport?: {
|
|
1088
|
+
width: number;
|
|
1089
|
+
height: number;
|
|
1090
|
+
};
|
|
1091
|
+
}
|
|
1092
|
+
interface Placed {
|
|
1093
|
+
side: Side;
|
|
1094
|
+
/** Viewport coordinates of the box's top-left corner. */
|
|
1095
|
+
x: number;
|
|
1096
|
+
y: number;
|
|
1097
|
+
/** Arrow position along the box's edge facing the anchor, in px from its start. */
|
|
1098
|
+
arrow: number;
|
|
1099
|
+
}
|
|
1100
|
+
declare function place(anchor: Box, size: {
|
|
1101
|
+
width: number;
|
|
1102
|
+
height: number;
|
|
1103
|
+
}, options?: PlaceOptions): Placed;
|
|
1104
|
+
|
|
1105
|
+
interface TooltipOptions {
|
|
1106
|
+
/** Text of the bubble (default: the trigger's title, which is removed so the browser's own does not show). */
|
|
1107
|
+
content?: string;
|
|
1108
|
+
/** Preferred side (default 'top'); 'auto' takes the roomiest. */
|
|
1109
|
+
placement?: Placement;
|
|
1110
|
+
/** Hover delay in ms (default 400). Focus shows it at once. */
|
|
1111
|
+
openDelay?: number;
|
|
1112
|
+
/** Delay before hiding when the pointer leaves, in ms (default 100). */
|
|
1113
|
+
closeDelay?: number;
|
|
1114
|
+
/** The pointer can move onto the bubble (links, selectable text). */
|
|
1115
|
+
interactive?: boolean;
|
|
1116
|
+
/** Arrow pointing at the trigger (default true). */
|
|
1117
|
+
arrow?: boolean;
|
|
1118
|
+
onOpenChange?: (open: boolean) => void;
|
|
1119
|
+
}
|
|
1120
|
+
interface TooltipInstance extends Instance {
|
|
1121
|
+
open(): void;
|
|
1122
|
+
close(): void;
|
|
1123
|
+
/** New text; an open tooltip cross-fades to it. Empty text hides it. */
|
|
1124
|
+
setContent(text: string): void;
|
|
1125
|
+
readonly isOpen: boolean;
|
|
1126
|
+
}
|
|
1127
|
+
declare function createTooltip(root: HTMLElement | null, options?: TooltipOptions): TooltipInstance;
|
|
1128
|
+
|
|
1129
|
+
interface PopoverOptions {
|
|
1130
|
+
/** Accessible name of the panel (default: the trigger's text). */
|
|
1131
|
+
label?: string;
|
|
1132
|
+
onOpenChange?: (open: boolean) => void;
|
|
1133
|
+
}
|
|
1134
|
+
interface PopoverInstance extends Instance {
|
|
1135
|
+
open(): void;
|
|
1136
|
+
close(): void;
|
|
1137
|
+
toggle(): void;
|
|
1138
|
+
readonly isOpen: boolean;
|
|
1139
|
+
/** The panel (a <dialog>). */
|
|
1140
|
+
readonly panel: HTMLElement | null;
|
|
1141
|
+
}
|
|
1142
|
+
declare function createPopover(root: HTMLElement | null, options?: PopoverOptions): PopoverInstance;
|
|
1143
|
+
|
|
1144
|
+
type LoadingState = 'idle' | 'loading' | 'success' | 'error';
|
|
1145
|
+
interface LoadingButtonOptions {
|
|
1146
|
+
/** Runs on click; its promise drives the states (resolve → success, reject → error). */
|
|
1147
|
+
action?: () => unknown;
|
|
1148
|
+
/** Texts for the states (announced; shown beside the icon when not compact). */
|
|
1149
|
+
labels?: {
|
|
1150
|
+
loading?: string;
|
|
1151
|
+
success?: string;
|
|
1152
|
+
error?: string;
|
|
1153
|
+
};
|
|
1154
|
+
/** Icon only while working (default true). */
|
|
1155
|
+
compact?: boolean;
|
|
1156
|
+
/** ms in success or error before going back to the label (default 1800; 0 stays). */
|
|
1157
|
+
resetAfter?: number;
|
|
1158
|
+
onStateChange?: (state: LoadingState) => void;
|
|
1159
|
+
}
|
|
1160
|
+
interface LoadingButtonInstance extends Instance {
|
|
1161
|
+
setState(state: LoadingState): void;
|
|
1162
|
+
/** Runs `action` (or the option) and walks the states; resolves true on success. */
|
|
1163
|
+
run(action?: () => unknown): Promise<boolean>;
|
|
1164
|
+
readonly state: LoadingState;
|
|
1165
|
+
}
|
|
1166
|
+
declare function createLoadingButton(root: HTMLElement | null, options?: LoadingButtonOptions): LoadingButtonInstance;
|
|
1167
|
+
|
|
1168
|
+
interface BreadcrumbItem {
|
|
1169
|
+
label: string;
|
|
1170
|
+
href?: string;
|
|
1171
|
+
}
|
|
1172
|
+
interface BreadcrumbOptions {
|
|
1173
|
+
/** The path; without it, the authored <ol> or <a>/<span> children are read. */
|
|
1174
|
+
items?: BreadcrumbItem[];
|
|
1175
|
+
/** Accessible name of the navigation (default 'Ruta de navegación'). */
|
|
1176
|
+
label?: string;
|
|
1177
|
+
/** 'auto' (default) folds the middle when it does not fit; a number keeps at most that many items. */
|
|
1178
|
+
maxItems?: number | 'auto';
|
|
1179
|
+
/** Called before following a link; event.preventDefault() keeps the browser where it is (SPA routing). */
|
|
1180
|
+
onNavigate?: (item: BreadcrumbItem, index: number, event: Event) => void;
|
|
1181
|
+
}
|
|
1182
|
+
interface BreadcrumbInstance extends Instance {
|
|
1183
|
+
setItems(items: BreadcrumbItem[]): void;
|
|
1184
|
+
readonly items: BreadcrumbItem[];
|
|
1185
|
+
}
|
|
1186
|
+
declare function createBreadcrumb(root: HTMLElement | null, options?: BreadcrumbOptions): BreadcrumbInstance;
|
|
1187
|
+
|
|
1188
|
+
type EmptyIllustration = 'inbox' | 'search' | 'folder' | 'error' | 'success' | 'none';
|
|
1189
|
+
interface EmptyAction {
|
|
1190
|
+
id: string;
|
|
1191
|
+
label: string;
|
|
1192
|
+
/** primary (default for the first) or secondary. */
|
|
1193
|
+
variant?: 'primary' | 'secondary';
|
|
1194
|
+
/** A link instead of a button. */
|
|
1195
|
+
href?: string;
|
|
1196
|
+
}
|
|
1197
|
+
interface EmptyStateOptions {
|
|
1198
|
+
illustration?: EmptyIllustration;
|
|
1199
|
+
title?: string;
|
|
1200
|
+
description?: string;
|
|
1201
|
+
actions?: EmptyAction[];
|
|
1202
|
+
/** The illustration's idle motion (default true). */
|
|
1203
|
+
loop?: boolean;
|
|
1204
|
+
onAction?: (id: string, event: MouseEvent) => void;
|
|
1205
|
+
}
|
|
1206
|
+
interface EmptyStateInstance extends Instance {
|
|
1207
|
+
update(next: Pick<EmptyStateOptions, 'illustration' | 'title' | 'description' | 'actions'>): void;
|
|
1208
|
+
}
|
|
1209
|
+
declare function createEmptyState(root: HTMLElement | null, options?: EmptyStateOptions): EmptyStateInstance;
|
|
1210
|
+
|
|
1211
|
+
interface StatCardOptions {
|
|
1212
|
+
label?: string;
|
|
1213
|
+
value?: number;
|
|
1214
|
+
/** The value it is compared with (the previous period). */
|
|
1215
|
+
previous?: number;
|
|
1216
|
+
/** Intl.NumberFormat options (e.g. { style: 'currency', currency: 'MXN' }) or a formatter. */
|
|
1217
|
+
format?: Intl.NumberFormatOptions | ((value: number) => string);
|
|
1218
|
+
/** Locale for the numbers (default: the page's language). */
|
|
1219
|
+
locale?: string;
|
|
1220
|
+
/** Which way is good (default 'up'; 'down' for costs, churn, latency). */
|
|
1221
|
+
positive?: 'up' | 'down';
|
|
1222
|
+
/** What the change compares with (default 'vs. periodo anterior'). */
|
|
1223
|
+
comparison?: string;
|
|
1224
|
+
/** Values for the sparkline (two or more). */
|
|
1225
|
+
series?: number[];
|
|
1226
|
+
/** A goal: a bar shows how far the value is. */
|
|
1227
|
+
target?: number;
|
|
1228
|
+
/** Count when it comes into view (default true); false shows the figure at once. */
|
|
1229
|
+
countOnView?: boolean;
|
|
1230
|
+
}
|
|
1231
|
+
interface StatCardInstance extends Instance {
|
|
1232
|
+
update(next: Omit<StatCardOptions, 'countOnView' | 'locale'>): void;
|
|
1233
|
+
}
|
|
1234
|
+
declare function createStatCard(root: HTMLElement | null, initial?: StatCardOptions): StatCardInstance;
|
|
1235
|
+
|
|
1236
|
+
interface ChartTooltipSeries {
|
|
1237
|
+
name: string;
|
|
1238
|
+
values: Array<number | null>;
|
|
1239
|
+
/** Any CSS colour (default: the --mk-chart-N slot). */
|
|
1240
|
+
color?: string;
|
|
1241
|
+
}
|
|
1242
|
+
interface ChartTooltipOptions {
|
|
1243
|
+
/** Standalone: the x labels, one per point. */
|
|
1244
|
+
labels?: string[];
|
|
1245
|
+
series?: ChartTooltipSeries[];
|
|
1246
|
+
/** Standalone: points edge to edge (lines, default) or at slot centres (bars). */
|
|
1247
|
+
align?: 'edge' | 'center';
|
|
1248
|
+
/** Standalone: the plot inside the root, in px from each side (default 0). */
|
|
1249
|
+
inset?: {
|
|
1250
|
+
top?: number;
|
|
1251
|
+
right?: number;
|
|
1252
|
+
bottom?: number;
|
|
1253
|
+
left?: number;
|
|
1254
|
+
};
|
|
1255
|
+
/** Standalone: the y scale; with it a marker sits on each series. */
|
|
1256
|
+
min?: number;
|
|
1257
|
+
max?: number;
|
|
1258
|
+
formatValue?: (value: number) => string;
|
|
1259
|
+
/** The change from the previous point (default true). */
|
|
1260
|
+
delta?: boolean;
|
|
1261
|
+
/** Each row's share of the total (default false). */
|
|
1262
|
+
share?: boolean;
|
|
1263
|
+
/** A total row (default: two or more series). */
|
|
1264
|
+
total?: boolean;
|
|
1265
|
+
/** Rows by value, largest first (default false). */
|
|
1266
|
+
sort?: boolean;
|
|
1267
|
+
/** A click pins the card (default true). */
|
|
1268
|
+
pin?: boolean;
|
|
1269
|
+
/** Standalone: accessible name of the focusable plot. */
|
|
1270
|
+
label?: string;
|
|
1271
|
+
onIndexChange?: (index: number | null) => void;
|
|
1272
|
+
}
|
|
1273
|
+
interface ChartTooltipInstance extends Instance {
|
|
1274
|
+
show(index: number): void;
|
|
1275
|
+
hide(): void;
|
|
1276
|
+
update(options: ChartTooltipOptions): void;
|
|
1277
|
+
readonly index: number | null;
|
|
1278
|
+
readonly pinned: boolean;
|
|
1279
|
+
}
|
|
1280
|
+
declare function createChartTooltip(root: HTMLElement | null, initial?: ChartTooltipOptions): ChartTooltipInstance;
|
|
1281
|
+
|
|
1282
|
+
interface MultiSelectOption {
|
|
1283
|
+
value: string;
|
|
1284
|
+
label: string;
|
|
1285
|
+
group?: string;
|
|
1286
|
+
hint?: string;
|
|
1287
|
+
disabled?: boolean;
|
|
1288
|
+
}
|
|
1289
|
+
interface MultiSelectOptions {
|
|
1290
|
+
/** The options; without them, an authored <select multiple> gives them. */
|
|
1291
|
+
options?: MultiSelectOption[];
|
|
1292
|
+
value?: string[];
|
|
1293
|
+
/** Search placeholder (default 'Buscar…'). */
|
|
1294
|
+
placeholder?: string;
|
|
1295
|
+
/** Accessible name (default: the authored <label>, else 'Selección'). */
|
|
1296
|
+
label?: string;
|
|
1297
|
+
/** Hidden inputs name[] (when there is no authored select). */
|
|
1298
|
+
name?: string;
|
|
1299
|
+
/** At most this many choices. */
|
|
1300
|
+
max?: number;
|
|
1301
|
+
/** Close the list after each choice (default false). */
|
|
1302
|
+
closeOnSelect?: boolean;
|
|
1303
|
+
disabled?: boolean;
|
|
1304
|
+
onChange?: (values: string[]) => void;
|
|
1305
|
+
}
|
|
1306
|
+
interface MultiSelectInstance extends Instance {
|
|
1307
|
+
setValue(values: string[], notify?: boolean): void;
|
|
1308
|
+
setOptions(options: MultiSelectOption[]): void;
|
|
1309
|
+
open(): void;
|
|
1310
|
+
close(): void;
|
|
1311
|
+
readonly value: string[];
|
|
1312
|
+
}
|
|
1313
|
+
declare function createMultiSelect(root: HTMLElement | null, settings?: MultiSelectOptions): MultiSelectInstance;
|
|
1314
|
+
|
|
1315
|
+
interface TagInputOptions {
|
|
1316
|
+
value?: string[];
|
|
1317
|
+
/** Offered while typing (fuzzy, accents ignored). */
|
|
1318
|
+
suggestions?: string[];
|
|
1319
|
+
placeholder?: string;
|
|
1320
|
+
/** Accessible name (default: the authored <label>, else 'Etiquetas'). */
|
|
1321
|
+
label?: string;
|
|
1322
|
+
/** Hidden inputs name[] for forms. */
|
|
1323
|
+
name?: string;
|
|
1324
|
+
max?: number;
|
|
1325
|
+
/** Only tags from the suggestions. */
|
|
1326
|
+
restrict?: boolean;
|
|
1327
|
+
allowDuplicates?: boolean;
|
|
1328
|
+
/** Return a message to refuse a tag. */
|
|
1329
|
+
validate?: (tag: string, tags: string[]) => string | null | undefined | void;
|
|
1330
|
+
/** Clean a tag before adding it (default: trim and collapse spaces). */
|
|
1331
|
+
transform?: (tag: string) => string;
|
|
1332
|
+
disabled?: boolean;
|
|
1333
|
+
onChange?: (tags: string[]) => void;
|
|
1334
|
+
}
|
|
1335
|
+
interface TagInputInstance extends Instance {
|
|
1336
|
+
setValue(tags: string[], notify?: boolean): void;
|
|
1337
|
+
/** Add a tag as if typed; false when refused. */
|
|
1338
|
+
add(tag: string): boolean;
|
|
1339
|
+
remove(tag: string): void;
|
|
1340
|
+
setSuggestions(suggestions: string[]): void;
|
|
1341
|
+
readonly value: string[];
|
|
1342
|
+
}
|
|
1343
|
+
declare function createTagInput(root: HTMLElement | null, settings?: TagInputOptions): TagInputInstance;
|
|
1344
|
+
|
|
1345
|
+
interface DateTimePickerOptions {
|
|
1346
|
+
/** A Date or 'YYYY-MM-DDTHH:MM' (local). */
|
|
1347
|
+
value?: DateInput | null;
|
|
1348
|
+
min?: DateInput | null;
|
|
1349
|
+
max?: DateInput | null;
|
|
1350
|
+
locale?: string;
|
|
1351
|
+
hourCycle?: 12 | 24;
|
|
1352
|
+
/** Arrow step of the minutes (default 5). */
|
|
1353
|
+
minuteStep?: number;
|
|
1354
|
+
firstDay?: number;
|
|
1355
|
+
unavailable?: string[] | ((day: Date) => boolean);
|
|
1356
|
+
/** Override "today" (demos, tests). */
|
|
1357
|
+
today?: DateInput;
|
|
1358
|
+
/** Accessible name of the field (default 'Fecha y hora'). */
|
|
1359
|
+
label?: string;
|
|
1360
|
+
/** Hidden input with 'YYYY-MM-DDTHH:MM'. */
|
|
1361
|
+
name?: string;
|
|
1362
|
+
disabled?: boolean;
|
|
1363
|
+
onChange?: (value: Date | null) => void;
|
|
1364
|
+
}
|
|
1365
|
+
interface DateTimePickerInstance extends Instance {
|
|
1366
|
+
open(): void;
|
|
1367
|
+
close(): void;
|
|
1368
|
+
setValue(value: DateInput | null): void;
|
|
1369
|
+
readonly value: Date | null;
|
|
1370
|
+
readonly isOpen: boolean;
|
|
1371
|
+
}
|
|
1372
|
+
/** A local date-time from a Date or 'YYYY-MM-DD[T ]HH:MM[:SS]'; null when unreadable. */
|
|
1373
|
+
declare function toDateTimeValue(input: DateInput | null | undefined): Date | null;
|
|
1374
|
+
/** 'YYYY-MM-DDTHH:MM' of a local date-time (what <input type="datetime-local"> posts). */
|
|
1375
|
+
declare const dateTimeKey: (date: Date) => string;
|
|
1376
|
+
declare function createDateTimePicker(root: HTMLElement | null, options?: DateTimePickerOptions): DateTimePickerInstance;
|
|
1377
|
+
|
|
1378
|
+
type FilterFieldType = 'text' | 'number' | 'date' | 'select' | 'boolean';
|
|
1379
|
+
interface FilterField {
|
|
1380
|
+
key: string;
|
|
1381
|
+
label: string;
|
|
1382
|
+
type?: FilterFieldType;
|
|
1383
|
+
/** 'select' fields: the values to choose from. */
|
|
1384
|
+
options?: Array<{
|
|
1385
|
+
value: string;
|
|
1386
|
+
label: string;
|
|
1387
|
+
}>;
|
|
1388
|
+
}
|
|
1389
|
+
type FilterValue = string | number | null | [string | number | null, string | number | null];
|
|
1390
|
+
interface FilterRule {
|
|
1391
|
+
id: string;
|
|
1392
|
+
field: string;
|
|
1393
|
+
operator: string;
|
|
1394
|
+
value?: FilterValue;
|
|
1395
|
+
}
|
|
1396
|
+
interface FilterGroup {
|
|
1397
|
+
id: string;
|
|
1398
|
+
combinator: 'and' | 'or';
|
|
1399
|
+
rules: FilterNode[];
|
|
1400
|
+
}
|
|
1401
|
+
type FilterNode = FilterRule | FilterGroup;
|
|
1402
|
+
interface OperatorDef {
|
|
1403
|
+
id: string;
|
|
1404
|
+
label: string;
|
|
1405
|
+
/** How many values it takes. */
|
|
1406
|
+
arity: 0 | 1 | 2;
|
|
1407
|
+
}
|
|
1408
|
+
declare const OPERATORS: Record<FilterFieldType, OperatorDef[]>;
|
|
1409
|
+
declare const emptyFilter: (combinator?: "and" | "or") => FilterGroup;
|
|
1410
|
+
/** Whether `record` passes `filter`; incomplete conditions (and empty groups) do not filter. */
|
|
1411
|
+
declare function matchesFilter(record: Record<string, unknown>, filter: FilterGroup, fields: FilterField[]): boolean;
|
|
1412
|
+
/** The group holds at least one complete condition (at any depth). */
|
|
1413
|
+
declare function hasConditions(filter: FilterGroup, fields: FilterField[]): boolean;
|
|
1414
|
+
/** The filter as a sentence; incomplete conditions are left out. Empty: ''. */
|
|
1415
|
+
declare function describeFilter(filter: FilterGroup, fields: FilterField[], nested?: boolean): string;
|
|
1416
|
+
|
|
1417
|
+
interface FilterBuilderOptions {
|
|
1418
|
+
/** The fields to filter by (without them the builder stays inert). */
|
|
1419
|
+
fields?: FilterField[];
|
|
1420
|
+
value?: FilterGroup;
|
|
1421
|
+
/** Levels of groups (default 2: groups inside the main one). */
|
|
1422
|
+
maxDepth?: number;
|
|
1423
|
+
/** Accessible name (default 'Filtros'). */
|
|
1424
|
+
label?: string;
|
|
1425
|
+
/** The sentence under the builder (default true). */
|
|
1426
|
+
summary?: boolean;
|
|
1427
|
+
onChange?: (filter: FilterGroup) => void;
|
|
1428
|
+
}
|
|
1429
|
+
interface FilterBuilderInstance extends Instance {
|
|
1430
|
+
setValue(filter: FilterGroup): void;
|
|
1431
|
+
clear(): void;
|
|
1432
|
+
readonly value: FilterGroup;
|
|
1433
|
+
readonly summary: string;
|
|
1434
|
+
}
|
|
1435
|
+
declare function createFilterBuilder(root: HTMLElement | null, options?: FilterBuilderOptions): FilterBuilderInstance;
|
|
1436
|
+
|
|
1437
|
+
type TimeInput = Date | string | number;
|
|
1438
|
+
/** "ahora", "hace 5 min", "hace 2 h", "ayer", "hace 3 días", then "12 nov." (with the year when it differs). */
|
|
1439
|
+
declare function relativeTime(date: Date, now?: Date, locale?: string): string;
|
|
1440
|
+
/** "Hoy", "Ayer", "Mañana", else "Lunes, 12 de noviembre" (with the year when it differs). */
|
|
1441
|
+
declare function dayLabel(date: Date, now?: Date, locale?: string): string;
|
|
1442
|
+
|
|
1443
|
+
type TimelineStatus = 'done' | 'current' | 'upcoming' | 'error';
|
|
1444
|
+
interface TimelineEvent {
|
|
1445
|
+
id: string;
|
|
1446
|
+
title: string;
|
|
1447
|
+
description?: string;
|
|
1448
|
+
time?: TimeInput;
|
|
1449
|
+
status?: TimelineStatus;
|
|
1450
|
+
/** A short glyph in the dot (an emoji or one or two letters). */
|
|
1451
|
+
icon?: string;
|
|
1452
|
+
/** Small text under it (an author, a place). */
|
|
1453
|
+
meta?: string;
|
|
1454
|
+
}
|
|
1455
|
+
interface TimelineOptions {
|
|
1456
|
+
events?: TimelineEvent[];
|
|
1457
|
+
/** 'start' (default): the rail on the left; 'alternate': both sides on wide screens. */
|
|
1458
|
+
layout?: 'start' | 'alternate';
|
|
1459
|
+
/** A heading for each day (default false). */
|
|
1460
|
+
group?: boolean;
|
|
1461
|
+
/** Times as "hace 2 h", refreshed every minute (default true); false shows the date and time. */
|
|
1462
|
+
relative?: boolean;
|
|
1463
|
+
locale?: string;
|
|
1464
|
+
/** Accessible name of the list (default 'Historial'). */
|
|
1465
|
+
label?: string;
|
|
1466
|
+
}
|
|
1467
|
+
interface TimelineInstance extends Instance {
|
|
1468
|
+
add(event: TimelineEvent, at?: 'start' | 'end'): void;
|
|
1469
|
+
update(id: string, patch: Partial<Omit<TimelineEvent, 'id'>>): void;
|
|
1470
|
+
remove(id: string): void;
|
|
1471
|
+
setEvents(events: TimelineEvent[]): void;
|
|
1472
|
+
readonly events: TimelineEvent[];
|
|
1473
|
+
}
|
|
1474
|
+
declare function createTimeline(root: HTMLElement | null, options?: TimelineOptions): TimelineInstance;
|
|
1475
|
+
|
|
1476
|
+
interface ActivityActor {
|
|
1477
|
+
name: string;
|
|
1478
|
+
/** A picture URL; without it, the initials. */
|
|
1479
|
+
avatar?: string;
|
|
1480
|
+
}
|
|
1481
|
+
type ActivityKind = 'comment' | 'create' | 'update' | 'delete' | 'upload' | 'complete' | 'mention';
|
|
1482
|
+
interface ActivityItem {
|
|
1483
|
+
id: string;
|
|
1484
|
+
actor: ActivityActor | string;
|
|
1485
|
+
/** The verb: "comentó en", "cerró", "subió". */
|
|
1486
|
+
action: string;
|
|
1487
|
+
/** What it was done to. */
|
|
1488
|
+
target?: string;
|
|
1489
|
+
/** A link for the target. */
|
|
1490
|
+
href?: string;
|
|
1491
|
+
time: TimeInput;
|
|
1492
|
+
/** A quote under it (the comment). */
|
|
1493
|
+
detail?: string;
|
|
1494
|
+
kind?: ActivityKind;
|
|
1495
|
+
}
|
|
1496
|
+
interface ActivityFeedOptions {
|
|
1497
|
+
items?: ActivityItem[];
|
|
1498
|
+
locale?: string;
|
|
1499
|
+
/** Accessible name (default 'Actividad'). */
|
|
1500
|
+
label?: string;
|
|
1501
|
+
/** Older entries for "Cargar más": resolve with them, or with [] when there are no more. */
|
|
1502
|
+
onLoadMore?: () => Promise<ActivityItem[]> | ActivityItem[];
|
|
1503
|
+
emptyLabel?: string;
|
|
1504
|
+
}
|
|
1505
|
+
interface ActivityFeedInstance extends Instance {
|
|
1506
|
+
/** New activity on top (or behind the "novedades" pill when the reader is scrolled down). */
|
|
1507
|
+
prepend(items: ActivityItem[]): void;
|
|
1508
|
+
append(items: ActivityItem[]): void;
|
|
1509
|
+
setItems(items: ActivityItem[]): void;
|
|
1510
|
+
readonly items: ActivityItem[];
|
|
1511
|
+
}
|
|
1512
|
+
declare function createActivityFeed(root: HTMLElement | null, options?: ActivityFeedOptions): ActivityFeedInstance;
|
|
1513
|
+
|
|
1514
|
+
interface TreeNode {
|
|
1515
|
+
id: string;
|
|
1516
|
+
label: string;
|
|
1517
|
+
children?: TreeNode[];
|
|
1518
|
+
/** A short glyph before the label. */
|
|
1519
|
+
icon?: string;
|
|
1520
|
+
disabled?: boolean;
|
|
1521
|
+
/** Has children that loadChildren() will bring. */
|
|
1522
|
+
hasChildren?: boolean;
|
|
1523
|
+
/** Anything the app wants to keep with the node. */
|
|
1524
|
+
data?: unknown;
|
|
1525
|
+
}
|
|
1526
|
+
type CheckState = 'true' | 'false' | 'mixed';
|
|
1527
|
+
/** The node with `id` and the path from the top to it (it included). */
|
|
1528
|
+
declare function findNode(nodes: TreeNode[], id: string): {
|
|
1529
|
+
node: TreeNode;
|
|
1530
|
+
path: TreeNode[];
|
|
1531
|
+
} | null;
|
|
1532
|
+
/** Each node's state: leaves from `checked`, branches from their children (the enabled ones, when there are). */
|
|
1533
|
+
declare function checkStates(nodes: TreeNode[], checked: Set<string>): Map<string, CheckState>;
|
|
1534
|
+
/** Check or uncheck `id` and everything under it but disabled nodes; returns the new set (branches follow their children). */
|
|
1535
|
+
declare function toggleCheck(nodes: TreeNode[], checked: Set<string>, id: string, value?: boolean): Set<string>;
|
|
1536
|
+
/**
|
|
1537
|
+
* The nodes whose text has `query` (accents and case ignored), the ancestors
|
|
1538
|
+
* that keep them visible, and the branches to open to show them.
|
|
1539
|
+
*/
|
|
1540
|
+
declare function searchTree(nodes: TreeNode[], query: string, text?: (node: TreeNode) => string): {
|
|
1541
|
+
matches: Set<string>;
|
|
1542
|
+
visible: Set<string>;
|
|
1543
|
+
open: Set<string>;
|
|
1544
|
+
active: boolean;
|
|
1545
|
+
};
|
|
1546
|
+
|
|
1547
|
+
interface TreeViewOptions {
|
|
1548
|
+
nodes?: TreeNode[];
|
|
1549
|
+
/** Three-state checkboxes (default false). */
|
|
1550
|
+
checkable?: boolean;
|
|
1551
|
+
checked?: string[];
|
|
1552
|
+
/** Open at the start: ids, or true for every branch. */
|
|
1553
|
+
expanded?: string[] | boolean;
|
|
1554
|
+
selected?: string | null;
|
|
1555
|
+
/** A search field above the tree: true, or its placeholder. */
|
|
1556
|
+
search?: boolean | string;
|
|
1557
|
+
/** Accessible name (default 'Árbol'). */
|
|
1558
|
+
label?: string;
|
|
1559
|
+
/** Children of a branch with hasChildren, the first time it opens. */
|
|
1560
|
+
loadChildren?: (node: TreeNode) => Promise<TreeNode[]> | TreeNode[];
|
|
1561
|
+
/** Draw a label yourself (json-viewer, file-explorer); `query` is the search, for marking. */
|
|
1562
|
+
renderLabel?: (node: TreeNode, element: HTMLElement, query: string) => void;
|
|
1563
|
+
/** The text the search looks in (default: the label). */
|
|
1564
|
+
searchText?: (node: TreeNode) => string;
|
|
1565
|
+
onSelect?: (node: TreeNode) => void;
|
|
1566
|
+
onCheck?: (checked: string[]) => void;
|
|
1567
|
+
onExpand?: (node: TreeNode, expanded: boolean) => void;
|
|
1568
|
+
/** Folder and page icons (default false); a node's own `icon` still wins. */
|
|
1569
|
+
icons?: boolean;
|
|
1570
|
+
/** Rows can be dragged into another branch (default false). */
|
|
1571
|
+
draggable?: boolean;
|
|
1572
|
+
/** A node was dropped into a branch (the tree has moved it). */
|
|
1573
|
+
onMove?: (node: TreeNode, into: TreeNode) => void;
|
|
1574
|
+
}
|
|
1575
|
+
interface TreeViewInstance extends Instance {
|
|
1576
|
+
expand(id: string, animate?: boolean): void;
|
|
1577
|
+
collapse(id: string, animate?: boolean): void;
|
|
1578
|
+
toggle(id: string): void;
|
|
1579
|
+
expandAll(): void;
|
|
1580
|
+
collapseAll(): void;
|
|
1581
|
+
/** Open the branches above it and bring it into view. */
|
|
1582
|
+
reveal(id: string): void;
|
|
1583
|
+
select(id: string | null, notify?: boolean): void;
|
|
1584
|
+
setChecked(ids: string[]): void;
|
|
1585
|
+
filter(query: string): void;
|
|
1586
|
+
setNodes(nodes: TreeNode[]): void;
|
|
1587
|
+
focusItem(id: string): void;
|
|
1588
|
+
readonly selected: string | null;
|
|
1589
|
+
readonly checked: string[];
|
|
1590
|
+
readonly expanded: string[];
|
|
1591
|
+
/** The tree element (role="tree"). */
|
|
1592
|
+
readonly element: HTMLElement;
|
|
1593
|
+
}
|
|
1594
|
+
declare function createTreeView(root: HTMLElement | null, options?: TreeViewOptions): TreeViewInstance;
|
|
1595
|
+
|
|
1596
|
+
interface FileEntry {
|
|
1597
|
+
id: string;
|
|
1598
|
+
name: string;
|
|
1599
|
+
/** 'folder' or 'file'; without it, an entry with children is a folder. */
|
|
1600
|
+
kind?: 'folder' | 'file';
|
|
1601
|
+
children?: FileEntry[];
|
|
1602
|
+
/** Bytes. */
|
|
1603
|
+
size?: number;
|
|
1604
|
+
modified?: TimeInput;
|
|
1605
|
+
}
|
|
1606
|
+
type FileFamily = 'folder' | 'image' | 'pdf' | 'doc' | 'sheet' | 'slides' | 'code' | 'archive' | 'media' | 'other';
|
|
1607
|
+
type FileSort = 'name' | 'size' | 'modified';
|
|
1608
|
+
declare function fileFamily(entry: FileEntry): FileFamily;
|
|
1609
|
+
/** "820 B", "12 KB", "3,4 MB" (in the given language). */
|
|
1610
|
+
declare function formatSize(bytes: number, locale?: string): string;
|
|
1611
|
+
/** Folders first; then by `key` (names in natural order: "Foto 2" before "Foto 10"). */
|
|
1612
|
+
declare function sortEntries(entries: FileEntry[], key?: FileSort, direction?: 1 | -1, locale?: string): FileEntry[];
|
|
1613
|
+
|
|
1614
|
+
type FileView = 'list' | 'grid';
|
|
1615
|
+
type FileChange = {
|
|
1616
|
+
type: 'create';
|
|
1617
|
+
id: string;
|
|
1618
|
+
parent: string;
|
|
1619
|
+
} | {
|
|
1620
|
+
type: 'rename';
|
|
1621
|
+
id: string;
|
|
1622
|
+
name: string;
|
|
1623
|
+
} | {
|
|
1624
|
+
type: 'delete';
|
|
1625
|
+
ids: string[];
|
|
1626
|
+
} | {
|
|
1627
|
+
type: 'move';
|
|
1628
|
+
ids: string[];
|
|
1629
|
+
to: string;
|
|
1630
|
+
};
|
|
1631
|
+
interface FileExplorerOptions {
|
|
1632
|
+
/** What the top folder holds. */
|
|
1633
|
+
files?: FileEntry[];
|
|
1634
|
+
/** Name of the top folder (default 'Inicio'). */
|
|
1635
|
+
rootLabel?: string;
|
|
1636
|
+
/** The folder open at the start (default: the top one, '/'). */
|
|
1637
|
+
folder?: string;
|
|
1638
|
+
view?: FileView;
|
|
1639
|
+
/** The folder tree beside the content (default true; it hides on narrow widths). */
|
|
1640
|
+
tree?: boolean;
|
|
1641
|
+
/** No new folders, renaming, deleting or moving (default false). */
|
|
1642
|
+
readOnly?: boolean;
|
|
1643
|
+
locale?: string;
|
|
1644
|
+
/** Accessible name (default 'Explorador de archivos'). */
|
|
1645
|
+
label?: string;
|
|
1646
|
+
/** A file was opened (double click or Enter). */
|
|
1647
|
+
onOpen?: (entry: FileEntry) => void;
|
|
1648
|
+
onNavigate?: (folder: FileEntry) => void;
|
|
1649
|
+
onSelectionChange?: (ids: string[]) => void;
|
|
1650
|
+
onViewChange?: (view: FileView) => void;
|
|
1651
|
+
/** After every change (new folder, rename, delete, move), with all the files. */
|
|
1652
|
+
onChange?: (files: FileEntry[], change: FileChange) => void;
|
|
1653
|
+
}
|
|
1654
|
+
interface FileExplorerInstance extends Instance {
|
|
1655
|
+
/** Open a folder, or a file (its folder opens and onOpen is called). */
|
|
1656
|
+
open(id: string): void;
|
|
1657
|
+
up(): void;
|
|
1658
|
+
setView(view: FileView): void;
|
|
1659
|
+
select(ids: string[]): void;
|
|
1660
|
+
/** A new folder in the open one; its name is asked for in place. Returns its id. */
|
|
1661
|
+
createFolder(name?: string): string | null;
|
|
1662
|
+
/** With a name, renames at once; without one, asks for it in place. */
|
|
1663
|
+
rename(id: string, name?: string): void;
|
|
1664
|
+
/** Deletes these entries (default: the selection). */
|
|
1665
|
+
remove(ids?: string[]): void;
|
|
1666
|
+
move(ids: string[], folder: string): void;
|
|
1667
|
+
setFiles(files: FileEntry[]): void;
|
|
1668
|
+
readonly files: FileEntry[];
|
|
1669
|
+
/** The open folder's id ('/' for the top one). */
|
|
1670
|
+
readonly folder: string;
|
|
1671
|
+
readonly selection: string[];
|
|
1672
|
+
readonly view: FileView;
|
|
1673
|
+
}
|
|
1674
|
+
declare function createFileExplorer(root: HTMLElement | null, options?: FileExplorerOptions): FileExplorerInstance;
|
|
1675
|
+
|
|
1676
|
+
type JsonType = 'object' | 'array' | 'string' | 'number' | 'boolean' | 'null';
|
|
1677
|
+
interface JsonViewerOptions {
|
|
1678
|
+
/** The value; without it, the JSON written inside the root (as text or in a <script type="application/json">). */
|
|
1679
|
+
data?: unknown;
|
|
1680
|
+
/** Levels open at the start: 1 shows the top keys closed, 2 opens them… (default 1; Infinity opens all). */
|
|
1681
|
+
expandDepth?: number;
|
|
1682
|
+
/** A row for the value itself with this name; without it the top keys are the first rows. */
|
|
1683
|
+
rootName?: string;
|
|
1684
|
+
/** A search field: true, or its placeholder (default false). */
|
|
1685
|
+
search?: boolean | string;
|
|
1686
|
+
/** The bar with expand, collapse and copy (default true). */
|
|
1687
|
+
toolbar?: boolean;
|
|
1688
|
+
/** Keys in alphabetical order (default false: as they come). */
|
|
1689
|
+
sortKeys?: boolean;
|
|
1690
|
+
/** Accessible name (default 'Datos JSON'). */
|
|
1691
|
+
label?: string;
|
|
1692
|
+
onSelect?: (path: string, value: unknown) => void;
|
|
1693
|
+
onCopy?: (text: string, path: string) => void;
|
|
1694
|
+
}
|
|
1695
|
+
interface JsonViewerInstance extends Instance {
|
|
1696
|
+
setData(data: unknown): void;
|
|
1697
|
+
expandAll(): void;
|
|
1698
|
+
collapseAll(): void;
|
|
1699
|
+
/** Open the rows down to this path ($.user.roles) and show it. */
|
|
1700
|
+
reveal(path: string): void;
|
|
1701
|
+
filter(query: string): void;
|
|
1702
|
+
/** Copy a value (default: all of it) as text. */
|
|
1703
|
+
copy(path?: string): Promise<boolean>;
|
|
1704
|
+
readonly data: unknown;
|
|
1705
|
+
}
|
|
1706
|
+
/** $.user, $.items[0], $["con espacios"]. */
|
|
1707
|
+
declare const jsonPath: (parent: string, key: string | number) => string;
|
|
1708
|
+
declare function createJsonViewer(root: HTMLElement | null, options?: JsonViewerOptions): JsonViewerInstance;
|
|
1709
|
+
|
|
1710
|
+
interface VirtualRange {
|
|
1711
|
+
/** First row drawn. */
|
|
1712
|
+
start: number;
|
|
1713
|
+
/** One past the last row drawn. */
|
|
1714
|
+
end: number;
|
|
1715
|
+
}
|
|
1716
|
+
interface VirtualSizes {
|
|
1717
|
+
readonly count: number;
|
|
1718
|
+
get(index: number): number;
|
|
1719
|
+
/** A row's height; true when it changed. */
|
|
1720
|
+
set(index: number, height: number): boolean;
|
|
1721
|
+
/** The top of a row (the sum of the heights before it). */
|
|
1722
|
+
offset(index: number): number;
|
|
1723
|
+
total(): number;
|
|
1724
|
+
/** The row at a vertical position (clamped to the list). */
|
|
1725
|
+
indexAt(y: number): number;
|
|
1726
|
+
/** The rows that cover y … y + height, with `overscan` more on each side. */
|
|
1727
|
+
range(y: number, height: number, overscan?: number): VirtualRange;
|
|
1728
|
+
}
|
|
1729
|
+
declare function createSizes(heights: number[]): VirtualSizes;
|
|
1730
|
+
|
|
1731
|
+
type VirtualKey = string | number;
|
|
1732
|
+
interface VirtualListOptions<T = unknown> {
|
|
1733
|
+
items?: T[];
|
|
1734
|
+
/** Every row this tall (fastest); without it rows are measured. */
|
|
1735
|
+
itemHeight?: number;
|
|
1736
|
+
/** Height of a row not measured yet (default: itemHeight, else 48). */
|
|
1737
|
+
estimatedHeight?: number;
|
|
1738
|
+
/** Rows drawn beyond each edge (default 6). */
|
|
1739
|
+
overscan?: number;
|
|
1740
|
+
/** Draw a row into its element (recycled: draw all of it every time). Default: its text. */
|
|
1741
|
+
renderItem?: (item: T, index: number, element: HTMLElement) => void;
|
|
1742
|
+
/** A row's text: the default drawing, typing to jump and announcements (default: label, title, name or the value). */
|
|
1743
|
+
itemText?: (item: T) => string;
|
|
1744
|
+
/** A stable key for a row (default: its id, else its index). */
|
|
1745
|
+
getKey?: (item: T, index: number) => VirtualKey;
|
|
1746
|
+
/** Rows can be chosen: true or 'single', or 'multiple' (default false). */
|
|
1747
|
+
selectable?: boolean | 'single' | 'multiple';
|
|
1748
|
+
selected?: VirtualKey[];
|
|
1749
|
+
/** Accessible name (default 'Lista'). */
|
|
1750
|
+
label?: string;
|
|
1751
|
+
emptyLabel?: string;
|
|
1752
|
+
locale?: string;
|
|
1753
|
+
onSelect?: (keys: VirtualKey[], items: T[]) => void;
|
|
1754
|
+
/** Enter or a double click on a row. */
|
|
1755
|
+
onActivate?: (item: T, index: number) => void;
|
|
1756
|
+
/** More rows at the end: resolve with them, with [] when there are no more, or with nothing when you add them yourself (setItems). */
|
|
1757
|
+
onEndReached?: () => Promise<T[] | void> | T[] | void;
|
|
1758
|
+
/** Draw the rows yourself (frameworks): told which ones; put them in `container` as [data-mk-vl-item][data-index] and call refresh(). */
|
|
1759
|
+
onRange?: (range: VirtualRange) => void;
|
|
1760
|
+
}
|
|
1761
|
+
interface VirtualScrollOptions {
|
|
1762
|
+
align?: 'auto' | 'start' | 'center' | 'end';
|
|
1763
|
+
animate?: boolean;
|
|
1764
|
+
}
|
|
1765
|
+
interface VirtualListInstance<T = unknown> extends Instance {
|
|
1766
|
+
setItems(items: T[]): void;
|
|
1767
|
+
/** Add rows at the end. */
|
|
1768
|
+
append(items: T[]): void;
|
|
1769
|
+
scrollToIndex(index: number, options?: VirtualScrollOptions): void;
|
|
1770
|
+
/** Position and measure the drawn rows again (after drawing them yourself, or when their content changed). */
|
|
1771
|
+
refresh(): void;
|
|
1772
|
+
select(keys: VirtualKey[]): void;
|
|
1773
|
+
/** Change how rows are drawn (vanilla). */
|
|
1774
|
+
setRenderer(renderItem: (item: T, index: number, element: HTMLElement) => void): void;
|
|
1775
|
+
readonly items: T[];
|
|
1776
|
+
readonly range: VirtualRange;
|
|
1777
|
+
readonly selected: VirtualKey[];
|
|
1778
|
+
/** Where the rows live. */
|
|
1779
|
+
readonly container: HTMLElement;
|
|
1780
|
+
}
|
|
1781
|
+
declare function createVirtualList<T = unknown>(root: HTMLElement | null, options?: VirtualListOptions<T>): VirtualListInstance<T>;
|
|
1782
|
+
|
|
1783
|
+
type PanelOrientation = 'horizontal' | 'vertical';
|
|
1784
|
+
interface ResizablePanelOptions {
|
|
1785
|
+
/** 'horizontal' (default): side by side; 'vertical': stacked. */
|
|
1786
|
+
orientation?: PanelOrientation;
|
|
1787
|
+
/** Sizes in percent, one per panel (default: data-size on the panels, else equal). */
|
|
1788
|
+
sizes?: number[];
|
|
1789
|
+
/** Smallest size of a panel in percent (default 10; data-min on a panel wins). */
|
|
1790
|
+
min?: number;
|
|
1791
|
+
/** Largest size of a panel in percent (default 100; data-max on a panel wins). */
|
|
1792
|
+
max?: number;
|
|
1793
|
+
/** Panels (indexes) that snap shut when dragged well under their minimum; data-collapsible on a panel too. */
|
|
1794
|
+
collapsible?: number[];
|
|
1795
|
+
/** Panels that start shut. */
|
|
1796
|
+
collapsed?: number[];
|
|
1797
|
+
/** Arrow keys move this many percent (default 5; Shift: four times). */
|
|
1798
|
+
step?: number;
|
|
1799
|
+
/** Remember sizes in localStorage under this key. */
|
|
1800
|
+
storageKey?: string;
|
|
1801
|
+
/** Buttons on each separator to shut and open the panels beside it. */
|
|
1802
|
+
handleButtons?: boolean;
|
|
1803
|
+
/** Names of the panels, for the separators' labels (default: data-label, else "panel 1"…). */
|
|
1804
|
+
labels?: string[];
|
|
1805
|
+
/** While it moves (once a frame). */
|
|
1806
|
+
onResize?: (sizes: number[]) => void;
|
|
1807
|
+
/** When a drag, a key or an animation ends. */
|
|
1808
|
+
onResizeEnd?: (sizes: number[]) => void;
|
|
1809
|
+
onCollapse?: (index: number, collapsed: boolean) => void;
|
|
1810
|
+
}
|
|
1811
|
+
interface ResizablePanelInstance extends Instance {
|
|
1812
|
+
setSizes(sizes: number[], animate?: boolean): void;
|
|
1813
|
+
collapse(index: number): void;
|
|
1814
|
+
expand(index: number): void;
|
|
1815
|
+
toggle(index: number): void;
|
|
1816
|
+
/** The first sizes again. */
|
|
1817
|
+
reset(): void;
|
|
1818
|
+
setOrientation(orientation: PanelOrientation): void;
|
|
1819
|
+
readonly sizes: number[];
|
|
1820
|
+
readonly collapsed: number[];
|
|
1821
|
+
readonly orientation: PanelOrientation;
|
|
1822
|
+
}
|
|
1823
|
+
/** Sizes that add up to 100: missing ones share what is left, then all scale to 100 (all missing: equal). */
|
|
1824
|
+
declare function normaliseSizes(sizes: Array<number | undefined>, count: number): number[];
|
|
1825
|
+
declare function createResizablePanel(root: HTMLElement | null, options?: ResizablePanelOptions): ResizablePanelInstance;
|
|
1826
|
+
|
|
1827
|
+
type SplitSide = 'start' | 'end';
|
|
1828
|
+
interface SplitViewOptions {
|
|
1829
|
+
/** 'horizontal' (default): side by side; 'vertical': one over the other. */
|
|
1830
|
+
orientation?: PanelOrientation;
|
|
1831
|
+
/** The first area's share, 0–1 (default .5). */
|
|
1832
|
+
ratio?: number;
|
|
1833
|
+
/** Smallest share of an area in percent (default 15). */
|
|
1834
|
+
min?: number;
|
|
1835
|
+
/** Which sides can shut: true (default) both, 'start', 'end' or false. */
|
|
1836
|
+
collapsible?: boolean | SplitSide;
|
|
1837
|
+
/** Stack the areas when the view is narrower than this many pixels (default 0: never). */
|
|
1838
|
+
stackBelow?: number;
|
|
1839
|
+
storageKey?: string;
|
|
1840
|
+
/** Names of the two areas (default 'Primera área', 'Segunda área'; or their data-label). */
|
|
1841
|
+
labels?: [string, string];
|
|
1842
|
+
/** After a change of the split ends. */
|
|
1843
|
+
onChange?: (ratio: number) => void;
|
|
1844
|
+
onCollapse?: (side: SplitSide | null) => void;
|
|
1845
|
+
}
|
|
1846
|
+
interface SplitViewInstance extends Instance {
|
|
1847
|
+
setRatio(ratio: number, animate?: boolean): void;
|
|
1848
|
+
collapse(side: SplitSide): void;
|
|
1849
|
+
/** Open the side that is shut. */
|
|
1850
|
+
expand(): void;
|
|
1851
|
+
toggle(side: SplitSide): void;
|
|
1852
|
+
readonly ratio: number;
|
|
1853
|
+
readonly collapsed: SplitSide | null;
|
|
1854
|
+
readonly orientation: PanelOrientation;
|
|
1855
|
+
}
|
|
1856
|
+
declare function createSplitView(root: HTMLElement | null, options?: SplitViewOptions): SplitViewInstance;
|
|
1857
|
+
|
|
1858
|
+
type DataColumnType = 'text' | 'number' | 'date' | 'boolean' | 'select';
|
|
1859
|
+
type DataRow = Record<string, unknown>;
|
|
1860
|
+
type RowId = string | number;
|
|
1861
|
+
type SortDirection = 'asc' | 'desc';
|
|
1862
|
+
interface DataSort {
|
|
1863
|
+
key: string;
|
|
1864
|
+
direction: SortDirection;
|
|
1865
|
+
}
|
|
1866
|
+
interface DataColumn<T extends DataRow = DataRow> {
|
|
1867
|
+
key: string;
|
|
1868
|
+
label: string;
|
|
1869
|
+
/** For sorting, filtering and the default text (default 'text'). */
|
|
1870
|
+
type?: DataColumnType;
|
|
1871
|
+
/** The choices of a 'select' column (its text and its filter). */
|
|
1872
|
+
options?: Array<{
|
|
1873
|
+
value: string;
|
|
1874
|
+
label: string;
|
|
1875
|
+
}>;
|
|
1876
|
+
sortable?: boolean;
|
|
1877
|
+
filterable?: boolean;
|
|
1878
|
+
searchable?: boolean;
|
|
1879
|
+
/** Starts hidden (it can be shown from "Columnas"). */
|
|
1880
|
+
hidden?: boolean;
|
|
1881
|
+
/** Can be hidden from "Columnas" (default true). */
|
|
1882
|
+
hideable?: boolean;
|
|
1883
|
+
align?: 'start' | 'center' | 'end';
|
|
1884
|
+
width?: string;
|
|
1885
|
+
/** The cell's text (default: numbers and dates in the page's language, Sí/No, the choice's label). */
|
|
1886
|
+
format?: (value: unknown, row: T) => string;
|
|
1887
|
+
/** Draw the cell yourself (vanilla). */
|
|
1888
|
+
render?: (value: unknown, row: T, cell: HTMLTableCellElement) => void;
|
|
1889
|
+
/** The value to sort, filter and search by (default row[key]). */
|
|
1890
|
+
value?: (row: T) => unknown;
|
|
1891
|
+
}
|
|
1892
|
+
interface DataAction {
|
|
1893
|
+
id: string;
|
|
1894
|
+
label: string;
|
|
1895
|
+
danger?: boolean;
|
|
1896
|
+
}
|
|
1897
|
+
interface DataTableOptions<T extends DataRow = DataRow> {
|
|
1898
|
+
columns?: DataColumn<T>[];
|
|
1899
|
+
rows?: T[];
|
|
1900
|
+
/** The rows' id: a key (default 'id') or a function. */
|
|
1901
|
+
rowKey?: string | ((row: T) => RowId);
|
|
1902
|
+
/** Accessible name (default 'Tabla'). */
|
|
1903
|
+
caption?: string;
|
|
1904
|
+
/** Rows a page (default 10; 0: all of them). */
|
|
1905
|
+
pageSize?: number;
|
|
1906
|
+
pageSizes?: number[];
|
|
1907
|
+
selectable?: boolean;
|
|
1908
|
+
/** A search field: true, or its placeholder (default true). */
|
|
1909
|
+
search?: boolean | string;
|
|
1910
|
+
/** A "Filtros" button with filter-builder (default true). */
|
|
1911
|
+
filters?: boolean;
|
|
1912
|
+
filter?: FilterGroup;
|
|
1913
|
+
/** A "Columnas" button to show and hide columns (default true). */
|
|
1914
|
+
columnsMenu?: boolean;
|
|
1915
|
+
/** A menu on each row. */
|
|
1916
|
+
actions?: DataAction[];
|
|
1917
|
+
/** Buttons in the bar of the chosen rows. */
|
|
1918
|
+
bulkActions?: DataAction[];
|
|
1919
|
+
sort?: DataSort | null;
|
|
1920
|
+
loading?: boolean;
|
|
1921
|
+
emptyTitle?: string;
|
|
1922
|
+
emptyDescription?: string;
|
|
1923
|
+
locale?: string;
|
|
1924
|
+
onSortChange?: (sort: DataSort | null) => void;
|
|
1925
|
+
onSelectionChange?: (ids: RowId[], rows: T[]) => void;
|
|
1926
|
+
onAction?: (action: string, row: T) => void;
|
|
1927
|
+
onBulkAction?: (action: string, rows: T[]) => void;
|
|
1928
|
+
onPageChange?: (page: number) => void;
|
|
1929
|
+
onFilterChange?: (filter: FilterGroup, query: string) => void;
|
|
1930
|
+
/** After the rows are drawn (editable-table decorates them). */
|
|
1931
|
+
onRender?: (body: HTMLTableSectionElement) => void;
|
|
1932
|
+
}
|
|
1933
|
+
interface DataTableInstance<T extends DataRow = DataRow> extends Instance {
|
|
1934
|
+
setRows(rows: T[]): void;
|
|
1935
|
+
updateRow(id: RowId, patch: Partial<T>): void;
|
|
1936
|
+
/** Rows slide out and the rest close the gap. */
|
|
1937
|
+
removeRows(ids: RowId[]): void;
|
|
1938
|
+
setLoading(loading: boolean): void;
|
|
1939
|
+
sortBy(key: string | null, direction?: SortDirection): void;
|
|
1940
|
+
setPage(page: number): void;
|
|
1941
|
+
setPageSize(size: number): void;
|
|
1942
|
+
setQuery(query: string): void;
|
|
1943
|
+
setFilter(filter: FilterGroup): void;
|
|
1944
|
+
setColumnVisible(key: string, visible: boolean): void;
|
|
1945
|
+
select(ids: RowId[]): void;
|
|
1946
|
+
rowOf(id: RowId): HTMLTableRowElement | null;
|
|
1947
|
+
cellOf(id: RowId, key: string): HTMLTableCellElement | null;
|
|
1948
|
+
/** Draw the rows again (after changing them in place). */
|
|
1949
|
+
refresh(): void;
|
|
1950
|
+
idOf(row: T): RowId;
|
|
1951
|
+
readonly rows: T[];
|
|
1952
|
+
/** The rows the search and the filters leave, in order. */
|
|
1953
|
+
readonly results: T[];
|
|
1954
|
+
readonly page: number;
|
|
1955
|
+
readonly pageCount: number;
|
|
1956
|
+
readonly selection: RowId[];
|
|
1957
|
+
readonly sort: DataSort | null;
|
|
1958
|
+
readonly query: string;
|
|
1959
|
+
readonly filter: FilterGroup;
|
|
1960
|
+
readonly columns: DataColumn<T>[];
|
|
1961
|
+
readonly body: HTMLTableSectionElement;
|
|
1962
|
+
}
|
|
1963
|
+
declare function createDataTable<T extends DataRow = DataRow>(root: HTMLElement | null, options?: DataTableOptions<T>): DataTableInstance<T>;
|
|
1964
|
+
|
|
1965
|
+
type EditorKind = 'text' | 'number' | 'date' | 'select' | 'checkbox';
|
|
1966
|
+
interface EditableColumn<T extends DataRow = DataRow> extends DataColumn<T> {
|
|
1967
|
+
/** Can be edited (default true). */
|
|
1968
|
+
editable?: boolean;
|
|
1969
|
+
/** The editor (default: from the column's type). */
|
|
1970
|
+
editor?: EditorKind;
|
|
1971
|
+
required?: boolean;
|
|
1972
|
+
min?: number;
|
|
1973
|
+
max?: number;
|
|
1974
|
+
/** An error message, or nothing when the value is fine. */
|
|
1975
|
+
validate?: (value: unknown, row: T) => string | null | undefined | void;
|
|
1976
|
+
}
|
|
1977
|
+
interface RowChange<T extends DataRow = DataRow> {
|
|
1978
|
+
id: RowId;
|
|
1979
|
+
/** The row as it is now (as it was, for a removed one). */
|
|
1980
|
+
row: T;
|
|
1981
|
+
/** The values that changed (all of them for a new row). */
|
|
1982
|
+
changes: Partial<T>;
|
|
1983
|
+
isNew?: boolean;
|
|
1984
|
+
removed?: boolean;
|
|
1985
|
+
}
|
|
1986
|
+
interface EditableTableOptions<T extends DataRow = DataRow> extends Omit<DataTableOptions<T>, 'columns'> {
|
|
1987
|
+
columns?: EditableColumn<T>[];
|
|
1988
|
+
/** Keep the changes: resolve when they are saved; reject (or throw) to keep them pending. */
|
|
1989
|
+
onSave?: (changes: RowChange<T>[], rows: T[]) => Promise<void> | void;
|
|
1990
|
+
/** After every edit. */
|
|
1991
|
+
onChange?: (changes: RowChange<T>[]) => void;
|
|
1992
|
+
/** A new row's values: shows "Agregar fila". */
|
|
1993
|
+
newRow?: () => Partial<T>;
|
|
1994
|
+
}
|
|
1995
|
+
interface EditableTableInstance<T extends DataRow = DataRow> extends Instance {
|
|
1996
|
+
/** Open a cell's editor. */
|
|
1997
|
+
edit(id: RowId, key: string): void;
|
|
1998
|
+
setValue(id: RowId, key: string, value: unknown): boolean;
|
|
1999
|
+
addRow(values?: Partial<T>): RowId;
|
|
2000
|
+
removeRows(ids: RowId[]): void;
|
|
2001
|
+
save(): Promise<boolean>;
|
|
2002
|
+
discard(): void;
|
|
2003
|
+
setRows(rows: T[]): void;
|
|
2004
|
+
readonly changes: RowChange<T>[];
|
|
2005
|
+
readonly dirty: boolean;
|
|
2006
|
+
readonly rows: T[];
|
|
2007
|
+
readonly table: DataTableInstance<T>;
|
|
2008
|
+
}
|
|
2009
|
+
declare function createEditableTable<T extends DataRow = DataRow>(root: HTMLElement | null, options?: EditableTableOptions<T>): EditableTableInstance<T>;
|
|
2010
|
+
|
|
2011
|
+
type RichCommand = 'bold' | 'italic' | 'underline' | 'strike' | 'h2' | 'h3' | 'ul' | 'ol' | 'quote' | 'code' | 'link' | 'clear' | 'undo' | 'redo';
|
|
2012
|
+
interface RichTextEditorOptions {
|
|
2013
|
+
/** The first content, as HTML (cleaned like a paste). */
|
|
2014
|
+
value?: string;
|
|
2015
|
+
placeholder?: string;
|
|
2016
|
+
/** The buttons, in order; '|' separates groups (default: all). */
|
|
2017
|
+
toolbar?: Array<RichCommand | '|'>;
|
|
2018
|
+
/** Characters before the counter turns red (the text can go on). */
|
|
2019
|
+
maxLength?: number;
|
|
2020
|
+
/** 'words' (default), 'characters', or false. */
|
|
2021
|
+
counter?: 'words' | 'characters' | false;
|
|
2022
|
+
/** A hidden field with this name carries the HTML. */
|
|
2023
|
+
name?: string;
|
|
2024
|
+
/** Accessible name of the writing area (default 'Editor de texto'). */
|
|
2025
|
+
label?: string;
|
|
2026
|
+
readOnly?: boolean;
|
|
2027
|
+
/** Markdown shortcuts while typing (default true). */
|
|
2028
|
+
markdown?: boolean;
|
|
2029
|
+
onChange?: (html: string, text: string) => void;
|
|
2030
|
+
}
|
|
2031
|
+
interface RichTextEditorInstance extends Instance {
|
|
2032
|
+
setValue(html: string): void;
|
|
2033
|
+
focus(): void;
|
|
2034
|
+
exec(command: RichCommand, value?: string): void;
|
|
2035
|
+
readonly value: string;
|
|
2036
|
+
readonly text: string;
|
|
2037
|
+
readonly element: HTMLElement;
|
|
2038
|
+
}
|
|
2039
|
+
/** HTML with only safe formatting: known tags (renamed to their kind), links with safe addresses, no attributes else. */
|
|
2040
|
+
declare function sanitizeHtml(html: string): string;
|
|
2041
|
+
declare function createRichTextEditor(root: HTMLElement | null, options?: RichTextEditorOptions): RichTextEditorInstance;
|
|
2042
|
+
|
|
2043
|
+
interface SelectOption {
|
|
2044
|
+
value: string;
|
|
2045
|
+
label: string;
|
|
2046
|
+
disabled?: boolean;
|
|
2047
|
+
/** A heading the option sits under (an <optgroup>). */
|
|
2048
|
+
group?: string;
|
|
2049
|
+
}
|
|
2050
|
+
interface SelectOptions {
|
|
2051
|
+
/** The choices; without them, the authored <select> gives them. */
|
|
2052
|
+
options?: SelectOption[];
|
|
2053
|
+
value?: string;
|
|
2054
|
+
/** Form name of the select it builds (an authored one keeps its own). */
|
|
2055
|
+
name?: string;
|
|
2056
|
+
/** Accessible name; the button reads "<label>: <chosen>". */
|
|
2057
|
+
label?: string;
|
|
2058
|
+
/** Text while nothing is chosen (default: the empty option's text, else 'Elige…'). */
|
|
2059
|
+
placeholder?: string;
|
|
2060
|
+
disabled?: boolean;
|
|
2061
|
+
onChange?: (value: string) => void;
|
|
2062
|
+
}
|
|
2063
|
+
interface SelectInstance extends Instance {
|
|
2064
|
+
setValue(value: string, notify?: boolean): void;
|
|
2065
|
+
setOptions(options: SelectOption[]): void;
|
|
2066
|
+
/** Read the select's options again (changes to them are also noticed on their own). */
|
|
2067
|
+
refresh(): void;
|
|
2068
|
+
open(): void;
|
|
2069
|
+
close(): void;
|
|
2070
|
+
readonly value: string;
|
|
2071
|
+
}
|
|
2072
|
+
declare function createSelect(root: HTMLElement | null, options?: SelectOptions): SelectInstance;
|
|
2073
|
+
|
|
2074
|
+
interface AddToCartOptions {
|
|
2075
|
+
/** Where the box goes: an element, a selector, or (default) the first visible [data-mk-cart-target]. */
|
|
2076
|
+
target?: HTMLElement | string;
|
|
2077
|
+
/** The picture packed: an element, a selector, or (default) the [data-mk-cart-image] of the [data-mk-cart-item] around the button. */
|
|
2078
|
+
image?: HTMLElement | string;
|
|
2079
|
+
/** Items each click adds (default 1). */
|
|
2080
|
+
quantity?: number;
|
|
2081
|
+
/** The cart's count to start from (default: the number in the target's [data-mk-cart-count], else 0). */
|
|
2082
|
+
count?: number;
|
|
2083
|
+
/** Announced after a box lands (default 'Añadido al carrito'). */
|
|
2084
|
+
label?: string;
|
|
2085
|
+
/** A click: the new count (right away). */
|
|
2086
|
+
onAdd?: (count: number) => void;
|
|
2087
|
+
/** A box landed in the cart. */
|
|
2088
|
+
onLand?: (count: number) => void;
|
|
2089
|
+
}
|
|
2090
|
+
interface AddToCartInstance extends Instance {
|
|
2091
|
+
/** Send a box, as a click does. */
|
|
2092
|
+
add(): void;
|
|
2093
|
+
setCount(count: number): void;
|
|
2094
|
+
readonly count: number;
|
|
2095
|
+
}
|
|
2096
|
+
declare function createAddToCart(root: HTMLElement | null, options?: AddToCartOptions): AddToCartInstance;
|
|
2097
|
+
|
|
2098
|
+
interface ScrollIslandOptions {
|
|
2099
|
+
/** Headings that name the sections (default 'h2, h3'); false: only the percentage. */
|
|
2100
|
+
sections?: string | false;
|
|
2101
|
+
/** How near the edge, in px, the pointer turns the bar into the island (default 56). */
|
|
2102
|
+
reach?: number;
|
|
2103
|
+
/** ms the bar stays after scrolling stops (default 900). */
|
|
2104
|
+
idle?: number;
|
|
2105
|
+
/** Follow the page's scroll (default: when the root is <html> or <body>). */
|
|
2106
|
+
page?: boolean;
|
|
2107
|
+
/** The current section changed (its heading's text, or null before the first). */
|
|
2108
|
+
onSection?: (section: string | null) => void;
|
|
2109
|
+
}
|
|
2110
|
+
interface ScrollIslandInstance extends Instance {
|
|
2111
|
+
/** Measure again (after the content changed size). */
|
|
2112
|
+
refresh(): void;
|
|
2113
|
+
}
|
|
2114
|
+
declare function createScrollIsland(root: HTMLElement | null, options?: ScrollIslandOptions): ScrollIslandInstance;
|
|
2115
|
+
|
|
2116
|
+
/**
|
|
2117
|
+
* Every duration in one place (seconds, like GSAP, unless the name says
|
|
2118
|
+
* ms). Recipes and components take their defaults from here, so a timing is
|
|
2119
|
+
* changed once.
|
|
2120
|
+
*/
|
|
2121
|
+
declare const TIMING: Readonly<{
|
|
2122
|
+
flow: 0.5;
|
|
2123
|
+
flowStagger: 0.05;
|
|
2124
|
+
stepChange: 0.5;
|
|
2125
|
+
reveal: Readonly<{
|
|
2126
|
+
readonly fast: readonly [0.5, 0.25];
|
|
2127
|
+
readonly normal: readonly [0.7, 0.35];
|
|
2128
|
+
readonly slow: readonly [1.05, 0.5];
|
|
2129
|
+
readonly slower: readonly [1.6, 0.75];
|
|
2130
|
+
}>;
|
|
2131
|
+
details: 0.32;
|
|
2132
|
+
chevron: 0.25;
|
|
2133
|
+
indicator: 0.45;
|
|
2134
|
+
number: 0.6;
|
|
2135
|
+
numberPricing: 0.7;
|
|
2136
|
+
revealCounter: 0.9;
|
|
2137
|
+
layoutTravel: 0.62;
|
|
2138
|
+
/** New items in a reflow enter in this share of the travel time. */
|
|
2139
|
+
layoutEnterFactor: 0.6;
|
|
2140
|
+
menu: Readonly<{
|
|
2141
|
+
duration: 0.35;
|
|
2142
|
+
stagger: 0.04;
|
|
2143
|
+
delay: 0.1;
|
|
2144
|
+
}>;
|
|
2145
|
+
palette: Readonly<{
|
|
2146
|
+
duration: 0.1;
|
|
2147
|
+
stagger: 0.01;
|
|
2148
|
+
}>;
|
|
2149
|
+
form: Readonly<{
|
|
2150
|
+
duration: 0.35;
|
|
2151
|
+
stagger: 0.04;
|
|
2152
|
+
}>;
|
|
2153
|
+
landing: Readonly<{
|
|
2154
|
+
duration: 0.4;
|
|
2155
|
+
stagger: 0.05;
|
|
2156
|
+
delay: 0.15;
|
|
2157
|
+
}>;
|
|
2158
|
+
content: Readonly<{
|
|
2159
|
+
duration: 0.6;
|
|
2160
|
+
stagger: 0.06;
|
|
2161
|
+
}>;
|
|
2162
|
+
bubble: 0.7;
|
|
2163
|
+
bubbleStagger: 0.06;
|
|
2164
|
+
word: 0.25;
|
|
2165
|
+
wordStagger: 0.05;
|
|
2166
|
+
chatScroll: 0.35;
|
|
2167
|
+
composer: 0.18;
|
|
2168
|
+
slot: Readonly<{
|
|
2169
|
+
durationMs: 300;
|
|
2170
|
+
staggerMs: 45;
|
|
2171
|
+
exitOffsetMs: 50;
|
|
2172
|
+
colorFadeMs: 280;
|
|
2173
|
+
maxTilt: 5;
|
|
2174
|
+
minResizeMs: 140;
|
|
2175
|
+
}>;
|
|
2176
|
+
swatch: 0.5;
|
|
2177
|
+
swatchLight: 3.5;
|
|
2178
|
+
swatchBackground: 4.5;
|
|
2179
|
+
/** ModalHost (modal-origin, modal-close-origin, modal-fallback, modal-auto-resize). */
|
|
2180
|
+
dialog: Readonly<{
|
|
2181
|
+
/** The surface travels from its opener. */
|
|
2182
|
+
open: 0.7;
|
|
2183
|
+
/** The opener's colour hands over to the surface's. */
|
|
2184
|
+
surfaceColor: 0.3;
|
|
2185
|
+
/** Back into the opener. */
|
|
2186
|
+
close: 0.5;
|
|
2187
|
+
/** While closing, the content heads for the opener on a 2 s path cut at `close`. */
|
|
2188
|
+
contentReturn: 2;
|
|
2189
|
+
originHide: 0.08;
|
|
2190
|
+
originShow: 0.3;
|
|
2191
|
+
originShowDelay: 0.2;
|
|
2192
|
+
/** No opener on screen: scale .92 → 1. */
|
|
2193
|
+
fallback: 0.35;
|
|
2194
|
+
autoResize: 0.45;
|
|
2195
|
+
/** Backdrop tint on the signature curve. */
|
|
2196
|
+
backdrop: 0.5;
|
|
2197
|
+
/** Items of a list that opens from its control. */
|
|
2198
|
+
list: 0.25;
|
|
2199
|
+
}>;
|
|
2200
|
+
/** modal-liquid (spring channels; springs are stiffness/damping, not times). */
|
|
2201
|
+
liquid: Readonly<{
|
|
2202
|
+
size: 0.3;
|
|
2203
|
+
radius: 0.7;
|
|
2204
|
+
content: 0.3;
|
|
2205
|
+
color: 0.4;
|
|
2206
|
+
colorDelay: 0.15;
|
|
2207
|
+
ghost: 0.25;
|
|
2208
|
+
ghostDelay: 0.05;
|
|
2209
|
+
closeSize: 0.25;
|
|
2210
|
+
closeContent: 0.3;
|
|
2211
|
+
originRestore: 0.3;
|
|
2212
|
+
originRestoreDelay: 0.2;
|
|
2213
|
+
safetyMs: 1100;
|
|
2214
|
+
}>;
|
|
2215
|
+
/** modal-drag: the spring back when a drag is not far enough. */
|
|
2216
|
+
drag: Readonly<{
|
|
2217
|
+
restore: 0.5;
|
|
2218
|
+
radiusRestore: 0.3;
|
|
2219
|
+
}>;
|
|
2220
|
+
/** modal-float. */
|
|
2221
|
+
float: Readonly<{
|
|
2222
|
+
shadow: 0.45;
|
|
2223
|
+
glideDecay: 0.18;
|
|
2224
|
+
sizeSmoothing: 0.08;
|
|
2225
|
+
}>;
|
|
2226
|
+
/** chat-loader-delay, chat-confirmation-bar. */
|
|
2227
|
+
chat: Readonly<{
|
|
2228
|
+
pendingDelayMs: 500;
|
|
2229
|
+
confirmWordStagger: 0.1;
|
|
2230
|
+
}>;
|
|
2231
|
+
/** onboarding-busy-background, step-change, onboarding-reveal-counter. */
|
|
2232
|
+
onboarding: Readonly<{
|
|
2233
|
+
busy: 0.8;
|
|
2234
|
+
idle: 0.6;
|
|
2235
|
+
step: 0.5;
|
|
2236
|
+
counter: 0.9;
|
|
2237
|
+
}>;
|
|
2238
|
+
/** task-drag: lift, land (FA .62), crossfade (66 % of the land), neighbours shifting (FA .52). */
|
|
2239
|
+
sortable: Readonly<{
|
|
2240
|
+
lift: 0.18;
|
|
2241
|
+
land: 0.42;
|
|
2242
|
+
landFade: number;
|
|
2243
|
+
shift: 0.62;
|
|
2244
|
+
}>;
|
|
2245
|
+
/** toast-deck, toast-morph, toast-character-reveal. */
|
|
2246
|
+
toast: Readonly<{
|
|
2247
|
+
relayout: 0.6;
|
|
2248
|
+
expand: 0.55;
|
|
2249
|
+
expandStagger: 0.06;
|
|
2250
|
+
enter: 0.5;
|
|
2251
|
+
exit: 0.3;
|
|
2252
|
+
collapseDelayMs: 150;
|
|
2253
|
+
morphSize: 0.32;
|
|
2254
|
+
morphRadius: 0.7;
|
|
2255
|
+
morphContent: 0.32;
|
|
2256
|
+
morphColor: 0.4;
|
|
2257
|
+
morphColorDelay: 0.15;
|
|
2258
|
+
morphShadow: 0.6;
|
|
2259
|
+
morphShadowDelay: 0.05;
|
|
2260
|
+
safetyMs: 1100;
|
|
2261
|
+
chars: 0.4;
|
|
2262
|
+
charsDelay: 0.225;
|
|
2263
|
+
charsStagger: 0.02;
|
|
2264
|
+
}>;
|
|
2265
|
+
/** glass (CSS): surface/shadow transitions, ring and shine. */
|
|
2266
|
+
glass: Readonly<{
|
|
2267
|
+
hover: 0.4;
|
|
2268
|
+
ring: 0.5;
|
|
2269
|
+
}>;
|
|
2270
|
+
/** utility animations (css/effects/anim.css), by name. */
|
|
2271
|
+
effects: Readonly<{
|
|
2272
|
+
out: 0.5;
|
|
2273
|
+
'out-left': 0.5;
|
|
2274
|
+
'out-bottom': 0.5;
|
|
2275
|
+
collapse: 0.25;
|
|
2276
|
+
highlight: 1;
|
|
2277
|
+
shake: 0.5;
|
|
2278
|
+
'shake-strong': 0.4;
|
|
2279
|
+
fade: 0.3;
|
|
2280
|
+
wipe: 0.7;
|
|
2281
|
+
'progress-in': 1;
|
|
2282
|
+
}>;
|
|
2283
|
+
/** success confetti, per 60 fps frame. */
|
|
2284
|
+
confetti: Readonly<{
|
|
2285
|
+
count: 45;
|
|
2286
|
+
speed: readonly [2, 8];
|
|
2287
|
+
lift: 2;
|
|
2288
|
+
radius: readonly [3, 7];
|
|
2289
|
+
decay: readonly [0.015, 0.03];
|
|
2290
|
+
gravity: 0.15;
|
|
2291
|
+
drag: 0.98;
|
|
2292
|
+
spin: 2.5;
|
|
2293
|
+
}>;
|
|
2294
|
+
/** project sheet. */
|
|
2295
|
+
sheet: Readonly<{
|
|
2296
|
+
open: 0.72;
|
|
2297
|
+
close: 0.72;
|
|
2298
|
+
underlayScale: 0.98;
|
|
2299
|
+
underlayOpacity: 0.4;
|
|
2300
|
+
}>;
|
|
2301
|
+
/** Physical spring pairs: [stiffness, damping]. */
|
|
2302
|
+
springs: Readonly<{
|
|
2303
|
+
press: readonly [400, 10];
|
|
2304
|
+
success: readonly [260, 18];
|
|
2305
|
+
underlay: readonly [300, 30];
|
|
2306
|
+
letters: readonly [300, 10];
|
|
2307
|
+
cursorFollow: readonly [800, 35];
|
|
2308
|
+
cursorAppear: readonly [500, 30];
|
|
2309
|
+
bentoEnter: readonly [60, 15];
|
|
2310
|
+
bentoRepel: readonly [300, 25];
|
|
2311
|
+
dockPill: readonly [380, 30];
|
|
2312
|
+
}>;
|
|
2313
|
+
/** masked type. */
|
|
2314
|
+
maskText: Readonly<{
|
|
2315
|
+
duration: 1.2;
|
|
2316
|
+
delay: 0.1;
|
|
2317
|
+
stagger: 0.02;
|
|
2318
|
+
exitStagger: 0.002;
|
|
2319
|
+
y: 100;
|
|
2320
|
+
threshold: 0.8;
|
|
2321
|
+
}>;
|
|
2322
|
+
/** reveal group (rules, fades, rises). */
|
|
2323
|
+
cascade: Readonly<{
|
|
2324
|
+
duration: 1.2;
|
|
2325
|
+
step: 0.03;
|
|
2326
|
+
rise: 200;
|
|
2327
|
+
threshold: 0.3;
|
|
2328
|
+
}>;
|
|
2329
|
+
/** slot title: each letter turns 8–14 times inside a 2 s expo.out envelope. */
|
|
2330
|
+
textRoll: Readonly<{
|
|
2331
|
+
duration: 2;
|
|
2332
|
+
stagger: 0.04;
|
|
2333
|
+
turns: readonly [8, 14];
|
|
2334
|
+
interval: 6000;
|
|
2335
|
+
quietMs: 1000;
|
|
2336
|
+
}>;
|
|
2337
|
+
/** hero letters: scale on hover, pastel blink. */
|
|
2338
|
+
letters: Readonly<{
|
|
2339
|
+
scale: 1.3;
|
|
2340
|
+
y: -5;
|
|
2341
|
+
step: 0.03;
|
|
2342
|
+
blink: 0.6;
|
|
2343
|
+
blinkStart: 0.6;
|
|
2344
|
+
blinkRepeatDelay: 0.1;
|
|
2345
|
+
blinkDelays: readonly [0.1, 0.6, 0.2, 1, 0.4, 1.2, 0.15, 0.8, 0.3];
|
|
2346
|
+
}>;
|
|
2347
|
+
/** image parallax. */
|
|
2348
|
+
parallax: Readonly<{
|
|
2349
|
+
travel: 10;
|
|
2350
|
+
scale: 1.2;
|
|
2351
|
+
strongScale: 1.3;
|
|
2352
|
+
lerp: 1;
|
|
2353
|
+
}>;
|
|
2354
|
+
/** About grid gathering from depth. */
|
|
2355
|
+
depthGrid: Readonly<{
|
|
2356
|
+
perspective: 600;
|
|
2357
|
+
distance: 900;
|
|
2358
|
+
depth: -3000;
|
|
2359
|
+
rotate: -160;
|
|
2360
|
+
opacity: 0.05;
|
|
2361
|
+
scale: 0.4;
|
|
2362
|
+
stagger: 0.15;
|
|
2363
|
+
lerp: 1;
|
|
2364
|
+
}>;
|
|
2365
|
+
/** video mask: the frame and the picture inside scale in opposite directions. */
|
|
2366
|
+
frameZoom: Readonly<{
|
|
2367
|
+
outer: readonly [80, 20];
|
|
2368
|
+
inner: readonly [130, 20];
|
|
2369
|
+
phoneOuter: readonly [95, 5];
|
|
2370
|
+
phoneInner: readonly [105, 5];
|
|
2371
|
+
open: 1;
|
|
2372
|
+
lerp: 1;
|
|
2373
|
+
}>;
|
|
2374
|
+
/** marquee: seconds per item, at most 14 counted. */
|
|
2375
|
+
marquee: Readonly<{
|
|
2376
|
+
perItem: 2;
|
|
2377
|
+
maxItems: 14;
|
|
2378
|
+
}>;
|
|
2379
|
+
/** glass chip and dot cursor. */
|
|
2380
|
+
cursor: Readonly<{
|
|
2381
|
+
gutter: 10;
|
|
2382
|
+
circle: 96;
|
|
2383
|
+
dotLerp: 0.2;
|
|
2384
|
+
light: 180;
|
|
2385
|
+
}>;
|
|
2386
|
+
/** floating navbar: enters from −300 % over 1.8 s; rows follow 0.15 s + 0.025 s each. */
|
|
2387
|
+
island: Readonly<{
|
|
2388
|
+
entrance: 1.8;
|
|
2389
|
+
offset: -300;
|
|
2390
|
+
delay: 0.15;
|
|
2391
|
+
step: 0.025;
|
|
2392
|
+
focus: 150;
|
|
2393
|
+
}>;
|
|
2394
|
+
/** product dock: spread for 1.6 s on load; tablet range re-checked 250 ms after a resize. */
|
|
2395
|
+
cardDock: Readonly<{
|
|
2396
|
+
intro: 1600;
|
|
2397
|
+
resizeDebounce: 250;
|
|
2398
|
+
}>;
|
|
2399
|
+
/** phone cards: 5 s a card, 2 s wait after a touch, 0.5 s after it shows. */
|
|
2400
|
+
snapStrip: Readonly<{
|
|
2401
|
+
interval: 5000;
|
|
2402
|
+
resume: 2000;
|
|
2403
|
+
delay: 500;
|
|
2404
|
+
}>;
|
|
2405
|
+
/** fill-text: letters from .2, 0.5 s each, 0.1 s apart, top 90 % → centre 40 %. */
|
|
2406
|
+
fillText: Readonly<{
|
|
2407
|
+
from: 0.2;
|
|
2408
|
+
duration: 0.5;
|
|
2409
|
+
stagger: 0.1;
|
|
2410
|
+
start: "top 90%";
|
|
2411
|
+
end: "center 40%";
|
|
2412
|
+
}>;
|
|
2413
|
+
/** particle hero: fade in 1 s after 0.3 s, morph cycles, pointer push. */
|
|
2414
|
+
particleHero: Readonly<{
|
|
2415
|
+
fadeIn: 1;
|
|
2416
|
+
fadeDelay: 0.3;
|
|
2417
|
+
size: 128;
|
|
2418
|
+
pointSize: 1.7;
|
|
2419
|
+
maxDpr: 1.5;
|
|
2420
|
+
stillSteps: 110;
|
|
2421
|
+
}>;
|
|
2422
|
+
ticketMenu: Readonly<{
|
|
2423
|
+
open: 0.9;
|
|
2424
|
+
content: 1.1;
|
|
2425
|
+
stagger: 0.02;
|
|
2426
|
+
from: 150;
|
|
2427
|
+
}>;
|
|
2428
|
+
infiniteReel: Readonly<{
|
|
2429
|
+
friction: 0.95;
|
|
2430
|
+
wheel: 0.05;
|
|
2431
|
+
dragThreshold: 5;
|
|
2432
|
+
}>;
|
|
2433
|
+
repelBento: Readonly<{
|
|
2434
|
+
offset: 0.6;
|
|
2435
|
+
stagger: 0.006;
|
|
2436
|
+
strength: 5000;
|
|
2437
|
+
distance: 30;
|
|
2438
|
+
breakpoint: 1024;
|
|
2439
|
+
}>;
|
|
2440
|
+
rotator: Readonly<{
|
|
2441
|
+
interval: 8000;
|
|
2442
|
+
duration: 0.25;
|
|
2443
|
+
y: 5;
|
|
2444
|
+
}>;
|
|
2445
|
+
dragRuler: Readonly<{
|
|
2446
|
+
min: 0;
|
|
2447
|
+
max: 8;
|
|
2448
|
+
step: 0.1;
|
|
2449
|
+
pixelsPerUnit: 60;
|
|
2450
|
+
}>;
|
|
2451
|
+
}>;
|
|
2452
|
+
|
|
2453
|
+
type RevealSpeed = keyof typeof TIMING.reveal;
|
|
2454
|
+
interface RevealOptions {
|
|
2455
|
+
/** Element (its centre) or viewport point. Default: the last pointer position, else the centre. */
|
|
2456
|
+
origin?: Element | {
|
|
2457
|
+
x: number;
|
|
2458
|
+
y: number;
|
|
2459
|
+
} | null;
|
|
2460
|
+
speed?: RevealSpeed;
|
|
2461
|
+
delay?: number;
|
|
2462
|
+
overshoot?: number;
|
|
2463
|
+
/** Veil colour. Default: the first opaque background up the tree, else var(--mk-bg). */
|
|
2464
|
+
fill?: string;
|
|
2465
|
+
}
|
|
2466
|
+
interface RevealHandle {
|
|
2467
|
+
timeline: gsap.core.Timeline;
|
|
2468
|
+
finished: Promise<void>;
|
|
2469
|
+
/** Stop now and remove the veil. */
|
|
2470
|
+
cancel(): void;
|
|
2471
|
+
}
|
|
2472
|
+
declare function revealFrom(target: HTMLElement, options?: RevealOptions): RevealHandle | null;
|
|
2473
|
+
|
|
2474
|
+
export { createRichTextEditor as $, createColorArea as A, createColorField as B, createColorPicker as C, createTimeField as D, createRangeCalendar as E, createDateRangePicker as F, createTooltip as G, createPopover as H, createLoadingButton as I, createBreadcrumb as J, createEmptyState as K, createStatCard as L, createChartTooltip as M, createMultiSelect as N, createTagInput as O, createDateTimePicker as P, createFilterBuilder as Q, createTimeline as R, createActivityFeed as S, createTreeView as T, createFileExplorer as U, createJsonViewer as V, createVirtualList as W, createResizablePanel as X, createSplitView as Y, createDataTable as Z, createEditableTable as _, createTrailer as a, type DataAction as a$, createSelect as a0, createAddToCart as a1, createScrollIsland as a2, type RevealHandle as a3, type DateInput as a4, type ActivityActor as a5, type ActivityFeedInstance as a6, type ActivityFeedOptions as a7, type ActivityItem as a8, type ActivityKind as a9, type ChartTooltipInstance as aA, type ChartTooltipOptions as aB, type ChartTooltipSeries as aC, type ChartType as aD, type CheckState as aE, type CodeBlockInstance as aF, type CodeBlockOptions as aG, type ColorAreaInstance as aH, type ColorAreaOptions as aI, type ColorChannel as aJ, type ColorFieldInstance as aK, type ColorFieldOptions as aL, type ColorFormat as aM, type ColorPickerInstance as aN, type ColorPickerOptions as aO, type ColorSliderInstance as aP, type ColorSliderOptions as aQ, type CommandItem as aR, type CommandSearchInstance as aS, type CommandSearchOptions as aT, type ContextMenuInstance as aU, type ContextMenuOptions as aV, type CreditCardField as aW, type CreditCardInstance as aX, type CreditCardLabels as aY, type CreditCardOptions as aZ, type CreditCardValues as a_, type AddToCartInstance as aa, type AddToCartOptions as ab, type AttachmentFile as ac, type AttachmentInstance as ad, type AttachmentLabels as ae, type AttachmentOptions as af, type AttachmentRejectCode as ag, type AttachmentRejection as ah, type AttachmentStatus as ai, BRAND_LABELS as aj, type BreadcrumbInstance as ak, type BreadcrumbItem as al, type BreadcrumbOptions as am, CHANNEL_LABELS as an, type CalendarEvent as ao, type CalendarEventStatus as ap, type CalendarInstance as aq, type CalendarLabels as ar, type CalendarOptions as as, type CalendarRange as at, type CalendarView as au, type CardBrand as av, type ChartInstance as aw, type ChartOptions as ax, type ChartPoint as ay, type ChartSeries as az, createQuantity as b, type MultiSelectOptions as b$, type DataColumn as b0, type DataColumnType as b1, type DataRow as b2, type DataSort as b3, type DataTableInstance as b4, type DataTableOptions as b5, type DateRange as b6, type DateRangePickerInstance as b7, type DateRangePickerOptions as b8, type DateTimePickerInstance as b9, type FilterGroup as bA, type FilterNode as bB, type FilterRule as bC, type FilterValue as bD, type HoldConfirmInstance as bE, type HoldConfirmOptions as bF, type HoverCardInstance as bG, type HoverCardOptions as bH, type Hsla as bI, type Hsva as bJ, type ImagePreviewInstance as bK, type ImagePreviewOptions as bL, type InputOtpInstance as bM, type InputOtpOptions as bN, type JsonType as bO, type JsonViewerInstance as bP, type JsonViewerOptions as bQ, type LinkPreviewInstance as bR, type LinkPreviewOptions as bS, type LinkPreviewVariant as bT, type LoadingButtonInstance as bU, type LoadingButtonOptions as bV, type LoadingState as bW, type MenuInstance as bX, type MenuOptions as bY, type MultiSelectInstance as bZ, type MultiSelectOption as b_, type DateTimePickerOptions as ba, type DialogInstance as bb, type DialogLabels as bc, type DialogOptions as bd, type DialogPlacement as be, type DialogVariant as bf, type EditableColumn as bg, type EditableTableInstance as bh, type EditableTableOptions as bi, type EditorKind as bj, type EmptyAction as bk, type EmptyIllustration as bl, type EmptyStateInstance as bm, type EmptyStateOptions as bn, type Expiry as bo, type FileChange as bp, type FileEntry as bq, type FileExplorerInstance as br, type FileExplorerOptions as bs, type FileFamily as bt, type FileSort as bu, type FileView as bv, type FilterBuilderInstance as bw, type FilterBuilderOptions as bx, type FilterField as by, type FilterFieldType as bz, createStudioDock as c, type StatCardOptions as c$, type NotificationBellInstance as c0, type NotificationBellOptions as c1, OPERATORS as c2, type PaginationInstance as c3, type PaginationOptions as c4, type PanelOrientation as c5, type PasswordChecks as c6, type PasswordScore as c7, type PasswordStrengthInstance as c8, type PasswordStrengthOptions as c9, type RowChange as cA, type RowId as cB, STRENGTH_LABELS as cC, type ScratchCardInstance as cD, type ScratchCardOptions as cE, type ScrollIslandInstance as cF, type ScrollIslandOptions as cG, type SelectInstance as cH, type SelectOption as cI, type SelectOptions as cJ, type Side as cK, type SkeletonAnimation as cL, type SkeletonInstance as cM, type SkeletonOptions as cN, type SkeletonShape as cO, type SlotPickerInstance as cP, type SlotPickerLabels as cQ, type SlotPickerOptions as cR, type SlotSource as cS, type SlotValue as cT, type SortDirection as cU, type SplitSide as cV, type SplitViewInstance as cW, type SplitViewOptions as cX, type StarRatingInstance as cY, type StarRatingOptions as cZ, type StatCardInstance as c_, type Placed as ca, type Placement as cb, type PopoverInstance as cc, type PopoverOptions as cd, type ProgressInstance as ce, type ProgressOptions as cf, type ProgressVariant as cg, type QuantityInstance as ch, type QuantityOptions as ci, type QuestionnaireAnswers as cj, type QuestionnaireInstance as ck, type QuestionnaireLabels as cl, type QuestionnaireOptions as cm, type RangeCalendarInstance as cn, type RangeCalendarOptions as co, type RangeSliderInstance as cp, type RangeSliderOptions as cq, type RangeValue as cr, type ResizablePanelInstance as cs, type ResizablePanelOptions as ct, type RevealOptions as cu, type RevealSpeed as cv, type Rgba as cw, type RichCommand as cx, type RichTextEditorInstance as cy, type RichTextEditorOptions as cz, createPagination as d, rangeKeys as d$, type StudioDockInstance as d0, type StudioDockOptions as d1, type StudioDockState as d2, type StudioDockView as d3, TIMING as d4, type TagInputInstance as d5, type TagInputOptions as d6, type TimeFieldInstance as d7, type TimeFieldOptions as d8, type TimeInput as d9, createSizes as dA, cvcLength as dB, dateTimeKey as dC, dayKey as dD, dayLabel as dE, describeAccept as dF, describeFilter as dG, detectBrand as dH, emptyFilter as dI, fileFamily as dJ, findNode as dK, formatBytes as dL, formatColor as dM, formatNumber as dN, formatSize as dO, getChannel as dP, hasConditions as dQ, hsvToRgb as dR, jsonPath as dS, linkDomain as dT, luhn as dU, luminance as dV, matchesFilter as dW, normaliseSizes as dX, parseColor as dY, parseExpiry as dZ, place as d_, type TimelineEvent as da, type TimelineInstance as db, type TimelineOptions as dc, type TimelineStatus as dd, type TooltipInstance as de, type TooltipOptions as df, type TrailerInstance as dg, type TrailerOptions as dh, type TreeNode as di, type TreeViewInstance as dj, type TreeViewOptions as dk, type VirtualKey as dl, type VirtualListInstance as dm, type VirtualListOptions as dn, type VirtualRange as dp, type VirtualScrollOptions as dq, type VirtualSizes as dr, acceptsFile as ds, bandDuration as dt, cardLength as du, channelText as dv, checkStates as dw, codeLines as dx, createDialog as dy, createMenu as dz, createHoverCard as e, rangeLength as e0, readAnswers as e1, relativeTime as e2, revealFrom as e3, rgbToHsv as e4, safeHref as e5, safeImage as e6, sanitizeHtml as e7, scorePassword as e8, searchTree as e9, setChannel as ea, skeletonBones as eb, sortEntries as ec, toDate as ed, toDateTimeValue as ee, toHex as ef, toHsva as eg, toRange as eh, toggleCheck as ei, createInputOtp as f, createCalendar as g, createSlotPicker as h, createCreditCard as i, createCommandSearch as j, createHoldConfirm as k, createImagePreview as l, createNotificationBell as m, createPasswordStrength as n, createScratchCard as o, createStarRating as p, createAttachment as q, createSkeleton as r, createQuestionnaire as s, createCodeBlock as t, createContextMenu as u, createLinkPreview as v, createProgress as w, createRangeSlider as x, createChart as y, createColorSlider as z };
|