@cascivo/react 1.0.0 → 1.2.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 +5 -4
- package/dist/accordion/accordion.js +1 -114
- package/dist/accordion/accordion.module.js +1 -10
- package/dist/action-sheet/action-sheet.css +1 -1
- package/dist/action-sheet/action-sheet.js +1 -91
- package/dist/action-sheet/action-sheet.module.js +1 -12
- package/dist/alert/alert.js +1 -55
- package/dist/alert/alert.module.js +1 -11
- package/dist/alert-dialog/alert-dialog.css +1 -1
- package/dist/alert-dialog/alert-dialog.js +1 -66
- package/dist/alert-dialog/alert-dialog.module.js +1 -11
- package/dist/app-shell/app-shell.css +1 -1
- package/dist/app-shell/app-shell.js +1 -85
- package/dist/app-shell/app-shell.module.js +1 -12
- package/dist/aspect-ratio/aspect-ratio.js +1 -20
- package/dist/aspect-ratio/aspect-ratio.module.js +1 -6
- package/dist/avatar/avatar.js +1 -57
- package/dist/avatar/avatar.module.js +1 -8
- package/dist/avatar-group/avatar-group.js +1 -24
- package/dist/avatar-group/avatar-group.module.js +1 -6
- package/dist/badge/badge.js +1 -22
- package/dist/badge/badge.module.js +1 -3
- package/dist/blockquote/blockquote.js +1 -16
- package/dist/blockquote/blockquote.module.js +1 -6
- package/dist/bottom-sheet/bottom-sheet.js +1 -111
- package/dist/bottom-sheet/bottom-sheet.module.js +1 -14
- package/dist/brand/logo/logo.css +1 -0
- package/dist/brand/logo/logo.js +1 -0
- package/dist/brand/logo/logo.module.js +2 -0
- package/dist/breadcrumb/breadcrumb.js +1 -28
- package/dist/breadcrumb/breadcrumb.module.js +1 -3
- package/dist/button/button.css +1 -1
- package/dist/button/button.js +1 -35
- package/dist/button/button.module.js +1 -6
- package/dist/button-group/button-group.js +1 -39
- package/dist/button-group/button-group.module.js +1 -3
- package/dist/calendar/calendar-date.js +1 -0
- package/dist/calendar/calendar.css +1 -1
- package/dist/calendar/calendar.js +1 -199
- package/dist/calendar/calendar.module.js +1 -14
- package/dist/card/card.js +1 -53
- package/dist/card/card.module.js +1 -12
- package/dist/carousel/carousel.css +1 -1
- package/dist/carousel/carousel.js +1 -138
- package/dist/carousel/carousel.module.js +1 -13
- package/dist/chat-bubble/chat-bubble.js +1 -31
- package/dist/chat-bubble/chat-bubble.module.js +1 -11
- package/dist/checkbox/checkbox.js +1 -39
- package/dist/checkbox/checkbox.module.js +1 -8
- package/dist/checkbox-card/checkbox-card.css +1 -1
- package/dist/checkbox-card/checkbox-card.js +1 -50
- package/dist/checkbox-card/checkbox-card.module.js +1 -11
- package/dist/code/code.js +1 -14
- package/dist/code/code.module.js +1 -3
- package/dist/code-snippet/code-snippet.js +2 -121
- package/dist/code-snippet/code-snippet.module.js +1 -17
- package/dist/code-snippet/highlight.js +1 -67
- package/dist/collapsible/collapsible.js +1 -47
- package/dist/collapsible/collapsible.module.js +1 -7
- package/dist/color-picker/color-picker.css +1 -1
- package/dist/color-picker/color-picker.js +1 -272
- package/dist/color-picker/color-picker.module.js +1 -18
- package/dist/color-picker/color.js +1 -0
- package/dist/combobox/combobox.css +1 -1
- package/dist/combobox/combobox.js +1 -170
- package/dist/combobox/combobox.module.js +1 -19
- package/dist/combobox/list-nav.js +1 -0
- package/dist/combobox/option-list.js +1 -0
- package/dist/command-menu/command-menu.js +1 -421
- package/dist/command-menu/command-menu.module.js +1 -34
- package/dist/comparison/comparison.js +1 -69
- package/dist/comparison/comparison.module.js +1 -9
- package/dist/contained-list/contained-list.js +1 -41
- package/dist/contained-list/contained-list.module.js +1 -11
- package/dist/context-menu/context-menu.js +1 -93
- package/dist/context-menu/context-menu.module.js +1 -7
- package/dist/copy-button/copy-button.js +1 -60
- package/dist/copy-button/copy-button.module.js +1 -6
- package/dist/data-list/data-list.js +1 -25
- package/dist/data-list/data-list.module.js +1 -8
- package/dist/data-table/column-filter.js +1 -0
- package/dist/data-table/column-layout.js +1 -0
- package/dist/data-table/data-table.css +1 -1
- package/dist/data-table/data-table.js +1 -398
- package/dist/data-table/data-table.module.js +1 -33
- package/dist/data-table/grid-keys.js +1 -0
- package/dist/data-table/row-group.js +1 -0
- package/dist/data-table/row-search.js +1 -0
- package/dist/data-table/row-sort.js +1 -0
- package/dist/data-table/to-csv.js +3 -0
- package/dist/data-table/virtual-window.js +1 -0
- package/dist/date-picker/date-picker.css +1 -1
- package/dist/date-picker/date-picker.js +1 -224
- package/dist/date-picker/date-picker.module.js +1 -23
- package/dist/date-picker/parse-date.js +1 -0
- package/dist/date-range-picker/date-range-picker.js +1 -196
- package/dist/date-range-picker/date-range-picker.module.js +1 -18
- package/dist/dock/dock.css +1 -1
- package/dist/dock/dock.js +1 -34
- package/dist/dock/dock.module.js +1 -8
- package/dist/drawer/drawer.js +1 -96
- package/dist/drawer/drawer.module.js +1 -13
- package/dist/dropdown/dropdown.css +1 -1
- package/dist/dropdown/dropdown.js +1 -110
- package/dist/dropdown/dropdown.module.js +1 -9
- package/dist/editable/editable.js +1 -76
- package/dist/editable/editable.module.js +1 -11
- package/dist/empty-state/empty-state.js +1 -32
- package/dist/empty-state/empty-state.module.js +1 -9
- package/dist/fab/fab.css +1 -1
- package/dist/fab/fab.js +1 -93
- package/dist/fab/fab.module.js +1 -12
- package/dist/field/field.css +1 -1
- package/dist/field/field.js +1 -53
- package/dist/field/field.module.js +1 -7
- package/dist/file-uploader/file-uploader.css +1 -1
- package/dist/file-uploader/file-uploader.js +1 -123
- package/dist/file-uploader/file-uploader.module.js +1 -18
- package/dist/filter/filter.css +1 -1
- package/dist/filter/filter.js +1 -35
- package/dist/filter/filter.module.js +1 -6
- package/dist/form/form.js +1 -95
- package/dist/form/form.module.js +1 -3
- package/dist/header/header.js +1 -44
- package/dist/header/header.module.js +1 -11
- package/dist/header-panel/header-panel.js +1 -72
- package/dist/header-panel/header-panel.module.js +1 -9
- package/dist/heading/heading.css +1 -1
- package/dist/heading/heading.js +1 -22
- package/dist/heading/heading.module.js +1 -3
- package/dist/hover-card/hover-card.css +1 -1
- package/dist/hover-card/hover-card.js +1 -84
- package/dist/hover-card/hover-card.module.js +1 -6
- package/dist/icon-button/icon-button.js +1 -19
- package/dist/icon-button/icon-button.module.js +1 -3
- package/dist/image/image.css +1 -1
- package/dist/image/image.js +1 -64
- package/dist/image/image.module.js +1 -9
- package/dist/index.d.ts +1521 -38
- package/dist/indicator/indicator.js +1 -16
- package/dist/indicator/indicator.module.js +1 -6
- package/dist/infinite-scroll/infinite-scroll.js +1 -49
- package/dist/infinite-scroll/infinite-scroll.module.js +1 -7
- package/dist/inline-loading/inline-loading.js +1 -74
- package/dist/inline-loading/inline-loading.module.js +1 -9
- package/dist/input/input.css +1 -1
- package/dist/input/input.js +1 -56
- package/dist/input/input.module.js +1 -9
- package/dist/input-group/input-group.css +1 -1
- package/dist/input-group/input-group.js +1 -39
- package/dist/input-group/input-group.module.js +1 -9
- package/dist/item/item.js +1 -50
- package/dist/item/item.module.js +1 -10
- package/dist/join/join.js +1 -12
- package/dist/join/join.module.js +1 -3
- package/dist/kbd/kbd.js +1 -14
- package/dist/kbd/kbd.module.js +1 -3
- package/dist/label/label.js +1 -23
- package/dist/label/label.module.js +1 -7
- package/dist/large-title-header/large-title-header.js +1 -38
- package/dist/large-title-header/large-title-header.module.js +1 -12
- package/dist/layouts/src/auto-grid/auto-grid.js +1 -17
- package/dist/layouts/src/auto-grid/auto-grid.module.js +1 -4
- package/dist/layouts/src/center/center.js +1 -16
- package/dist/layouts/src/center/center.module.js +1 -3
- package/dist/layouts/src/columns/columns.js +1 -21
- package/dist/layouts/src/columns/columns.module.js +1 -6
- package/dist/layouts/src/flex/flex.css +1 -1
- package/dist/layouts/src/flex/flex.js +1 -20
- package/dist/layouts/src/flex/flex.module.js +1 -3
- package/dist/layouts/src/grid/grid.css +1 -1
- package/dist/layouts/src/grid/grid.js +1 -55
- package/dist/layouts/src/grid/grid.module.js +1 -7
- package/dist/layouts/src/page-header/page-header.js +1 -31
- package/dist/layouts/src/page-header/page-header.module.js +1 -10
- package/dist/layouts/src/spacer/spacer.js +1 -17
- package/dist/layouts/src/spacer/spacer.module.js +1 -3
- package/dist/link/link.css +1 -1
- package/dist/link/link.js +1 -22
- package/dist/link/link.module.js +1 -3
- package/dist/list/list.js +1 -21
- package/dist/list/list.module.js +1 -6
- package/dist/log-viewer/log-viewer.css +1 -1
- package/dist/log-viewer/log-viewer.js +2 -184
- package/dist/log-viewer/log-viewer.module.js +1 -16
- package/dist/menu/menu.js +1 -126
- package/dist/menu/menu.module.js +1 -8
- package/dist/menu-button/menu-button.js +1 -92
- package/dist/menu-button/menu-button.module.js +1 -8
- package/dist/menubar/menubar.js +1 -103
- package/dist/menubar/menubar.module.js +1 -8
- package/dist/modal/modal.css +1 -1
- package/dist/modal/modal.js +1 -76
- package/dist/modal/modal.module.js +1 -12
- package/dist/multi-select/list-nav.js +1 -0
- package/dist/multi-select/multi-select.css +1 -1
- package/dist/multi-select/multi-select.js +1 -106
- package/dist/multi-select/multi-select.module.js +1 -15
- package/dist/multi-select/option-list.js +1 -0
- package/dist/native-select/native-select.css +1 -1
- package/dist/native-select/native-select.js +1 -37
- package/dist/native-select/native-select.module.js +1 -7
- package/dist/navigation-menu/navigation-menu.js +1 -99
- package/dist/navigation-menu/navigation-menu.module.js +1 -10
- package/dist/node/accordion/accordion.js +1 -114
- package/dist/node/accordion/accordion.module.js +1 -10
- package/dist/node/action-sheet/action-sheet.js +1 -91
- package/dist/node/action-sheet/action-sheet.module.js +1 -12
- package/dist/node/alert/alert.js +1 -55
- package/dist/node/alert/alert.module.js +1 -11
- package/dist/node/alert-dialog/alert-dialog.js +1 -66
- package/dist/node/alert-dialog/alert-dialog.module.js +1 -11
- package/dist/node/app-shell/app-shell.js +1 -85
- package/dist/node/app-shell/app-shell.module.js +1 -12
- package/dist/node/aspect-ratio/aspect-ratio.js +1 -20
- package/dist/node/aspect-ratio/aspect-ratio.module.js +1 -6
- package/dist/node/avatar/avatar.js +1 -57
- package/dist/node/avatar/avatar.module.js +1 -8
- package/dist/node/avatar-group/avatar-group.js +1 -24
- package/dist/node/avatar-group/avatar-group.module.js +1 -6
- package/dist/node/badge/badge.js +1 -22
- package/dist/node/badge/badge.module.js +1 -3
- package/dist/node/blockquote/blockquote.js +1 -16
- package/dist/node/blockquote/blockquote.module.js +1 -6
- package/dist/node/bottom-sheet/bottom-sheet.js +1 -111
- package/dist/node/bottom-sheet/bottom-sheet.module.js +1 -14
- package/dist/node/brand/logo/logo.js +1 -0
- package/dist/node/brand/logo/logo.module.js +1 -0
- package/dist/node/breadcrumb/breadcrumb.js +1 -28
- package/dist/node/breadcrumb/breadcrumb.module.js +1 -3
- package/dist/node/button/button.js +1 -35
- package/dist/node/button/button.module.js +1 -6
- package/dist/node/button-group/button-group.js +1 -39
- package/dist/node/button-group/button-group.module.js +1 -3
- package/dist/node/calendar/calendar-date.js +1 -0
- package/dist/node/calendar/calendar.js +1 -199
- package/dist/node/calendar/calendar.module.js +1 -14
- package/dist/node/card/card.js +1 -53
- package/dist/node/card/card.module.js +1 -12
- package/dist/node/carousel/carousel.js +1 -138
- package/dist/node/carousel/carousel.module.js +1 -13
- package/dist/node/chat-bubble/chat-bubble.js +1 -31
- package/dist/node/chat-bubble/chat-bubble.module.js +1 -11
- package/dist/node/checkbox/checkbox.js +1 -39
- package/dist/node/checkbox/checkbox.module.js +1 -8
- package/dist/node/checkbox-card/checkbox-card.js +1 -50
- package/dist/node/checkbox-card/checkbox-card.module.js +1 -11
- package/dist/node/code/code.js +1 -14
- package/dist/node/code/code.module.js +1 -3
- package/dist/node/code-snippet/code-snippet.js +2 -121
- package/dist/node/code-snippet/code-snippet.module.js +1 -17
- package/dist/node/code-snippet/highlight.js +1 -67
- package/dist/node/collapsible/collapsible.js +1 -47
- package/dist/node/collapsible/collapsible.module.js +1 -7
- package/dist/node/color-picker/color-picker.js +1 -272
- package/dist/node/color-picker/color-picker.module.js +1 -18
- package/dist/node/color-picker/color.js +1 -0
- package/dist/node/combobox/combobox.js +1 -170
- package/dist/node/combobox/combobox.module.js +1 -19
- package/dist/node/combobox/list-nav.js +1 -0
- package/dist/node/combobox/option-list.js +1 -0
- package/dist/node/command-menu/command-menu.js +1 -421
- package/dist/node/command-menu/command-menu.module.js +1 -34
- package/dist/node/comparison/comparison.js +1 -69
- package/dist/node/comparison/comparison.module.js +1 -9
- package/dist/node/contained-list/contained-list.js +1 -41
- package/dist/node/contained-list/contained-list.module.js +1 -11
- package/dist/node/context-menu/context-menu.js +1 -93
- package/dist/node/context-menu/context-menu.module.js +1 -7
- package/dist/node/copy-button/copy-button.js +1 -60
- package/dist/node/copy-button/copy-button.module.js +1 -6
- package/dist/node/data-list/data-list.js +1 -25
- package/dist/node/data-list/data-list.module.js +1 -8
- package/dist/node/data-table/column-filter.js +1 -0
- package/dist/node/data-table/column-layout.js +1 -0
- package/dist/node/data-table/data-table.js +1 -398
- package/dist/node/data-table/data-table.module.js +1 -33
- package/dist/node/data-table/grid-keys.js +1 -0
- package/dist/node/data-table/row-group.js +1 -0
- package/dist/node/data-table/row-search.js +1 -0
- package/dist/node/data-table/row-sort.js +1 -0
- package/dist/node/data-table/to-csv.js +3 -0
- package/dist/node/data-table/virtual-window.js +1 -0
- package/dist/node/date-picker/date-picker.js +1 -224
- package/dist/node/date-picker/date-picker.module.js +1 -23
- package/dist/node/date-picker/parse-date.js +1 -0
- package/dist/node/date-range-picker/date-range-picker.js +1 -196
- package/dist/node/date-range-picker/date-range-picker.module.js +1 -18
- package/dist/node/dock/dock.js +1 -34
- package/dist/node/dock/dock.module.js +1 -8
- package/dist/node/drawer/drawer.js +1 -96
- package/dist/node/drawer/drawer.module.js +1 -13
- package/dist/node/dropdown/dropdown.js +1 -110
- package/dist/node/dropdown/dropdown.module.js +1 -9
- package/dist/node/editable/editable.js +1 -76
- package/dist/node/editable/editable.module.js +1 -11
- package/dist/node/empty-state/empty-state.js +1 -32
- package/dist/node/empty-state/empty-state.module.js +1 -9
- package/dist/node/fab/fab.js +1 -93
- package/dist/node/fab/fab.module.js +1 -12
- package/dist/node/field/field.js +1 -53
- package/dist/node/field/field.module.js +1 -7
- package/dist/node/file-uploader/file-uploader.js +1 -123
- package/dist/node/file-uploader/file-uploader.module.js +1 -18
- package/dist/node/filter/filter.js +1 -35
- package/dist/node/filter/filter.module.js +1 -6
- package/dist/node/form/form.js +1 -95
- package/dist/node/form/form.module.js +1 -3
- package/dist/node/header/header.js +1 -44
- package/dist/node/header/header.module.js +1 -11
- package/dist/node/header-panel/header-panel.js +1 -72
- package/dist/node/header-panel/header-panel.module.js +1 -9
- package/dist/node/heading/heading.js +1 -22
- package/dist/node/heading/heading.module.js +1 -3
- package/dist/node/hover-card/hover-card.js +1 -84
- package/dist/node/hover-card/hover-card.module.js +1 -6
- package/dist/node/icon-button/icon-button.js +1 -19
- package/dist/node/icon-button/icon-button.module.js +1 -3
- package/dist/node/image/image.js +1 -64
- package/dist/node/image/image.module.js +1 -9
- package/dist/node/indicator/indicator.js +1 -16
- package/dist/node/indicator/indicator.module.js +1 -6
- package/dist/node/infinite-scroll/infinite-scroll.js +1 -49
- package/dist/node/infinite-scroll/infinite-scroll.module.js +1 -7
- package/dist/node/inline-loading/inline-loading.js +1 -74
- package/dist/node/inline-loading/inline-loading.module.js +1 -9
- package/dist/node/input/input.js +1 -56
- package/dist/node/input/input.module.js +1 -9
- package/dist/node/input-group/input-group.js +1 -39
- package/dist/node/input-group/input-group.module.js +1 -9
- package/dist/node/item/item.js +1 -50
- package/dist/node/item/item.module.js +1 -10
- package/dist/node/join/join.js +1 -12
- package/dist/node/join/join.module.js +1 -3
- package/dist/node/kbd/kbd.js +1 -14
- package/dist/node/kbd/kbd.module.js +1 -3
- package/dist/node/label/label.js +1 -23
- package/dist/node/label/label.module.js +1 -7
- package/dist/node/large-title-header/large-title-header.js +1 -38
- package/dist/node/large-title-header/large-title-header.module.js +1 -12
- package/dist/node/layouts/src/auto-grid/auto-grid.js +1 -17
- package/dist/node/layouts/src/auto-grid/auto-grid.module.js +1 -4
- package/dist/node/layouts/src/center/center.js +1 -16
- package/dist/node/layouts/src/center/center.module.js +1 -3
- package/dist/node/layouts/src/columns/columns.js +1 -21
- package/dist/node/layouts/src/columns/columns.module.js +1 -6
- package/dist/node/layouts/src/flex/flex.js +1 -20
- package/dist/node/layouts/src/flex/flex.module.js +1 -3
- package/dist/node/layouts/src/grid/grid.js +1 -55
- package/dist/node/layouts/src/grid/grid.module.js +1 -7
- package/dist/node/layouts/src/page-header/page-header.js +1 -31
- package/dist/node/layouts/src/page-header/page-header.module.js +1 -10
- package/dist/node/layouts/src/spacer/spacer.js +1 -17
- package/dist/node/layouts/src/spacer/spacer.module.js +1 -3
- package/dist/node/link/link.js +1 -22
- package/dist/node/link/link.module.js +1 -3
- package/dist/node/list/list.js +1 -21
- package/dist/node/list/list.module.js +1 -6
- package/dist/node/log-viewer/log-viewer.js +2 -184
- package/dist/node/log-viewer/log-viewer.module.js +1 -16
- package/dist/node/menu/menu.js +1 -126
- package/dist/node/menu/menu.module.js +1 -8
- package/dist/node/menu-button/menu-button.js +1 -92
- package/dist/node/menu-button/menu-button.module.js +1 -8
- package/dist/node/menubar/menubar.js +1 -103
- package/dist/node/menubar/menubar.module.js +1 -8
- package/dist/node/modal/modal.js +1 -76
- package/dist/node/modal/modal.module.js +1 -12
- package/dist/node/multi-select/list-nav.js +1 -0
- package/dist/node/multi-select/multi-select.js +1 -106
- package/dist/node/multi-select/multi-select.module.js +1 -15
- package/dist/node/multi-select/option-list.js +1 -0
- package/dist/node/native-select/native-select.js +1 -37
- package/dist/node/native-select/native-select.module.js +1 -7
- package/dist/node/navigation-menu/navigation-menu.js +1 -99
- package/dist/node/navigation-menu/navigation-menu.module.js +1 -10
- package/dist/node/notification/notification.js +1 -140
- package/dist/node/notification/notification.module.js +1 -11
- package/dist/node/number-input/number-input.js +1 -148
- package/dist/node/number-input/number-input.module.js +1 -12
- package/dist/node/otp-input/otp-input.js +1 -70
- package/dist/node/otp-input/otp-input.module.js +1 -6
- package/dist/node/overflow-menu/overflow-menu.js +1 -70
- package/dist/node/overflow-menu/overflow-menu.module.js +1 -7
- package/dist/node/pagination/pagination.js +1 -92
- package/dist/node/pagination/pagination.module.js +1 -11
- package/dist/node/password-input/password-input.js +1 -81
- package/dist/node/password-input/password-input.module.js +1 -11
- package/dist/node/popover/popover.js +1 -51
- package/dist/node/popover/popover.module.js +1 -6
- package/dist/node/popover/use-popover.js +1 -55
- package/dist/node/progress/progress.js +1 -16
- package/dist/node/progress/progress.module.js +1 -6
- package/dist/node/progress-bar/progress-bar.js +1 -42
- package/dist/node/progress-bar/progress-bar.module.js +1 -11
- package/dist/node/progress-circle/progress-circle.js +1 -46
- package/dist/node/progress-circle/progress-circle.module.js +1 -9
- package/dist/node/progress-indicator/progress-indicator.js +1 -34
- package/dist/node/progress-indicator/progress-indicator.module.js +1 -10
- package/dist/node/prose/prose.js +1 -13
- package/dist/node/prose/prose.module.js +1 -3
- package/dist/node/pull-to-refresh/pull-to-refresh.js +1 -82
- package/dist/node/pull-to-refresh/pull-to-refresh.module.js +1 -9
- package/dist/node/qr-code/encode.js +1 -583
- package/dist/node/qr-code/qr-code.js +1 -41
- package/dist/node/qr-code/qr-code.module.js +1 -6
- package/dist/node/radial-progress/radial-progress.js +1 -27
- package/dist/node/radial-progress/radial-progress.module.js +1 -6
- package/dist/node/radio/radio.js +1 -49
- package/dist/node/radio/radio.module.js +1 -9
- package/dist/node/radio-card/radio-card.js +1 -64
- package/dist/node/radio-card/radio-card.module.js +1 -11
- package/dist/node/rating-group/rating-group.js +1 -37
- package/dist/node/rating-group/rating-group.module.js +1 -6
- package/dist/node/react/src/index.js +1 -141
- package/dist/node/relative-time/relative-time.js +1 -66
- package/dist/node/relative-time/relative-time.module.js +1 -3
- package/dist/node/reorder-list/reorder-list.js +1 -143
- package/dist/node/reorder-list/reorder-list.module.js +1 -11
- package/dist/node/resizable/resizable.js +1 -80
- package/dist/node/resizable/resizable.module.js +1 -8
- package/dist/node/scroll-area/scroll-area.js +1 -38
- package/dist/node/scroll-area/scroll-area.module.js +1 -3
- package/dist/node/search/search.js +1 -96
- package/dist/node/search/search.module.js +1 -9
- package/dist/node/segmented-control/segmented-control.js +1 -43
- package/dist/node/segmented-control/segmented-control.module.js +1 -6
- package/dist/node/select/select.js +1 -73
- package/dist/node/select/select.module.js +1 -11
- package/dist/node/separator/separator.js +1 -19
- package/dist/node/separator/separator.module.js +1 -3
- package/dist/node/sheet/sheet.js +1 -49
- package/dist/node/sheet/sheet.module.js +1 -9
- package/dist/node/shell-header/shell-header.js +1 -169
- package/dist/node/shell-header/shell-header.module.js +1 -24
- package/dist/node/side-nav/side-nav.js +1 -334
- package/dist/node/side-nav/side-nav.module.js +1 -31
- package/dist/node/skeleton/skeleton.js +1 -23
- package/dist/node/skeleton/skeleton.module.js +1 -7
- package/dist/node/skip-nav/skip-nav.js +1 -28
- package/dist/node/skip-nav/skip-nav.module.js +1 -3
- package/dist/node/slider/slider.js +1 -30
- package/dist/node/slider/slider.module.js +1 -7
- package/dist/node/spinner/spinner.js +1 -18
- package/dist/node/spinner/spinner.module.js +1 -6
- package/dist/node/stack/stack.js +1 -17
- package/dist/node/stack/stack.module.js +1 -6
- package/dist/node/stat/stat.js +1 -41
- package/dist/node/stat/stat.module.js +1 -11
- package/dist/node/status/status.js +1 -25
- package/dist/node/status/status.module.js +1 -7
- package/dist/node/steps/steps.js +1 -35
- package/dist/node/steps/steps.module.js +1 -8
- package/dist/node/structured-list/structured-list.js +1 -102
- package/dist/node/structured-list/structured-list.module.js +1 -12
- package/dist/node/swap/swap.js +1 -36
- package/dist/node/swap/swap.module.js +1 -7
- package/dist/node/swipe-item/swipe-item.js +1 -62
- package/dist/node/swipe-item/swipe-item.module.js +1 -12
- package/dist/node/switcher/switcher.js +1 -32
- package/dist/node/switcher/switcher.module.js +1 -8
- package/dist/node/tabs/tabs.js +1 -98
- package/dist/node/tabs/tabs.module.js +1 -8
- package/dist/node/tag/tag.js +1 -33
- package/dist/node/tag/tag.module.js +1 -6
- package/dist/node/tags-input/tags-input.js +1 -68
- package/dist/node/tags-input/tags-input.module.js +1 -8
- package/dist/node/text/text.js +1 -16
- package/dist/node/text/text.module.js +1 -3
- package/dist/node/textarea/textarea.js +1 -58
- package/dist/node/textarea/textarea.module.js +1 -9
- package/dist/node/tile/tile.js +1 -39
- package/dist/node/tile/tile.module.js +1 -7
- package/dist/node/time-picker/time-picker.js +1 -64
- package/dist/node/time-picker/time-picker.module.js +1 -9
- package/dist/node/timeline/timeline.js +1 -55
- package/dist/node/timeline/timeline.module.js +1 -11
- package/dist/node/toast/toast.js +1 -85
- package/dist/node/toast/toast.module.js +1 -11
- package/dist/node/toc/toc.js +1 -43
- package/dist/node/toc/toc.module.js +1 -3
- package/dist/node/toc/use-toc-from-region.js +1 -18
- package/dist/node/toggle/toggle.js +1 -42
- package/dist/node/toggle/toggle.module.js +1 -8
- package/dist/node/toggle-group/toggle-group.js +1 -55
- package/dist/node/toggle-group/toggle-group.module.js +1 -6
- package/dist/node/toggletip/toggletip.js +1 -49
- package/dist/node/toggletip/toggletip.module.js +1 -7
- package/dist/node/tooltip/tooltip.js +1 -58
- package/dist/node/tooltip/tooltip.module.js +1 -6
- package/dist/node/tree-view/tree-view.js +1 -201
- package/dist/node/tree-view/tree-view.module.js +1 -13
- package/dist/node/user/user.js +1 -35
- package/dist/node/user/user.module.js +1 -9
- package/dist/node/virtual-list/virtual-list.js +1 -40
- package/dist/node/virtual-list/virtual-list.module.js +1 -7
- package/dist/node/visually-hidden/visually-hidden.js +1 -2
- package/dist/node/wheel-picker/wheel-picker.js +1 -84
- package/dist/node/wheel-picker/wheel-picker.module.js +1 -8
- package/dist/notification/notification.js +1 -140
- package/dist/notification/notification.module.js +1 -11
- package/dist/number-input/number-input.js +1 -148
- package/dist/number-input/number-input.module.js +1 -12
- package/dist/otp-input/otp-input.js +1 -70
- package/dist/otp-input/otp-input.module.js +1 -6
- package/dist/overflow-menu/overflow-menu.js +1 -70
- package/dist/overflow-menu/overflow-menu.module.js +1 -7
- package/dist/pagination/pagination.js +1 -92
- package/dist/pagination/pagination.module.js +1 -11
- package/dist/password-input/password-input.js +1 -81
- package/dist/password-input/password-input.module.js +1 -11
- package/dist/popover/popover.js +1 -51
- package/dist/popover/popover.module.js +1 -6
- package/dist/popover/use-popover.js +1 -55
- package/dist/progress/progress.css +1 -1
- package/dist/progress/progress.js +1 -16
- package/dist/progress/progress.module.js +1 -6
- package/dist/progress-bar/progress-bar.css +1 -1
- package/dist/progress-bar/progress-bar.js +1 -42
- package/dist/progress-bar/progress-bar.module.js +1 -11
- package/dist/progress-circle/progress-circle.js +1 -46
- package/dist/progress-circle/progress-circle.module.js +1 -9
- package/dist/progress-indicator/progress-indicator.css +1 -1
- package/dist/progress-indicator/progress-indicator.js +1 -34
- package/dist/progress-indicator/progress-indicator.module.js +1 -10
- package/dist/prose/prose.css +1 -1
- package/dist/prose/prose.js +1 -13
- package/dist/prose/prose.module.js +1 -3
- package/dist/pull-to-refresh/pull-to-refresh.js +1 -82
- package/dist/pull-to-refresh/pull-to-refresh.module.js +1 -9
- package/dist/qr-code/encode.js +1 -583
- package/dist/qr-code/qr-code.js +1 -41
- package/dist/qr-code/qr-code.module.js +1 -6
- package/dist/radial-progress/radial-progress.js +1 -27
- package/dist/radial-progress/radial-progress.module.js +1 -6
- package/dist/radio/radio.js +1 -49
- package/dist/radio/radio.module.js +1 -9
- package/dist/radio-card/radio-card.css +1 -1
- package/dist/radio-card/radio-card.js +1 -64
- package/dist/radio-card/radio-card.module.js +1 -11
- package/dist/rating-group/rating-group.js +1 -37
- package/dist/rating-group/rating-group.module.js +1 -6
- package/dist/react/src/index.js +1 -141
- package/dist/relative-time/relative-time.js +1 -66
- package/dist/relative-time/relative-time.module.js +1 -3
- package/dist/reorder-list/reorder-list.css +1 -1
- package/dist/reorder-list/reorder-list.js +1 -143
- package/dist/reorder-list/reorder-list.module.js +1 -11
- package/dist/resizable/resizable.js +1 -80
- package/dist/resizable/resizable.module.js +1 -8
- package/dist/scroll-area/scroll-area.css +1 -1
- package/dist/scroll-area/scroll-area.js +1 -38
- package/dist/scroll-area/scroll-area.module.js +1 -3
- package/dist/search/search.js +1 -96
- package/dist/search/search.module.js +1 -9
- package/dist/segmented-control/segmented-control.js +1 -43
- package/dist/segmented-control/segmented-control.module.js +1 -6
- package/dist/select/select.js +1 -73
- package/dist/select/select.module.js +1 -11
- package/dist/separator/separator.js +1 -19
- package/dist/separator/separator.module.js +1 -3
- package/dist/sheet/sheet.js +1 -49
- package/dist/sheet/sheet.module.js +1 -9
- package/dist/shell-header/shell-header.css +1 -1
- package/dist/shell-header/shell-header.js +1 -169
- package/dist/shell-header/shell-header.module.js +1 -24
- package/dist/side-nav/side-nav.css +1 -1
- package/dist/side-nav/side-nav.js +1 -334
- package/dist/side-nav/side-nav.module.js +1 -31
- package/dist/skeleton/skeleton.css +1 -1
- package/dist/skeleton/skeleton.js +1 -23
- package/dist/skeleton/skeleton.module.js +1 -7
- package/dist/skip-nav/skip-nav.js +1 -28
- package/dist/skip-nav/skip-nav.module.js +1 -3
- package/dist/slider/slider.js +1 -30
- package/dist/slider/slider.module.js +1 -7
- package/dist/spinner/spinner.css +1 -1
- package/dist/spinner/spinner.js +1 -18
- package/dist/spinner/spinner.module.js +1 -6
- package/dist/stack/stack.js +1 -17
- package/dist/stack/stack.module.js +1 -6
- package/dist/stat/stat.js +1 -41
- package/dist/stat/stat.module.js +1 -11
- package/dist/status/status.css +1 -1
- package/dist/status/status.js +1 -25
- package/dist/status/status.module.js +1 -7
- package/dist/steps/steps.css +1 -1
- package/dist/steps/steps.js +1 -35
- package/dist/steps/steps.module.js +1 -8
- package/dist/structured-list/structured-list.js +1 -102
- package/dist/structured-list/structured-list.module.js +1 -12
- package/dist/styles.css +401 -55
- package/dist/swap/swap.css +1 -1
- package/dist/swap/swap.js +1 -36
- package/dist/swap/swap.module.js +1 -7
- package/dist/swipe-item/swipe-item.js +1 -62
- package/dist/swipe-item/swipe-item.module.js +1 -12
- package/dist/switcher/switcher.js +1 -32
- package/dist/switcher/switcher.module.js +1 -8
- package/dist/tabs/tabs.js +1 -98
- package/dist/tabs/tabs.module.js +1 -8
- package/dist/tag/tag.js +1 -33
- package/dist/tag/tag.module.js +1 -6
- package/dist/tags-input/tags-input.js +1 -68
- package/dist/tags-input/tags-input.module.js +1 -8
- package/dist/text/text.css +1 -1
- package/dist/text/text.js +1 -16
- package/dist/text/text.module.js +1 -3
- package/dist/textarea/textarea.css +1 -1
- package/dist/textarea/textarea.js +1 -58
- package/dist/textarea/textarea.module.js +1 -9
- package/dist/tile/tile.css +1 -1
- package/dist/tile/tile.js +1 -39
- package/dist/tile/tile.module.js +1 -7
- package/dist/time-picker/time-picker.js +1 -64
- package/dist/time-picker/time-picker.module.js +1 -9
- package/dist/timeline/timeline.js +1 -55
- package/dist/timeline/timeline.module.js +1 -11
- package/dist/toast/toast.css +1 -1
- package/dist/toast/toast.js +1 -85
- package/dist/toast/toast.module.js +1 -11
- package/dist/toc/toc.css +1 -1
- package/dist/toc/toc.js +1 -43
- package/dist/toc/toc.module.js +1 -3
- package/dist/toc/use-toc-from-region.js +1 -18
- package/dist/toggle/toggle.js +1 -42
- package/dist/toggle/toggle.module.js +1 -8
- package/dist/toggle-group/toggle-group.js +1 -55
- package/dist/toggle-group/toggle-group.module.js +1 -6
- package/dist/toggletip/toggletip.js +1 -49
- package/dist/toggletip/toggletip.module.js +1 -7
- package/dist/tooltip/tooltip.css +1 -1
- package/dist/tooltip/tooltip.js +1 -58
- package/dist/tooltip/tooltip.module.js +1 -6
- package/dist/tree-view/tree-view.css +1 -1
- package/dist/tree-view/tree-view.js +1 -201
- package/dist/tree-view/tree-view.module.js +1 -13
- package/dist/user/user.js +1 -35
- package/dist/user/user.module.js +1 -9
- package/dist/virtual-list/virtual-list.js +1 -40
- package/dist/virtual-list/virtual-list.module.js +1 -7
- package/dist/visually-hidden/visually-hidden.js +1 -2
- package/dist/wheel-picker/wheel-picker.js +1 -84
- package/dist/wheel-picker/wheel-picker.module.js +1 -8
- package/package.json +4 -4
- package/readme.body.md +3 -2
|
@@ -1,92 +1 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import e from "./menu-button.module.js";
|
|
4
|
-
import { useId as t, useRef as n } from "react";
|
|
5
|
-
import { DismissableLayer as r, cn as i, focusElement as a, useAnchorPosition as o, useSignal as s, useSignalEffect as c, useSignals as l } from "@cascivo/core";
|
|
6
|
-
import { jsx as u, jsxs as d } from "react/jsx-runtime";
|
|
7
|
-
//#region ../components/src/menu-button/menu-button.tsx
|
|
8
|
-
function f(e, t) {
|
|
9
|
-
if (!e) return;
|
|
10
|
-
let n = e.querySelectorAll("[role=\"menuitem\"]:not([aria-disabled=\"true\"])");
|
|
11
|
-
n[t < 0 ? n.length - 1 : t % n.length]?.focus();
|
|
12
|
-
}
|
|
13
|
-
function p({ label: p, items: m, variant: h = "secondary", size: g = "md", disabled: _ = !1, align: v = "start", labels: y, className: b }) {
|
|
14
|
-
l();
|
|
15
|
-
let x = s(!1), S = n(null), C = n(null), w = t(), { anchorStyle: T, floatingStyle: E } = o({
|
|
16
|
-
anchorRef: S,
|
|
17
|
-
floatingRef: C,
|
|
18
|
-
placement: v === "end" ? "bottom-end" : "bottom-start",
|
|
19
|
-
enabled: x
|
|
20
|
-
});
|
|
21
|
-
c(() => {
|
|
22
|
-
x.value && f(C.current, 0);
|
|
23
|
-
});
|
|
24
|
-
function D(e) {
|
|
25
|
-
_ || (x.value = !0, queueMicrotask(() => f(C.current, e)));
|
|
26
|
-
}
|
|
27
|
-
function O(e) {
|
|
28
|
-
x.value = !1, e && a(S.current);
|
|
29
|
-
}
|
|
30
|
-
function k(e) {
|
|
31
|
-
e.key === "ArrowDown" || e.key === "Enter" || e.key === " " ? (e.preventDefault(), D(0)) : e.key === "ArrowUp" && (e.preventDefault(), D(-1));
|
|
32
|
-
}
|
|
33
|
-
function A(e) {
|
|
34
|
-
if (e.key === "ArrowDown") {
|
|
35
|
-
e.preventDefault();
|
|
36
|
-
let t = e.currentTarget.nextElementSibling;
|
|
37
|
-
t ? t.focus() : f(C.current, 0);
|
|
38
|
-
} else if (e.key === "ArrowUp") {
|
|
39
|
-
e.preventDefault();
|
|
40
|
-
let t = e.currentTarget.previousElementSibling;
|
|
41
|
-
t ? t.focus() : f(C.current, -1);
|
|
42
|
-
} else e.key === "Escape" ? (e.preventDefault(), O(!0)) : e.key === "Tab" && O(!1);
|
|
43
|
-
}
|
|
44
|
-
function j(e) {
|
|
45
|
-
e.disabled || (e.onSelect?.(), O(!0));
|
|
46
|
-
}
|
|
47
|
-
return /* @__PURE__ */ d("div", {
|
|
48
|
-
className: i(e.root, b),
|
|
49
|
-
children: [/* @__PURE__ */ u("button", {
|
|
50
|
-
ref: S,
|
|
51
|
-
type: "button",
|
|
52
|
-
className: e.trigger,
|
|
53
|
-
"data-variant": h,
|
|
54
|
-
"data-size": g,
|
|
55
|
-
disabled: _,
|
|
56
|
-
"aria-haspopup": "menu",
|
|
57
|
-
"aria-expanded": x.value,
|
|
58
|
-
"aria-controls": w,
|
|
59
|
-
...y?.open !== void 0 && { "aria-label": y.open },
|
|
60
|
-
style: T,
|
|
61
|
-
onClick: () => {
|
|
62
|
-
x.value ? O(!1) : D(0);
|
|
63
|
-
},
|
|
64
|
-
onKeyDown: k,
|
|
65
|
-
children: p
|
|
66
|
-
}), x.value ? /* @__PURE__ */ u(r, {
|
|
67
|
-
onDismiss: () => O(!0),
|
|
68
|
-
children: /* @__PURE__ */ u("div", {
|
|
69
|
-
ref: C,
|
|
70
|
-
id: w,
|
|
71
|
-
role: "menu",
|
|
72
|
-
"data-state": "open",
|
|
73
|
-
"data-align": v,
|
|
74
|
-
className: e.menu,
|
|
75
|
-
style: E,
|
|
76
|
-
children: m.map((t) => /* @__PURE__ */ u("div", {
|
|
77
|
-
role: "menuitem",
|
|
78
|
-
tabIndex: -1,
|
|
79
|
-
"aria-disabled": t.disabled,
|
|
80
|
-
className: e.item,
|
|
81
|
-
onClick: () => j(t),
|
|
82
|
-
onKeyDown: (e) => {
|
|
83
|
-
e.key === "Enter" || e.key === " " ? (e.preventDefault(), j(t)) : A(e);
|
|
84
|
-
},
|
|
85
|
-
children: t.label
|
|
86
|
-
}, t.id))
|
|
87
|
-
})
|
|
88
|
-
}) : null]
|
|
89
|
-
});
|
|
90
|
-
}
|
|
91
|
-
//#endregion
|
|
92
|
-
export { p as MenuButton };
|
|
1
|
+
"use client";import e from"./menu-button.module.js";import{useId as t,useRef as n}from"react";import{DismissableLayer as r,cn as i,focusElement as a,useAnchorPosition as o,useSignal as s,useSignalEffect as c,useSignals as l}from"@cascivo/core";import{jsx as u,jsxs as d}from"react/jsx-runtime";function focusItem(e,t){if(!e)return;let n=e.querySelectorAll(`[role="menuitem"]:not([aria-disabled="true"])`);n[t<0?n.length-1:t%n.length]?.focus()}function MenuButton({label:f,items:p,variant:m=`secondary`,size:h=`md`,disabled:g=!1,align:_=`start`,labels:v,className:y}){l();let b=s(!1),x=n(null),S=n(null),C=t(),{anchorStyle:w,floatingStyle:T}=o({anchorRef:x,floatingRef:S,placement:_===`end`?`bottom-end`:`bottom-start`,enabled:b});c(()=>{b.value&&focusItem(S.current,0)});function openMenu(e){g||(b.value=!0,queueMicrotask(()=>focusItem(S.current,e)))}function close(e){b.value=!1,e&&a(x.current)}function handleTriggerKeyDown(e){e.key===`ArrowDown`||e.key===`Enter`||e.key===` `?(e.preventDefault(),openMenu(0)):e.key===`ArrowUp`&&(e.preventDefault(),openMenu(-1))}function handleItemKeyDown(e){if(e.key===`ArrowDown`){e.preventDefault();let t=e.currentTarget.nextElementSibling;t?t.focus():focusItem(S.current,0)}else if(e.key===`ArrowUp`){e.preventDefault();let t=e.currentTarget.previousElementSibling;t?t.focus():focusItem(S.current,-1)}else e.key===`Escape`?(e.preventDefault(),close(!0)):e.key===`Tab`&&close(!1)}function select(e){e.disabled||(e.onSelect?.(),close(!0))}return d(`div`,{className:i(e.root,y),children:[u(`button`,{ref:x,type:`button`,className:e.trigger,"data-variant":m,"data-size":h,disabled:g,"aria-haspopup":`menu`,"aria-expanded":b.value,"aria-controls":C,...v?.open!==void 0&&{"aria-label":v.open},style:w,onClick:()=>{b.value?close(!1):openMenu(0)},onKeyDown:handleTriggerKeyDown,children:f}),b.value?u(r,{onDismiss:()=>close(!0),children:u(`div`,{ref:S,id:C,role:`menu`,"data-state":`open`,"data-align":_,className:e.menu,style:T,children:p.map(t=>u(`div`,{role:`menuitem`,tabIndex:-1,"aria-disabled":t.disabled,className:e.item,onClick:()=>select(t),onKeyDown:e=>{e.key===`Enter`||e.key===` `?(e.preventDefault(),select(t)):handleItemKeyDown(e)},children:t.label},t.id))})}):null]})}export{MenuButton};
|
|
@@ -1,9 +1,2 @@
|
|
|
1
1
|
import './menu-button.css';
|
|
2
|
-
var e
|
|
3
|
-
root: "_root_rzxsi_2",
|
|
4
|
-
trigger: "_trigger_rzxsi_7",
|
|
5
|
-
menu: "_menu_rzxsi_82",
|
|
6
|
-
item: "_item_rzxsi_104"
|
|
7
|
-
};
|
|
8
|
-
//#endregion
|
|
9
|
-
export { e as default };
|
|
2
|
+
var e={root:`_root_rzxsi_2`,trigger:`_trigger_rzxsi_7`,menu:`_menu_rzxsi_82`,item:`_item_rzxsi_104`};export{e as default};
|
package/dist/menubar/menubar.js
CHANGED
|
@@ -1,103 +1 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import e from "./menubar.module.js";
|
|
4
|
-
import { useId as t, useRef as n } from "react";
|
|
5
|
-
import { DismissableLayer as r, Presence as i, cn as a, focusElement as o, useAnchorPosition as s, useRovingFocus as c, useSignal as l, useSignals as u } from "@cascivo/core";
|
|
6
|
-
import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
|
|
7
|
-
//#region ../components/src/menubar/menubar.tsx
|
|
8
|
-
function m({ menus: n, ariaLabel: r, "aria-label": i, className: o }) {
|
|
9
|
-
u();
|
|
10
|
-
let s = t(), d = l(null), p = c({
|
|
11
|
-
orientation: "horizontal",
|
|
12
|
-
loop: !0
|
|
13
|
-
});
|
|
14
|
-
return /* @__PURE__ */ f("div", {
|
|
15
|
-
role: "menubar",
|
|
16
|
-
"aria-label": r ?? i,
|
|
17
|
-
className: a(e.menubar, o),
|
|
18
|
-
children: n.map((e, t) => /* @__PURE__ */ f(h, {
|
|
19
|
-
menu: e,
|
|
20
|
-
index: t,
|
|
21
|
-
baseId: s,
|
|
22
|
-
openId: d,
|
|
23
|
-
itemProps: p.getItemProps(t)
|
|
24
|
-
}, e.id))
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
function h({ menu: t, baseId: r, openId: a, itemProps: c }) {
|
|
28
|
-
u();
|
|
29
|
-
let l = n(null), m = n(null), h = a.value === t.id, _ = `${r}-menu-${t.id}`, { anchorStyle: v, floatingStyle: y } = s({
|
|
30
|
-
anchorRef: l,
|
|
31
|
-
floatingRef: m,
|
|
32
|
-
placement: "bottom-start",
|
|
33
|
-
enabled: h
|
|
34
|
-
}), b = () => {
|
|
35
|
-
(m.current?.querySelector("[role=\"menuitem\"]:not([aria-disabled=\"true\"])"))?.focus();
|
|
36
|
-
}, x = (e) => {
|
|
37
|
-
c.onKeyDown(e), !e.defaultPrevented && (e.key === "ArrowDown" || e.key === "Enter" || e.key === " " ? (e.preventDefault(), a.value = t.id, requestAnimationFrame(b)) : e.key === "Escape" && (a.value = null));
|
|
38
|
-
}, { ref: S, onKeyDown: C, ...w } = c;
|
|
39
|
-
return /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f("button", {
|
|
40
|
-
ref: (e) => {
|
|
41
|
-
l.current = e, S(e);
|
|
42
|
-
},
|
|
43
|
-
type: "button",
|
|
44
|
-
role: "menuitem",
|
|
45
|
-
"aria-haspopup": "menu",
|
|
46
|
-
"aria-expanded": h,
|
|
47
|
-
"aria-controls": _,
|
|
48
|
-
"data-state": h ? "open" : "closed",
|
|
49
|
-
className: e.trigger,
|
|
50
|
-
style: v,
|
|
51
|
-
onClick: () => {
|
|
52
|
-
a.value = h ? null : t.id;
|
|
53
|
-
},
|
|
54
|
-
onKeyDown: x,
|
|
55
|
-
...w,
|
|
56
|
-
children: t.label
|
|
57
|
-
}), /* @__PURE__ */ f(i, {
|
|
58
|
-
present: h,
|
|
59
|
-
children: /* @__PURE__ */ f(g, {
|
|
60
|
-
menu: t,
|
|
61
|
-
menuId: _,
|
|
62
|
-
floatingRef: m,
|
|
63
|
-
floatingStyle: y,
|
|
64
|
-
onClose: () => {
|
|
65
|
-
a.value = null, o(l.current);
|
|
66
|
-
}
|
|
67
|
-
})
|
|
68
|
-
})] });
|
|
69
|
-
}
|
|
70
|
-
function g({ menu: t, menuId: n, floatingRef: i, floatingStyle: a, onClose: o }) {
|
|
71
|
-
let s = (e) => {
|
|
72
|
-
let t = Array.from(i.current?.querySelectorAll("[role=\"menuitem\"]:not([aria-disabled=\"true\"])") ?? []);
|
|
73
|
-
if (t.length === 0) return;
|
|
74
|
-
let n = t.indexOf(e.currentTarget);
|
|
75
|
-
e.key === "ArrowDown" ? (e.preventDefault(), t[(n + 1) % t.length]?.focus()) : e.key === "ArrowUp" ? (e.preventDefault(), t[(n - 1 + t.length) % t.length]?.focus()) : e.key === "Home" ? (e.preventDefault(), t[0]?.focus()) : e.key === "End" && (e.preventDefault(), t[t.length - 1]?.focus());
|
|
76
|
-
};
|
|
77
|
-
return /* @__PURE__ */ f(r, {
|
|
78
|
-
onDismiss: o,
|
|
79
|
-
children: /* @__PURE__ */ f("div", {
|
|
80
|
-
ref: i,
|
|
81
|
-
id: n,
|
|
82
|
-
role: "menu",
|
|
83
|
-
"aria-label": typeof t.label == "string" ? t.label : void 0,
|
|
84
|
-
className: e.panel,
|
|
85
|
-
style: a,
|
|
86
|
-
children: t.items.map((t) => /* @__PURE__ */ f("div", {
|
|
87
|
-
role: "menuitem",
|
|
88
|
-
tabIndex: -1,
|
|
89
|
-
"aria-disabled": t.disabled,
|
|
90
|
-
className: e.item,
|
|
91
|
-
onClick: () => {
|
|
92
|
-
t.disabled || (t.onSelect?.(), o());
|
|
93
|
-
},
|
|
94
|
-
onKeyDown: (e) => {
|
|
95
|
-
t.disabled || (e.key === "Enter" || e.key === " " ? (e.preventDefault(), t.onSelect?.(), o()) : s(e));
|
|
96
|
-
},
|
|
97
|
-
children: t.label
|
|
98
|
-
}, t.id))
|
|
99
|
-
})
|
|
100
|
-
});
|
|
101
|
-
}
|
|
102
|
-
//#endregion
|
|
103
|
-
export { m as Menubar };
|
|
1
|
+
"use client";import e from"./menubar.module.js";import{useId as t,useRef as n}from"react";import{DismissableLayer as r,Presence as i,cn as a,focusElement as o,useAnchorPosition as s,useRovingFocus as c,useSignal as l,useSignals as u}from"@cascivo/core";import{Fragment as d,jsx as f,jsxs as p}from"react/jsx-runtime";function Menubar({menus:n,ariaLabel:r,"aria-label":i,className:o}){u();let s=t(),d=l(null),p=c({orientation:`horizontal`,loop:!0});return f(`div`,{role:`menubar`,"aria-label":r??i,className:a(e.menubar,o),children:n.map((e,t)=>f(MenubarTrigger,{menu:e,index:t,baseId:s,openId:d,itemProps:p.getItemProps(t)},e.id))})}function MenubarTrigger({menu:t,baseId:r,openId:a,itemProps:c}){u();let l=n(null),m=n(null),h=a.value===t.id,g=`${r}-menu-${t.id}`,{anchorStyle:_,floatingStyle:v}=s({anchorRef:l,floatingRef:m,placement:`bottom-start`,enabled:h}),focusFirstItem=()=>{(m.current?.querySelector(`[role="menuitem"]:not([aria-disabled="true"])`))?.focus()},handleKeyDown=e=>{c.onKeyDown(e),!e.defaultPrevented&&(e.key===`ArrowDown`||e.key===`Enter`||e.key===` `?(e.preventDefault(),a.value=t.id,requestAnimationFrame(focusFirstItem)):e.key===`Escape`&&(a.value=null))},{ref:y,onKeyDown:b,...x}=c;return p(d,{children:[f(`button`,{ref:e=>{l.current=e,y(e)},type:`button`,role:`menuitem`,"aria-haspopup":`menu`,"aria-expanded":h,"aria-controls":g,"data-state":h?`open`:`closed`,className:e.trigger,style:_,onClick:()=>{a.value=h?null:t.id},onKeyDown:handleKeyDown,...x,children:t.label}),f(i,{present:h,children:f(MenubarPanel,{menu:t,menuId:g,floatingRef:m,floatingStyle:v,onClose:()=>{a.value=null,o(l.current)}})})]})}function MenubarPanel({menu:t,menuId:n,floatingRef:i,floatingStyle:a,onClose:o}){let handleItemKeyDown=e=>{let t=Array.from(i.current?.querySelectorAll(`[role="menuitem"]:not([aria-disabled="true"])`)??[]);if(t.length===0)return;let n=t.indexOf(e.currentTarget);e.key===`ArrowDown`?(e.preventDefault(),t[(n+1)%t.length]?.focus()):e.key===`ArrowUp`?(e.preventDefault(),t[(n-1+t.length)%t.length]?.focus()):e.key===`Home`?(e.preventDefault(),t[0]?.focus()):e.key===`End`&&(e.preventDefault(),t[t.length-1]?.focus())};return f(r,{onDismiss:o,children:f(`div`,{ref:i,id:n,role:`menu`,"aria-label":typeof t.label==`string`?t.label:void 0,className:e.panel,style:a,children:t.items.map(t=>f(`div`,{role:`menuitem`,tabIndex:-1,"aria-disabled":t.disabled,className:e.item,onClick:()=>{t.disabled||(t.onSelect?.(),o())},onKeyDown:e=>{t.disabled||(e.key===`Enter`||e.key===` `?(e.preventDefault(),t.onSelect?.(),o()):handleItemKeyDown(e))},children:t.label},t.id))})})}export{Menubar};
|
|
@@ -1,9 +1,2 @@
|
|
|
1
1
|
import './menubar.css';
|
|
2
|
-
var e
|
|
3
|
-
menubar: "_menubar_1fs00_2",
|
|
4
|
-
trigger: "_trigger_1fs00_12",
|
|
5
|
-
panel: "_panel_1fs00_35",
|
|
6
|
-
item: "_item_1fs00_66"
|
|
7
|
-
};
|
|
8
|
-
//#endregion
|
|
9
|
-
export { e as default };
|
|
2
|
+
var e={menubar:`_menubar_1fs00_2`,trigger:`_trigger_1fs00_12`,panel:`_panel_1fs00_35`,item:`_item_1fs00_66`};export{e as default};
|
package/dist/modal/modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer cascivo.component{.
|
|
1
|
+
@layer cascivo.component{._dialog_flqt0_2{border-radius:var(--cascivo-radius-overlay);max-height:calc(100dvh - var(--cascivo-space-16));opacity:0;transition:opacity var(--cascivo-motion-exit), scale var(--cascivo-motion-exit), display var(--cascivo-duration-150) allow-discrete, overlay var(--cascivo-duration-150) allow-discrete;background:0 0;border:none;padding:0;overflow:visible;scale:.96}._dialog_flqt0_2[open]{opacity:1;transition:opacity var(--cascivo-motion-enter), scale var(--cascivo-motion-enter), display var(--cascivo-duration-200) allow-discrete, overlay var(--cascivo-duration-200) allow-discrete;scale:1}@starting-style{._dialog_flqt0_2[open]{opacity:0;scale:.96}}._dialog_flqt0_2::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity var(--cascivo-motion-exit), display var(--cascivo-duration-150) allow-discrete, overlay var(--cascivo-duration-150) allow-discrete;background-color:#00000080}._dialog_flqt0_2[open]::backdrop{opacity:1;transition:opacity var(--cascivo-motion-enter), display var(--cascivo-duration-200) allow-discrete, overlay var(--cascivo-duration-200) allow-discrete}@starting-style{._dialog_flqt0_2[open]::backdrop{opacity:0}}._dialog_flqt0_2[data-size=sm]{--_modal-width:24rem}._dialog_flqt0_2[data-size=md]{--_modal-width:32rem}._dialog_flqt0_2[data-size=lg]{--_modal-width:48rem}._panel_flqt0_69{width:var(--_modal-width,32rem);max-width:calc(100vw - var(--cascivo-space-8));background-color:var(--cascivo-color-surface-overlay);border-radius:var(--cascivo-radius-overlay);border:1px solid var(--cascivo-color-border);box-shadow:var(--cascivo-shadow-overlay);overflow:hidden}._header_flqt0_79{padding:var(--cascivo-space-6);border-block-end:1px solid var(--cascivo-color-border);justify-content:space-between;align-items:center;padding-block-end:var(--cascivo-space-4);display:flex}._dialog_flqt0_2[data-draggable]{translate:var(--modal-x,0) var(--modal-y,0)}._dialog_flqt0_2[data-draggable] ._header_flqt0_79{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}._dialog_flqt0_2[data-draggable] ._header_flqt0_79:active{cursor:grabbing}._title_flqt0_101{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-lg);font-weight:var(--cascivo-font-semibold);color:var(--cascivo-color-text);line-height:var(--cascivo-leading-tight);margin:0}._close_flqt0_110{width:2rem;height:2rem;font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text-muted);border-radius:var(--cascivo-radius-control);cursor:pointer;transition:color var(--cascivo-duration-150) var(--cascivo-ease-out), background-color var(--cascivo-duration-150) var(--cascivo-ease-out);background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex}._close_flqt0_110:hover{color:var(--cascivo-color-text);background-color:var(--cascivo-color-bg-subtle)}._close_flqt0_110:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}._description_flqt0_138{padding-inline:var(--cascivo-space-6);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text-subtle);line-height:var(--cascivo-leading-relaxed);margin:0;padding-block-start:var(--cascivo-space-4)}._body_flqt0_148{gap:var(--cascivo-dialog-body-gap,var(--cascivo-space-5));padding:var(--cascivo-space-6);flex-direction:column;display:flex}._footer_flqt0_166{justify-content:flex-end;gap:var(--cascivo-space-2);padding:var(--cascivo-space-4) var(--cascivo-space-6);border-block-start:1px solid var(--cascivo-color-border);flex-wrap:wrap;display:flex}@media (width<=40rem){._dialog_flqt0_2{max-block-size:90dvh;margin:0}._panel_flqt0_69{max-block-size:90dvh;inline-size:100%;max-inline-size:100%;border-start-start-radius:var(--cascivo-radius-overlay);border-start-end-radius:var(--cascivo-radius-overlay);border-end-end-radius:0;border-end-start-radius:0;padding-block-end:env(safe-area-inset-bottom,0);overflow-y:auto}}@media (prefers-reduced-motion:reduce){._dialog_flqt0_2,._dialog_flqt0_2[open]{transition:none}}}@media (forced-colors:active){._panel_flqt0_69{border:1px solid buttontext}._close_flqt0_110:focus-visible{outline-offset:2px;outline:2px solid highlight}}
|
package/dist/modal/modal.js
CHANGED
|
@@ -1,76 +1 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import e from "./modal.module.js";
|
|
4
|
-
import { useRef as t } from "react";
|
|
5
|
-
import { cn as n, useDraggable as r, useEffectPropSignal as i, useId as a, useSignalEffect as o, useSignals as s } from "@cascivo/core";
|
|
6
|
-
import { builtin as c, t as l } from "@cascivo/i18n";
|
|
7
|
-
import { jsx as u, jsxs as d } from "react/jsx-runtime";
|
|
8
|
-
//#region ../components/src/modal/modal.tsx
|
|
9
|
-
function f({ open: f = !1, onClose: p, title: m, description: h, children: g, footer: _, className: v, size: y = "md", draggable: b = !1 }) {
|
|
10
|
-
s();
|
|
11
|
-
let x = t(null), S = t(p);
|
|
12
|
-
S.current = p;
|
|
13
|
-
let C = a("cascivo-modal-title"), w = a("cascivo-modal-desc"), { handleRef: T, offset: E } = r({ isDisabled: !b }), D = b ? {
|
|
14
|
-
"--modal-x": `${E.value.x}px`,
|
|
15
|
-
"--modal-y": `${E.value.y}px`
|
|
16
|
-
} : void 0, O = i(f);
|
|
17
|
-
return o(() => {
|
|
18
|
-
let e = x.current;
|
|
19
|
-
e && (O.value ? e.open || e.showModal() : e.open && e.close());
|
|
20
|
-
}), o(() => {
|
|
21
|
-
let e = x.current;
|
|
22
|
-
if (!e) return;
|
|
23
|
-
let t = () => S.current?.();
|
|
24
|
-
return e.addEventListener("close", t), () => e.removeEventListener("close", t);
|
|
25
|
-
}), /* @__PURE__ */ u("dialog", {
|
|
26
|
-
ref: x,
|
|
27
|
-
"data-size": y,
|
|
28
|
-
"data-draggable": b || void 0,
|
|
29
|
-
className: n(e.dialog, v),
|
|
30
|
-
style: D,
|
|
31
|
-
onClick: (e) => {
|
|
32
|
-
e.target === x.current && x.current?.close();
|
|
33
|
-
},
|
|
34
|
-
"aria-labelledby": m ? C : void 0,
|
|
35
|
-
"aria-describedby": h ? w : void 0,
|
|
36
|
-
children: /* @__PURE__ */ d("div", {
|
|
37
|
-
className: e.panel,
|
|
38
|
-
children: [
|
|
39
|
-
(m || p) && /* @__PURE__ */ d("div", {
|
|
40
|
-
className: e.header,
|
|
41
|
-
ref: b ? (e) => {
|
|
42
|
-
T.current = e;
|
|
43
|
-
} : void 0,
|
|
44
|
-
children: [m && /* @__PURE__ */ u("h2", {
|
|
45
|
-
id: C,
|
|
46
|
-
className: e.title,
|
|
47
|
-
children: m
|
|
48
|
-
}), p && /* @__PURE__ */ u("button", {
|
|
49
|
-
type: "button",
|
|
50
|
-
className: e.close,
|
|
51
|
-
onClick: () => x.current?.close(),
|
|
52
|
-
"aria-label": l(c.modal.close),
|
|
53
|
-
children: "✕"
|
|
54
|
-
})]
|
|
55
|
-
}),
|
|
56
|
-
h && /* @__PURE__ */ u("p", {
|
|
57
|
-
id: w,
|
|
58
|
-
className: e.description,
|
|
59
|
-
children: h
|
|
60
|
-
}),
|
|
61
|
-
/* @__PURE__ */ u("div", {
|
|
62
|
-
className: e.body,
|
|
63
|
-
"data-cascivo-modal-body": "",
|
|
64
|
-
children: g
|
|
65
|
-
}),
|
|
66
|
-
_ && /* @__PURE__ */ u("div", {
|
|
67
|
-
className: e.footer,
|
|
68
|
-
"data-cascivo-modal-footer": "",
|
|
69
|
-
children: _
|
|
70
|
-
})
|
|
71
|
-
]
|
|
72
|
-
})
|
|
73
|
-
});
|
|
74
|
-
}
|
|
75
|
-
//#endregion
|
|
76
|
-
export { f as Modal };
|
|
1
|
+
"use client";import e from"./modal.module.js";import{useRef as t}from"react";import{cn as n,useDraggable as r,useEffectPropSignal as i,useId as a,useSignalEffect as o,useSignals as s}from"@cascivo/core";import{builtin as c,t as l}from"@cascivo/i18n";import{jsx as u,jsxs as d}from"react/jsx-runtime";function Modal({open:f=!1,onClose:p,title:m,description:h,children:g,footer:_,className:v,size:y=`md`,draggable:b=!1}){s();let x=t(null),S=t(p);S.current=p;let C=a(`cascivo-modal-title`),w=a(`cascivo-modal-desc`),{handleRef:T,offset:E}=r({isDisabled:!b}),D=b?{"--modal-x":`${E.value.x}px`,"--modal-y":`${E.value.y}px`}:void 0,O=i(f);return o(()=>{let e=x.current;e&&(O.value?e.open||e.showModal():e.open&&e.close())}),o(()=>{let e=x.current;if(!e)return;let handler=()=>S.current?.();return e.addEventListener(`close`,handler),()=>e.removeEventListener(`close`,handler)}),u(`dialog`,{ref:x,"data-size":y,"data-draggable":b||void 0,className:n(e.dialog,v),style:D,onClick:e=>{e.target===x.current&&x.current?.close()},"aria-labelledby":m?C:void 0,"aria-describedby":h?w:void 0,children:d(`div`,{className:e.panel,children:[(m||p)&&d(`div`,{className:e.header,ref:b?e=>{T.current=e}:void 0,children:[m&&u(`h2`,{id:C,className:e.title,children:m}),p&&u(`button`,{type:`button`,className:e.close,onClick:()=>x.current?.close(),"aria-label":l(c.modal.close),children:`✕`})]}),h&&u(`p`,{id:w,className:e.description,children:h}),u(`div`,{className:e.body,"data-cascivo-modal-body":``,children:g}),_&&u(`div`,{className:e.footer,"data-cascivo-modal-footer":``,children:_})]})})}export{Modal};
|
|
@@ -1,13 +1,2 @@
|
|
|
1
1
|
import './modal.css';
|
|
2
|
-
var e
|
|
3
|
-
dialog: "_dialog_hywey_2",
|
|
4
|
-
panel: "_panel_hywey_69",
|
|
5
|
-
header: "_header_hywey_79",
|
|
6
|
-
title: "_title_hywey_101",
|
|
7
|
-
close: "_close_hywey_110",
|
|
8
|
-
description: "_description_hywey_138",
|
|
9
|
-
body: "_body_hywey_148",
|
|
10
|
-
footer: "_footer_hywey_166"
|
|
11
|
-
};
|
|
12
|
-
//#endregion
|
|
13
|
-
export { e as default };
|
|
2
|
+
var e={dialog:`_dialog_flqt0_2`,panel:`_panel_flqt0_69`,header:`_header_flqt0_79`,title:`_title_flqt0_101`,close:`_close_flqt0_110`,description:`_description_flqt0_138`,body:`_body_flqt0_148`,footer:`_footer_flqt0_166`};export{e as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
function enabledIndexes(e){let t=[];return e.forEach((e,n)=>{e.disabled||t.push(n)}),t}function moveActive(e,t,n){let r=enabledIndexes(n);if(r.length===0)return-1;let i=r.indexOf(e);return i===-1?t>0?r[0]:r[r.length-1]:r[(i+t+r.length)%r.length]}function firstActive(e){return enabledIndexes(e)[0]??-1}function lastActive(e){let t=enabledIndexes(e);return t[t.length-1]??-1}function pageActive(e,t,n){let r=enabledIndexes(n);if(r.length===0)return-1;let i=r.indexOf(e),a=i===-1?t>0?-1:r.length:i;return r[Math.min(Math.max(a+t*10,0),r.length-1)]}function clampActive(e,t){return e>=0&&e<t.length&&!t[e]?.disabled?e:firstActive(t)}export{clampActive,firstActive,lastActive,moveActive,pageActive};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer cascivo.component{._wrapper_o9vhb_2{min-inline-size:0;width:100%;display:inline-block;position:relative}._trigger_o9vhb_12{width:100%;height:2.5rem;padding-inline:var(--cascivo-space-4);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);cursor:pointer;text-align:start;transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out);justify-content:space-between;align-items:center;display:flex}._trigger_o9vhb_12:hover:not(:disabled){border-color:var(--cascivo-color-border-strong)}._trigger_o9vhb_12:focus-visible{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring);outline:none}._trigger_o9vhb_12:disabled{opacity:.5;cursor:not-allowed;background-color:var(--cascivo-color-bg-subtle)}._trigger_o9vhb_12[aria-expanded=true]{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._trigger-label_o9vhb_51{text-overflow:ellipsis;white-space:nowrap;color:var(--cascivo-color-text-muted);overflow:hidden}._chevron_o9vhb_63{width:1rem;height:1rem;background-color:var(--cascivo-color-text-muted);transition:transform var(--cascivo-duration-150) var(--cascivo-ease-out);flex-shrink:0;margin-inline-start:var(--cascivo-space-2);display:block;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}._trigger_o9vhb_12[aria-expanded=true] ._chevron_o9vhb_63{transform:rotate(180deg)}._panel_o9vhb_83{position-area:block-end span-inline-end;position-try-fallbacks:--bottom-start, block-start span-inline-end;padding:var(--cascivo-space-1);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-overlay);min-width:12rem;max-height:16rem;box-shadow:var(--cascivo-shadow-md);opacity:0;transition:opacity var(--cascivo-motion-enter), translate var(--cascivo-motion-enter), display var(--cascivo-motion-enter) allow-discrete, overlay var(--cascivo-motion-enter) allow-discrete;flex-direction:column;margin-block-start:var(--cascivo-space-1);overflow:hidden;translate:0 -.25rem}._panel_o9vhb_83:popover-open{opacity:1;display:flex;translate:0}@starting-style{._panel_o9vhb_83:popover-open{opacity:0;translate:0 -.25rem}}._search-row_o9vhb_128{padding-block-end:var(--cascivo-space-1)}._search_o9vhb_128{width:100%;height:2rem;padding-inline:var(--cascivo-space-3);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text);background-color:var(--cascivo-color-bg-subtle);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);outline:none}._search_o9vhb_128:focus{border-color:var(--cascivo-color-accent)}._options_o9vhb_149{flex:1;overflow-y:auto}._option_o9vhb_149{align-items:center;gap:var(--cascivo-space-2);padding-block:var(--cascivo-space-2);padding-inline:var(--cascivo-space-2);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text);border-radius:var(--cascivo-radius-item);cursor:pointer;-webkit-user-select:none;user-select:none;display:flex}._option_o9vhb_149[data-active]{background-color:var(--cascivo-color-bg-subtle)}._option_o9vhb_149[data-disabled]{opacity:.5;cursor:not-allowed}._checkbox_o9vhb_177{border:1.5px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-indicator);background-color:var(--cascivo-color-surface);width:1rem;height:1rem;transition:background-color var(--cascivo-duration-100) var(--cascivo-ease-out);flex-shrink:0}._option_o9vhb_149[data-selected] ._checkbox_o9vhb_177{background-color:var(--cascivo-color-accent);border-color:var(--cascivo-color-accent)}._no-results_o9vhb_192{padding-block:var(--cascivo-space-3);padding-inline:var(--cascivo-space-2);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text-muted);text-align:center}}
|
|
1
|
+
@layer cascivo.component{._wrapper_1vodk_2{gap:var(--cascivo-space-1);flex-direction:column;inline-size:100%;min-inline-size:0;display:flex;position:relative}._label_1vodk_14{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);font-weight:var(--cascivo-font-medium);color:var(--cascivo-color-text)}._field_1vodk_21{align-items:center;min-inline-size:0;display:flex;position:relative}._field_1vodk_21[data-display=chips]{gap:var(--cascivo-space-1);padding:var(--cascivo-space-1);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);flex-wrap:wrap}._field_1vodk_21[data-display=chips] ._trigger_1vodk_37{min-block-size:1.75rem;padding-inline:var(--cascivo-space-2);box-shadow:none;background:0 0;border:none;flex:6rem}._trigger_1vodk_37{min-block-size:2.5rem;inline-size:100%;padding-inline:var(--cascivo-space-4);padding-block:var(--cascivo-space-1);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);cursor:pointer;text-align:start;transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out);justify-content:space-between;align-items:center;display:flex}._wrapper_1vodk_2[data-size=sm] ._trigger_1vodk_37{min-block-size:2rem;padding-inline:var(--cascivo-space-3);font-size:var(--cascivo-text-xs)}._wrapper_1vodk_2[data-size=lg] ._trigger_1vodk_37{min-block-size:3rem;font-size:var(--cascivo-text-base)}._trigger_1vodk_37:hover:not(:disabled){border-color:var(--cascivo-color-border-strong)}._trigger_1vodk_37:focus-visible{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring);outline:none}._trigger_1vodk_37:disabled{opacity:.5;cursor:not-allowed;background-color:var(--cascivo-color-bg-subtle)}._trigger_1vodk_37[aria-expanded=true]{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._wrapper_1vodk_2[data-state=error] ._trigger_1vodk_37{border-color:var(--cascivo-color-destructive)}._trigger-label_1vodk_103{text-overflow:ellipsis;white-space:nowrap;color:var(--cascivo-color-text);overflow:hidden}._trigger-label_1vodk_103[data-empty]{color:var(--cascivo-color-text-muted)}._chip_1vodk_116{align-items:center;gap:var(--cascivo-space-1);max-inline-size:12rem;padding-inline:var(--cascivo-space-2);font-size:var(--cascivo-text-xs);color:var(--cascivo-color-text);background-color:var(--cascivo-color-bg-subtle);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-indicator);padding-block:.125rem;display:inline-flex}._chip-label_1vodk_130{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._chip-remove_1vodk_136{cursor:pointer;background-color:var(--cascivo-color-text-muted);border:none;flex-shrink:0;block-size:.75rem;inline-size:.75rem;padding:0;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}._chip-remove_1vodk_136:hover{background-color:var(--cascivo-color-text)}._chip-remove_1vodk_136:focus-visible{outline:2px solid var(--cascivo-color-accent);outline-offset:2px}._clear_1vodk_161{border-radius:var(--cascivo-radius-indicator);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;min-block-size:1.5rem;min-inline-size:1.5rem;padding:0;display:inline-flex;position:absolute;inset-inline-end:var(--cascivo-space-8)}._clear_1vodk_161:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}._clear-glyph_1vodk_181{background-color:var(--cascivo-color-text-muted);block-size:.75rem;inline-size:.75rem;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}._chevron_1vodk_193{block-size:1rem;inline-size:1rem;background-color:var(--cascivo-color-text-muted);transition:rotate var(--cascivo-duration-150) var(--cascivo-ease-out);flex-shrink:0;margin-inline-start:var(--cascivo-space-2);display:block;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}._trigger_1vodk_37[aria-expanded=true] ._chevron_1vodk_193{rotate:180deg}@supports (anchor-name:--a){._panel_1vodk_213{position-area:block-end span-inline-end;position-try-fallbacks:--bottom-start, block-start span-inline-end}}._panel_1vodk_213{padding:var(--cascivo-space-1);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-overlay);max-block-size:20rem;min-inline-size:12rem;box-shadow:var(--cascivo-shadow-md);opacity:0;transition:opacity var(--cascivo-motion-enter), translate var(--cascivo-motion-enter), display var(--cascivo-motion-enter) allow-discrete, overlay var(--cascivo-motion-enter) allow-discrete;flex-direction:column;margin-block-start:var(--cascivo-space-1);overflow:hidden;translate:0 -.25rem}._panel_1vodk_213:popover-open{opacity:1;display:flex;translate:0}@starting-style{._panel_1vodk_213:popover-open{opacity:0;translate:0 -.25rem}}._search-row_1vodk_266{padding-block-end:var(--cascivo-space-1)}._search_1vodk_266{min-block-size:2rem;inline-size:100%;padding-inline:var(--cascivo-space-3);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text);background-color:var(--cascivo-color-bg-subtle);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);outline:none}._search_1vodk_266:focus{border-color:var(--cascivo-color-accent)}._select-all_1vodk_287{inline-size:100%;padding-block:var(--cascivo-space-2);padding-inline:var(--cascivo-space-2);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-xs);font-weight:var(--cascivo-font-medium);color:var(--cascivo-color-accent);border:none;border-block-end:1px solid var(--cascivo-color-border);cursor:pointer;text-align:start;background:0 0;border-radius:0}._select-all_1vodk_287:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}._options_1vodk_308{flex:1;overflow-y:auto}._options_1vodk_308:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}._group_1vodk_318{display:block}._group-label_1vodk_322{padding-block:var(--cascivo-space-1);padding-inline:var(--cascivo-space-2);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-xs);font-weight:var(--cascivo-font-medium);color:var(--cascivo-color-text-muted);text-transform:uppercase;letter-spacing:.04em;display:block}._option_1vodk_308{align-items:center;gap:var(--cascivo-space-2);padding-block:var(--cascivo-space-2);padding-inline:var(--cascivo-space-2);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text);border-radius:var(--cascivo-radius-item);cursor:pointer;-webkit-user-select:none;user-select:none;display:flex}._option_1vodk_308[data-active]{background-color:var(--cascivo-color-bg-subtle);outline:1px solid var(--cascivo-color-border-strong);outline-offset:-1px}._option_1vodk_308[data-disabled]{opacity:.5;cursor:not-allowed}._option-label_1vodk_360{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;overflow:hidden}._match_1vodk_367{color:inherit;font-weight:var(--cascivo-font-bold);background:0 0;text-decoration:underline}._create_1vodk_374{color:var(--cascivo-color-accent);font-weight:var(--cascivo-font-medium)}._checkbox_1vodk_379{border:1.5px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-indicator);background-color:var(--cascivo-color-surface);block-size:1rem;inline-size:1rem;transition:background-color var(--cascivo-duration-100) var(--cascivo-ease-out);flex-shrink:0}._option_1vodk_308[data-selected] ._checkbox_1vodk_379{background-color:var(--cascivo-color-accent);border-color:var(--cascivo-color-accent);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='m5 13 4 4L19 7'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:.75rem;-webkit-mask-image:none;mask-image:none}._status_1vodk_402{padding-block:var(--cascivo-space-3);padding-inline:var(--cascivo-space-2);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text-muted);text-align:center}._error_1vodk_411,._hint_1vodk_412{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-xs)}._error_1vodk_411{color:var(--cascivo-color-destructive)}._hint_1vodk_412{color:var(--cascivo-color-text-muted)}._sr-only_1vodk_425{clip-path:inset(50%);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (pointer:coarse){._trigger_1vodk_37,._search_1vodk_266,._wrapper_1vodk_2[data-size=sm] ._trigger_1vodk_37{min-block-size:var(--cascivo-target-min-coarse,2.75rem)}._clear_1vodk_161,._chip-remove_1vodk_136{min-inline-size:var(--cascivo-target-min-coarse,2.75rem);min-block-size:var(--cascivo-target-min-coarse,2.75rem)}._option_1vodk_308,._select-all_1vodk_287{min-block-size:var(--cascivo-target-min-coarse,2.75rem)}}}@media (forced-colors:active){._option_1vodk_308[data-selected] ._checkbox_1vodk_379{forced-color-adjust:none;background-color:highlight;border-color:highlight}._option_1vodk_308[data-active]{outline-offset:-2px;outline:2px solid highlight}._option_1vodk_308[data-disabled]{color:graytext}._trigger_1vodk_37:focus-visible,._search_1vodk_266:focus,._options_1vodk_308:focus-visible,._select-all_1vodk_287:focus-visible,._clear_1vodk_161:focus-visible{outline-offset:1px;outline:2px solid highlight}._panel_1vodk_213{border:1px solid canvastext}}@media (prefers-reduced-motion:reduce){._panel_1vodk_213,._chevron_1vodk_193,._checkbox_1vodk_379{transition-duration:1ms}}
|
|
@@ -1,106 +1 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import { usePopover as e } from "../popover/use-popover.js";
|
|
4
|
-
import t from "./multi-select.module.js";
|
|
5
|
-
import { useRef as n } from "react";
|
|
6
|
-
import { cn as r, focusElement as i, useComputed as a, useSignal as o, useSignalEffect as s, useSignals as c } from "@cascivo/core";
|
|
7
|
-
import { builtin as l, t as u } from "@cascivo/i18n";
|
|
8
|
-
import { jsx as d, jsxs as f } from "react/jsx-runtime";
|
|
9
|
-
//#region ../components/src/multi-select/multi-select.tsx
|
|
10
|
-
function p({ options: p, value: m, onValueChange: h, placeholder: g, disabled: _ = !1, labels: v, className: y, ...b }) {
|
|
11
|
-
c();
|
|
12
|
-
let x = e({ placement: "bottom" }), S = o(""), C = o(-1), w = n(null), T = n(null), E = a(() => {
|
|
13
|
-
let e = S.value.toLowerCase();
|
|
14
|
-
return e ? p.filter((t) => t.label.toLowerCase().includes(e)) : p;
|
|
15
|
-
});
|
|
16
|
-
s(() => {
|
|
17
|
-
x.isOpen.value ? (C.value = -1, setTimeout(() => i(T.current), 0)) : S.value = "";
|
|
18
|
-
}), s(() => {
|
|
19
|
-
let e = w.current;
|
|
20
|
-
if (!e || !x.isOpen.value) return;
|
|
21
|
-
let t = (e) => {
|
|
22
|
-
let t = E.value;
|
|
23
|
-
if (e.key === "ArrowDown") e.preventDefault(), C.value = Math.min(C.value + 1, t.length - 1);
|
|
24
|
-
else if (e.key === "ArrowUp") e.preventDefault(), C.value = Math.max(C.value - 1, -1);
|
|
25
|
-
else if (e.key === " " || e.key === "Enter") {
|
|
26
|
-
let n = t[C.value];
|
|
27
|
-
n && !n.disabled && (e.preventDefault(), D(n.value));
|
|
28
|
-
} else e.key === "Escape" && x.close();
|
|
29
|
-
};
|
|
30
|
-
return e.addEventListener("keydown", t), () => e.removeEventListener("keydown", t);
|
|
31
|
-
});
|
|
32
|
-
function D(e) {
|
|
33
|
-
m.includes(e) ? h(m.filter((t) => t !== e)) : h([...m, e]);
|
|
34
|
-
}
|
|
35
|
-
let O = m.length === 0 ? g ?? v?.placeholder ?? u(l.multiSelect.placeholder) : v?.selected ? v.selected(m.length) : u(l.multiSelect.selected, { count: String(m.length) }), k = v?.search ?? u(l.multiSelect.search), A = v?.noResults ?? u(l.multiSelect.noResults);
|
|
36
|
-
return /* @__PURE__ */ f("div", {
|
|
37
|
-
className: r(t.wrapper, y),
|
|
38
|
-
...b,
|
|
39
|
-
children: [/* @__PURE__ */ f("button", {
|
|
40
|
-
ref: x.triggerRef,
|
|
41
|
-
type: "button",
|
|
42
|
-
className: t.trigger,
|
|
43
|
-
"aria-haspopup": "listbox",
|
|
44
|
-
"aria-expanded": x.isOpen.value,
|
|
45
|
-
disabled: _,
|
|
46
|
-
style: { anchorName: x.anchorName },
|
|
47
|
-
onClick: () => x.toggle(),
|
|
48
|
-
children: [/* @__PURE__ */ d("span", {
|
|
49
|
-
className: t["trigger-label"],
|
|
50
|
-
children: O
|
|
51
|
-
}), /* @__PURE__ */ d("span", {
|
|
52
|
-
className: t.chevron,
|
|
53
|
-
"aria-hidden": "true"
|
|
54
|
-
})]
|
|
55
|
-
}), /* @__PURE__ */ f("div", {
|
|
56
|
-
ref: x.popoverRef,
|
|
57
|
-
popover: "auto",
|
|
58
|
-
className: t.panel,
|
|
59
|
-
style: { positionAnchor: x.anchorName },
|
|
60
|
-
tabIndex: -1,
|
|
61
|
-
children: [/* @__PURE__ */ d("div", {
|
|
62
|
-
className: t["search-row"],
|
|
63
|
-
children: /* @__PURE__ */ d("input", {
|
|
64
|
-
ref: T,
|
|
65
|
-
type: "search",
|
|
66
|
-
className: t.search,
|
|
67
|
-
placeholder: k,
|
|
68
|
-
value: S.value,
|
|
69
|
-
onChange: (e) => {
|
|
70
|
-
S.value = e.currentTarget.value, C.value = -1;
|
|
71
|
-
}
|
|
72
|
-
})
|
|
73
|
-
}), /* @__PURE__ */ d("div", {
|
|
74
|
-
ref: w,
|
|
75
|
-
role: "listbox",
|
|
76
|
-
"aria-multiselectable": "true",
|
|
77
|
-
"aria-label": v?.label ?? u(l.multiSelect.label),
|
|
78
|
-
className: t.options,
|
|
79
|
-
children: E.value.length === 0 ? /* @__PURE__ */ d("div", {
|
|
80
|
-
className: t["no-results"],
|
|
81
|
-
children: A
|
|
82
|
-
}) : E.value.map((e, n) => /* @__PURE__ */ f("div", {
|
|
83
|
-
role: "option",
|
|
84
|
-
"aria-selected": m.includes(e.value),
|
|
85
|
-
"aria-disabled": e.disabled,
|
|
86
|
-
"data-active": n === C.value ? "" : void 0,
|
|
87
|
-
"data-selected": m.includes(e.value) ? "" : void 0,
|
|
88
|
-
"data-disabled": e.disabled ? "" : void 0,
|
|
89
|
-
className: t.option,
|
|
90
|
-
onMouseDown: (t) => {
|
|
91
|
-
t.preventDefault(), e.disabled || D(e.value);
|
|
92
|
-
},
|
|
93
|
-
onMouseEnter: () => {
|
|
94
|
-
C.value = n;
|
|
95
|
-
},
|
|
96
|
-
children: [/* @__PURE__ */ d("span", {
|
|
97
|
-
className: t.checkbox,
|
|
98
|
-
"aria-hidden": "true"
|
|
99
|
-
}), e.label]
|
|
100
|
-
}, e.value))
|
|
101
|
-
})]
|
|
102
|
-
})]
|
|
103
|
-
});
|
|
104
|
-
}
|
|
105
|
-
//#endregion
|
|
106
|
-
export { p as MultiSelect };
|
|
1
|
+
"use client";import{usePopover as e}from"../popover/use-popover.js";import{clampActive as t,firstActive as n,lastActive as r,moveActive as i,pageActive as a}from"./list-nav.js";import{filterOptions as o,groupOptions as ee,highlightSegments as te,isNewLabel as ne,orderByGroup as re}from"./option-list.js";import s from"./multi-select.module.js";import{useId as ie,useRef as c}from"react";import{cn as l,focusElement as u,useControllableSignal as ae,useSignal as d,useSignalEffect as f,useSignals as oe}from"@cascivo/core";import{builtin as p,t as m}from"@cascivo/i18n";import{jsx as h,jsxs as g}from"react/jsx-runtime";function mergeDescribedBy(...e){return e.filter(Boolean).join(` `)||void 0}function MultiSelect({options:_,value:se,defaultValue:ce,onValueChange:le,placeholder:ue,label:v,ariaLabel:y,hint:b,error:x,display:S=`count`,disabled:C=!1,clearable:de=!1,selectAll:fe=!1,max:w,creatable:pe=!1,onCreate:me,loading:T=!1,onSearchChange:E,filter:D,searchable:O=!0,size:he=`md`,name:k,labels:A,className:ge,id:_e,"aria-labelledby":ve,"aria-describedby":ye,"aria-invalid":be,...xe}){oe();let j=e({placement:`bottom`}),M=ie(),N=_e??`${M}-trigger`,P=`${M}-listbox`,F=`${M}-panel`,Se=`${M}-search`,optionId=e=>`${M}-option-${e}`,I=d(``),L=d(-1),R=c(null),z=c(null),B=c(null),[V,Ce]=ae({value:se,defaultValue:ce??[],onChange:le}),H=j.isOpen.value,U=V.value,W=w!==void 0&&U.length>=w,G=I.value,K=re(o(_,O?G:``,D)),q=pe&&G.trim()!==``&&ne(_,G.trim()),J=q?K.length:-1,we=ee(K),Te=ue??A?.placeholder??m(p.multiSelect.placeholder),Y=A?.search??m(p.multiSelect.search),Ee=A?.noResults??m(p.multiSelect.noResults),De=A?.loading??m(p.multiSelect.loading),Oe=A?.label??v??y??m(p.multiSelect.label),ke=A?.clear??m(p.multiSelect.clear),Ae=A?.selectAll??m(p.multiSelect.selectAll),je=A?.clearAll??m(p.multiSelect.clearAll),removeLabel=e=>A?.remove?A.remove.replaceAll(`{label}`,e):m(p.multiSelect.remove,{label:e}),createLabel=e=>A?.create?A.create.replaceAll(`{label}`,e):m(p.multiSelect.create,{label:e}),Me=U.flatMap(e=>{let t=_.find(t=>t.value===e);return t?[t]:[{value:e,label:e}]}),X=U.length===0?Te:A?.selected?A.selected(U.length):m(p.multiSelect.selected,{count:String(U.length)}),Z=c(!1);f(()=>{if(j.isOpen.value){L.value=-1;let e=setTimeout(()=>u(O?z.current:R.current),0);return Z.current=!0,()=>clearTimeout(e)}I.value=``,Z.current&&(Z.current=!1,u(B.current))}),f(()=>{let e=L.value;if(!j.isOpen.value||e<0)return;let t=R.current?.querySelector(`#${CSS.escape(optionId(e))}`);t&&typeof t.scrollIntoView==`function`&&t.scrollIntoView({block:`nearest`})});function commit(e){Ce(e)}function toggleOption(e){let t=V.value;if(t.includes(e)){commit(t.filter(t=>t!==e));return}w!==void 0&&t.length>=w||commit([...t,e])}function activate(e){if(e===J&&q){me?.(G.trim()),I.value=``,E?.(``);return}let t=K[e];t&&!t.disabled&&toggleOption(t.value)}function setActive(e){L.value=e}function handleKeyDown(e){let t=[...K.map(e=>({...e,disabled:e.disabled||W&&!U.includes(e.value)})),...q?[{value:``,label:G}]:[]];switch(e.key){case`ArrowDown`:e.preventDefault(),setActive(i(L.value,1,t));break;case`ArrowUp`:e.preventDefault(),setActive(i(L.value,-1,t));break;case`Home`:e.preventDefault(),setActive(n(t));break;case`End`:e.preventDefault(),setActive(r(t));break;case`PageDown`:e.preventDefault(),setActive(a(L.value,1,t));break;case`PageUp`:e.preventDefault(),setActive(a(L.value,-1,t));break;case`Enter`:L.value>=0&&(e.preventDefault(),activate(L.value));break;case` `:!O&&L.value>=0&&(e.preventDefault(),activate(L.value));break;case`Escape`:e.preventDefault(),e.stopPropagation(),j.close();break;case`Backspace`:S===`chips`&&G===``&&V.value.length>0&&(e.preventDefault(),commit(V.value.slice(0,-1)));break}}function handleTriggerKeyDown(e){C||(e.key===`ArrowDown`||e.key===`ArrowUp`||e.key===`Enter`||e.key===` `)&&(e.preventDefault(),j.open())}let Q=_.filter(e=>!e.disabled).map(e=>e.value),$=Q.length>0&&Q.every(e=>U.includes(e)),Ne=mergeDescribedBy(x?`${M}-error`:b?`${M}-hint`:void 0,ye);function renderOption(e,t){let n=U.includes(e.value),r=e.disabled||W&&!n;return g(`div`,{id:optionId(t),role:`option`,"aria-selected":n,"aria-disabled":r||void 0,"data-active":t===L.value?``:void 0,"data-selected":n?``:void 0,"data-disabled":r?``:void 0,className:s.option,onMouseDown:e=>e.preventDefault(),onClick:()=>{r||toggleOption(e.value)},onMouseEnter:()=>{r||setActive(t)},children:[h(`span`,{className:s.checkbox,"aria-hidden":`true`}),h(`span`,{className:s[`option-label`],children:te(e.label,O?G:``).map((e,t)=>e.match?h(`mark`,{className:s.match,children:e.text},t):h(`span`,{children:e.text},t))})]},e.value)}return g(`div`,{className:l(s.wrapper,ge),"data-state":x?`error`:H?`open`:`closed`,"data-size":he,...xe,children:[v&&h(`label`,{className:s.label,htmlFor:N,children:v}),g(`div`,{className:s.field,"data-display":S,children:[S===`chips`&&Me.map(e=>g(`span`,{className:s.chip,children:[h(`span`,{className:s[`chip-label`],children:e.label}),h(`button`,{type:`button`,className:s[`chip-remove`],"aria-label":removeLabel(e.label),disabled:C,onClick:()=>commit(V.value.filter(t=>t!==e.value))})]},e.value)),g(`button`,{ref:e=>{B.current=e,j.triggerRef.current=e},id:N,type:`button`,className:s.trigger,"aria-haspopup":`listbox`,"aria-expanded":H,"aria-controls":F,"aria-labelledby":ve,"aria-label":y,"aria-invalid":x?!0:be,"aria-describedby":Ne,disabled:C,style:{anchorName:j.anchorName},onClick:()=>{C||j.toggle()},onKeyDown:handleTriggerKeyDown,children:[h(`span`,{className:s[`trigger-label`],"data-empty":U.length===0?``:void 0,children:S===`chips`&&U.length>0?h(`span`,{className:s[`sr-only`],children:X}):X}),h(`span`,{className:s.chevron,"aria-hidden":`true`})]}),de&&U.length>0&&!C&&h(`button`,{type:`button`,className:s.clear,"aria-label":ke,onClick:()=>commit([]),children:h(`span`,{className:s[`clear-glyph`],"aria-hidden":`true`})})]}),k!==void 0&&U.map(e=>h(`input`,{type:`hidden`,name:k,value:e},e)),g(`div`,{ref:j.popoverRef,id:F,popover:`auto`,className:s.panel,style:{positionAnchor:j.anchorName},tabIndex:-1,children:[O&&h(`div`,{className:s[`search-row`],children:h(`input`,{ref:z,id:Se,type:`text`,role:`combobox`,className:s.search,placeholder:Y,"aria-label":Y,"aria-expanded":H,"aria-controls":P,"aria-autocomplete":`list`,"aria-activedescendant":H&&L.value>=0?optionId(L.value):void 0,autoComplete:`off`,value:G,onChange:e=>{I.value=e.currentTarget.value,E?.(e.currentTarget.value),L.value=t(-1,o(_,e.currentTarget.value,D))},onKeyDown:handleKeyDown})}),fe&&Q.length>0&&h(`button`,{type:`button`,className:s[`select-all`],onMouseDown:e=>e.preventDefault(),onClick:()=>commit($?[]:w===void 0?Q:Q.slice(0,w)),children:$?je:Ae}),g(`div`,{ref:R,role:`listbox`,id:P,"aria-multiselectable":`true`,"aria-label":Oe,"aria-busy":T||void 0,"aria-activedescendant":!O&&H&&L.value>=0?optionId(L.value):void 0,tabIndex:O?-1:0,className:s.options,onKeyDown:O?void 0:handleKeyDown,children:[we.map(e=>e.label===void 0?e.entries.map(({option:e,index:t})=>renderOption(e,t)):g(`div`,{role:`group`,"aria-label":e.label,className:s.group,children:[h(`span`,{className:s[`group-label`],"aria-hidden":`true`,children:e.label}),e.entries.map(({option:e,index:t})=>renderOption(e,t))]},e.label)),q&&h(`div`,{id:optionId(J),role:`option`,"aria-selected":!1,"data-active":J===L.value?``:void 0,className:l(s.option,s.create),onMouseDown:e=>e.preventDefault(),onClick:()=>activate(J),onMouseEnter:()=>setActive(J),children:createLabel(G.trim())})]}),T?h(`div`,{className:s.status,role:`status`,children:De}):K.length===0&&!q?h(`div`,{className:s.status,role:`status`,children:Ee}):null]}),h(`span`,{className:s[`sr-only`],role:`status`,"aria-live":`polite`,children:H?m(p.multiSelect.selectionChanged,{count:String(U.length),total:String(_.length)}):``}),x&&h(`span`,{id:`${M}-error`,className:s.error,role:`alert`,children:x}),!x&&b&&h(`span`,{id:`${M}-hint`,className:s.hint,children:b})]})}export{MultiSelect};
|
|
@@ -1,16 +1,2 @@
|
|
|
1
1
|
import './multi-select.css';
|
|
2
|
-
var e
|
|
3
|
-
wrapper: "_wrapper_o9vhb_2",
|
|
4
|
-
trigger: "_trigger_o9vhb_12",
|
|
5
|
-
"trigger-label": "_trigger-label_o9vhb_51",
|
|
6
|
-
chevron: "_chevron_o9vhb_63",
|
|
7
|
-
panel: "_panel_o9vhb_83",
|
|
8
|
-
"search-row": "_search-row_o9vhb_128",
|
|
9
|
-
search: "_search_o9vhb_128",
|
|
10
|
-
options: "_options_o9vhb_149",
|
|
11
|
-
option: "_option_o9vhb_149",
|
|
12
|
-
checkbox: "_checkbox_o9vhb_177",
|
|
13
|
-
"no-results": "_no-results_o9vhb_192"
|
|
14
|
-
};
|
|
15
|
-
//#endregion
|
|
16
|
-
export { e as default };
|
|
2
|
+
var e={wrapper:`_wrapper_1vodk_2`,label:`_label_1vodk_14`,field:`_field_1vodk_21`,trigger:`_trigger_1vodk_37`,"trigger-label":`_trigger-label_1vodk_103`,chip:`_chip_1vodk_116`,"chip-label":`_chip-label_1vodk_130`,"chip-remove":`_chip-remove_1vodk_136`,clear:`_clear_1vodk_161`,"clear-glyph":`_clear-glyph_1vodk_181`,chevron:`_chevron_1vodk_193`,panel:`_panel_1vodk_213`,"search-row":`_search-row_1vodk_266`,search:`_search_1vodk_266`,"select-all":`_select-all_1vodk_287`,options:`_options_1vodk_308`,group:`_group_1vodk_318`,"group-label":`_group-label_1vodk_322`,option:`_option_1vodk_308`,"option-label":`_option-label_1vodk_360`,match:`_match_1vodk_367`,create:`_create_1vodk_374`,checkbox:`_checkbox_1vodk_379`,status:`_status_1vodk_402`,error:`_error_1vodk_411`,hint:`_hint_1vodk_412`,"sr-only":`_sr-only_1vodk_425`};export{e as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
function foldChar(e){return(e.normalize(`NFD`)[0]??e).toLowerCase()}function fold(e){return Array.from(e,foldChar)}function defaultMatch(e,t){let n=fold(t).join(``);return n===``?!0:fold(e.label).join(``).includes(n)||fold(e.value).join(``).includes(n)}function filterOptions(e,t,n){let r=n??defaultMatch;return t===``&&!n?e:e.filter(e=>r(e,t))}function highlightSegments(e,t){let n=fold(t).join(``);if(n===``)return[{text:e,match:!1}];let r=Array.from(e),i=fold(e).join(``).indexOf(n);if(i===-1)return[{text:e,match:!1}];let a=Array.from(t).length,o=[],s=r.slice(0,i).join(``),c=r.slice(i,i+a).join(``),l=r.slice(i+a).join(``);return s!==``&&o.push({text:s,match:!1}),o.push({text:c,match:!0}),l!==``&&o.push({text:l,match:!1}),o}function groupOptions(e){let t=[],n=new Map;return e.forEach((e,r)=>{let i=e.group,a=n.get(i);a||(a={label:i,entries:[]},n.set(i,a),t.push(a)),a.entries.push({option:e,index:r})}),t.sort((e,t)=>Number(e.label!==void 0)-Number(t.label!==void 0))}function orderByGroup(e){return groupOptions(e).flatMap(e=>e.entries.map(e=>e.option))}function isNewLabel(e,t){let n=fold(t).join(``);return n===``?!1:!e.some(e=>fold(e.label).join(``)===n)}export{filterOptions,groupOptions,highlightSegments,isNewLabel,orderByGroup};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer cascivo.component{.
|
|
1
|
+
@layer cascivo.component{._root_1g3i3_2{inline-size:100%;display:inline-flex;position:relative}._root_1g3i3_2[data-size=sm]{--_select-height:2rem;--_select-font:var(--cascivo-text-sm);--_select-px:var(--cascivo-space-3)}._root_1g3i3_2[data-size=md]{--_select-height:2.5rem;--_select-font:var(--cascivo-text-sm);--_select-px:var(--cascivo-space-4)}._root_1g3i3_2[data-size=lg]{--_select-height:3rem;--_select-font:var(--cascivo-text-base);--_select-px:var(--cascivo-space-4)}._select_1g3i3_24{appearance:none;inline-size:100%;block-size:var(--_select-height,2.5rem);font-family:var(--cascivo-font-sans);font-size:var(--_select-font,var(--cascivo-text-sm));color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);cursor:pointer;transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);outline:none;padding-inline-start:var(--_select-px,var(--cascivo-space-4));padding-inline-end:var(--cascivo-space-10)}._select_1g3i3_24:hover:not(:disabled):not(:focus){border-color:var(--cascivo-color-border-strong)}._select_1g3i3_24:focus{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._select_1g3i3_24:disabled{opacity:.5;cursor:not-allowed;background-color:var(--cascivo-color-bg-subtle)}._root_1g3i3_2[data-invalid] ._select_1g3i3_24{border-color:var(--cascivo-color-destructive)}._root_1g3i3_2[data-invalid] ._select_1g3i3_24:focus{box-shadow:0 0 0 3px rgb(from var(--cascivo-color-destructive) r g b / .3)}._chevron_1g3i3_66{pointer-events:none;background-color:var(--cascivo-color-text-muted);block-size:1rem;inline-size:1rem;position:absolute;inset-block-start:50%;inset-inline-end:var(--cascivo-space-3);translate:0 -50%;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E") 50%/contain no-repeat}@supports (appearance:base-select){._select_1g3i3_24{appearance:base-select;align-items:center;gap:var(--cascivo-space-2);text-align:start;padding-inline-end:var(--_select-px,var(--cascivo-space-4));display:inline-flex}._select_1g3i3_24:focus-visible{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._chevron_1g3i3_66{display:none}._select_1g3i3_24::picker-icon{color:var(--cascivo-color-text-muted);transition:rotate var(--cascivo-duration-150) var(--cascivo-ease-out);margin-inline-start:auto}._select_1g3i3_24:open::picker-icon{rotate:180deg}._select_1g3i3_24::picker(select){appearance:base-select;box-sizing:border-box;margin-block:var(--cascivo-space-1);padding:var(--cascivo-space-1);background:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-overlay);max-block-size:18rem;box-shadow:var(--cascivo-shadow-md);min-inline-size:10rem;min-inline-size:anchor-size(self-inline);position-try-fallbacks:flip-block;opacity:1;transition:opacity var(--cascivo-motion-enter), translate var(--cascivo-motion-enter), display var(--cascivo-motion-enter) allow-discrete, overlay var(--cascivo-motion-enter) allow-discrete;overflow-y:auto;translate:0}@starting-style{._select_1g3i3_24::picker(select){opacity:0;translate:0 calc(-1 * var(--cascivo-space-2))}}._select_1g3i3_24:not(:open)::picker(select){opacity:0;translate:0 calc(-1 * var(--cascivo-space-2));transition:opacity var(--cascivo-motion-exit), translate var(--cascivo-motion-exit), display var(--cascivo-motion-exit) allow-discrete, overlay var(--cascivo-motion-exit) allow-discrete}._select_1g3i3_24 option{align-items:center;gap:var(--cascivo-space-2);padding:var(--cascivo-space-2) var(--cascivo-space-3);border-radius:var(--cascivo-radius-item);font-family:var(--cascivo-font-sans);font-size:var(--_select-font,var(--cascivo-text-sm));color:var(--cascivo-color-text);cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;display:flex}._select_1g3i3_24 option:hover,._select_1g3i3_24 option:focus{background:var(--cascivo-color-bg-subtle);outline:none}._select_1g3i3_24 option:checked{color:var(--cascivo-color-accent)}._select_1g3i3_24 option:disabled{opacity:.5;cursor:not-allowed}._select_1g3i3_24 option::checkmark{content:"";background-color:currentColor;flex-shrink:0;block-size:.75rem;inline-size:.75rem;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 8.5l3.5 3.5L13 4.5'/%3E%3C/svg%3E") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 8.5l3.5 3.5L13 4.5'/%3E%3C/svg%3E") 50%/contain no-repeat}._select_1g3i3_24 option:not(:checked)::checkmark{visibility:hidden}}}@media (forced-colors:active){._select_1g3i3_24{color:fieldtext;background-color:field;border:1px solid fieldtext}._select_1g3i3_24:focus{outline-offset:2px;outline:2px solid highlight}}
|
|
@@ -1,37 +1 @@
|
|
|
1
|
-
import e from
|
|
2
|
-
import { cn as t } from "@cascivo/core/pure";
|
|
3
|
-
import { forwardRef as n } from "react";
|
|
4
|
-
import { jsx as r, jsxs as i } from "react/jsx-runtime";
|
|
5
|
-
//#region ../components/src/native-select/native-select.tsx
|
|
6
|
-
var a = n(function({ options: n, children: a, size: o = "md", invalid: s, disabled: c, placeholder: l, value: u, defaultValue: d, className: f, ...p }, m) {
|
|
7
|
-
let h = u !== void 0, g = l !== void 0;
|
|
8
|
-
return /* @__PURE__ */ i("div", {
|
|
9
|
-
className: t(e.root, f),
|
|
10
|
-
"data-size": o,
|
|
11
|
-
"data-invalid": s || void 0,
|
|
12
|
-
children: [/* @__PURE__ */ i("select", {
|
|
13
|
-
ref: m,
|
|
14
|
-
className: e.select,
|
|
15
|
-
disabled: c,
|
|
16
|
-
"aria-invalid": s || void 0,
|
|
17
|
-
value: u,
|
|
18
|
-
defaultValue: !h && g ? d ?? "" : d,
|
|
19
|
-
...p,
|
|
20
|
-
children: [g && /* @__PURE__ */ r("option", {
|
|
21
|
-
value: "",
|
|
22
|
-
disabled: !0,
|
|
23
|
-
hidden: !0,
|
|
24
|
-
children: l
|
|
25
|
-
}), n ? n.map((e) => /* @__PURE__ */ r("option", {
|
|
26
|
-
value: e.value,
|
|
27
|
-
disabled: e.disabled,
|
|
28
|
-
children: e.label
|
|
29
|
-
}, e.value)) : a]
|
|
30
|
-
}), /* @__PURE__ */ r("span", {
|
|
31
|
-
className: e.chevron,
|
|
32
|
-
"aria-hidden": "true"
|
|
33
|
-
})]
|
|
34
|
-
});
|
|
35
|
-
});
|
|
36
|
-
//#endregion
|
|
37
|
-
export { a as NativeSelect };
|
|
1
|
+
import e from"./native-select.module.js";import{cn as t}from"@cascivo/core/pure";import{forwardRef as n}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";var a=n(function({options:n,children:a,size:o=`md`,invalid:s,disabled:c,placeholder:l,value:u,defaultValue:d,className:f,...p},m){let h=u!==void 0,g=l!==void 0;return i(`div`,{className:t(e.root,f),"data-size":o,"data-invalid":s||void 0,children:[i(`select`,{ref:m,className:e.select,disabled:c,"aria-invalid":s||void 0,value:u,defaultValue:!h&&g?d??``:d,...p,children:[g&&r(`option`,{value:``,disabled:!0,hidden:!0,children:l}),n?n.map(e=>r(`option`,{value:e.value,disabled:e.disabled,children:e.label},e.value)):a]}),r(`span`,{className:e.chevron,"aria-hidden":`true`})]})});export{a as NativeSelect};
|
|
@@ -1,8 +1,2 @@
|
|
|
1
1
|
import './native-select.css';
|
|
2
|
-
var e
|
|
3
|
-
root: "_root_1s4kv_2",
|
|
4
|
-
select: "_select_1s4kv_24",
|
|
5
|
-
chevron: "_chevron_1s4kv_66"
|
|
6
|
-
};
|
|
7
|
-
//#endregion
|
|
8
|
-
export { e as default };
|
|
2
|
+
var e={root:`_root_1g3i3_2`,select:`_select_1g3i3_24`,chevron:`_chevron_1g3i3_66`};export{e as default};
|