@keboola/design 13.2.0 → 15.0.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/AGENTS.md +16 -24
- package/CHANGELOG.md +194 -0
- package/COMPONENT-API.md +109 -105
- package/dist/{AIKit-C5FbKjwa.js → AIKit-CaAW4GLx.js} +2216 -307
- package/dist/AIKit-CaAW4GLx.js.map +1 -0
- package/dist/{Alert-DuAGeYyM.js → Alert-Chz6KZ7e.js} +11 -20
- package/dist/Alert-Chz6KZ7e.js.map +1 -0
- package/dist/{AlertModal-BDle9ZVQ.js → AlertModal-D4AtpvLS.js} +15 -35
- package/dist/AlertModal-D4AtpvLS.js.map +1 -0
- package/dist/{AppShell-B03fj1j7.js → AppShell-C8V1KRr_.js} +2 -2
- package/dist/{AppShell-B03fj1j7.js.map → AppShell-C8V1KRr_.js.map} +1 -1
- package/dist/{AutoSaveTextarea-jiqNeeE4.js → AutoSaveTextarea-BbMhC5Aq.js} +3 -3
- package/dist/AutoSaveTextarea-BbMhC5Aq.js.map +1 -0
- package/dist/{Badge-Ba3epgcI.js → Badge-5GHIsgRS.js} +14 -3
- package/dist/Badge-5GHIsgRS.js.map +1 -0
- package/dist/{BrandEditor-Dq168RJc.js → BrandEditor-CTGtQUFZ.js} +8 -10
- package/dist/BrandEditor-CTGtQUFZ.js.map +1 -0
- package/dist/{BrandLogo-BfITD0im.js → BrandLogo-DkESE19K.js} +2 -2
- package/dist/{BrandLogo-BfITD0im.js.map → BrandLogo-DkESE19K.js.map} +1 -1
- package/dist/{Breadcrumb-CUyYu5Bi.js → Breadcrumb-B2YSNON4.js} +55 -13
- package/dist/Breadcrumb-B2YSNON4.js.map +1 -0
- package/dist/{Button-D2JqBAq7.js → Button-BNkyYU8u.js} +9 -185
- package/dist/Button-BNkyYU8u.js.map +1 -0
- package/dist/{Card-Bpc_ZlL4.js → Card-DxjGiqH8.js} +11 -18
- package/dist/Card-DxjGiqH8.js.map +1 -0
- package/dist/{Checkbox-D9rafoKh.js → Checkbox-CHDDJyAA.js} +20 -45
- package/dist/Checkbox-CHDDJyAA.js.map +1 -0
- package/dist/{Clipboard-BHWUodAx.js → Clipboard-DlwVZS1P.js} +2 -2
- package/dist/{Clipboard-BHWUodAx.js.map → Clipboard-DlwVZS1P.js.map} +1 -1
- package/dist/{ClipboardButton-Urg-kZbh.js → ClipboardButton-B1Hr_n_Z.js} +3 -3
- package/dist/{ClipboardButton-Urg-kZbh.js.map → ClipboardButton-B1Hr_n_Z.js.map} +1 -1
- package/dist/{CodeEditor-Y0iE-SwV.js → CodeEditor-DVSPdfdo.js} +24 -31
- package/dist/CodeEditor-DVSPdfdo.js.map +1 -0
- package/dist/{ColorInput-D1nC0X6i.js → ColorInput-B_eZIu39.js} +5 -7
- package/dist/ColorInput-B_eZIu39.js.map +1 -0
- package/dist/{ColorModeSwitch-Cxee8jnB.js → ColorModeSwitch-B6UEzG0H.js} +3 -3
- package/dist/{ColorModeSwitch-Cxee8jnB.js.map → ColorModeSwitch-B6UEzG0H.js.map} +1 -1
- package/dist/{Combobox-B1Kjoy5J.js → Combobox-CaKqgstG.js} +250 -56
- package/dist/Combobox-CaKqgstG.js.map +1 -0
- package/dist/{Command-BuOA3V18.js → Command-DhXmqFLT.js} +51 -33
- package/dist/Command-DhXmqFLT.js.map +1 -0
- package/dist/{CopyField-DsOVtV2Q.js → CopyField-D0Pg4Z0R.js} +2 -2
- package/dist/{CopyField-DsOVtV2Q.js.map → CopyField-D0Pg4Z0R.js.map} +1 -1
- package/dist/{DateInput-BlKkequE.js → DateInput-BgbMDJkm.js} +5 -7
- package/dist/DateInput-BgbMDJkm.js.map +1 -0
- package/dist/{DatePicker-CgHAu9KX.js → DatePicker-BXpDRo-R.js} +2 -2
- package/dist/{DatePicker-CgHAu9KX.js.map → DatePicker-BXpDRo-R.js.map} +1 -1
- package/dist/{DateRangeInput-DOxJHw8V.js → DateRangeInput-BW0-_jV0.js} +5 -7
- package/dist/DateRangeInput-BW0-_jV0.js.map +1 -0
- package/dist/{DateRangePicker-CXpXPMoh.js → DateRangePicker-C4-DoWac.js} +7 -12
- package/dist/DateRangePicker-C4-DoWac.js.map +1 -0
- package/dist/{DropdownMenu-DtRYcKEx.js → DropdownMenu-CcVbZ_5u.js} +35 -64
- package/dist/DropdownMenu-CcVbZ_5u.js.map +1 -0
- package/dist/{FieldItem-Cf1E3rfQ.js → FieldItem-BHUqgSO1.js} +3 -3
- package/dist/{FieldItem-Cf1E3rfQ.js.map → FieldItem-BHUqgSO1.js.map} +1 -1
- package/dist/{FileUpload-D6vPG3WB.js → FileUpload-BYFONpEl.js} +3 -3
- package/dist/FileUpload-BYFONpEl.js.map +1 -0
- package/dist/{Form-CuaAn-lR.js → Form-CAofWyMI.js} +8 -8
- package/dist/{Form-CuaAn-lR.js.map → Form-CAofWyMI.js.map} +1 -1
- package/dist/{FormGroup-D4O96YPm.js → FormGroup-V5kIgQRN.js} +3 -3
- package/dist/{FormGroup-D4O96YPm.js.map → FormGroup-V5kIgQRN.js.map} +1 -1
- package/dist/{FullScreenModal-CUuAakh3.js → FullScreenModal-DAvvlGOz.js} +2 -5
- package/dist/FullScreenModal-DAvvlGOz.js.map +1 -0
- package/dist/HoverCard-Cv5rmvJq.js +26 -0
- package/dist/HoverCard-Cv5rmvJq.js.map +1 -0
- package/dist/{InlineEdit-DSMIEUUa.js → InlineEdit-D4P0SvCB.js} +5 -9
- package/dist/InlineEdit-D4P0SvCB.js.map +1 -0
- package/dist/{InputGroup-Dm014ruw.js → InputGroup-CZv_7QlM.js} +39 -146
- package/dist/InputGroup-CZv_7QlM.js.map +1 -0
- package/dist/{Kbd-Du93F3o4.js → Kbd-CflKthfu.js} +5 -14
- package/dist/Kbd-CflKthfu.js.map +1 -0
- package/dist/MermaidDiagram-Te-5gOCU.js +199 -0
- package/dist/MermaidDiagram-Te-5gOCU.js.map +1 -0
- package/dist/{Modal-DQIauzar.js → Modal-CbUz-5YH.js} +19 -37
- package/dist/Modal-CbUz-5YH.js.map +1 -0
- package/dist/{ModalTitle-CTECVgL8.js → ModalTitle-cy0Ht9VY.js} +2 -2
- package/dist/{ModalTitle-CTECVgL8.js.map → ModalTitle-cy0Ht9VY.js.map} +1 -1
- package/dist/{MultiActionButtonGroup-xKqiucAN.js → MultiActionButtonGroup-Dzig87s1.js} +3 -3
- package/dist/{MultiActionButtonGroup-xKqiucAN.js.map → MultiActionButtonGroup-Dzig87s1.js.map} +1 -1
- package/dist/{Navbar-CtVYcRFn.js → Navbar-DHUS7XiU.js} +2 -2
- package/dist/{Navbar-CtVYcRFn.js.map → Navbar-DHUS7XiU.js.map} +1 -1
- package/dist/OtpInput-CY8yCaJk.js.map +1 -1
- package/dist/{PageToolbar-B_e7HGva.js → PageToolbar-DJ5tdYla.js} +4 -4
- package/dist/{PageToolbar-B_e7HGva.js.map → PageToolbar-DJ5tdYla.js.map} +1 -1
- package/dist/{Pagination-DDp6PRqf.js → Pagination-D27x5KmH.js} +2 -2
- package/dist/{Pagination-DDp6PRqf.js.map → Pagination-D27x5KmH.js.map} +1 -1
- package/dist/{Popconfirm-BgV6a0sl.js → Popconfirm-DwLCYNaF.js} +3 -3
- package/dist/{Popconfirm-BgV6a0sl.js.map → Popconfirm-DwLCYNaF.js.map} +1 -1
- package/dist/{Popover-BU7nGOv-.js → Popover-DtUDwUVO.js} +24 -37
- package/dist/Popover-DtUDwUVO.js.map +1 -0
- package/dist/{RadioGroup-C2vk5acr.js → RadioGroup-B0TwHjBb.js} +9 -13
- package/dist/RadioGroup-B0TwHjBb.js.map +1 -0
- package/dist/{Search-CVrv3hqf.js → Search-vyZwGKMU.js} +3 -3
- package/dist/{Search-CVrv3hqf.js.map → Search-vyZwGKMU.js.map} +1 -1
- package/dist/{SearchInput-BnU6YHgT.js → SearchInput-DyYXyw3u.js} +4 -6
- package/dist/SearchInput-DyYXyw3u.js.map +1 -0
- package/dist/{SectionNav-XlhvXXdF.js → SectionNav-tLK3iF6c.js} +5 -5
- package/dist/{SectionNav-XlhvXXdF.js.map → SectionNav-tLK3iF6c.js.map} +1 -1
- package/dist/{Select-CjQgU_6K.js → Select-B22hB_-w.js} +11 -25
- package/dist/Select-B22hB_-w.js.map +1 -0
- package/dist/{Sheet-utw4_rUa.js → Sheet-0TWKTqid.js} +12 -15
- package/dist/Sheet-0TWKTqid.js.map +1 -0
- package/dist/{Sidebar-CKaxOPwY.js → Sidebar-C5hdANBU.js} +11 -11
- package/dist/Sidebar-C5hdANBU.js.map +1 -0
- package/dist/{Slider-Rcc2qVct.js → Slider-DrcsM8_G.js} +4 -4
- package/dist/Slider-DrcsM8_G.js.map +1 -0
- package/dist/{Stepper-BBPembeK.js → Stepper-CQrUPVFL.js} +2 -2
- package/dist/Stepper-CQrUPVFL.js.map +1 -0
- package/dist/Switch-DccpSpzC.js +66 -0
- package/dist/Switch-DccpSpzC.js.map +1 -0
- package/dist/{Table-CgSC-fSo.js → Table-CilEvpMq.js} +62 -3
- package/dist/Table-CilEvpMq.js.map +1 -0
- package/dist/{Tabs-C0uvkPHc.js → Tabs-Ck4uWf8U.js} +2 -2
- package/dist/{Tabs-C0uvkPHc.js.map → Tabs-Ck4uWf8U.js.map} +1 -1
- package/dist/{TextInput-B5TDDOty.js → TextInput-CR0_USaY.js} +4 -7
- package/dist/TextInput-CR0_USaY.js.map +1 -0
- package/dist/{ThemeProvider-Dt9b67sW.js → ThemeProvider-BTK7AL-T.js} +21 -8
- package/dist/ThemeProvider-BTK7AL-T.js.map +1 -0
- package/dist/{TimePicker-DyyV3nw8.js → TimePicker-CoRpiEM3.js} +2 -2
- package/dist/{TimePicker-DyyV3nw8.js.map → TimePicker-CoRpiEM3.js.map} +1 -1
- package/dist/{Toast-BGnUL4jV.js → Toast-937n7n8i.js} +2 -2
- package/dist/{Toast-BGnUL4jV.js.map → Toast-937n7n8i.js.map} +1 -1
- package/dist/ToggleAllTooltip-DEjbWFoj.js +37 -0
- package/dist/ToggleAllTooltip-DEjbWFoj.js.map +1 -0
- package/dist/{ZoomableSvg-D8sXKpoV.js → ZoomableSvg-DnFXo2L4.js} +85 -81
- package/dist/ZoomableSvg-DnFXo2L4.js.map +1 -0
- package/dist/editors.js +4 -4
- package/dist/flint.js +10 -45
- package/dist/flint.js.map +1 -1
- package/dist/highlightCode-D354tCXO.js +81 -0
- package/dist/highlightCode-D354tCXO.js.map +1 -0
- package/dist/index.d.ts +843 -443
- package/dist/index.js +62 -63
- package/dist/internal/blocks/AIKit.js +2 -2
- package/dist/internal/blocks/AppShell.js +1 -1
- package/dist/internal/blocks/AuthLayout.js +1 -1
- package/dist/internal/blocks/AutoSaveTextarea.js +1 -1
- package/dist/internal/blocks/BrandEditor.js +1 -1
- package/dist/internal/blocks/ChartPanel.js +1 -1
- package/dist/internal/blocks/ChipEditor.js +5 -9
- package/dist/internal/blocks/ChipEditor.js.map +1 -1
- package/dist/internal/blocks/ClipboardButton.js +1 -1
- package/dist/internal/blocks/ColorInput.js +1 -1
- package/dist/internal/blocks/ColorModeSwitch.js +1 -1
- package/dist/internal/blocks/Command.js +1 -1
- package/dist/internal/blocks/CopyField.js +1 -1
- package/dist/internal/blocks/DateInput.js +1 -1
- package/dist/internal/blocks/DateRangeInput.js +1 -1
- package/dist/internal/blocks/DiagramShared/DiagramSkeleton.js.map +1 -1
- package/dist/internal/blocks/EmptyConfigurationActionCard.js +1 -1
- package/dist/internal/blocks/ErrorState.js +18 -29
- package/dist/internal/blocks/ErrorState.js.map +1 -1
- package/dist/internal/blocks/ExportMenu.js +3 -3
- package/dist/internal/blocks/ExportMenu.js.map +1 -1
- package/dist/internal/blocks/Form/connectors/ComboboxField.js +2 -2
- package/dist/internal/blocks/Form/connectors/MultiComboboxField.js +1 -1
- package/dist/internal/blocks/Form.js +1 -1
- package/dist/internal/blocks/FormGroup.js +1 -1
- package/dist/internal/blocks/InlineEdit.js +1 -1
- package/dist/internal/blocks/MultiActionButtonGroup.js +1 -1
- package/dist/internal/blocks/MultiCombobox.js +202 -70
- package/dist/internal/blocks/MultiCombobox.js.map +1 -1
- package/dist/internal/blocks/NumberInput.js +2 -4
- package/dist/internal/blocks/NumberInput.js.map +1 -1
- package/dist/internal/blocks/PageToolbar.js +1 -1
- package/dist/internal/blocks/PasswordInput.js +3 -5
- package/dist/internal/blocks/PasswordInput.js.map +1 -1
- package/dist/internal/blocks/SearchInput.js +1 -1
- package/dist/internal/blocks/SearchInputWithNavigation.js +6 -7
- package/dist/internal/blocks/SearchInputWithNavigation.js.map +1 -1
- package/dist/internal/blocks/SectionNav.js +1 -1
- package/dist/internal/blocks/SplitButton.js +2 -2
- package/dist/internal/blocks/StatCard.js +1 -1
- package/dist/internal/blocks/TextInput.js +1 -1
- package/dist/internal/blocks/Textarea.js +3 -8
- package/dist/internal/blocks/Textarea.js.map +1 -1
- package/dist/internal/blocks/TimeInput.js +4 -6
- package/dist/internal/blocks/TimeInput.js.map +1 -1
- package/dist/internal/components/Alert.js +1 -1
- package/dist/internal/components/AlertModal.js +1 -1
- package/dist/internal/components/Avatar.js +1 -1
- package/dist/internal/components/Badge.js +1 -1
- package/dist/internal/components/BrandLogo.js +1 -1
- package/dist/internal/components/Breadcrumb.js +1 -1
- package/dist/internal/components/Button.js +2 -2
- package/dist/internal/components/ButtonGroup.js +1 -1
- package/dist/internal/components/ButtonGroup.js.map +1 -1
- package/dist/internal/components/Card.js +1 -1
- package/dist/internal/components/Checkbox.js +1 -1
- package/dist/internal/components/Clipboard.js +1 -1
- package/dist/internal/components/CollapsiblePanel.js +1 -1
- package/dist/internal/components/Combobox.js +1 -1
- package/dist/internal/components/DatePicker.js +1 -1
- package/dist/internal/components/DateRangePicker.js +1 -1
- package/dist/internal/components/DropdownMenu.js +1 -1
- package/dist/internal/components/FileUpload.js +1 -1
- package/dist/internal/components/FullScreenModal.js +1 -1
- package/dist/internal/components/HoverCard.js +1 -1
- package/dist/internal/components/InputGroup.js +1 -1
- package/dist/internal/components/Kbd.js +1 -1
- package/dist/internal/components/Modal.js +1 -1
- package/dist/internal/components/Navbar.js +1 -1
- package/dist/internal/components/Pagination.js +1 -1
- package/dist/internal/components/Popconfirm.js +1 -1
- package/dist/internal/components/Popover.js +1 -1
- package/dist/internal/components/RadioGroup.js +1 -1
- package/dist/internal/components/Search.js +1 -1
- package/dist/internal/components/Select.js +1 -1
- package/dist/internal/components/Sheet.js +1 -1
- package/dist/internal/components/Sidebar.js +1 -1
- package/dist/internal/components/Skeleton/Skeleton.js +2 -2
- package/dist/internal/components/Skeleton/Skeleton.js.map +1 -1
- package/dist/internal/components/Slider.js +1 -1
- package/dist/internal/components/Stepper.js +1 -1
- package/dist/internal/components/Switch.js +1 -1
- package/dist/internal/components/Table.js +1 -1
- package/dist/internal/components/Tabs.js +1 -1
- package/dist/internal/components/ThemeProvider.js +3 -4
- package/dist/internal/components/TimePicker.js +1 -1
- package/dist/internal/components/Toast.js +2 -2
- package/dist/internal/components/Toggle.js +13 -3
- package/dist/internal/components/Toggle.js.map +1 -1
- package/dist/internal/components/Tooltip.js +1 -1
- package/dist/internal/components/Truncated.js +1 -1
- package/dist/internal/components/ZoomableSvg.js +1 -1
- package/dist/internal/utils.js +1 -1
- package/dist/markdown-editor.js +16 -18
- package/dist/markdown-editor.js.map +1 -1
- package/dist/mermaid.d.ts +1 -2
- package/dist/mermaid.js +1 -1
- package/dist/rjsf.js +121 -43
- package/dist/rjsf.js.map +1 -1
- package/dist/styles-DxazJ8Mz.js +81 -0
- package/dist/styles-DxazJ8Mz.js.map +1 -0
- package/dist/styles-T8xwr0sR.js +73 -0
- package/dist/styles-T8xwr0sR.js.map +1 -0
- package/dist/styles.css +1 -1
- package/dist/svgCache-Dhmbe-7i.js +26 -0
- package/dist/svgCache-Dhmbe-7i.js.map +1 -0
- package/dist/svgTransforms-Hnvev3Vs.js +38 -0
- package/dist/svgTransforms-Hnvev3Vs.js.map +1 -0
- package/dist/testing.d.ts +0 -2
- package/dist/testing.js +3 -10
- package/dist/testing.js.map +1 -1
- package/dist/{useColorSchemeState-Cw4MCXUs.js → themeScopeContext-CEVXbYvZ.js} +43 -15
- package/dist/themeScopeContext-CEVXbYvZ.js.map +1 -0
- package/dist/{useThemeAttributes-B199Regy.js → themeTokens-DCeb62ap.js} +22 -4
- package/dist/themeTokens-DCeb62ap.js.map +1 -0
- package/dist/{toast-D6Z6MOB5.js → toast-Y3cTMBW8.js} +7 -10
- package/dist/toast-Y3cTMBW8.js.map +1 -0
- package/dist/{utils-p6tjltbX.js → utils-DwC9u0tM.js} +39 -49
- package/dist/utils-DwC9u0tM.js.map +1 -0
- package/dist/vega.js +2 -2
- package/dist/vegaTheme-ISwGXvof.js +49 -0
- package/dist/vegaTheme-ISwGXvof.js.map +1 -0
- package/dist/{vegaTheme-VQMWTlBw.js → vegaTokens-DCkvpIVE.js} +36 -44
- package/dist/vegaTokens-DCkvpIVE.js.map +1 -0
- package/package.json +3 -4
- package/src/styles.css +4 -39
- package/src/theme.css +42 -0
- package/dist/AIKit-C5FbKjwa.js.map +0 -1
- package/dist/Alert-DuAGeYyM.js.map +0 -1
- package/dist/AlertModal-BDle9ZVQ.js.map +0 -1
- package/dist/AutoSaveTextarea-jiqNeeE4.js.map +0 -1
- package/dist/Badge-Ba3epgcI.js.map +0 -1
- package/dist/BrandEditor-Dq168RJc.js.map +0 -1
- package/dist/Breadcrumb-CUyYu5Bi.js.map +0 -1
- package/dist/Button-D2JqBAq7.js.map +0 -1
- package/dist/Card-Bpc_ZlL4.js.map +0 -1
- package/dist/Checkbox-D9rafoKh.js.map +0 -1
- package/dist/CodeEditor-Y0iE-SwV.js.map +0 -1
- package/dist/ColorInput-D1nC0X6i.js.map +0 -1
- package/dist/Combobox-B1Kjoy5J.js.map +0 -1
- package/dist/Command-BuOA3V18.js.map +0 -1
- package/dist/DateInput-BlKkequE.js.map +0 -1
- package/dist/DateRangeInput-DOxJHw8V.js.map +0 -1
- package/dist/DateRangePicker-CXpXPMoh.js.map +0 -1
- package/dist/DiagramSource-jTwmmi9g.js +0 -11
- package/dist/DiagramSource-jTwmmi9g.js.map +0 -1
- package/dist/DropdownMenu-DtRYcKEx.js.map +0 -1
- package/dist/FileUpload-D6vPG3WB.js.map +0 -1
- package/dist/FullScreenModal-CUuAakh3.js.map +0 -1
- package/dist/HoverCard-Cy6nhg4u.js +0 -31
- package/dist/HoverCard-Cy6nhg4u.js.map +0 -1
- package/dist/InlineEdit-DSMIEUUa.js.map +0 -1
- package/dist/InputGroup-Dm014ruw.js.map +0 -1
- package/dist/Kbd-Du93F3o4.js.map +0 -1
- package/dist/MermaidDiagram-D2ThT8Q-.js +0 -302
- package/dist/MermaidDiagram-D2ThT8Q-.js.map +0 -1
- package/dist/Modal-DQIauzar.js.map +0 -1
- package/dist/Popover-BU7nGOv-.js.map +0 -1
- package/dist/RadioGroup-C2vk5acr.js.map +0 -1
- package/dist/SearchInput-BnU6YHgT.js.map +0 -1
- package/dist/Select-CjQgU_6K.js.map +0 -1
- package/dist/Sheet-utw4_rUa.js.map +0 -1
- package/dist/Sidebar-CKaxOPwY.js.map +0 -1
- package/dist/Slider-Rcc2qVct.js.map +0 -1
- package/dist/Stepper-BBPembeK.js.map +0 -1
- package/dist/Switch-Dw4tvQls.js +0 -201
- package/dist/Switch-Dw4tvQls.js.map +0 -1
- package/dist/Table-CgSC-fSo.js.map +0 -1
- package/dist/TextInput-B5TDDOty.js.map +0 -1
- package/dist/ThemeProvider-Dt9b67sW.js.map +0 -1
- package/dist/ZoomableSvg-D8sXKpoV.js.map +0 -1
- package/dist/context-U293r3v-.js +0 -29
- package/dist/context-U293r3v-.js.map +0 -1
- package/dist/defaults-i_xG2F_1.js +0 -32
- package/dist/defaults-i_xG2F_1.js.map +0 -1
- package/dist/styles-BDA5rQz3.js +0 -127
- package/dist/styles-BDA5rQz3.js.map +0 -1
- package/dist/styles-YQdM7G8c.js +0 -159
- package/dist/styles-YQdM7G8c.js.map +0 -1
- package/dist/svgTransforms-Dw2hRA-i.js +0 -51
- package/dist/svgTransforms-Dw2hRA-i.js.map +0 -1
- package/dist/themeTokens-7DEab0kp.js +0 -31
- package/dist/themeTokens-7DEab0kp.js.map +0 -1
- package/dist/toast-D6Z6MOB5.js.map +0 -1
- package/dist/useColorSchemeState-Cw4MCXUs.js.map +0 -1
- package/dist/useThemeAttributes-B199Regy.js.map +0 -1
- package/dist/utils-p6tjltbX.js.map +0 -1
- package/dist/vegaTheme-VQMWTlBw.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Navbar-CtVYcRFn.js","names":["variants","variants"],"sources":["../src/components/Navbar/NavbarContent.tsx","../src/components/Navbar/NavbarFooter.tsx","../src/components/Navbar/NavbarHeader.tsx","../src/components/Navbar/NavbarMenu.tsx","../src/components/Navbar/NavbarMenuAvatar.tsx","../src/components/Navbar/NavbarMenuItemAdornment.tsx","../src/components/Navbar/NavbarMenuButton.tsx","../src/components/Navbar/NavbarMenuItem.tsx","../src/components/Navbar/Navbar.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\nimport { ScrollArea } from '../ScrollArea';\n\ntype Props = {\n className?: string;\n children?: ReactNode;\n};\n\nexport const NavbarContent = ({ children, className }: Props) => (\n <ScrollArea\n type=\"auto\"\n orientation=\"horizontal\"\n className=\"tw:flex-1\"\n scrollBarClassName=\"tw:h-1.5\"\n >\n <div className={cn('tw:flex', 'tw:py-1.5', className)}>{children}</div>\n </ScrollArea>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\n// `flex items-center`, not a bare block: this slot is documented to hold several\n// items (search, notifications, avatar). As a block they are inline-level boxes\n// aligned on a text baseline, so a button carrying an icon and a text-only button\n// sit at different heights — visibly off-centre against the bar. Centring them is\n// a no-op for the common single-`Navbar.Menu` child, and `gap` only applies\n// between siblings, so existing compositions keep their spacing.\nexport const NavbarFooter = ({ children, className, ...rest }: Props) => (\n <div {...rest} className={cn('tw:flex tw:items-center tw:gap-2 tw:py-1.5', className)}>\n {children}\n </div>\n);\n","import { type ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\nimport { BrandLogo } from '../BrandLogo';\n\ntype Props = ComponentProps<'div'>;\n\nexport const NavbarHeader = ({ children, className, ...rest }: Props) => (\n // BrandLogo reads the nearest ThemeProvider (or the default context) and\n // renders null when the active brand ships no logo, so no provider gate needed.\n <div {...rest} className={cn('tw:overflow-hidden', 'tw:py-1.5', className)}>\n {children ?? <BrandLogo variant=\"wordmark\" className=\"tw:h-7\" />}\n </div>\n);\n","import type { ComponentProps } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\n// `tw:m-0` alongside `tw:p-0`: browsers give `<ul>` a default block margin. In a plain\n// app the scoped preflight resets it, but in kbc-ui the legacy Bootstrap layer (which sits\n// above the preflight so Bootstrap padding survives on its own elements) re-applies\n// `ul { margin-bottom: 10px }`, which then inflates this menu's height and pushes the whole\n// navbar row off-center. Resetting the margin explicitly (utilities beat the legacy layer)\n// keeps the row centered everywhere.\nconst variants = cva(\n ['tw:m-0', 'tw:p-0', 'tw:flex', 'tw:items-center', 'tw:justify-center', 'tw:gap-2'],\n {\n variants: {\n marker: {\n none: [],\n 'forward-slash': [\n // Style all li children with pseudo-element marker\n 'tw:[&_li]:flex',\n 'tw:[&_li]:items-center',\n 'tw:[&_li]:before:content-[\"/\"]',\n 'tw:[&_li]:before:text-border',\n 'tw:[&_li]:before:text-sm',\n 'tw:[&_li]:before:mr-0.5',\n 'tw:[&_li:not(:first-child)]:before:ml-0.5',\n ],\n },\n },\n defaultVariants: {\n marker: 'none',\n },\n },\n);\n\ntype Props = ComponentProps<'ul'> & VariantProps<typeof variants>;\n\nexport const NavbarMenu = ({ className, marker, ...rest }: Props) => (\n <ul {...rest} className={variants({ marker, className })} />\n);\n","import type { ComponentProps } from 'react';\nimport * as RadixAvatar from '@radix-ui/react-avatar';\nimport BoringAvatar from 'boring-avatars';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'button'> & {\n src?: string;\n alt?: string;\n};\n\nexport const NavbarMenuAvatar = ({ ref, className, type = 'button', src, alt, ...rest }: Props) => {\n const altText = alt ?? 'Avatar';\n\n return (\n <button\n {...rest}\n ref={ref}\n type={type}\n className={cn(\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-center',\n 'tw:size-8',\n\n 'tw:aspect-square',\n 'tw:overflow-hidden',\n 'tw:shrink-0',\n\n 'tw:rounded-lg',\n 'tw:bg-transparent',\n 'tw:cursor-pointer',\n\n // Disabled state\n 'tw:disabled:opacity-disabled',\n 'tw:disabled:cursor-not-allowed',\n\n // Focus-visible (matches SidebarMenuButton exactly)\n 'tw:focus-visible:outline-hidden',\n 'tw:focus-visible:ring-2',\n 'tw:focus-visible:ring-sidebar-ring/50',\n className,\n )}\n >\n <RadixAvatar.Root>\n <RadixAvatar.Image src={src} alt={altText} className=\"tw:size-full tw:object-cover\" />\n\n <RadixAvatar.Fallback asChild>\n <BoringAvatar\n square\n name={altText}\n variant=\"beam\"\n colors={['#1F8FFF', '#004787', '#28D8FF', '#925cff', '#A8C2E6']}\n size={32}\n />\n </RadixAvatar.Fallback>\n </RadixAvatar.Root>\n </button>\n );\n};\n","import type { ComponentProps } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nconst variants = cva(\n [\n 'tw:flex',\n 'tw:justify-center',\n 'tw:items-center',\n\n 'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3',\n 'tw:[&:not(svg)]:h-5',\n 'tw:[&:not(svg)]:min-w-5',\n\n 'tw:p-1',\n 'tw:aspect-square',\n 'tw:rounded-md',\n ],\n {\n defaultVariants: { variant: 'icon-accent' },\n variants: {\n variant: {\n icon: ['tw:text-sidebar-foreground', 'tw:[&_svg]:text-sidebar-foreground'],\n 'icon-emphasized': ['tw:text-white', 'tw:[&_svg]:text-white'],\n 'icon-accent': [\n // color-aware accent styling\n 'tw:group-data-[accent=blue]/navbar:text-sidebar-primary',\n 'tw:group-data-[accent=blue]/navbar:[&_svg]:text-sidebar-primary',\n 'tw:group-data-[accent=purple]/navbar:text-purple-500',\n 'tw:group-data-[accent=purple]/navbar:[&_svg]:text-purple-500',\n 'tw:group-data-[accent=orange]/navbar:text-warning-500',\n 'tw:group-data-[accent=orange]/navbar:[&_svg]:text-warning-500',\n 'tw:group-data-[accent=green]/navbar:text-primary-500',\n 'tw:group-data-[accent=green]/navbar:[&_svg]:text-primary-500',\n ],\n 'icon-accent-emphasized': [\n 'tw:text-white',\n 'tw:[&_svg]:text-white',\n\n 'tw:group-data-[accent=blue]/navbar:bg-sidebar-primary',\n 'tw:group-data-[accent=purple]/navbar:bg-purple-500',\n 'tw:group-data-[accent=orange]/navbar:bg-warning-500',\n 'tw:group-data-[accent=green]/navbar:bg-primary-500',\n ],\n 'icon-button': ['tw:size-4', 'tw:!p-0', 'tw:[&_svg:not([class*=\"tw:size-\"])]:size-4'],\n shortcut: ['tw:bg-muted', 'tw:text-sidebar-foreground', 'tw:ml-auto'],\n },\n },\n },\n);\n\ntype Props = { asChild?: boolean } & ComponentProps<'span'> & VariantProps<typeof variants>;\n\nexport const NavbarMenuItemAdornment = ({\n ref,\n asChild = false,\n className,\n variant = 'icon-accent',\n ...props\n}: Props) => {\n const Comp = asChild ? Slot : 'span';\n\n return <Comp {...props} ref={ref} className={variants({ variant, className })} />;\n};\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Root, Slottable } from '@radix-ui/react-slot';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { Search } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { NavbarMenuItemAdornment } from './NavbarMenuItemAdornment';\n\nconst variants = cva(\n [\n 'tw:group/navbar-menu-button',\n 'tw:box-border',\n 'tw:flex',\n 'tw:items-center',\n 'tw:gap-2',\n 'tw:bg-transparent',\n\n 'tw:leading-9',\n\n 'tw:border',\n 'tw:rounded-lg',\n 'tw:whitespace-nowrap',\n 'tw:select-none',\n\n // focus-visible\n 'tw:!outline-hidden',\n 'tw:focus-visible:ring-2',\n 'tw:focus-visible:ring-sidebar-ring/50',\n\n // disabled\n 'tw:disabled:opacity-disabled',\n 'tw:disabled:hover:bg-transparent',\n 'tw:disabled:cursor-not-allowed',\n ],\n {\n defaultVariants: {\n variant: 'default',\n },\n variants: {\n variant: {\n default: [\n 'tw:max-h-9',\n 'tw:border-transparent',\n 'tw:py-2',\n 'tw:px-1.5',\n 'tw:text-sidebar-foreground',\n 'tw:hover:bg-sidebar-hover',\n 'tw:aria-expanded:bg-sidebar-hover',\n\n // Active page. Mirrors `Sidebar.MenuButton`, which styles `aria-current=\"page\"` — a top nav\n // needs the same affordance, and without it a Navbar-shelled app cannot show where you are.\n // `aria-current` rather than a prop: with `asChild` the slot is an <a>, and that is the\n // attribute a router sets on an active link (TanStack's `Link` does it for free).\n 'tw:aria-[current=page]:bg-sidebar-selected',\n 'tw:aria-[current=page]:hover:bg-sidebar-selected',\n 'tw:aria-[current=page]:text-[var(--sidebar-selected-foreground,rgb(var(--sidebar-foreground)))]',\n 'tw:aria-[current=page]:font-medium',\n ],\n emphasized: [\n 'tw:max-h-9',\n 'tw:border-transparent',\n 'tw:py-2',\n 'tw:px-1.5',\n\n 'tw:text-sidebar-foreground',\n 'tw:hover:bg-sidebar-hover',\n 'tw:aria-expanded:bg-sidebar-hover',\n\n 'tw:aria-[current=page]:bg-sidebar-selected',\n 'tw:aria-[current=page]:hover:bg-sidebar-selected',\n 'tw:aria-[current=page]:text-[var(--sidebar-selected-foreground,rgb(var(--sidebar-foreground)))]',\n\n 'tw:font-semibold',\n ],\n icon: [\n 'tw:size-8',\n 'tw:aspect-square',\n 'tw:justify-center',\n 'tw:font-normal',\n 'tw:border-transparent',\n 'tw:text-primary',\n 'tw:[&_svg]:!text-primary',\n 'tw:hover:bg-sidebar-hover',\n 'tw:aria-expanded:bg-sidebar-hover',\n ],\n search: [\n 'tw:max-h-8',\n 'tw:min-w-52',\n 'tw:px-3',\n 'tw:py-1',\n 'tw:font-normal',\n 'tw:border-input',\n 'tw:text-muted-foreground',\n 'tw:[&_svg]:!text-muted-foreground',\n ],\n },\n },\n },\n);\n\ntype Props = ComponentProps<'button'> & {\n /** Optional leading-icon slot. Pass a Lucide icon node to render an adornment before children. */\n icon?: ReactNode;\n asChild?: boolean;\n} & VariantProps<typeof variants>;\n\nexport const NavbarMenuButton = ({\n ref,\n className,\n type = 'button',\n children,\n icon,\n asChild = false,\n variant = 'default',\n ...rest\n}: Props) => {\n const Comp = asChild ? Root : 'button';\n const isSearchVariant = variant === 'search';\n const isEmphasizedVariant = variant === 'emphasized';\n const adornment = isSearchVariant ? <Search /> : icon;\n\n const adornmentVariant: ComponentProps<typeof NavbarMenuItemAdornment>['variant'] = (() => {\n if (isSearchVariant || variant === 'icon') return 'icon-button';\n if (isEmphasizedVariant) return 'icon-accent-emphasized';\n return 'icon-accent';\n })();\n\n return (\n <Comp\n {...rest}\n ref={ref}\n type={type}\n data-variant={variant}\n className={cn(variants({ className, variant }))}\n >\n {adornment && (\n <NavbarMenuItemAdornment variant={adornmentVariant}>{adornment}</NavbarMenuItemAdornment>\n )}\n\n <Slottable>{children}</Slottable>\n </Comp>\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'li'>;\n\nexport const NavbarMenuItem = ({ className, ...rest }: Props) => (\n <li {...rest} className={cn('tw:flex', 'tw:items-center', 'tw:gap-2', className)} />\n);\n","import type { ComponentProps } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { NavbarContent } from './NavbarContent';\nimport { NavbarFooter } from './NavbarFooter';\nimport { NavbarHeader } from './NavbarHeader';\nimport { NavbarMenu } from './NavbarMenu';\nimport { NavbarMenuAvatar } from './NavbarMenuAvatar';\nimport { NavbarMenuButton } from './NavbarMenuButton';\nimport { NavbarMenuItem } from './NavbarMenuItem';\nimport { NavbarMenuItemAdornment } from './NavbarMenuItemAdornment';\n\nconst navbarClassnames = cva(\n [\n 'tailwindcss-preflight',\n 'tw:group/navbar',\n 'tw:sticky',\n 'tw:top-0',\n 'tw:z-50',\n 'tw:flex',\n 'tw:gap-2',\n 'tw:items-center',\n\n // The left side is intentionally smaller to align the logo with the sidebar icons.\n 'tw:pl-2',\n 'tw:pr-3',\n\n 'tw:bg-sidebar',\n // Required with `bg-sidebar`: otherwise `currentColor` (text, `BrandLogo`) is black on dark.\n 'tw:text-sidebar-foreground',\n 'tw:text-xs',\n 'tw:leading-4',\n ],\n {\n defaultVariants: {\n bordered: false,\n },\n variants: {\n bordered: {\n true: [\n 'tw:before:content',\n 'tw:before:h-0.5',\n 'tw:before:w-full',\n 'tw:before:absolute',\n 'tw:before:left-0',\n 'tw:before:top-0',\n 'tw:data-[accent=blue]:before:bg-sidebar-primary',\n 'tw:data-[accent=purple]:before:bg-purple-500',\n 'tw:data-[accent=green]:before:bg-primary-500',\n 'tw:data-[accent=orange]:before:bg-warning-500',\n ],\n false: '',\n },\n },\n },\n);\n\ntype Props = ComponentProps<'nav'> &\n VariantProps<typeof navbarClassnames> & {\n accent?: 'blue' | 'purple' | 'green' | 'orange';\n };\n\n/**\n * Top navigation bar for the app shell, hosted inside `<AppShell.Header>`.\n *\n * - Composition: `Navbar.Header` (brand), `Navbar.Content` (scrollable menu), `Navbar.Footer`.\n * - `bordered` adds a top hairline coloured by `accent`.\n * - Override the default `aria-label` when a page has more than one nav.\n *\n * @see AppShell — the sidebar rail uses `Sidebar` instead.\n */\nexport const Navbar = ({ className, accent = 'blue', bordered = false, ...rest }: Props) => (\n // - `<nav>`, not `<header>`: `AppShell.Header` is already the `<header>` landmark.\n // - `aria-label` precedes `...rest` so a caller's label wins.\n <nav\n aria-label=\"Main navigation\"\n {...rest}\n // `Tooltip` reads this: a trigger inside the bar gets the argo tooltip under any brand.\n data-slot=\"navbar\"\n data-accent={accent}\n className={navbarClassnames({ bordered, className })}\n />\n);\n\nNavbar.Header = NavbarHeader;\nNavbar.Footer = NavbarFooter;\nNavbar.Content = NavbarContent;\n\nNavbar.Menu = NavbarMenu;\nNavbar.MenuItem = NavbarMenuItem;\nNavbar.MenuButton = NavbarMenuButton;\nNavbar.MenuItemAdornment = NavbarMenuItemAdornment;\nNavbar.MenuAvatar = NavbarMenuAvatar;\n"],"mappings":";;;;;;;;;;AAUA,MAAa,iBAAiB,EAAE,UAAU,gBACxC,oBAAC,YAAD;CACE,MAAK;CACL,aAAY;CACZ,WAAU;CACV,oBAAmB;CAEnB,UAAA,oBAAC,OAAD;EAAK,WAAW,GAAG,WAAW,aAAa,SAAS;EAAI;CAAc,CAAA;AAC5D,CAAA;;;ACNd,MAAa,gBAAgB,EAAE,UAAU,WAAW,GAAG,WACrD,oBAAC,OAAD;CAAK,GAAI;CAAM,WAAW,GAAG,8CAA8C,SAAS;CACjF;AACE,CAAA;;;ACRP,MAAa,gBAAgB,EAAE,UAAU,WAAW,GAAG,WAGrD,oBAAC,OAAD;CAAK,GAAI;CAAM,WAAW,GAAG,sBAAsB,aAAa,SAAS;CACtE,UAAA,YAAY,oBAAC,WAAD;EAAW,SAAQ;EAAW,WAAU;CAAU,CAAA;AAC5D,CAAA;;;ACFP,MAAMA,aAAW,IACf;CAAC;CAAU;CAAU;CAAW;CAAmB;CAAqB;AAAU,GAClF;CACE,UAAU,EACR,QAAQ;EACN,MAAM,CAAC;EACP,iBAAiB;GAEf;GACA;GACA;GACA;GACA;GACA;GACA;EACF;CACF,EACF;CACA,iBAAiB,EACf,QAAQ,OACV;AACF,CACF;AAIA,MAAa,cAAc,EAAE,WAAW,QAAQ,GAAG,WACjD,oBAAC,MAAD;CAAI,GAAI;CAAM,WAAWA,WAAS;EAAE;EAAQ;CAAU,CAAC;AAAI,CAAA;;;AC1B7D,MAAa,oBAAoB,EAAE,KAAK,WAAW,OAAO,UAAU,KAAK,KAAK,GAAG,WAAkB;CACjG,MAAM,UAAU,OAAO;CAEvB,OACE,oBAAC,UAAD;EACE,GAAI;EACC;EACC;EACN,WAAW,GACT,WACA,mBACA,qBACA,aAEA,oBACA,sBACA,eAEA,iBACA,qBACA,qBAGA,gCACA,kCAGA,mCACA,2BACA,yCACA,SACF;EAEA,UAAA,qBAAC,YAAY,MAAb,EAAA,UAAA,CACE,oBAAC,YAAY,OAAb;GAAwB;GAAK,KAAK;GAAS,WAAU;EAAgC,CAAA,GAErF,oBAAC,YAAY,UAAb;GAAsB,SAAA;GACpB,UAAA,oBAAC,cAAD;IACE,QAAA;IACA,MAAM;IACN,SAAQ;IACR,QAAQ;KAAC;KAAW;KAAW;KAAW;KAAW;IAAS;IAC9D,MAAM;GACP,CAAA;EACmB,CAAA,CACN,EAAA,CAAA;CACZ,CAAA;AAEZ;;;ACtDA,MAAMC,aAAW,IACf;CACE;CACA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EAAE,SAAS,cAAc;CAC1C,UAAU,EACR,SAAS;EACP,MAAM,CAAC,8BAA8B,oCAAoC;EACzE,mBAAmB,CAAC,iBAAiB,uBAAuB;EAC5D,eAAe;GAEb;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EACA,0BAA0B;GACxB;GACA;GAEA;GACA;GACA;GACA;EACF;EACA,eAAe;GAAC;GAAa;GAAW;EAA4C;EACpF,UAAU;GAAC;GAAe;GAA8B;EAAY;CACtE,EACF;AACF,CACF;AAIA,MAAa,2BAA2B,EACtC,KACA,UAAU,OACV,WACA,UAAU,eACV,GAAG,YACQ;CAGX,OAAO,oBAFM,UAAU,OAAO,QAEvB;EAAM,GAAI;EAAY;EAAK,WAAWA,WAAS;GAAE;GAAS;EAAU,CAAC;CAAI,CAAA;AAClF;;;ACtDA,MAAM,WAAW,IACf;CACE;CACA;CACA;CACA;CACA;CACA;CAEA;CAEA;CACA;CACA;CACA;CAGA;CACA;CACA;CAGA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EACf,SAAS,UACX;CACA,UAAU,EACR,SAAS;EACP,SAAS;GACP;GACA;GACA;GACA;GACA;GACA;GACA;GAMA;GACA;GACA;GACA;EACF;EACA,YAAY;GACV;GACA;GACA;GACA;GAEA;GACA;GACA;GAEA;GACA;GACA;GAEA;EACF;EACA,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EACA,QAAQ;GACN;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;CACF,EACF;AACF,CACF;AAQA,MAAa,oBAAoB,EAC/B,KACA,WACA,OAAO,UACP,UACA,MACA,UAAU,OACV,UAAU,WACV,GAAG,WACQ;CACX,MAAM,OAAO,UAAU,OAAO;CAC9B,MAAM,kBAAkB,YAAY;CACpC,MAAM,sBAAsB,YAAY;CACxC,MAAM,YAAY,kBAAkB,oBAAC,QAAD,CAAS,CAAA,IAAI;CAEjD,MAAM,0BAAqF;EACzF,IAAI,mBAAmB,YAAY,QAAQ,OAAO;EAClD,IAAI,qBAAqB,OAAO;EAChC,OAAO;CACT,EAAA,CAAG;CAEH,OACE,qBAAC,MAAD;EACE,GAAI;EACC;EACC;EACN,gBAAc;EACd,WAAW,GAAG,SAAS;GAAE;GAAW;EAAQ,CAAC,CAAC;EALhD,UAAA,CAOG,aACC,oBAAC,yBAAD;GAAyB,SAAS;GAAmB,UAAA;EAAmC,CAAA,GAG1F,oBAAC,WAAD,EAAY,SAAoB,CAAA,CAC5B;;AAEV;;;AC1IA,MAAa,kBAAkB,EAAE,WAAW,GAAG,WAC7C,oBAAC,MAAD;CAAI,GAAI;CAAM,WAAW,GAAG,WAAW,mBAAmB,YAAY,SAAS;AAAI,CAAA;;;ACMrF,MAAM,mBAAmB,IACvB;CACE;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAGA;CACA;CAEA;CAEA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EACf,UAAU,MACZ;CACA,UAAU,EACR,UAAU;EACR,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EACA,OAAO;CACT,EACF;AACF,CACF;;;;;;;;;;AAgBA,MAAa,UAAU,EAAE,WAAW,SAAS,QAAQ,WAAW,OAAO,GAAG,WAGxE,oBAAC,OAAD;CACE,cAAW;CACX,GAAI;CAEJ,aAAU;CACV,eAAa;CACb,WAAW,iBAAiB;EAAE;EAAU;CAAU,CAAC;AACpD,CAAA;AAGH,OAAO,SAAS;AAChB,OAAO,SAAS;AAChB,OAAO,UAAU;AAEjB,OAAO,OAAO;AACd,OAAO,WAAW;AAClB,OAAO,aAAa;AACpB,OAAO,oBAAoB;AAC3B,OAAO,aAAa"}
|
|
1
|
+
{"version":3,"file":"Navbar-DHUS7XiU.js","names":["variants","variants"],"sources":["../src/components/Navbar/NavbarContent.tsx","../src/components/Navbar/NavbarFooter.tsx","../src/components/Navbar/NavbarHeader.tsx","../src/components/Navbar/NavbarMenu.tsx","../src/components/Navbar/NavbarMenuAvatar.tsx","../src/components/Navbar/NavbarMenuItemAdornment.tsx","../src/components/Navbar/NavbarMenuButton.tsx","../src/components/Navbar/NavbarMenuItem.tsx","../src/components/Navbar/Navbar.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\nimport { ScrollArea } from '../ScrollArea';\n\ntype Props = {\n className?: string;\n children?: ReactNode;\n};\n\nexport const NavbarContent = ({ children, className }: Props) => (\n <ScrollArea\n type=\"auto\"\n orientation=\"horizontal\"\n className=\"tw:flex-1\"\n scrollBarClassName=\"tw:h-1.5\"\n >\n <div className={cn('tw:flex', 'tw:py-1.5', className)}>{children}</div>\n </ScrollArea>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\n// `flex items-center`, not a bare block: this slot is documented to hold several\n// items (search, notifications, avatar). As a block they are inline-level boxes\n// aligned on a text baseline, so a button carrying an icon and a text-only button\n// sit at different heights — visibly off-centre against the bar. Centring them is\n// a no-op for the common single-`Navbar.Menu` child, and `gap` only applies\n// between siblings, so existing compositions keep their spacing.\nexport const NavbarFooter = ({ children, className, ...rest }: Props) => (\n <div {...rest} className={cn('tw:flex tw:items-center tw:gap-2 tw:py-1.5', className)}>\n {children}\n </div>\n);\n","import { type ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\nimport { BrandLogo } from '../BrandLogo';\n\ntype Props = ComponentProps<'div'>;\n\nexport const NavbarHeader = ({ children, className, ...rest }: Props) => (\n // BrandLogo reads the nearest ThemeProvider (or the default context) and\n // renders null when the active brand ships no logo, so no provider gate needed.\n <div {...rest} className={cn('tw:overflow-hidden', 'tw:py-1.5', className)}>\n {children ?? <BrandLogo variant=\"wordmark\" className=\"tw:h-7\" />}\n </div>\n);\n","import type { ComponentProps } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\n// `tw:m-0` alongside `tw:p-0`: browsers give `<ul>` a default block margin. In a plain\n// app the scoped preflight resets it, but in kbc-ui the legacy Bootstrap layer (which sits\n// above the preflight so Bootstrap padding survives on its own elements) re-applies\n// `ul { margin-bottom: 10px }`, which then inflates this menu's height and pushes the whole\n// navbar row off-center. Resetting the margin explicitly (utilities beat the legacy layer)\n// keeps the row centered everywhere.\nconst variants = cva(\n ['tw:m-0', 'tw:p-0', 'tw:flex', 'tw:items-center', 'tw:justify-center', 'tw:gap-2'],\n {\n variants: {\n marker: {\n none: [],\n 'forward-slash': [\n // Style all li children with pseudo-element marker\n 'tw:[&_li]:flex',\n 'tw:[&_li]:items-center',\n 'tw:[&_li]:before:content-[\"/\"]',\n 'tw:[&_li]:before:text-border',\n 'tw:[&_li]:before:text-sm',\n 'tw:[&_li]:before:mr-0.5',\n 'tw:[&_li:not(:first-child)]:before:ml-0.5',\n ],\n },\n },\n defaultVariants: {\n marker: 'none',\n },\n },\n);\n\ntype Props = ComponentProps<'ul'> & VariantProps<typeof variants>;\n\nexport const NavbarMenu = ({ className, marker, ...rest }: Props) => (\n <ul {...rest} className={variants({ marker, className })} />\n);\n","import type { ComponentProps } from 'react';\nimport * as RadixAvatar from '@radix-ui/react-avatar';\nimport BoringAvatar from 'boring-avatars';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'button'> & {\n src?: string;\n alt?: string;\n};\n\nexport const NavbarMenuAvatar = ({ ref, className, type = 'button', src, alt, ...rest }: Props) => {\n const altText = alt ?? 'Avatar';\n\n return (\n <button\n {...rest}\n ref={ref}\n type={type}\n className={cn(\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-center',\n 'tw:size-8',\n\n 'tw:aspect-square',\n 'tw:overflow-hidden',\n 'tw:shrink-0',\n\n 'tw:rounded-lg',\n 'tw:bg-transparent',\n 'tw:cursor-pointer',\n\n // Disabled state\n 'tw:disabled:opacity-disabled',\n 'tw:disabled:cursor-not-allowed',\n\n // Focus-visible (matches SidebarMenuButton exactly)\n 'tw:focus-visible:outline-hidden',\n 'tw:focus-visible:ring-2',\n 'tw:focus-visible:ring-sidebar-ring/50',\n className,\n )}\n >\n <RadixAvatar.Root>\n <RadixAvatar.Image src={src} alt={altText} className=\"tw:size-full tw:object-cover\" />\n\n <RadixAvatar.Fallback asChild>\n <BoringAvatar\n square\n name={altText}\n variant=\"beam\"\n colors={['#1F8FFF', '#004787', '#28D8FF', '#925cff', '#A8C2E6']}\n size={32}\n />\n </RadixAvatar.Fallback>\n </RadixAvatar.Root>\n </button>\n );\n};\n","import type { ComponentProps } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nconst variants = cva(\n [\n 'tw:flex',\n 'tw:justify-center',\n 'tw:items-center',\n\n 'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3',\n 'tw:[&:not(svg)]:h-5',\n 'tw:[&:not(svg)]:min-w-5',\n\n 'tw:p-1',\n 'tw:aspect-square',\n 'tw:rounded-md',\n ],\n {\n defaultVariants: { variant: 'icon-accent' },\n variants: {\n variant: {\n icon: ['tw:text-sidebar-foreground', 'tw:[&_svg]:text-sidebar-foreground'],\n 'icon-emphasized': ['tw:text-white', 'tw:[&_svg]:text-white'],\n 'icon-accent': [\n // color-aware accent styling\n 'tw:group-data-[accent=blue]/navbar:text-sidebar-primary',\n 'tw:group-data-[accent=blue]/navbar:[&_svg]:text-sidebar-primary',\n 'tw:group-data-[accent=purple]/navbar:text-purple-500',\n 'tw:group-data-[accent=purple]/navbar:[&_svg]:text-purple-500',\n 'tw:group-data-[accent=orange]/navbar:text-warning-500',\n 'tw:group-data-[accent=orange]/navbar:[&_svg]:text-warning-500',\n 'tw:group-data-[accent=green]/navbar:text-primary-500',\n 'tw:group-data-[accent=green]/navbar:[&_svg]:text-primary-500',\n ],\n 'icon-accent-emphasized': [\n 'tw:text-white',\n 'tw:[&_svg]:text-white',\n\n 'tw:group-data-[accent=blue]/navbar:bg-sidebar-primary',\n 'tw:group-data-[accent=purple]/navbar:bg-purple-500',\n 'tw:group-data-[accent=orange]/navbar:bg-warning-500',\n 'tw:group-data-[accent=green]/navbar:bg-primary-500',\n ],\n 'icon-button': ['tw:size-4', 'tw:!p-0', 'tw:[&_svg:not([class*=\"tw:size-\"])]:size-4'],\n shortcut: ['tw:bg-muted', 'tw:text-sidebar-foreground', 'tw:ml-auto'],\n },\n },\n },\n);\n\ntype Props = { asChild?: boolean } & ComponentProps<'span'> & VariantProps<typeof variants>;\n\nexport const NavbarMenuItemAdornment = ({\n ref,\n asChild = false,\n className,\n variant = 'icon-accent',\n ...props\n}: Props) => {\n const Comp = asChild ? Slot : 'span';\n\n return <Comp {...props} ref={ref} className={variants({ variant, className })} />;\n};\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Root, Slottable } from '@radix-ui/react-slot';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { Search } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { NavbarMenuItemAdornment } from './NavbarMenuItemAdornment';\n\nconst variants = cva(\n [\n 'tw:group/navbar-menu-button',\n 'tw:box-border',\n 'tw:flex',\n 'tw:items-center',\n 'tw:gap-2',\n 'tw:bg-transparent',\n\n 'tw:leading-9',\n\n 'tw:border',\n 'tw:rounded-lg',\n 'tw:whitespace-nowrap',\n 'tw:select-none',\n\n // focus-visible\n 'tw:!outline-hidden',\n 'tw:focus-visible:ring-2',\n 'tw:focus-visible:ring-sidebar-ring/50',\n\n // disabled\n 'tw:disabled:opacity-disabled',\n 'tw:disabled:hover:bg-transparent',\n 'tw:disabled:cursor-not-allowed',\n ],\n {\n defaultVariants: {\n variant: 'default',\n },\n variants: {\n variant: {\n default: [\n 'tw:max-h-9',\n 'tw:border-transparent',\n 'tw:py-2',\n 'tw:px-1.5',\n 'tw:text-sidebar-foreground',\n 'tw:hover:bg-sidebar-hover',\n 'tw:aria-expanded:bg-sidebar-hover',\n\n // Active page. Mirrors `Sidebar.MenuButton`, which styles `aria-current=\"page\"` — a top nav\n // needs the same affordance, and without it a Navbar-shelled app cannot show where you are.\n // `aria-current` rather than a prop: with `asChild` the slot is an <a>, and that is the\n // attribute a router sets on an active link (TanStack's `Link` does it for free).\n 'tw:aria-[current=page]:bg-sidebar-selected',\n 'tw:aria-[current=page]:hover:bg-sidebar-selected',\n 'tw:aria-[current=page]:text-[var(--sidebar-selected-foreground,rgb(var(--sidebar-foreground)))]',\n 'tw:aria-[current=page]:font-medium',\n ],\n emphasized: [\n 'tw:max-h-9',\n 'tw:border-transparent',\n 'tw:py-2',\n 'tw:px-1.5',\n\n 'tw:text-sidebar-foreground',\n 'tw:hover:bg-sidebar-hover',\n 'tw:aria-expanded:bg-sidebar-hover',\n\n 'tw:aria-[current=page]:bg-sidebar-selected',\n 'tw:aria-[current=page]:hover:bg-sidebar-selected',\n 'tw:aria-[current=page]:text-[var(--sidebar-selected-foreground,rgb(var(--sidebar-foreground)))]',\n\n 'tw:font-semibold',\n ],\n icon: [\n 'tw:size-8',\n 'tw:aspect-square',\n 'tw:justify-center',\n 'tw:font-normal',\n 'tw:border-transparent',\n 'tw:text-primary',\n 'tw:[&_svg]:!text-primary',\n 'tw:hover:bg-sidebar-hover',\n 'tw:aria-expanded:bg-sidebar-hover',\n ],\n search: [\n 'tw:max-h-8',\n 'tw:min-w-52',\n 'tw:px-3',\n 'tw:py-1',\n 'tw:font-normal',\n 'tw:border-input',\n 'tw:text-muted-foreground',\n 'tw:[&_svg]:!text-muted-foreground',\n ],\n },\n },\n },\n);\n\ntype Props = ComponentProps<'button'> & {\n /** Optional leading-icon slot. Pass a Lucide icon node to render an adornment before children. */\n icon?: ReactNode;\n asChild?: boolean;\n} & VariantProps<typeof variants>;\n\nexport const NavbarMenuButton = ({\n ref,\n className,\n type = 'button',\n children,\n icon,\n asChild = false,\n variant = 'default',\n ...rest\n}: Props) => {\n const Comp = asChild ? Root : 'button';\n const isSearchVariant = variant === 'search';\n const isEmphasizedVariant = variant === 'emphasized';\n const adornment = isSearchVariant ? <Search /> : icon;\n\n const adornmentVariant: ComponentProps<typeof NavbarMenuItemAdornment>['variant'] = (() => {\n if (isSearchVariant || variant === 'icon') return 'icon-button';\n if (isEmphasizedVariant) return 'icon-accent-emphasized';\n return 'icon-accent';\n })();\n\n return (\n <Comp\n {...rest}\n ref={ref}\n type={type}\n data-variant={variant}\n className={cn(variants({ className, variant }))}\n >\n {adornment && (\n <NavbarMenuItemAdornment variant={adornmentVariant}>{adornment}</NavbarMenuItemAdornment>\n )}\n\n <Slottable>{children}</Slottable>\n </Comp>\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'li'>;\n\nexport const NavbarMenuItem = ({ className, ...rest }: Props) => (\n <li {...rest} className={cn('tw:flex', 'tw:items-center', 'tw:gap-2', className)} />\n);\n","import type { ComponentProps } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { NavbarContent } from './NavbarContent';\nimport { NavbarFooter } from './NavbarFooter';\nimport { NavbarHeader } from './NavbarHeader';\nimport { NavbarMenu } from './NavbarMenu';\nimport { NavbarMenuAvatar } from './NavbarMenuAvatar';\nimport { NavbarMenuButton } from './NavbarMenuButton';\nimport { NavbarMenuItem } from './NavbarMenuItem';\nimport { NavbarMenuItemAdornment } from './NavbarMenuItemAdornment';\n\nconst navbarClassnames = cva(\n [\n 'tailwindcss-preflight',\n 'tw:group/navbar',\n 'tw:sticky',\n 'tw:top-0',\n 'tw:z-50',\n 'tw:flex',\n 'tw:gap-2',\n 'tw:items-center',\n\n // The left side is intentionally smaller to align the logo with the sidebar icons.\n 'tw:pl-2',\n 'tw:pr-3',\n\n 'tw:bg-sidebar',\n // Required with `bg-sidebar`: otherwise `currentColor` (text, `BrandLogo`) is black on dark.\n 'tw:text-sidebar-foreground',\n 'tw:text-xs',\n 'tw:leading-4',\n ],\n {\n defaultVariants: {\n bordered: false,\n },\n variants: {\n bordered: {\n true: [\n 'tw:before:content',\n 'tw:before:h-0.5',\n 'tw:before:w-full',\n 'tw:before:absolute',\n 'tw:before:left-0',\n 'tw:before:top-0',\n 'tw:data-[accent=blue]:before:bg-sidebar-primary',\n 'tw:data-[accent=purple]:before:bg-purple-500',\n 'tw:data-[accent=green]:before:bg-primary-500',\n 'tw:data-[accent=orange]:before:bg-warning-500',\n ],\n false: '',\n },\n },\n },\n);\n\ntype Props = ComponentProps<'nav'> &\n VariantProps<typeof navbarClassnames> & {\n accent?: 'blue' | 'purple' | 'green' | 'orange';\n };\n\n/**\n * Top navigation bar for the app shell, hosted inside `<AppShell.Header>`.\n *\n * - Composition: `Navbar.Header` (brand), `Navbar.Content` (scrollable menu), `Navbar.Footer`.\n * - `bordered` adds a top hairline coloured by `accent`.\n * - Override the default `aria-label` when a page has more than one nav.\n *\n * @see AppShell — the sidebar rail uses `Sidebar` instead.\n */\nexport const Navbar = ({ className, accent = 'blue', bordered = false, ...rest }: Props) => (\n // - `<nav>`, not `<header>`: `AppShell.Header` is already the `<header>` landmark.\n // - `aria-label` precedes `...rest` so a caller's label wins.\n <nav\n aria-label=\"Main navigation\"\n {...rest}\n data-slot=\"navbar\"\n data-accent={accent}\n className={navbarClassnames({ bordered, className })}\n />\n);\n\nNavbar.Header = NavbarHeader;\nNavbar.Footer = NavbarFooter;\nNavbar.Content = NavbarContent;\n\nNavbar.Menu = NavbarMenu;\nNavbar.MenuItem = NavbarMenuItem;\nNavbar.MenuButton = NavbarMenuButton;\nNavbar.MenuItemAdornment = NavbarMenuItemAdornment;\nNavbar.MenuAvatar = NavbarMenuAvatar;\n"],"mappings":";;;;;;;;;;AAUA,MAAa,iBAAiB,EAAE,UAAU,gBACxC,oBAAC,YAAD;CACE,MAAK;CACL,aAAY;CACZ,WAAU;CACV,oBAAmB;CAEnB,UAAA,oBAAC,OAAD;EAAK,WAAW,GAAG,WAAW,aAAa,SAAS;EAAI;CAAc,CAAA;AAC5D,CAAA;;;ACNd,MAAa,gBAAgB,EAAE,UAAU,WAAW,GAAG,WACrD,oBAAC,OAAD;CAAK,GAAI;CAAM,WAAW,GAAG,8CAA8C,SAAS;CACjF;AACE,CAAA;;;ACRP,MAAa,gBAAgB,EAAE,UAAU,WAAW,GAAG,WAGrD,oBAAC,OAAD;CAAK,GAAI;CAAM,WAAW,GAAG,sBAAsB,aAAa,SAAS;CACtE,UAAA,YAAY,oBAAC,WAAD;EAAW,SAAQ;EAAW,WAAU;CAAU,CAAA;AAC5D,CAAA;;;ACFP,MAAMA,aAAW,IACf;CAAC;CAAU;CAAU;CAAW;CAAmB;CAAqB;AAAU,GAClF;CACE,UAAU,EACR,QAAQ;EACN,MAAM,CAAC;EACP,iBAAiB;GAEf;GACA;GACA;GACA;GACA;GACA;GACA;EACF;CACF,EACF;CACA,iBAAiB,EACf,QAAQ,OACV;AACF,CACF;AAIA,MAAa,cAAc,EAAE,WAAW,QAAQ,GAAG,WACjD,oBAAC,MAAD;CAAI,GAAI;CAAM,WAAWA,WAAS;EAAE;EAAQ;CAAU,CAAC;AAAI,CAAA;;;AC1B7D,MAAa,oBAAoB,EAAE,KAAK,WAAW,OAAO,UAAU,KAAK,KAAK,GAAG,WAAkB;CACjG,MAAM,UAAU,OAAO;CAEvB,OACE,oBAAC,UAAD;EACE,GAAI;EACC;EACC;EACN,WAAW,GACT,WACA,mBACA,qBACA,aAEA,oBACA,sBACA,eAEA,iBACA,qBACA,qBAGA,gCACA,kCAGA,mCACA,2BACA,yCACA,SACF;EAEA,UAAA,qBAAC,YAAY,MAAb,EAAA,UAAA,CACE,oBAAC,YAAY,OAAb;GAAwB;GAAK,KAAK;GAAS,WAAU;EAAgC,CAAA,GAErF,oBAAC,YAAY,UAAb;GAAsB,SAAA;GACpB,UAAA,oBAAC,cAAD;IACE,QAAA;IACA,MAAM;IACN,SAAQ;IACR,QAAQ;KAAC;KAAW;KAAW;KAAW;KAAW;IAAS;IAC9D,MAAM;GACP,CAAA;EACmB,CAAA,CACN,EAAA,CAAA;CACZ,CAAA;AAEZ;;;ACtDA,MAAMC,aAAW,IACf;CACE;CACA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EAAE,SAAS,cAAc;CAC1C,UAAU,EACR,SAAS;EACP,MAAM,CAAC,8BAA8B,oCAAoC;EACzE,mBAAmB,CAAC,iBAAiB,uBAAuB;EAC5D,eAAe;GAEb;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EACA,0BAA0B;GACxB;GACA;GAEA;GACA;GACA;GACA;EACF;EACA,eAAe;GAAC;GAAa;GAAW;EAA4C;EACpF,UAAU;GAAC;GAAe;GAA8B;EAAY;CACtE,EACF;AACF,CACF;AAIA,MAAa,2BAA2B,EACtC,KACA,UAAU,OACV,WACA,UAAU,eACV,GAAG,YACQ;CAGX,OAAO,oBAFM,UAAU,OAAO,QAEvB;EAAM,GAAI;EAAY;EAAK,WAAWA,WAAS;GAAE;GAAS;EAAU,CAAC;CAAI,CAAA;AAClF;;;ACtDA,MAAM,WAAW,IACf;CACE;CACA;CACA;CACA;CACA;CACA;CAEA;CAEA;CACA;CACA;CACA;CAGA;CACA;CACA;CAGA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EACf,SAAS,UACX;CACA,UAAU,EACR,SAAS;EACP,SAAS;GACP;GACA;GACA;GACA;GACA;GACA;GACA;GAMA;GACA;GACA;GACA;EACF;EACA,YAAY;GACV;GACA;GACA;GACA;GAEA;GACA;GACA;GAEA;GACA;GACA;GAEA;EACF;EACA,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EACA,QAAQ;GACN;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;CACF,EACF;AACF,CACF;AAQA,MAAa,oBAAoB,EAC/B,KACA,WACA,OAAO,UACP,UACA,MACA,UAAU,OACV,UAAU,WACV,GAAG,WACQ;CACX,MAAM,OAAO,UAAU,OAAO;CAC9B,MAAM,kBAAkB,YAAY;CACpC,MAAM,sBAAsB,YAAY;CACxC,MAAM,YAAY,kBAAkB,oBAAC,QAAD,CAAS,CAAA,IAAI;CAEjD,MAAM,0BAAqF;EACzF,IAAI,mBAAmB,YAAY,QAAQ,OAAO;EAClD,IAAI,qBAAqB,OAAO;EAChC,OAAO;CACT,EAAA,CAAG;CAEH,OACE,qBAAC,MAAD;EACE,GAAI;EACC;EACC;EACN,gBAAc;EACd,WAAW,GAAG,SAAS;GAAE;GAAW;EAAQ,CAAC,CAAC;EALhD,UAAA,CAOG,aACC,oBAAC,yBAAD;GAAyB,SAAS;GAAmB,UAAA;EAAmC,CAAA,GAG1F,oBAAC,WAAD,EAAY,SAAoB,CAAA,CAC5B;;AAEV;;;AC1IA,MAAa,kBAAkB,EAAE,WAAW,GAAG,WAC7C,oBAAC,MAAD;CAAI,GAAI;CAAM,WAAW,GAAG,WAAW,mBAAmB,YAAY,SAAS;AAAI,CAAA;;;ACMrF,MAAM,mBAAmB,IACvB;CACE;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAGA;CACA;CAEA;CAEA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EACf,UAAU,MACZ;CACA,UAAU,EACR,UAAU;EACR,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EACA,OAAO;CACT,EACF;AACF,CACF;;;;;;;;;;AAgBA,MAAa,UAAU,EAAE,WAAW,SAAS,QAAQ,WAAW,OAAO,GAAG,WAGxE,oBAAC,OAAD;CACE,cAAW;CACX,GAAI;CACJ,aAAU;CACV,eAAa;CACb,WAAW,iBAAiB;EAAE;EAAU;CAAU,CAAC;AACpD,CAAA;AAGH,OAAO,SAAS;AAChB,OAAO,SAAS;AAChB,OAAO,UAAU;AAEjB,OAAO,OAAO;AACd,OAAO,WAAW;AAClB,OAAO,aAAa;AACpB,OAAO,oBAAoB;AAC3B,OAAO,aAAa"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OtpInput-CY8yCaJk.js","names":[],"sources":["../src/blocks/OtpInput/OtpInputGroup.tsx","../src/blocks/OtpInput/OtpInputSeparator.tsx","../src/blocks/OtpInput/OtpInputSlot.tsx","../src/blocks/OtpInput/OtpInput.tsx"],"sourcesContent":["import type { ComponentProps, Ref } from 'react';\n\nimport { cn } from '../../utils';\n\ntype GroupProps = ComponentProps<'div'>;\n\nexport const OtpInputGroup = ({\n ref,\n className,\n ...props\n}: GroupProps & { ref?: Ref<HTMLDivElement> }) => (\n <div ref={ref} className={cn('tw:flex tw:items-center tw:gap-2', className)} {...props} />\n);\n","import type { ComponentProps, Ref } from 'react';\n\nimport { Minus } from '../../icons';\nimport { cn } from '../../utils';\n\ntype SeparatorProps = ComponentProps<'div'>;\n\nexport const OtpInputSeparator = ({\n ref,\n children,\n className,\n ...props\n}: SeparatorProps & { ref?: Ref<HTMLDivElement> }) => (\n <div\n ref={ref}\n role=\"separator\"\n aria-orientation=\"vertical\"\n className={cn('tw:flex tw:items-center tw:text-muted-foreground', className)}\n {...props}\n >\n {children ?? <Minus className=\"tw:size-4\" />}\n </div>\n);\n","import { type ComponentProps, type Ref, use } from 'react';\nimport { OTPInputContext } from 'input-otp';\n\nimport { cn } from '../../utils';\n\nconst slotClassName = [\n // layout\n 'tw:relative',\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-center',\n 'tw:font-medium',\n 'tw:tabular-nums',\n 'tw:outline-hidden',\n 'tw:transition',\n // resting chrome — always-visible input border on a muted fill (matches InputGroup)\n 'tw:border',\n 'tw:border-solid',\n 'tw:border-input',\n 'tw:bg-muted',\n 'tw:text-foreground',\n 'tw:rounded-[var(--radius-lg,0.25rem)]',\n // focus — the active slot mirrors InputGroup's
|
|
1
|
+
{"version":3,"file":"OtpInput-CY8yCaJk.js","names":[],"sources":["../src/blocks/OtpInput/OtpInputGroup.tsx","../src/blocks/OtpInput/OtpInputSeparator.tsx","../src/blocks/OtpInput/OtpInputSlot.tsx","../src/blocks/OtpInput/OtpInput.tsx"],"sourcesContent":["import type { ComponentProps, Ref } from 'react';\n\nimport { cn } from '../../utils';\n\ntype GroupProps = ComponentProps<'div'>;\n\nexport const OtpInputGroup = ({\n ref,\n className,\n ...props\n}: GroupProps & { ref?: Ref<HTMLDivElement> }) => (\n <div ref={ref} className={cn('tw:flex tw:items-center tw:gap-2', className)} {...props} />\n);\n","import type { ComponentProps, Ref } from 'react';\n\nimport { Minus } from '../../icons';\nimport { cn } from '../../utils';\n\ntype SeparatorProps = ComponentProps<'div'>;\n\nexport const OtpInputSeparator = ({\n ref,\n children,\n className,\n ...props\n}: SeparatorProps & { ref?: Ref<HTMLDivElement> }) => (\n <div\n ref={ref}\n role=\"separator\"\n aria-orientation=\"vertical\"\n className={cn('tw:flex tw:items-center tw:text-muted-foreground', className)}\n {...props}\n >\n {children ?? <Minus className=\"tw:size-4\" />}\n </div>\n);\n","import { type ComponentProps, type Ref, use } from 'react';\nimport { OTPInputContext } from 'input-otp';\n\nimport { cn } from '../../utils';\n\nconst slotClassName = [\n // layout\n 'tw:relative',\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-center',\n 'tw:font-medium',\n 'tw:tabular-nums',\n 'tw:outline-hidden',\n 'tw:transition',\n // resting chrome — always-visible input border on a muted fill (matches InputGroup)\n 'tw:border',\n 'tw:border-solid',\n 'tw:border-input',\n 'tw:bg-muted',\n 'tw:text-foreground',\n 'tw:rounded-[var(--radius-lg,0.25rem)]',\n // focus — the active slot mirrors InputGroup's focus ring; z-10 so the ring isn't clipped\n 'tw:data-[active=true]:z-10',\n 'tw:data-[active=true]:border-primary',\n 'tw:data-[active=true]:ring-4',\n 'tw:data-[active=true]:ring-ring/50',\n // size — from `data-size` on the group/otp container\n 'tw:group-data-[size=sm]/otp:h-8 tw:group-data-[size=sm]/otp:w-8 tw:group-data-[size=sm]/otp:text-sm',\n 'tw:group-data-[size=md]/otp:h-9 tw:group-data-[size=md]/otp:w-9 tw:group-data-[size=md]/otp:text-base',\n 'tw:group-data-[size=lg]/otp:h-10 tw:group-data-[size=lg]/otp:w-10 tw:group-data-[size=lg]/otp:text-lg',\n // error — from `aria-invalid` on the OTP input (mirrors InputGroup's error chrome). `!` beats\n // the base/active border once tailwind-merge dedupes.\n 'tw:group-has-[input[aria-invalid=true]]/otp:!border-destructive',\n 'tw:group-has-[input[aria-invalid=true]]/otp:data-[active=true]:!border-destructive',\n 'tw:group-has-[input[aria-invalid=true]]/otp:data-[active=true]:ring-destructive/20',\n];\n\ntype SlotProps = Omit<ComponentProps<'div'>, 'children'> & {\n index: number;\n};\n\nexport const OtpInputSlot = ({\n ref,\n index,\n className,\n ...props\n}: SlotProps & { ref?: Ref<HTMLDivElement> }) => {\n // `input-otp` exposes per-slot char / active / caret state through its render context.\n const { slots } = use(OTPInputContext);\n // The context default has no `slots` — a slot rendered outside `<OtpInput>` would otherwise throw\n // a cryptic \"cannot read properties of undefined\". Fail with an actionable message instead.\n if (!slots) throw new Error('<OtpInput.Slot> must be rendered inside <OtpInput>.');\n const slot = slots[index];\n const char = slot?.char ?? null;\n const isActive = slot?.isActive ?? false;\n const hasFakeCaret = slot?.hasFakeCaret ?? false;\n\n return (\n <div\n ref={ref}\n data-active={isActive || undefined}\n data-slot-index={index}\n className={cn(slotClassName, className)}\n {...props}\n >\n {char}\n {hasFakeCaret && (\n <div\n aria-hidden=\"true\"\n className=\"tw:pointer-events-none tw:absolute tw:inset-0 tw:flex tw:items-center tw:justify-center\"\n >\n <div className=\"tw:h-1/2 tw:w-px tw:animate-caret-blink tw:bg-foreground\" />\n </div>\n )}\n </div>\n );\n};\n","import type { ComponentProps, ReactNode, Ref } from 'react';\nimport { OTPInput, REGEXP_ONLY_DIGITS } from 'input-otp';\n\nimport { cn } from '../../utils';\n\nimport { OtpInputGroup } from './OtpInputGroup';\nimport { OtpInputSeparator } from './OtpInputSeparator';\nimport { OtpInputSlot } from './OtpInputSlot';\n\ntype OtpInputSizing = 'sm' | 'md' | 'lg';\n\ntype OtpElementProps = ComponentProps<typeof OTPInput>;\ntype OtpElementChildrenProps = Omit<\n Extract<OtpElementProps, { children: ReactNode }>,\n 'containerClassName'\n>;\n\ntype RootOwnProps = {\n sizing?: OtpInputSizing;\n containerClassName?: string;\n};\n\ntype RootProps = OtpElementChildrenProps & RootOwnProps;\n\nconst Root = ({\n ref,\n sizing = 'md',\n pattern = REGEXP_ONLY_DIGITS,\n containerClassName,\n className,\n children,\n 'aria-invalid': ariaInvalid,\n ...rest\n}: RootProps & { ref?: Ref<HTMLInputElement> }) => (\n <div className=\"tw:group/otp tw:w-fit\" data-size={sizing}>\n <OTPInput\n {...rest}\n ref={ref}\n pattern={pattern}\n aria-invalid={ariaInvalid}\n containerClassName={cn(\n 'tw:flex tw:items-center tw:gap-2 tw:has-[:disabled]:opacity-disabled',\n containerClassName,\n )}\n className={cn('tw:disabled:cursor-not-allowed', className)}\n >\n {children}\n </OTPInput>\n </div>\n);\n\nexport const OtpInput = Object.assign(Root, {\n Group: OtpInputGroup,\n Slot: OtpInputSlot,\n Separator: OtpInputSeparator,\n});\nexport type { RootProps as OtpInputProps };\n"],"mappings":";;;;;;AAMA,MAAa,iBAAiB,EAC5B,KACA,WACA,GAAG,YAEH,oBAAC,OAAD;CAAU;CAAK,WAAW,GAAG,oCAAoC,SAAS;CAAG,GAAI;AAAQ,CAAA;;;ACJ3F,MAAa,qBAAqB,EAChC,KACA,UACA,WACA,GAAG,YAEH,oBAAC,OAAD;CACO;CACL,MAAK;CACL,oBAAiB;CACjB,WAAW,GAAG,oDAAoD,SAAS;CAC3E,GAAI;CAEH,UAAA,YAAY,oBAAC,OAAD,EAAO,WAAU,YAAa,CAAA;AACxC,CAAA;;;AChBP,MAAM,gBAAgB;CAEpB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CACA;CAGA;CACA;CACA;AACF;AAMA,MAAa,gBAAgB,EAC3B,KACA,OACA,WACA,GAAG,YAC4C;CAE/C,MAAM,EAAE,UAAU,IAAI,eAAe;CAGrC,IAAI,CAAC,OAAO,MAAM,IAAI,MAAM,qDAAqD;CACjF,MAAM,OAAO,MAAM;CACnB,MAAM,OAAO,MAAM,QAAQ;CAC3B,MAAM,WAAW,MAAM,YAAY;CACnC,MAAM,eAAe,MAAM,gBAAgB;CAE3C,OACE,qBAAC,OAAD;EACO;EACL,eAAa,YAAY,KAAA;EACzB,mBAAiB;EACjB,WAAW,GAAG,eAAe,SAAS;EACtC,GAAI;EALN,UAAA,CAOG,MACA,gBACC,oBAAC,OAAD;GACE,eAAY;GACZ,WAAU;GAEV,UAAA,oBAAC,OAAD,EAAK,WAAU,2DAA4D,CAAA;EACxE,CAAA,CAEJ;;AAET;;;ACrDA,MAAM,QAAQ,EACZ,KACA,SAAS,MACT,UAAU,oBACV,oBACA,WACA,UACA,gBAAgB,aAChB,GAAG,WAEH,oBAAC,OAAD;CAAK,WAAU;CAAwB,aAAW;CAChD,UAAA,oBAAC,UAAD;EACE,GAAI;EACC;EACI;EACT,gBAAc;EACd,oBAAoB,GAClB,wEACA,kBACF;EACA,WAAW,GAAG,kCAAkC,SAAS;EAExD;CACO,CAAA;AACP,CAAA;AAGP,MAAa,WAAW,OAAO,OAAO,MAAM;CAC1C,OAAO;CACP,MAAM;CACN,WAAW;AACb,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { cn } from "./classNames-DcGnTh2N.js";
|
|
2
2
|
import { ChevronDown, Plus, X } from "./icons-ZIeZXXS7.js";
|
|
3
|
-
import { Button } from "./Button-
|
|
4
|
-
import { Popover } from "./Popover-
|
|
5
|
-
import { Badge } from "./Badge-
|
|
3
|
+
import { Button } from "./Button-BNkyYU8u.js";
|
|
4
|
+
import { Popover } from "./Popover-DtUDwUVO.js";
|
|
5
|
+
import { Badge } from "./Badge-5GHIsgRS.js";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
//#region src/blocks/PageToolbar/PageToolbarToken.tsx
|
|
8
8
|
/**
|
|
@@ -120,4 +120,4 @@ const PageToolbar = Object.assign(Root, {
|
|
|
120
120
|
//#endregion
|
|
121
121
|
export { PageToolbar };
|
|
122
122
|
|
|
123
|
-
//# sourceMappingURL=PageToolbar-
|
|
123
|
+
//# sourceMappingURL=PageToolbar-DJ5tdYla.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageToolbar-
|
|
1
|
+
{"version":3,"file":"PageToolbar-DJ5tdYla.js","names":[],"sources":["../src/blocks/PageToolbar/PageToolbarToken.tsx","../src/blocks/PageToolbar/PageToolbar.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport { Badge } from '../../components/Badge';\nimport { Button } from '../../components/Button';\nimport { Popover } from '../../components/Popover';\nimport { ChevronDown, X } from '../../icons';\n\ntype PageToolbarTokenProps = Omit<\n ComponentPropsWithoutRef<typeof Badge>,\n 'variant' | 'color' | 'suffix' | 'children' | 'asChild' | 'popover'\n> & {\n children: ReactNode;\n /** Popover content rendered when the chevron-down trigger is clicked — typically a value editor. */\n popover: ReactNode;\n onRemove: () => void;\n removeAriaLabel: string;\n};\n\n/**\n * Editable filter token (Query Builder variant) — `Badge` pill with a `chevron-down`\n * popover trigger for editing values and an `×` dismiss button. The popover content\n * is supplied by the caller via the `popover` slot (typically a `Combobox` or option list).\n */\nexport const PageToolbarToken = ({\n children,\n popover,\n onRemove,\n removeAriaLabel,\n ...props\n}: PageToolbarTokenProps) => (\n <Popover>\n <Badge\n {...props}\n asChild\n variant=\"pill\"\n color=\"blue-inverse\"\n suffix={\n <Button\n type=\"button\"\n variant=\"inline\"\n size=\"icon-2xs\"\n aria-label={removeAriaLabel}\n onClick={onRemove}\n >\n <X className=\"tw:size-3\" />\n </Button>\n }\n >\n <Popover.Trigger\n type=\"button\"\n className=\"tw:inline-flex tw:cursor-pointer tw:items-center tw:gap-1 tw:bg-inherit tw:text-inherit tailwindcss-preflight\"\n >\n {children}\n <ChevronDown className=\"tw:size-3\" />\n </Popover.Trigger>\n </Badge>\n <Popover.Content align=\"start\">{popover}</Popover.Content>\n </Popover>\n);\n","import type { ComponentProps, ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport { Badge } from '../../components/Badge';\nimport { Button } from '../../components/Button';\nimport { Plus, X } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { PageToolbarToken } from './PageToolbarToken';\n\ntype DivProps = ComponentProps<'div'>;\n\nconst Root = ({ ref, className, children, ...props }: DivProps) => (\n <div\n ref={ref}\n className={cn('tw:flex tw:flex-wrap tw:items-center tw:gap-3 tw:w-full', className)}\n {...props}\n >\n {children}\n </div>\n);\n\nconst Search = ({ ref, className, children, ...props }: DivProps) => (\n <div\n ref={ref}\n className={cn(\n 'tw:mr-auto tw:flex tw:items-center tw:gap-2 tw:w-full tw:sm:w-auto tw:sm:min-w-64 tw:sm:max-w-md',\n // The search field fills the slot, else it stays content-width and truncates its placeholder.\n // - First child only: stretching the filter pills after it would size them like the input.\n // - `min-w-0` so a long value shrinks the input rather than overflowing the toolbar.\n 'tw:*:first:min-w-0 tw:*:first:flex-1',\n className,\n )}\n {...props}\n >\n {children}\n </div>\n);\n\nconst Right = ({ ref, className, children, ...props }: DivProps) => (\n <div\n ref={ref}\n className={cn('tw:flex tw:flex-wrap tw:items-center tw:gap-2', className)}\n {...props}\n >\n {children}\n </div>\n);\n\nconst ControlGroup = ({ ref, className, children, ...props }: DivProps) => (\n <div ref={ref} className={cn('tw:flex tw:items-center tw:gap-2', className)} {...props}>\n {children}\n </div>\n);\n\nconst ActiveFilters = ({ ref, className, children, ...props }: DivProps) => (\n <div\n ref={ref}\n className={cn('tw:flex tw:flex-wrap tw:items-center tw:gap-2 tw:basis-full', className)}\n {...props}\n >\n {children}\n </div>\n);\n\ntype ChipProps = Omit<\n ComponentPropsWithoutRef<typeof Badge>,\n 'variant' | 'color' | 'suffix' | 'children'\n> & {\n children: ReactNode;\n onRemove: () => void;\n removeAriaLabel: string;\n};\n\nconst Chip = ({ children, onRemove, removeAriaLabel, ...props }: ChipProps) => (\n <Badge\n {...props}\n variant=\"pill\"\n color=\"blue-inverse\"\n suffix={\n <Button\n type=\"button\"\n variant=\"inline\"\n size=\"icon-2xs\"\n aria-label={removeAriaLabel}\n onClick={onRemove}\n >\n <X className=\"tw:size-3\" />\n </Button>\n }\n >\n {children}\n </Badge>\n);\n\ntype ActionProps = ComponentPropsWithoutRef<typeof Button>;\n\nconst AddFilter = ({ className, children, ...props }: ActionProps) => (\n <Button variant=\"invisible\" size=\"small\" className={cn('tw:gap-1.5', className)} {...props}>\n <Plus className=\"tw:size-4\" />\n {children ?? 'Add filter'}\n </Button>\n);\n\nconst Clear = ({ className, children, ...props }: ActionProps) => (\n <Button variant=\"invisible\" size=\"small\" className={cn('tw:ml-auto', className)} {...props}>\n {children ?? 'Clear all'}\n </Button>\n);\n\n/**\n * Search / filter toolbar for index pages, between `PageLayout.Header` and `PageLayout.Content`.\n *\n * - Right cluster order: `Filters` → `Sort` → `Actions` → `View`; nothing after `View`.\n * - `ActiveFilters` only while a filter is active; chips or tokens, never both in one toolbar.\n *\n * @see https://github.com/evviku/design-system-docs/blob/main/docs/patterns/toolbar/toolbar.md\n */\nexport const PageToolbar = Object.assign(Root, {\n Search,\n Right,\n Filters: ControlGroup,\n Sort: ControlGroup,\n Actions: ControlGroup,\n /** Always last in the right cluster. */\n View: ControlGroup,\n /** Render only while a filter is active. */\n ActiveFilters,\n /** Non-editable filter chip. */\n Chip,\n /** Editable filter token; the caller supplies the edit popover via `popover`. */\n Token: PageToolbarToken,\n AddFilter,\n Clear,\n});\n"],"mappings":";;;;;;;;;;;;AAuBA,MAAa,oBAAoB,EAC/B,UACA,SACA,UACA,iBACA,GAAG,YAEH,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,OAAD;CACE,GAAI;CACJ,SAAA;CACA,SAAQ;CACR,OAAM;CACN,QACE,oBAAC,QAAD;EACE,MAAK;EACL,SAAQ;EACR,MAAK;EACL,cAAY;EACZ,SAAS;EAET,UAAA,oBAAC,GAAD,EAAG,WAAU,YAAa,CAAA;CACpB,CAAA;CAGV,UAAA,qBAAC,QAAQ,SAAT;EACE,MAAK;EACL,WAAU;EAFZ,UAAA,CAIG,UACD,oBAAC,aAAD,EAAa,WAAU,YAAa,CAAA,CACrB;;AACZ,CAAA,GACP,oBAAC,QAAQ,SAAT;CAAiB,OAAM;CAAS,UAAA;AAAyB,CAAA,CAClD,EAAA,CAAA;;;AC9CX,MAAM,QAAQ,EAAE,KAAK,WAAW,UAAU,GAAG,YAC3C,oBAAC,OAAD;CACO;CACL,WAAW,GAAG,2DAA2D,SAAS;CAClF,GAAI;CAEH;AACE,CAAA;AAGP,MAAM,UAAU,EAAE,KAAK,WAAW,UAAU,GAAG,YAC7C,oBAAC,OAAD;CACO;CACL,WAAW,GACT,oGAIA,wCACA,SACF;CACA,GAAI;CAEH;AACE,CAAA;AAGP,MAAM,SAAS,EAAE,KAAK,WAAW,UAAU,GAAG,YAC5C,oBAAC,OAAD;CACO;CACL,WAAW,GAAG,iDAAiD,SAAS;CACxE,GAAI;CAEH;AACE,CAAA;AAGP,MAAM,gBAAgB,EAAE,KAAK,WAAW,UAAU,GAAG,YACnD,oBAAC,OAAD;CAAU;CAAK,WAAW,GAAG,oCAAoC,SAAS;CAAG,GAAI;CAC9E;AACE,CAAA;AAGP,MAAM,iBAAiB,EAAE,KAAK,WAAW,UAAU,GAAG,YACpD,oBAAC,OAAD;CACO;CACL,WAAW,GAAG,+DAA+D,SAAS;CACtF,GAAI;CAEH;AACE,CAAA;AAYP,MAAM,QAAQ,EAAE,UAAU,UAAU,iBAAiB,GAAG,YACtD,oBAAC,OAAD;CACE,GAAI;CACJ,SAAQ;CACR,OAAM;CACN,QACE,oBAAC,QAAD;EACE,MAAK;EACL,SAAQ;EACR,MAAK;EACL,cAAY;EACZ,SAAS;EAET,UAAA,oBAAC,GAAD,EAAG,WAAU,YAAa,CAAA;CACpB,CAAA;CAGT;AACI,CAAA;AAKT,MAAM,aAAa,EAAE,WAAW,UAAU,GAAG,YAC3C,qBAAC,QAAD;CAAQ,SAAQ;CAAY,MAAK;CAAQ,WAAW,GAAG,cAAc,SAAS;CAAG,GAAI;CAArF,UAAA,CACE,oBAAC,MAAD,EAAM,WAAU,YAAa,CAAA,GAC5B,YAAY,YACP;;AAGV,MAAM,SAAS,EAAE,WAAW,UAAU,GAAG,YACvC,oBAAC,QAAD;CAAQ,SAAQ;CAAY,MAAK;CAAQ,WAAW,GAAG,cAAc,SAAS;CAAG,GAAI;CAClF,UAAA,YAAY;AACP,CAAA;;;;;;;;;AAWV,MAAa,cAAc,OAAO,OAAO,MAAM;CAC7C;CACA;CACA,SAAS;CACT,MAAM;CACN,SAAS;;CAET,MAAM;;CAEN;;CAEA;;CAEA,OAAO;CACP;CACA;AACF,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { cn } from "./classNames-DcGnTh2N.js";
|
|
2
2
|
import { ChevronLeft, ChevronRight, Ellipsis } from "./icons-ZIeZXXS7.js";
|
|
3
|
-
import { Button } from "./Button-
|
|
3
|
+
import { Button } from "./Button-BNkyYU8u.js";
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
//#region src/components/Pagination/PaginationButton.tsx
|
|
6
6
|
const PaginationButton = ({ ref, active: isActive = false, className, children, size = "icon", ...props }) => /* @__PURE__ */ jsx(Button, {
|
|
@@ -67,4 +67,4 @@ Pagination.Ellipsis = PaginationEllipsis;
|
|
|
67
67
|
//#endregion
|
|
68
68
|
export { Pagination };
|
|
69
69
|
|
|
70
|
-
//# sourceMappingURL=Pagination-
|
|
70
|
+
//# sourceMappingURL=Pagination-D27x5KmH.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination-
|
|
1
|
+
{"version":3,"file":"Pagination-D27x5KmH.js","names":[],"sources":["../src/components/Pagination/PaginationButton.tsx","../src/components/Pagination/PaginationContent.tsx","../src/components/Pagination/PaginationEllipsis.tsx","../src/components/Pagination/PaginationItem.tsx","../src/components/Pagination/PaginationNext.tsx","../src/components/Pagination/PaginationPrevious.tsx","../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\n\ntype Props = {\n active?: boolean;\n} & Omit<ComponentProps<typeof Button>, 'variant'>;\n\nexport const PaginationButton = ({\n ref,\n active: isActive = false,\n className,\n children,\n size = 'icon',\n ...props\n}: Props) => (\n <Button\n {...props}\n ref={ref}\n variant=\"invisible\"\n size={size}\n data-slot=\"pagination-link\"\n aria-current={isActive ? 'page' : undefined}\n data-active={isActive}\n className={cn(\n 'tw:data-[active=true]:bg-selected',\n 'tw:data-[active=true]:text-selected-foreground',\n 'tw:data-[active=true]:border-selected',\n className,\n )}\n >\n {children}\n </Button>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'ul'>;\n\nexport const PaginationContent = ({ className, ...props }: Props) => (\n <ul\n {...props}\n className={cn('tw:flex', 'tw:flex-row', 'tw:items-center', 'tw:gap-1', className)}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { Ellipsis } from '../../icons';\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'span'>;\n\nexport const PaginationEllipsis = ({ className, ...props }: Props) => (\n <span\n aria-hidden=\"true\"\n className={cn(\n // layout\n 'tw:flex',\n 'tw:p-2.5',\n 'tw:items-center',\n 'tw:justify-center',\n\n 'tw:text-foreground',\n 'tw:[&_svg:not([class*=\"tw:size-\"])]:size-4',\n className,\n )}\n {...props}\n >\n <Ellipsis />\n </span>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'li'>;\n\nexport const PaginationItem = ({ className, ...props }: Props) => (\n <li className={cn('tw:list-none', className)} {...props} />\n);\n","import type { ComponentProps } from 'react';\n\nimport { ChevronRight } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { PaginationButton } from './PaginationButton';\n\ntype Props = ComponentProps<typeof PaginationButton>;\n\nexport const PaginationNext = ({ children, className, ...props }: Props) => (\n <PaginationButton\n {...props}\n aria-label=\"Go to next page\"\n size=\"medium\"\n className={cn('tw:flex-row-reverse', className)}\n >\n <ChevronRight className=\"tw:size-5\" />\n {children ?? 'Next'}\n </PaginationButton>\n);\n","import type { ComponentProps } from 'react';\n\nimport { ChevronLeft } from '../../icons';\n\nimport { PaginationButton } from './PaginationButton';\n\ntype Props = ComponentProps<typeof PaginationButton>;\n\nexport const PaginationPrevious = ({ children, ...props }: Props) => (\n <PaginationButton {...props} size=\"medium\" aria-label=\"Go to previous page\">\n <ChevronLeft className=\"tw:size-5\" />\n {children ?? 'Previous'}\n </PaginationButton>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nimport { PaginationButton } from './PaginationButton';\nimport { PaginationContent } from './PaginationContent';\nimport { PaginationEllipsis } from './PaginationEllipsis';\nimport { PaginationItem } from './PaginationItem';\nimport { PaginationNext } from './PaginationNext';\nimport { PaginationPrevious } from './PaginationPrevious';\n\ntype Props = ComponentProps<'nav'>;\n\nexport const Pagination = ({ className, ...props }: Props) => (\n <nav\n {...props}\n aria-label=\"pagination\"\n className={cn(\n 'tailwindcss-preflight',\n 'tw:mx-auto',\n 'tw:flex',\n 'tw:w-full',\n 'tw:justify-center',\n className,\n )}\n />\n);\n\nPagination.Content = PaginationContent;\nPagination.Item = PaginationItem;\nPagination.Button = PaginationButton;\nPagination.Previous = PaginationPrevious;\nPagination.Next = PaginationNext;\nPagination.Ellipsis = PaginationEllipsis;\n"],"mappings":";;;;;AASA,MAAa,oBAAoB,EAC/B,KACA,QAAQ,WAAW,OACnB,WACA,UACA,OAAO,QACP,GAAG,YAEH,oBAAC,QAAD;CACE,GAAI;CACC;CACL,SAAQ;CACF;CACN,aAAU;CACV,gBAAc,WAAW,SAAS,KAAA;CAClC,eAAa;CACb,WAAW,GACT,qCACA,kDACA,yCACA,SACF;CAEC;AACK,CAAA;;;AC3BV,MAAa,qBAAqB,EAAE,WAAW,GAAG,YAChD,oBAAC,MAAD;CACE,GAAI;CACJ,WAAW,GAAG,WAAW,eAAe,mBAAmB,YAAY,SAAS;AACjF,CAAA;;;ACHH,MAAa,sBAAsB,EAAE,WAAW,GAAG,YACjD,oBAAC,QAAD;CACE,eAAY;CACZ,WAAW,GAET,WACA,YACA,mBACA,qBAEA,sBACA,gDACA,SACF;CACA,GAAI;CAEJ,UAAA,oBAAC,UAAD,CAAW,CAAA;AACP,CAAA;;;AClBR,MAAa,kBAAkB,EAAE,WAAW,GAAG,YAC7C,oBAAC,MAAD;CAAI,WAAW,GAAG,gBAAgB,SAAS;CAAG,GAAI;AAAQ,CAAA;;;ACE5D,MAAa,kBAAkB,EAAE,UAAU,WAAW,GAAG,YACvD,qBAAC,kBAAD;CACE,GAAI;CACJ,cAAW;CACX,MAAK;CACL,WAAW,GAAG,uBAAuB,SAAS;CAJhD,UAAA,CAME,oBAAC,cAAD,EAAc,WAAU,YAAa,CAAA,GACpC,YAAY,MACG;;;;ACVpB,MAAa,sBAAsB,EAAE,UAAU,GAAG,YAChD,qBAAC,kBAAD;CAAkB,GAAI;CAAO,MAAK;CAAS,cAAW;CAAtD,UAAA,CACE,oBAAC,aAAD,EAAa,WAAU,YAAa,CAAA,GACnC,YAAY,UACG;;;;ACCpB,MAAa,cAAc,EAAE,WAAW,GAAG,YACzC,oBAAC,OAAD;CACE,GAAI;CACJ,cAAW;CACX,WAAW,GACT,yBACA,cACA,WACA,aACA,qBACA,SACF;AACD,CAAA;AAGH,WAAW,UAAU;AACrB,WAAW,OAAO;AAClB,WAAW,SAAS;AACpB,WAAW,WAAW;AACtB,WAAW,OAAO;AAClB,WAAW,WAAW"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { cn } from "./classNames-DcGnTh2N.js";
|
|
2
|
-
import { Button } from "./Button-
|
|
2
|
+
import { Button } from "./Button-BNkyYU8u.js";
|
|
3
3
|
import { useStableCallback } from "./internal/hooks/useStableCallback.js";
|
|
4
|
-
import { Popover } from "./Popover-
|
|
4
|
+
import { Popover } from "./Popover-DtUDwUVO.js";
|
|
5
5
|
import { createContext, use, useMemo, useState } from "react";
|
|
6
6
|
import { Slot } from "@radix-ui/react-slot";
|
|
7
7
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -163,4 +163,4 @@ Popconfirm.Trigger = PopconfirmTrigger;
|
|
|
163
163
|
//#endregion
|
|
164
164
|
export { Popconfirm };
|
|
165
165
|
|
|
166
|
-
//# sourceMappingURL=Popconfirm-
|
|
166
|
+
//# sourceMappingURL=Popconfirm-DwLCYNaF.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popconfirm-BgV6a0sl.js","names":[],"sources":["../src/components/Popconfirm/context.ts","../src/components/Popconfirm/PopconfirmBody.tsx","../src/components/Popconfirm/PopconfirmCancel.tsx","../src/components/Popconfirm/PopconfirmConfirm.tsx","../src/components/Popconfirm/PopconfirmContent.tsx","../src/components/Popconfirm/PopconfirmFooter.tsx","../src/components/Popconfirm/PopconfirmTrigger.tsx","../src/components/Popconfirm/Popconfirm.tsx"],"sourcesContent":["import { createContext, type MouseEvent, use } from 'react';\n\nexport type PopconfirmContextType = {\n variant: 'confirm' | 'danger';\n onConfirm: (event: MouseEvent<HTMLButtonElement>) => void | Promise<void>;\n onCancel: (event: MouseEvent<HTMLButtonElement>) => void;\n enabled: boolean;\n isLoading: boolean;\n};\n\nconst PopconfirmContext = createContext<PopconfirmContextType | null>(null);\n\nexport const PopconfirmContextProvider = PopconfirmContext;\n\nexport const usePopconfirmContext = () => {\n const context = use(PopconfirmContext);\n if (!context) throw new Error('usePopconfirmContext must be used within a Popconfirm');\n return context;\n};\n","import type { ComponentProps } from 'react';\n\ntype Props = ComponentProps<'div'>;\n\nexport const PopconfirmBody = (props: Props) => <div {...props} />;\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype SlotProps = { asChild: true } & ComponentProps<'button'>;\ntype ButtonProps = { asChild?: false; children?: ReactNode } & Omit<\n ComponentProps<typeof Button>,\n 'children'\n>;\ntype Props = SlotProps | ButtonProps;\n\nexport const PopconfirmCancel = ({\n ref,\n onClick,\n children,\n asChild,\n className,\n ...props\n}: Props) => {\n const { onCancel, isLoading } = usePopconfirmContext();\n\n const handleClick: ComponentProps<'button'>['onClick'] = (event) => {\n onClick?.(event);\n onCancel(event);\n };\n\n return (\n <Popover.Close asChild onClick={handleClick} disabled={isLoading}>\n {asChild ? (\n <Slot {...props} ref={ref} className={className}>\n {children}\n </Slot>\n ) : (\n <Button variant=\"outline\" size=\"small\" {...props} ref={ref} className={cn(className)}>\n {children ?? 'Cancel'}\n </Button>\n )}\n </Popover.Close>\n );\n};\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button/Button';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype SlotProps = { asChild: true } & ComponentProps<'button'>;\ntype ButtonProps = { asChild?: false; children?: ReactNode } & Omit<\n ComponentProps<typeof Button>,\n 'children' | 'isLoading'\n>;\ntype Props = SlotProps | ButtonProps;\n\nexport const PopconfirmConfirm = ({\n ref,\n onClick,\n children,\n asChild,\n className,\n ...props\n}: Props) => {\n const { onConfirm, variant, isLoading } = usePopconfirmContext();\n\n const handleOnClick: ComponentProps<'button'>['onClick'] = (event) => {\n onClick?.(event);\n onConfirm(event);\n };\n\n const defaultLabel = (() => {\n if (children) return children;\n return variant === 'danger' ? 'Delete' : 'Confirm';\n })();\n\n return (\n <Popover.Close asChild onClick={handleOnClick} disabled={isLoading} data-loading={isLoading}>\n {asChild ? (\n <Slot {...props} ref={ref} className={className}>\n {children}\n </Slot>\n ) : (\n <Button\n size=\"small\"\n variant={variant === 'danger' ? 'danger' : 'primary'}\n {...props}\n ref={ref}\n className={cn('tw:flex-1', className)}\n isLoading={isLoading}\n >\n {defaultLabel}\n </Button>\n )}\n </Popover.Close>\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype Props = Omit<ComponentProps<typeof Popover.Content>, 'showArrow'>;\n\nexport const PopconfirmContent = ({ className, onInteractOutside, ...props }: Props) => {\n const { isLoading } = usePopconfirmContext();\n\n const handleOnInteractOutside: Props['onInteractOutside'] = (event) => {\n if (isLoading) event.preventDefault();\n onInteractOutside?.(event);\n };\n\n return (\n <Popover.Content\n {...props}\n onInteractOutside={handleOnInteractOutside}\n className={cn('tw:flex', 'tw:flex-col', 'tw:gap-3', 'tw:px-4', 'tw:py-3', className)}\n />\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const PopconfirmFooter = ({ className, ...props }: Props) => (\n <div {...props} className={cn('tw:flex tw:gap-2 tw:w-full', className)} />\n);\n","import type { ComponentProps, MouseEventHandler } from 'react';\n\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype Props = ComponentProps<typeof Popover.Trigger>;\n\nexport const PopconfirmTrigger = ({ onClick, ...props }: Props) => {\n const { enabled, onConfirm } = usePopconfirmContext();\n\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (!enabled) {\n event.preventDefault();\n onConfirm(event);\n }\n\n onClick?.(event);\n };\n\n return <Popover.Trigger {...props} onClick={handleClick} />;\n};\n","import { useMemo, useState } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\n\nimport { useStableCallback } from '../../hooks/useStableCallback';\nimport { Popover } from '../Popover';\n\nimport { PopconfirmContextProvider, type PopconfirmContextType } from './context';\nimport { PopconfirmBody } from './PopconfirmBody';\nimport { PopconfirmCancel } from './PopconfirmCancel';\nimport { PopconfirmConfirm } from './PopconfirmConfirm';\nimport { PopconfirmContent } from './PopconfirmContent';\nimport { PopconfirmFooter } from './PopconfirmFooter';\nimport { PopconfirmTrigger } from './PopconfirmTrigger';\n\nconst noop = () => void 0;\n\ntype Props = {\n children: ReactNode;\n skipAsyncWait?: boolean;\n} & ComponentProps<typeof Popover> &\n Omit<Partial<PopconfirmContextType>, 'isLoading'>;\n\nexport const Popconfirm = ({\n children,\n onConfirm = noop,\n onCancel = noop,\n variant = 'confirm',\n enabled = true,\n onOpenChange = noop,\n open,\n skipAsyncWait = false,\n ...rest\n}: Props) => {\n const [isLoading, setIsLoading] = useState(false);\n const [isOpen, setIsOpen] = useState(false);\n\n const handleConfirm = useStableCallback(onConfirm);\n const handleCancel = useStableCallback(onCancel);\n\n const handleOnOpenChange = (open: boolean) => {\n setIsOpen(open);\n onOpenChange(open);\n };\n\n const context = useMemo<PopconfirmContextType>(\n () => ({\n variant,\n isLoading,\n enabled,\n onConfirm: (event) => {\n const result = handleConfirm(event);\n\n if (!(result instanceof Promise) || skipAsyncWait) return;\n\n // The async confirm's outcome drives the popover.\n // - `preventDefault` stops the click closing it, so it stays up while the action runs.\n // - Resolved closes it; rejected leaves it up so the failure stays visible.\n // - The rejection is deliberately not caught — the host's global handler reports it.\n event.preventDefault();\n setIsLoading(true);\n result.then(() => setIsOpen(false)).finally(() => setIsLoading(false));\n },\n onCancel: handleCancel,\n }),\n [variant, isLoading, enabled, skipAsyncWait, handleConfirm, handleCancel],\n );\n\n return (\n <Popover {...rest} open={open || isOpen} onOpenChange={handleOnOpenChange}>\n <PopconfirmContextProvider value={context}>{children}</PopconfirmContextProvider>\n </Popover>\n );\n};\n\nPopconfirm.Confirm = PopconfirmConfirm;\nPopconfirm.Cancel = PopconfirmCancel;\nPopconfirm.Footer = PopconfirmFooter;\nPopconfirm.Content = PopconfirmContent;\nPopconfirm.Body = PopconfirmBody;\nPopconfirm.Trigger = PopconfirmTrigger;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Popconfirm-DwLCYNaF.js","names":[],"sources":["../src/components/Popconfirm/context.ts","../src/components/Popconfirm/PopconfirmBody.tsx","../src/components/Popconfirm/PopconfirmCancel.tsx","../src/components/Popconfirm/PopconfirmConfirm.tsx","../src/components/Popconfirm/PopconfirmContent.tsx","../src/components/Popconfirm/PopconfirmFooter.tsx","../src/components/Popconfirm/PopconfirmTrigger.tsx","../src/components/Popconfirm/Popconfirm.tsx"],"sourcesContent":["import { createContext, type MouseEvent, use } from 'react';\n\nexport type PopconfirmContextType = {\n variant: 'confirm' | 'danger';\n onConfirm: (event: MouseEvent<HTMLButtonElement>) => void | Promise<void>;\n onCancel: (event: MouseEvent<HTMLButtonElement>) => void;\n enabled: boolean;\n isLoading: boolean;\n};\n\nconst PopconfirmContext = createContext<PopconfirmContextType | null>(null);\n\nexport const PopconfirmContextProvider = PopconfirmContext;\n\nexport const usePopconfirmContext = () => {\n const context = use(PopconfirmContext);\n if (!context) throw new Error('usePopconfirmContext must be used within a Popconfirm');\n return context;\n};\n","import type { ComponentProps } from 'react';\n\ntype Props = ComponentProps<'div'>;\n\nexport const PopconfirmBody = (props: Props) => <div {...props} />;\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype SlotProps = { asChild: true } & ComponentProps<'button'>;\ntype ButtonProps = { asChild?: false; children?: ReactNode } & Omit<\n ComponentProps<typeof Button>,\n 'children'\n>;\ntype Props = SlotProps | ButtonProps;\n\nexport const PopconfirmCancel = ({\n ref,\n onClick,\n children,\n asChild,\n className,\n ...props\n}: Props) => {\n const { onCancel, isLoading } = usePopconfirmContext();\n\n const handleClick: ComponentProps<'button'>['onClick'] = (event) => {\n onClick?.(event);\n onCancel(event);\n };\n\n return (\n <Popover.Close asChild onClick={handleClick} disabled={isLoading}>\n {asChild ? (\n <Slot {...props} ref={ref} className={className}>\n {children}\n </Slot>\n ) : (\n <Button variant=\"outline\" size=\"small\" {...props} ref={ref} className={cn(className)}>\n {children ?? 'Cancel'}\n </Button>\n )}\n </Popover.Close>\n );\n};\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button/Button';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype SlotProps = { asChild: true } & ComponentProps<'button'>;\ntype ButtonProps = { asChild?: false; children?: ReactNode } & Omit<\n ComponentProps<typeof Button>,\n 'children' | 'isLoading'\n>;\ntype Props = SlotProps | ButtonProps;\n\nexport const PopconfirmConfirm = ({\n ref,\n onClick,\n children,\n asChild,\n className,\n ...props\n}: Props) => {\n const { onConfirm, variant, isLoading } = usePopconfirmContext();\n\n const handleOnClick: ComponentProps<'button'>['onClick'] = (event) => {\n onClick?.(event);\n onConfirm(event);\n };\n\n const defaultLabel = (() => {\n if (children) return children;\n return variant === 'danger' ? 'Delete' : 'Confirm';\n })();\n\n return (\n <Popover.Close asChild onClick={handleOnClick} disabled={isLoading} data-loading={isLoading}>\n {asChild ? (\n <Slot {...props} ref={ref} className={className}>\n {children}\n </Slot>\n ) : (\n <Button\n size=\"small\"\n variant={variant === 'danger' ? 'danger' : 'primary'}\n {...props}\n ref={ref}\n className={cn('tw:flex-1', className)}\n isLoading={isLoading}\n >\n {defaultLabel}\n </Button>\n )}\n </Popover.Close>\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype Props = Omit<ComponentProps<typeof Popover.Content>, 'showArrow'>;\n\nexport const PopconfirmContent = ({ className, onInteractOutside, ...props }: Props) => {\n const { isLoading } = usePopconfirmContext();\n\n const handleOnInteractOutside: Props['onInteractOutside'] = (event) => {\n if (isLoading) event.preventDefault();\n onInteractOutside?.(event);\n };\n\n return (\n <Popover.Content\n {...props}\n onInteractOutside={handleOnInteractOutside}\n className={cn('tw:flex', 'tw:flex-col', 'tw:gap-3', 'tw:px-4', 'tw:py-3', className)}\n />\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const PopconfirmFooter = ({ className, ...props }: Props) => (\n <div {...props} className={cn('tw:flex tw:gap-2 tw:w-full', className)} />\n);\n","import type { ComponentProps, MouseEventHandler } from 'react';\n\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype Props = ComponentProps<typeof Popover.Trigger>;\n\nexport const PopconfirmTrigger = ({ onClick, ...props }: Props) => {\n const { enabled, onConfirm } = usePopconfirmContext();\n\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (!enabled) {\n event.preventDefault();\n onConfirm(event);\n }\n\n onClick?.(event);\n };\n\n return <Popover.Trigger {...props} onClick={handleClick} />;\n};\n","import { useMemo, useState } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\n\nimport { useStableCallback } from '../../hooks/useStableCallback';\nimport { Popover } from '../Popover';\n\nimport { PopconfirmContextProvider, type PopconfirmContextType } from './context';\nimport { PopconfirmBody } from './PopconfirmBody';\nimport { PopconfirmCancel } from './PopconfirmCancel';\nimport { PopconfirmConfirm } from './PopconfirmConfirm';\nimport { PopconfirmContent } from './PopconfirmContent';\nimport { PopconfirmFooter } from './PopconfirmFooter';\nimport { PopconfirmTrigger } from './PopconfirmTrigger';\n\nconst noop = () => void 0;\n\ntype Props = {\n children: ReactNode;\n skipAsyncWait?: boolean;\n} & ComponentProps<typeof Popover> &\n Omit<Partial<PopconfirmContextType>, 'isLoading'>;\n\nexport const Popconfirm = ({\n children,\n onConfirm = noop,\n onCancel = noop,\n variant = 'confirm',\n enabled = true,\n onOpenChange = noop,\n open,\n skipAsyncWait = false,\n ...rest\n}: Props) => {\n const [isLoading, setIsLoading] = useState(false);\n const [isOpen, setIsOpen] = useState(false);\n\n const handleConfirm = useStableCallback(onConfirm);\n const handleCancel = useStableCallback(onCancel);\n\n const handleOnOpenChange = (open: boolean) => {\n setIsOpen(open);\n onOpenChange(open);\n };\n\n const context = useMemo<PopconfirmContextType>(\n () => ({\n variant,\n isLoading,\n enabled,\n onConfirm: (event) => {\n const result = handleConfirm(event);\n\n if (!(result instanceof Promise) || skipAsyncWait) return;\n\n // The async confirm's outcome drives the popover.\n // - `preventDefault` stops the click closing it, so it stays up while the action runs.\n // - Resolved closes it; rejected leaves it up so the failure stays visible.\n // - The rejection is deliberately not caught — the host's global handler reports it.\n event.preventDefault();\n setIsLoading(true);\n result.then(() => setIsOpen(false)).finally(() => setIsLoading(false));\n },\n onCancel: handleCancel,\n }),\n [variant, isLoading, enabled, skipAsyncWait, handleConfirm, handleCancel],\n );\n\n return (\n <Popover {...rest} open={open || isOpen} onOpenChange={handleOnOpenChange}>\n <PopconfirmContextProvider value={context}>{children}</PopconfirmContextProvider>\n </Popover>\n );\n};\n\nPopconfirm.Confirm = PopconfirmConfirm;\nPopconfirm.Cancel = PopconfirmCancel;\nPopconfirm.Footer = PopconfirmFooter;\nPopconfirm.Content = PopconfirmContent;\nPopconfirm.Body = PopconfirmBody;\nPopconfirm.Trigger = PopconfirmTrigger;\n"],"mappings":"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"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { cn } from "./classNames-DcGnTh2N.js";
|
|
2
|
-
import { useArgoDesign } from "./context-U293r3v-.js";
|
|
3
2
|
import { cva } from "class-variance-authority";
|
|
4
3
|
import { jsx } from "react/jsx-runtime";
|
|
5
4
|
import { Anchor, Close, Content, Portal, Root, Trigger } from "@radix-ui/react-popover";
|
|
@@ -20,6 +19,7 @@ const variants = cva([
|
|
|
20
19
|
"tw:border",
|
|
21
20
|
"tw:border-solid",
|
|
22
21
|
"tw:border-border",
|
|
22
|
+
"tw:rounded-popover",
|
|
23
23
|
"tw:shadow-lg",
|
|
24
24
|
"tw:bg-popover",
|
|
25
25
|
"tw:text-popover-foreground",
|
|
@@ -36,43 +36,30 @@ const variants = cva([
|
|
|
36
36
|
"tw:[&_svg.lucide:not([class*='tw:size-'])]:size-4",
|
|
37
37
|
"tw:[&_svg]:shrink-0"
|
|
38
38
|
], {
|
|
39
|
-
defaultVariants: {
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
39
|
+
defaultVariants: { matchTriggerWidth: false },
|
|
40
|
+
variants: { matchTriggerWidth: {
|
|
41
|
+
true: ["tw:w-[var(--radix-popover-trigger-width)]"],
|
|
42
|
+
false: []
|
|
43
|
+
} }
|
|
44
|
+
});
|
|
45
|
+
const PopoverContent = ({ ref, className, align = "center", sideOffset = 4, matchTriggerWidth = false, children, onEscapeKeyDown, container, ...props }) => /* @__PURE__ */ jsx(Portal, {
|
|
46
|
+
container,
|
|
47
|
+
children: /* @__PURE__ */ jsx(Content, {
|
|
48
|
+
ref,
|
|
49
|
+
align: matchTriggerWidth ? "start" : align,
|
|
50
|
+
sideOffset,
|
|
51
|
+
className: cn(variants({
|
|
52
|
+
className,
|
|
53
|
+
matchTriggerWidth
|
|
54
|
+
})),
|
|
55
|
+
onEscapeKeyDown: (event) => {
|
|
56
|
+
event.stopPropagation();
|
|
57
|
+
onEscapeKeyDown?.(event);
|
|
47
58
|
},
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
}
|
|
52
|
-
}
|
|
59
|
+
...props,
|
|
60
|
+
children
|
|
61
|
+
})
|
|
53
62
|
});
|
|
54
|
-
const PopoverContent = ({ ref, className, align = "center", sideOffset = 4, matchTriggerWidth = false, children, onEscapeKeyDown, container, ...props }) => {
|
|
55
|
-
const effectiveVariant = useArgoDesign() ? "argo" : "default";
|
|
56
|
-
return /* @__PURE__ */ jsx(Portal, {
|
|
57
|
-
container,
|
|
58
|
-
children: /* @__PURE__ */ jsx(Content, {
|
|
59
|
-
ref,
|
|
60
|
-
align: matchTriggerWidth ? "start" : align,
|
|
61
|
-
sideOffset,
|
|
62
|
-
className: cn(variants({
|
|
63
|
-
className,
|
|
64
|
-
matchTriggerWidth,
|
|
65
|
-
variant: effectiveVariant
|
|
66
|
-
})),
|
|
67
|
-
onEscapeKeyDown: (event) => {
|
|
68
|
-
event.stopPropagation();
|
|
69
|
-
onEscapeKeyDown?.(event);
|
|
70
|
-
},
|
|
71
|
-
...props,
|
|
72
|
-
children
|
|
73
|
-
})
|
|
74
|
-
});
|
|
75
|
-
};
|
|
76
63
|
//#endregion
|
|
77
64
|
//#region src/components/Popover/Popover.tsx
|
|
78
65
|
const Popover = (props) => /* @__PURE__ */ jsx(Root, { ...props });
|
|
@@ -86,4 +73,4 @@ Popover.Close = Close;
|
|
|
86
73
|
//#endregion
|
|
87
74
|
export { Popover };
|
|
88
75
|
|
|
89
|
-
//# sourceMappingURL=Popover-
|
|
76
|
+
//# sourceMappingURL=Popover-DtUDwUVO.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Popover-DtUDwUVO.js","names":[],"sources":["../src/components/Popover/PopoverContent.tsx","../src/components/Popover/Popover.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\nimport { Content, Portal } from '@radix-ui/react-popover';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nconst variants = cva(\n [\n 'tailwindcss-preflight',\n 'tw:group/popover-content',\n 'tw:z-[1055]',\n 'tw:focus-visible:outline-hidden',\n\n // An open Radix Dialog sets `pointer-events: none` on <body>, which this portalled panel\n // inherits; outside-click dismiss still works (it listens on document).\n 'tw:pointer-events-auto',\n\n // sizing\n 'tw:min-w-32',\n 'tw:max-h-[var(--radix-popover-content-available-height)]',\n 'tw:origin-(--radix-popover-content-transform-origin)',\n\n // layout\n 'tw:flex',\n 'tw:flex-col',\n 'tw:overflow-y-auto',\n\n // border\n 'tw:box-border',\n 'tw:border',\n 'tw:border-solid',\n 'tw:border-border',\n 'tw:rounded-popover',\n 'tw:shadow-lg',\n\n // surface — semantic tokens, so a portalled panel follows the brand and the scheme\n 'tw:bg-popover',\n 'tw:text-popover-foreground',\n\n // open animation\n 'tw:data-[state=open]:animate-in',\n 'tw:data-[state=open]:fade-in-0',\n 'tw:data-[state=open]:zoom-in-95',\n\n // closed animation\n 'tw:data-[state=closed]:animate-out',\n 'tw:data-[state=closed]:fade-out-0',\n 'tw:data-[state=closed]:zoom-out-95',\n\n // position animation\n 'tw:data-[side=bottom]:slide-in-from-top-2',\n 'tw:data-[side=left]:slide-in-from-right-2',\n 'tw:data-[side=right]:slide-in-from-left-2',\n 'tw:data-[side=top]:slide-in-from-bottom-2',\n\n // Default size for nested Lucide icons; callers can override on the icon.\n \"tw:[&_svg.lucide:not([class*='tw:size-'])]:size-4\",\n 'tw:[&_svg]:shrink-0',\n ],\n {\n defaultVariants: {\n matchTriggerWidth: false,\n },\n variants: {\n matchTriggerWidth: {\n true: ['tw:w-[var(--radix-popover-trigger-width)]'],\n false: [],\n },\n },\n },\n);\n\ntype Props = ComponentProps<typeof Content> &\n VariantProps<typeof variants> & {\n /**\n * Portal target, default `document.body`; pass a theme-scoped host so the panel takes its theme.\n */\n container?: ComponentProps<typeof Portal>['container'];\n };\n\nexport const PopoverContent = ({\n ref,\n className,\n align = 'center',\n sideOffset = 4,\n matchTriggerWidth = false,\n children,\n onEscapeKeyDown,\n container,\n ...props\n}: Props) => (\n <Portal container={container}>\n <Content\n ref={ref}\n align={matchTriggerWidth ? 'start' : align}\n sideOffset={sideOffset}\n className={cn(variants({ className, matchTriggerWidth }))}\n onEscapeKeyDown={(event) => {\n // Keeps parent modals (e.g. FullScreenModal) from closing.\n event.stopPropagation();\n onEscapeKeyDown?.(event);\n }}\n {...props}\n >\n {children}\n </Content>\n </Portal>\n);\n","import type { ComponentProps } from 'react';\nimport { Anchor, Close, Root, Trigger } from '@radix-ui/react-popover';\n\nimport { PopoverContent } from './PopoverContent';\n\ntype Props = ComponentProps<typeof Root>;\n\nexport const Popover = (props: Props) => <Root {...props} />;\n\n/**\n * Main Layout\n */\nPopover.Content = PopoverContent;\nPopover.Trigger = Trigger;\n// Positions a controlled popover against an element other than its trigger.\nPopover.Anchor = Anchor;\nPopover.Close = Close;\n"],"mappings":";;;;;AAOA,MAAM,WAAW,IACf;CACE;CACA;CACA;CACA;CAIA;CAGA;CACA;CACA;CAGA;CACA;CACA;CAGA;CACA;CACA;CACA;CACA;CACA;CAGA;CACA;CAGA;CACA;CACA;CAGA;CACA;CACA;CAGA;CACA;CACA;CACA;CAGA;CACA;AACF,GACA;CACE,iBAAiB,EACf,mBAAmB,MACrB;CACA,UAAU,EACR,mBAAmB;EACjB,MAAM,CAAC,2CAA2C;EAClD,OAAO,CAAC;CACV,EACF;AACF,CACF;AAUA,MAAa,kBAAkB,EAC7B,KACA,WACA,QAAQ,UACR,aAAa,GACb,oBAAoB,OACpB,UACA,iBACA,WACA,GAAG,YAEH,oBAAC,QAAD;CAAmB;CACjB,UAAA,oBAAC,SAAD;EACO;EACL,OAAO,oBAAoB,UAAU;EACzB;EACZ,WAAW,GAAG,SAAS;GAAE;GAAW;EAAkB,CAAC,CAAC;EACxD,kBAAkB,UAAU;GAE1B,MAAM,gBAAgB;GACtB,kBAAkB,KAAK;EACzB;EACA,GAAI;EAEH;CACM,CAAA;AACH,CAAA;;;ACpGV,MAAa,WAAW,UAAiB,oBAAC,MAAD,EAAM,GAAI,MAAQ,CAAA;;;;AAK3D,QAAQ,UAAU;AAClB,QAAQ,UAAU;AAElB,QAAQ,SAAS;AACjB,QAAQ,QAAQ"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { cn } from "./classNames-DcGnTh2N.js";
|
|
2
|
-
import { Tooltip } from "./utils-
|
|
3
|
-
import { useArgoDesign } from "./context-U293r3v-.js";
|
|
2
|
+
import { Tooltip } from "./utils-DwC9u0tM.js";
|
|
4
3
|
import { Circle } from "./icons-ZIeZXXS7.js";
|
|
5
|
-
import { radioCircleVariants, radioIndicatorVariants, radioItemButtonVariants, radioVariants } from "./styles-
|
|
6
|
-
import { Separator } from "./internal/components/Separator.js";
|
|
4
|
+
import { radioCircleVariants, radioIndicatorVariants, radioItemButtonVariants, radioVariants } from "./styles-DxazJ8Mz.js";
|
|
7
5
|
import { FieldBox } from "./FieldBox-BrxLkY9C.js";
|
|
6
|
+
import { Separator } from "./internal/components/Separator.js";
|
|
8
7
|
import { createContext, use, useId } from "react";
|
|
9
8
|
import { cva } from "class-variance-authority";
|
|
10
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -19,31 +18,29 @@ const RadioGroupProvider = RadioGroupContext;
|
|
|
19
18
|
const useRadioGroupContext = () => use(RadioGroupContext);
|
|
20
19
|
//#endregion
|
|
21
20
|
//#region src/components/RadioGroup/Radio.tsx
|
|
22
|
-
const Radio = ({ className,
|
|
21
|
+
const Radio = ({ className, ...props }) => /* @__PURE__ */ jsx(Item, {
|
|
23
22
|
...props,
|
|
24
|
-
className: cn(radioCircleVariants(
|
|
23
|
+
className: cn(radioCircleVariants(), radioVariants(), className),
|
|
25
24
|
children: /* @__PURE__ */ jsx(Indicator, {
|
|
26
25
|
className: cn("tw:flex", "tw:items-center", "tw:justify-center"),
|
|
27
|
-
children: /* @__PURE__ */ jsx(Circle, { className: radioIndicatorVariants(
|
|
26
|
+
children: /* @__PURE__ */ jsx(Circle, { className: radioIndicatorVariants() })
|
|
28
27
|
})
|
|
29
28
|
});
|
|
30
29
|
//#endregion
|
|
31
30
|
//#region src/components/RadioGroup/RadioGroupItemButton.tsx
|
|
32
|
-
const RadioGroupItemButton = ({ ref, className, children,
|
|
31
|
+
const RadioGroupItemButton = ({ ref, className, children, ...props }) => /* @__PURE__ */ jsx(Item, {
|
|
33
32
|
ref,
|
|
34
33
|
...props,
|
|
35
|
-
className: cn(radioItemButtonVariants(
|
|
34
|
+
className: cn(radioItemButtonVariants(), className),
|
|
36
35
|
children
|
|
37
36
|
});
|
|
38
37
|
//#endregion
|
|
39
38
|
//#region src/components/RadioGroup/RadioGroupItem.tsx
|
|
40
39
|
const RadioGroupItem = ({ children, className, tooltip, tooltipVariant, tooltipPlacement, description, ...props }) => {
|
|
41
40
|
const { variant } = useRadioGroupContext();
|
|
42
|
-
const styleVariant = useArgoDesign() ? "argo" : "default";
|
|
43
41
|
const id = useId();
|
|
44
42
|
const item = (() => {
|
|
45
43
|
if (variant === "button") return /* @__PURE__ */ jsx(RadioGroupItemButton, {
|
|
46
|
-
styleVariant,
|
|
47
44
|
...props,
|
|
48
45
|
className,
|
|
49
46
|
children
|
|
@@ -52,7 +49,6 @@ const RadioGroupItem = ({ children, className, tooltip, tooltipVariant, tooltipP
|
|
|
52
49
|
variant: variant === "radio-block" ? "boxed" : "default",
|
|
53
50
|
htmlFor: id,
|
|
54
51
|
control: /* @__PURE__ */ jsx(Radio, {
|
|
55
|
-
styleVariant,
|
|
56
52
|
...props,
|
|
57
53
|
id
|
|
58
54
|
}),
|
|
@@ -117,4 +113,4 @@ RadioGroup.Separator = RadioGroupSeparator;
|
|
|
117
113
|
//#endregion
|
|
118
114
|
export { RadioGroup };
|
|
119
115
|
|
|
120
|
-
//# sourceMappingURL=RadioGroup-
|
|
116
|
+
//# sourceMappingURL=RadioGroup-B0TwHjBb.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioGroup-B0TwHjBb.js","names":[],"sources":["../src/components/RadioGroup/context.ts","../src/components/RadioGroup/Radio.tsx","../src/components/RadioGroup/RadioGroupItemButton.tsx","../src/components/RadioGroup/RadioGroupItem.tsx","../src/components/RadioGroup/RadioGroupSeparator.tsx","../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { createContext, use } from 'react';\n\nexport type Variant = 'radio' | 'button' | 'radio-block';\nexport type Orientation = 'vertical' | 'horizontal';\n\nconst RadioGroupContext = createContext<{\n variant: Variant;\n orientation: Orientation;\n}>({\n variant: 'radio',\n orientation: 'horizontal',\n});\n\nexport const RadioGroupProvider = RadioGroupContext;\n\nexport const useRadioGroupContext = () => use(RadioGroupContext);\n","import type { ComponentProps } from 'react';\nimport { Indicator, Item } from '@radix-ui/react-radio-group';\n\nimport { Circle } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { radioCircleVariants, radioIndicatorVariants, radioVariants } from './styles';\n\nexport const Radio = ({ className, ...props }: ComponentProps<typeof Item>) => (\n <Item {...props} className={cn(radioCircleVariants(), radioVariants(), className)}>\n <Indicator className={cn('tw:flex', 'tw:items-center', 'tw:justify-center')}>\n {/* Lucide Circle is stroke-only — force fill to match the stroke (currentColor)\n so the indicator reads as a solid dot. */}\n <Circle className={radioIndicatorVariants()} />\n </Indicator>\n </Item>\n);\n","import type { ComponentProps } from 'react';\nimport { Item } from '@radix-ui/react-radio-group';\n\nimport { cn } from '../../utils';\n\nimport { radioItemButtonVariants } from './styles';\n\ntype Props = ComponentProps<typeof Item>;\n\nexport const RadioGroupItemButton = ({ ref, className, children, ...props }: Props) => (\n <Item ref={ref} {...props} className={cn(radioItemButtonVariants(), className)}>\n {children}\n </Item>\n);\n","import { useId } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\nimport type { Item } from '@radix-ui/react-radio-group';\n\nimport { cn } from '../../utils';\nimport { FieldBox } from '../FieldBox';\nimport type { Props as TooltipProps } from '../Tooltip';\nimport { Tooltip } from '../Tooltip';\n\nimport { useRadioGroupContext } from './context';\nimport { Radio } from './Radio';\nimport { RadioGroupItemButton } from './RadioGroupItemButton';\n\ntype ItemProps = Omit<ComponentProps<typeof Item>, 'asChild' | 'value'>;\n\ntype Props<T extends string = string> = ItemProps & {\n value: T;\n tooltip?: ReactNode;\n tooltipVariant?: TooltipProps['variant'];\n tooltipPlacement?: TooltipProps['placement'];\n description?: ReactNode;\n};\n\nexport const RadioGroupItem = <T extends string = string>({\n children,\n className,\n tooltip,\n tooltipVariant,\n tooltipPlacement,\n description,\n ...props\n}: Props<T>) => {\n const { variant } = useRadioGroupContext();\n const id = useId();\n\n const item = (() => {\n if (variant === 'button')\n return (\n <RadioGroupItemButton {...props} className={className}>\n {children}\n </RadioGroupItemButton>\n );\n\n return (\n <FieldBox\n variant={variant === 'radio-block' ? 'boxed' : 'default'}\n htmlFor={id}\n control={<Radio {...props} id={id} />}\n className={cn(variant === 'radio-block' && 'tw:flex-1', className)}\n >\n <FieldBox.Title>{children}</FieldBox.Title>\n {description && <FieldBox.Description>{description}</FieldBox.Description>}\n </FieldBox>\n );\n })();\n\n if (!tooltip) {\n return item;\n }\n\n return (\n <Tooltip tooltip={tooltip} variant={tooltipVariant} placement={tooltipPlacement} triggerAsChild>\n {item}\n </Tooltip>\n );\n};\n","import { Separator } from '../Separator';\n\nimport { useRadioGroupContext } from './context';\n\nexport const RadioGroupSeparator = () => {\n const { orientation } = useRadioGroupContext();\n const invertedOrientation = orientation === 'horizontal' ? 'vertical' : 'horizontal';\n const size = orientation === 'horizontal' ? '1/2' : 'full';\n const className = orientation === 'horizontal' ? 'tw:mx-2' : 'tw:my-2';\n\n return <Separator orientation={invertedOrientation} size={size} className={className} />;\n};\n","import type { ComponentProps } from 'react';\nimport * as RRadioGroup from '@radix-ui/react-radio-group';\nimport { cva } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nimport type { Orientation, Variant } from './context';\nimport { RadioGroupProvider } from './context';\nimport { RadioGroupItem } from './RadioGroupItem';\nimport { RadioGroupSeparator } from './RadioGroupSeparator';\n\nconst radioGroupVariants = cva(['tw:flex'], {\n variants: {\n orientation: {\n horizontal: ['tw:gap-2'],\n vertical: ['tw:flex-col', 'tw:gap-3'],\n },\n variant: {\n button: [],\n radio: [],\n 'radio-block': ['tw:w-full'],\n },\n },\n});\n\ntype Props<Value> = {\n variant?: Variant;\n orientation?: Orientation;\n onValueChange?: (value: Value) => void;\n value?: Value | null;\n defaultValue?: Value | null;\n} & Omit<\n ComponentProps<typeof RRadioGroup.Root>,\n 'asChild' | 'orientation' | 'onValueChange' | 'onChange' | 'value' | 'defaultValue'\n>;\n\nexport const RadioGroup = <Value extends string = string>({\n variant = 'radio',\n className,\n disabled = false,\n orientation = 'horizontal',\n onValueChange,\n children,\n value,\n defaultValue,\n ...props\n}: Props<Value>) => (\n <RRadioGroup.Root\n {...props}\n onValueChange={onValueChange}\n orientation={orientation}\n className={cn(radioGroupVariants({ orientation, variant, className }))}\n disabled={disabled}\n value={value ?? void 0}\n defaultValue={defaultValue ?? void 0}\n >\n <RadioGroupProvider value={{ variant, orientation }}>{children}</RadioGroupProvider>\n </RRadioGroup.Root>\n);\n\nRadioGroup.Item = RadioGroupItem;\nRadioGroup.Separator = RadioGroupSeparator;\n"],"mappings":";;;;;;;;;;;;AAKA,MAAM,oBAAoB,cAGvB;CACD,SAAS;CACT,aAAa;AACf,CAAC;AAED,MAAa,qBAAqB;AAElC,MAAa,6BAA6B,IAAI,iBAAiB;;;ACP/D,MAAa,SAAS,EAAE,WAAW,GAAG,YACpC,oBAAC,MAAD;CAAM,GAAI;CAAO,WAAW,GAAG,oBAAoB,GAAG,cAAc,GAAG,SAAS;CAC9E,UAAA,oBAAC,WAAD;EAAW,WAAW,GAAG,WAAW,mBAAmB,mBAAmB;EAGxE,UAAA,oBAAC,QAAD,EAAQ,WAAW,uBAAuB,EAAI,CAAA;CACrC,CAAA;AACP,CAAA;;;ACNR,MAAa,wBAAwB,EAAE,KAAK,WAAW,UAAU,GAAG,YAClE,oBAAC,MAAD;CAAW;CAAK,GAAI;CAAO,WAAW,GAAG,wBAAwB,GAAG,SAAS;CAC1E;AACG,CAAA;;;ACWR,MAAa,kBAA6C,EACxD,UACA,WACA,SACA,gBACA,kBACA,aACA,GAAG,YACW;CACd,MAAM,EAAE,YAAY,qBAAqB;CACzC,MAAM,KAAK,MAAM;CAEjB,MAAM,cAAc;EAClB,IAAI,YAAY,UACd,OACE,oBAAC,sBAAD;GAAsB,GAAI;GAAkB;GACzC;EACmB,CAAA;EAG1B,OACE,qBAAC,UAAD;GACE,SAAS,YAAY,gBAAgB,UAAU;GAC/C,SAAS;GACT,SAAS,oBAAC,OAAD;IAAO,GAAI;IAAW;GAAK,CAAA;GACpC,WAAW,GAAG,YAAY,iBAAiB,aAAa,SAAS;GAJnE,UAAA,CAME,oBAAC,SAAS,OAAV,EAAiB,SAAyB,CAAA,GACzC,eAAe,oBAAC,SAAS,aAAV,EAAA,UAAuB,YAAkC,CAAA,CACjE;;CAEd,EAAA,CAAG;CAEH,IAAI,CAAC,SACH,OAAO;CAGT,OACE,oBAAC,SAAD;EAAkB;EAAS,SAAS;EAAgB,WAAW;EAAkB,gBAAA;EAC9E,UAAA;CACM,CAAA;AAEb;;;AC7DA,MAAa,4BAA4B;CACvC,MAAM,EAAE,gBAAgB,qBAAqB;CAK7C,OAAO,oBAAC,WAAD;EAAW,aAJU,gBAAgB,eAAe,aAAa;EAIpB,MAHvC,gBAAgB,eAAe,QAAQ;EAGY,WAF9C,gBAAgB,eAAe,YAAY;CAE0B,CAAA;AACzF;;;ACAA,MAAM,qBAAqB,IAAI,CAAC,SAAS,GAAG,EAC1C,UAAU;CACR,aAAa;EACX,YAAY,CAAC,UAAU;EACvB,UAAU,CAAC,eAAe,UAAU;CACtC;CACA,SAAS;EACP,QAAQ,CAAC;EACT,OAAO,CAAC;EACR,eAAe,CAAC,WAAW;CAC7B;AACF,EACF,CAAC;AAaD,MAAa,cAA6C,EACxD,UAAU,SACV,WACA,WAAW,OACX,cAAc,cACd,eACA,UACA,OACA,cACA,GAAG,YAEH,oBAAC,YAAY,MAAb;CACE,GAAI;CACW;CACF;CACb,WAAW,GAAG,mBAAmB;EAAE;EAAa;EAAS;CAAU,CAAC,CAAC;CAC3D;CACV,OAAO,SAAS,KAAK;CACrB,cAAc,gBAAgB,KAAK;CAEnC,UAAA,oBAAC,oBAAD;EAAoB,OAAO;GAAE;GAAS;EAAY;EAAI;CAA6B,CAAA;AACnE,CAAA;AAGpB,WAAW,OAAO;AAClB,WAAW,YAAY"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { cn } from "./classNames-DcGnTh2N.js";
|
|
2
|
-
import { createPrefixedString, debounce, noop } from "./utils-
|
|
2
|
+
import { createPrefixedString, debounce, noop } from "./utils-DwC9u0tM.js";
|
|
3
3
|
import { Search as Search$1, Sparkles, X } from "./icons-ZIeZXXS7.js";
|
|
4
4
|
import { useEffect, useMemo, useState } from "react";
|
|
5
5
|
import { cva } from "class-variance-authority";
|
|
@@ -135,7 +135,7 @@ const Search = ({ ref, suffix, className, onBlur, onChange = noop, disabled = fa
|
|
|
135
135
|
"data-testid": testId.wrapper,
|
|
136
136
|
onMouseDown: handleWrapperMouseDown,
|
|
137
137
|
children: [
|
|
138
|
-
variant === "ai" ? /* @__PURE__ */ jsx(Sparkles, { className: "tw:size-4 tw:shrink-0 tw:[&_*]:stroke-aigradient-600" }) : /* @__PURE__ */ jsx(Search$1, { className: "tw:size-4 tw:shrink-0 tw:text-
|
|
138
|
+
variant === "ai" ? /* @__PURE__ */ jsx(Sparkles, { className: "tw:size-4 tw:shrink-0 tw:[&_*]:stroke-aigradient-600" }) : /* @__PURE__ */ jsx(Search$1, { className: "tw:size-4 tw:shrink-0 tw:text-muted-foreground" }),
|
|
139
139
|
/* @__PURE__ */ jsx("input", {
|
|
140
140
|
...rest,
|
|
141
141
|
ref,
|
|
@@ -181,4 +181,4 @@ const SearchForm = ({ ref, onSubmit, name = "search-field", ...props }) => {
|
|
|
181
181
|
//#endregion
|
|
182
182
|
export { Search, SearchForm };
|
|
183
183
|
|
|
184
|
-
//# sourceMappingURL=Search-
|
|
184
|
+
//# sourceMappingURL=Search-vyZwGKMU.js.map
|