@cssui/react 1.0.0 → 1.0.1
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/dist/adapter-react/components/breadcrumb/Breadcrumb.d.ts +8 -0
- package/dist/adapter-react/components/breadcrumb/Breadcrumb.d.ts.map +1 -0
- package/dist/adapter-react/components/breadcrumb/Breadcrumb.js +170 -0
- package/dist/adapter-react/components/breadcrumb/Breadcrumb.js.map +1 -0
- package/dist/adapter-react/components/breadcrumb/index.d.ts +2 -0
- package/dist/adapter-react/components/breadcrumb/index.d.ts.map +1 -0
- package/dist/adapter-react/components/button/Button.d.ts +10 -0
- package/dist/adapter-react/components/button/Button.d.ts.map +1 -0
- package/dist/adapter-react/components/button/Button.js +49 -0
- package/dist/adapter-react/components/button/Button.js.map +1 -0
- package/dist/adapter-react/components/button/index.d.ts +3 -0
- package/dist/adapter-react/components/button/index.d.ts.map +1 -0
- package/dist/adapter-react/components/carousel/Carousel.d.ts +12 -0
- package/dist/adapter-react/components/carousel/Carousel.d.ts.map +1 -0
- package/dist/adapter-react/components/carousel/Carousel.js +155 -0
- package/dist/adapter-react/components/carousel/Carousel.js.map +1 -0
- package/dist/adapter-react/components/carousel/index.d.ts +3 -0
- package/dist/adapter-react/components/carousel/index.d.ts.map +1 -0
- package/dist/adapter-react/components/checkbox/Checkbox.d.ts +11 -0
- package/dist/adapter-react/components/checkbox/Checkbox.d.ts.map +1 -0
- package/dist/adapter-react/components/checkbox/Checkbox.js +69 -0
- package/dist/adapter-react/components/checkbox/Checkbox.js.map +1 -0
- package/dist/adapter-react/components/checkbox/CheckboxGroup.d.ts +22 -0
- package/dist/adapter-react/components/checkbox/CheckboxGroup.d.ts.map +1 -0
- package/dist/adapter-react/components/checkbox/CheckboxGroup.js +86 -0
- package/dist/adapter-react/components/checkbox/CheckboxGroup.js.map +1 -0
- package/dist/adapter-react/components/checkbox/index.d.ts +5 -0
- package/dist/adapter-react/components/checkbox/index.d.ts.map +1 -0
- package/dist/adapter-react/components/date-picker/DatePicker.d.ts +8 -0
- package/dist/adapter-react/components/date-picker/DatePicker.d.ts.map +1 -0
- package/dist/adapter-react/components/date-picker/DatePicker.js +438 -0
- package/dist/adapter-react/components/date-picker/DatePicker.js.map +1 -0
- package/dist/adapter-react/components/date-picker/index.d.ts +2 -0
- package/dist/adapter-react/components/date-picker/index.d.ts.map +1 -0
- package/dist/adapter-react/components/divider/Divider.d.ts +13 -0
- package/dist/adapter-react/components/divider/Divider.d.ts.map +1 -0
- package/dist/adapter-react/components/divider/Divider.js +31 -0
- package/dist/adapter-react/components/divider/Divider.js.map +1 -0
- package/dist/adapter-react/components/divider/index.d.ts +3 -0
- package/dist/adapter-react/components/divider/index.d.ts.map +1 -0
- package/dist/adapter-react/components/float-button/FloatButton.d.ts +17 -0
- package/dist/adapter-react/components/float-button/FloatButton.d.ts.map +1 -0
- package/dist/adapter-react/components/float-button/FloatButton.js +97 -0
- package/dist/adapter-react/components/float-button/FloatButton.js.map +1 -0
- package/dist/adapter-react/components/float-button/FloatButtonGroup.d.ts +9 -0
- package/dist/adapter-react/components/float-button/FloatButtonGroup.d.ts.map +1 -0
- package/dist/adapter-react/components/float-button/FloatButtonGroup.js +61 -0
- package/dist/adapter-react/components/float-button/FloatButtonGroup.js.map +1 -0
- package/dist/adapter-react/components/float-button/context.d.ts +3 -0
- package/dist/adapter-react/components/float-button/context.d.ts.map +1 -0
- package/dist/adapter-react/components/float-button/context.js +6 -0
- package/dist/adapter-react/components/float-button/context.js.map +1 -0
- package/dist/adapter-react/components/float-button/index.d.ts +5 -0
- package/dist/adapter-react/components/float-button/index.d.ts.map +1 -0
- package/dist/adapter-react/components/form/Form.d.ts +13 -0
- package/dist/adapter-react/components/form/Form.d.ts.map +1 -0
- package/dist/adapter-react/components/form/Form.js +355 -0
- package/dist/adapter-react/components/form/Form.js.map +1 -0
- package/dist/adapter-react/components/form/index.d.ts +4 -0
- package/dist/adapter-react/components/form/index.d.ts.map +1 -0
- package/dist/adapter-react/components/grid/Grid.d.ts +8 -0
- package/dist/adapter-react/components/grid/Grid.d.ts.map +1 -0
- package/dist/adapter-react/components/grid/Grid.js +51 -0
- package/dist/adapter-react/components/grid/Grid.js.map +1 -0
- package/dist/adapter-react/components/grid/GridItem.d.ts +8 -0
- package/dist/adapter-react/components/grid/GridItem.d.ts.map +1 -0
- package/dist/adapter-react/components/grid/GridItem.js +31 -0
- package/dist/adapter-react/components/grid/GridItem.js.map +1 -0
- package/dist/adapter-react/components/grid/index.d.ts +6 -0
- package/dist/adapter-react/components/grid/index.d.ts.map +1 -0
- package/dist/adapter-react/components/icon/Icon.d.ts +18 -0
- package/dist/adapter-react/components/icon/Icon.d.ts.map +1 -0
- package/dist/adapter-react/components/icon/Icon.js +51 -0
- package/dist/adapter-react/components/icon/Icon.js.map +1 -0
- package/dist/adapter-react/components/icon/index.d.ts +3 -0
- package/dist/adapter-react/components/icon/index.d.ts.map +1 -0
- package/dist/adapter-react/components/input/Input.d.ts +10 -0
- package/dist/adapter-react/components/input/Input.d.ts.map +1 -0
- package/dist/adapter-react/components/input/Input.js +79 -0
- package/dist/adapter-react/components/input/Input.js.map +1 -0
- package/dist/adapter-react/components/input/index.d.ts +3 -0
- package/dist/adapter-react/components/input/index.d.ts.map +1 -0
- package/dist/adapter-react/components/input-bar/InputBar.d.ts +9 -0
- package/dist/adapter-react/components/input-bar/InputBar.d.ts.map +1 -0
- package/dist/adapter-react/components/input-bar/InputBar.js +136 -0
- package/dist/adapter-react/components/input-bar/InputBar.js.map +1 -0
- package/dist/adapter-react/components/input-bar/index.d.ts +3 -0
- package/dist/adapter-react/components/input-bar/index.d.ts.map +1 -0
- package/dist/adapter-react/components/input-number/InputNumber.d.ts +9 -0
- package/dist/adapter-react/components/input-number/InputNumber.d.ts.map +1 -0
- package/dist/adapter-react/components/input-number/InputNumber.js +135 -0
- package/dist/adapter-react/components/input-number/InputNumber.js.map +1 -0
- package/dist/adapter-react/components/input-number/index.d.ts +2 -0
- package/dist/adapter-react/components/input-number/index.d.ts.map +1 -0
- package/dist/adapter-react/components/modal/Modal.d.ts +18 -0
- package/dist/adapter-react/components/modal/Modal.d.ts.map +1 -0
- package/dist/adapter-react/components/modal/Modal.js +108 -0
- package/dist/adapter-react/components/modal/Modal.js.map +1 -0
- package/dist/adapter-react/components/modal/index.d.ts +6 -0
- package/dist/adapter-react/components/modal/index.d.ts.map +1 -0
- package/dist/adapter-react/components/nav-menu/NavMenu.d.ts +11 -0
- package/dist/adapter-react/components/nav-menu/NavMenu.d.ts.map +1 -0
- package/dist/adapter-react/components/nav-menu/NavMenu.js +197 -0
- package/dist/adapter-react/components/nav-menu/NavMenu.js.map +1 -0
- package/dist/adapter-react/components/nav-menu/index.d.ts +3 -0
- package/dist/adapter-react/components/nav-menu/index.d.ts.map +1 -0
- package/dist/adapter-react/components/pagination/Pagination.d.ts +11 -0
- package/dist/adapter-react/components/pagination/Pagination.d.ts.map +1 -0
- package/dist/adapter-react/components/pagination/Pagination.js +128 -0
- package/dist/adapter-react/components/pagination/Pagination.js.map +1 -0
- package/dist/adapter-react/components/pagination/index.d.ts +3 -0
- package/dist/adapter-react/components/pagination/index.d.ts.map +1 -0
- package/dist/adapter-react/components/radio/Radio.d.ts +12 -0
- package/dist/adapter-react/components/radio/Radio.d.ts.map +1 -0
- package/dist/adapter-react/components/radio/Radio.js +83 -0
- package/dist/adapter-react/components/radio/Radio.js.map +1 -0
- package/dist/adapter-react/components/radio/RadioGroup.d.ts +24 -0
- package/dist/adapter-react/components/radio/RadioGroup.d.ts.map +1 -0
- package/dist/adapter-react/components/radio/RadioGroup.js +97 -0
- package/dist/adapter-react/components/radio/RadioGroup.js.map +1 -0
- package/dist/adapter-react/components/radio/index.d.ts +7 -0
- package/dist/adapter-react/components/radio/index.d.ts.map +1 -0
- package/dist/adapter-react/components/select/Select.d.ts +9 -0
- package/dist/adapter-react/components/select/Select.d.ts.map +1 -0
- package/dist/adapter-react/components/select/Select.js +189 -0
- package/dist/adapter-react/components/select/Select.js.map +1 -0
- package/dist/adapter-react/components/select/index.d.ts +3 -0
- package/dist/adapter-react/components/select/index.d.ts.map +1 -0
- package/dist/adapter-react/components/sidebar/Sidebar.d.ts +13 -0
- package/dist/adapter-react/components/sidebar/Sidebar.d.ts.map +1 -0
- package/dist/adapter-react/components/sidebar/Sidebar.js +242 -0
- package/dist/adapter-react/components/sidebar/Sidebar.js.map +1 -0
- package/dist/adapter-react/components/sidebar/index.d.ts +3 -0
- package/dist/adapter-react/components/sidebar/index.d.ts.map +1 -0
- package/dist/adapter-react/components/slider/Slider.d.ts +9 -0
- package/dist/adapter-react/components/slider/Slider.d.ts.map +1 -0
- package/dist/adapter-react/components/slider/Slider.js +150 -0
- package/dist/adapter-react/components/slider/Slider.js.map +1 -0
- package/dist/adapter-react/components/slider/index.d.ts +3 -0
- package/dist/adapter-react/components/slider/index.d.ts.map +1 -0
- package/dist/adapter-react/components/steps/Steps.d.ts +11 -0
- package/dist/adapter-react/components/steps/Steps.d.ts.map +1 -0
- package/dist/adapter-react/components/steps/Steps.js +172 -0
- package/dist/adapter-react/components/steps/Steps.js.map +1 -0
- package/dist/adapter-react/components/steps/index.d.ts +3 -0
- package/dist/adapter-react/components/steps/index.d.ts.map +1 -0
- package/dist/adapter-react/components/switch/Switch.d.ts +11 -0
- package/dist/adapter-react/components/switch/Switch.d.ts.map +1 -0
- package/dist/adapter-react/components/switch/Switch.js +98 -0
- package/dist/adapter-react/components/switch/Switch.js.map +1 -0
- package/dist/adapter-react/components/switch/index.d.ts +2 -0
- package/dist/adapter-react/components/switch/index.d.ts.map +1 -0
- package/dist/adapter-react/components/table/Table.d.ts +15 -0
- package/dist/adapter-react/components/table/Table.d.ts.map +1 -0
- package/dist/adapter-react/components/table/Table.js +211 -0
- package/dist/adapter-react/components/table/Table.js.map +1 -0
- package/dist/adapter-react/components/table/index.d.ts +3 -0
- package/dist/adapter-react/components/table/index.d.ts.map +1 -0
- package/dist/adapter-react/components/tabs/Tabs.d.ts +9 -0
- package/dist/adapter-react/components/tabs/Tabs.d.ts.map +1 -0
- package/dist/adapter-react/components/tabs/Tabs.js +62 -0
- package/dist/adapter-react/components/tabs/Tabs.js.map +1 -0
- package/dist/adapter-react/components/tabs/index.d.ts +2 -0
- package/dist/adapter-react/components/tabs/index.d.ts.map +1 -0
- package/dist/adapter-react/components/time-picker/TimePicker.d.ts +9 -0
- package/dist/adapter-react/components/time-picker/TimePicker.d.ts.map +1 -0
- package/dist/adapter-react/components/time-picker/TimePicker.js +271 -0
- package/dist/adapter-react/components/time-picker/TimePicker.js.map +1 -0
- package/dist/adapter-react/components/time-picker/index.d.ts +2 -0
- package/dist/adapter-react/components/time-picker/index.d.ts.map +1 -0
- package/dist/adapter-react/components/toast/Toast.d.ts +25 -0
- package/dist/adapter-react/components/toast/Toast.d.ts.map +1 -0
- package/dist/adapter-react/components/toast/Toast.js +223 -0
- package/dist/adapter-react/components/toast/Toast.js.map +1 -0
- package/dist/adapter-react/components/toast/index.d.ts +3 -0
- package/dist/adapter-react/components/toast/index.d.ts.map +1 -0
- package/dist/adapter-react/components/toolbars/Toolbar.d.ts +11 -0
- package/dist/adapter-react/components/toolbars/Toolbar.d.ts.map +1 -0
- package/dist/adapter-react/components/toolbars/Toolbar.js +66 -0
- package/dist/adapter-react/components/toolbars/Toolbar.js.map +1 -0
- package/dist/adapter-react/components/toolbars/index.d.ts +3 -0
- package/dist/adapter-react/components/toolbars/index.d.ts.map +1 -0
- package/dist/adapter-react/components/tooltip/Tooltip.d.ts +9 -0
- package/dist/adapter-react/components/tooltip/Tooltip.d.ts.map +1 -0
- package/dist/adapter-react/components/tooltip/Tooltip.js +141 -0
- package/dist/adapter-react/components/tooltip/Tooltip.js.map +1 -0
- package/dist/adapter-react/components/tooltip/index.d.ts +2 -0
- package/dist/adapter-react/components/tooltip/index.d.ts.map +1 -0
- package/dist/adapter-react/hooks/index.d.ts +12 -0
- package/dist/adapter-react/hooks/index.d.ts.map +1 -0
- package/dist/adapter-react/hooks/index.js +43 -0
- package/dist/adapter-react/hooks/index.js.map +1 -0
- package/dist/adapter-react/hooks/useControlled.d.ts +7 -0
- package/dist/adapter-react/hooks/useControlled.d.ts.map +1 -0
- package/dist/adapter-react/hooks/useControlled.js +21 -0
- package/dist/adapter-react/hooks/useControlled.js.map +1 -0
- package/dist/adapter-react/hooks/useEvent.d.ts +2 -0
- package/dist/adapter-react/hooks/useEvent.d.ts.map +1 -0
- package/dist/adapter-react/hooks/useMergedState.d.ts +4 -0
- package/dist/adapter-react/hooks/useMergedState.d.ts.map +1 -0
- package/dist/adapter-react/hooks/useMergedState.js +15 -0
- package/dist/adapter-react/hooks/useMergedState.js.map +1 -0
- package/dist/adapter-react/index.d.ts +37 -0
- package/dist/adapter-react/index.d.ts.map +1 -0
- package/dist/adapter-react/runtime/createComponent.d.ts +3 -0
- package/dist/adapter-react/runtime/createComponent.d.ts.map +1 -0
- package/dist/adapter-react/runtime/createComponent.js +6 -0
- package/dist/adapter-react/runtime/createComponent.js.map +1 -0
- package/dist/adapter-react/runtime/createProps.d.ts +2 -0
- package/dist/adapter-react/runtime/createProps.d.ts.map +1 -0
- package/dist/adapter-react/runtime/forwardRef.d.ts +3 -0
- package/dist/adapter-react/runtime/forwardRef.d.ts.map +1 -0
- package/dist/adapter-react/runtime/forwardRef.js +6 -0
- package/dist/adapter-react/runtime/forwardRef.js.map +1 -0
- package/dist/adapter-react/runtime/index.d.ts +5 -0
- package/dist/adapter-react/runtime/index.d.ts.map +1 -0
- package/dist/adapter-react/runtime/withInstall.d.ts +3 -0
- package/dist/adapter-react/runtime/withInstall.d.ts.map +1 -0
- package/dist/adapter-react/runtime/withInstall.js +6 -0
- package/dist/adapter-react/runtime/withInstall.js.map +1 -0
- package/dist/adapter-react/style/index.d.ts +2 -0
- package/dist/adapter-react/style/index.d.ts.map +1 -0
- package/dist/adapter-react/style/injectStyle.d.ts +2 -0
- package/dist/adapter-react/style/injectStyle.d.ts.map +1 -0
- package/dist/adapter-react/types.d.ts +6 -0
- package/dist/adapter-react/types.d.ts.map +1 -0
- package/dist/breadcrumb/index.d.ts +2 -2
- package/dist/breadcrumb/index.js +34 -1
- package/dist/breadcrumb/index.js.map +1 -0
- package/dist/breadcrumb/style.css +219 -1
- package/dist/button/index.d.ts +2 -2
- package/dist/button/index.js +34 -1
- package/dist/button/index.js.map +1 -0
- package/dist/button/style.css +151 -1
- package/dist/carousel/index.d.ts +2 -2
- package/dist/carousel/index.js +34 -1
- package/dist/carousel/index.js.map +1 -0
- package/dist/carousel/style.css +196 -1
- package/dist/checkbox/index.d.ts +3 -3
- package/dist/checkbox/index.js +34 -2
- package/dist/checkbox/index.js.map +1 -0
- package/dist/checkbox/style.css +135 -1
- package/dist/components/breadcrumb/index.d.ts +61 -0
- package/dist/components/breadcrumb/index.d.ts.map +1 -0
- package/dist/components/breadcrumb/index.js +49 -0
- package/dist/components/breadcrumb/index.js.map +1 -0
- package/dist/components/breadcrumb/style.css +219 -0
- package/dist/components/button/index.d.ts +15 -0
- package/dist/components/button/index.d.ts.map +1 -0
- package/dist/components/button/index.js +11 -0
- package/dist/components/button/index.js.map +1 -0
- package/dist/components/button/style.css +151 -0
- package/dist/components/carousel/index.d.ts +38 -0
- package/dist/components/carousel/index.d.ts.map +1 -0
- package/dist/components/carousel/index.js +33 -0
- package/dist/components/carousel/index.js.map +1 -0
- package/dist/components/carousel/style.css +196 -0
- package/dist/components/checkbox/index.d.ts +36 -0
- package/dist/components/checkbox/index.d.ts.map +1 -0
- package/dist/components/checkbox/index.js +34 -0
- package/dist/components/checkbox/index.js.map +1 -0
- package/dist/components/checkbox/style.css +135 -0
- package/dist/components/date-picker/index.d.ts +53 -0
- package/dist/components/date-picker/index.d.ts.map +1 -0
- package/dist/components/date-picker/index.js +105 -0
- package/dist/components/date-picker/index.js.map +1 -0
- package/dist/components/date-picker/style.css +491 -0
- package/dist/components/divider/index.d.ts +12 -0
- package/dist/components/divider/index.d.ts.map +1 -0
- package/dist/components/divider/index.js +23 -0
- package/dist/components/divider/index.js.map +1 -0
- package/dist/components/divider/style.css +100 -0
- package/dist/components/float-button/index.d.ts +32 -0
- package/dist/components/float-button/index.d.ts.map +1 -0
- package/dist/components/float-button/index.js +23 -0
- package/dist/components/float-button/index.js.map +1 -0
- package/dist/components/float-button/style.css +176 -0
- package/dist/components/form/index.d.ts +79 -0
- package/dist/components/form/index.d.ts.map +1 -0
- package/dist/components/form/index.js +144 -0
- package/dist/components/form/index.js.map +1 -0
- package/dist/components/form/style.css +79 -0
- package/dist/components/grid/index.d.ts +34 -0
- package/dist/components/grid/index.d.ts.map +1 -0
- package/dist/components/grid/index.js +109 -0
- package/dist/components/grid/index.js.map +1 -0
- package/dist/components/grid/style.css +189 -0
- package/dist/components/icon/index.d.ts +35 -0
- package/dist/components/icon/index.d.ts.map +1 -0
- package/dist/components/icon/index.js +16 -0
- package/dist/components/icon/index.js.map +1 -0
- package/dist/components/icon/style.css +28 -0
- package/dist/components/input/index.d.ts +29 -0
- package/dist/components/input/index.d.ts.map +1 -0
- package/dist/components/input/index.js +19 -0
- package/dist/components/input/index.js.map +1 -0
- package/dist/components/input/style.css +110 -0
- package/dist/components/input-bar/index.d.ts +31 -0
- package/dist/components/input-bar/index.d.ts.map +1 -0
- package/dist/components/input-bar/index.js +18 -0
- package/dist/components/input-bar/index.js.map +1 -0
- package/dist/components/input-bar/style.css +180 -0
- package/dist/components/input-number/index.d.ts +28 -0
- package/dist/components/input-number/index.d.ts.map +1 -0
- package/dist/components/input-number/index.js +21 -0
- package/dist/components/input-number/index.js.map +1 -0
- package/dist/components/input-number/style.css +109 -0
- package/dist/components/modal/index.d.ts +17 -0
- package/dist/components/modal/index.d.ts.map +1 -0
- package/dist/components/modal/index.js +10 -0
- package/dist/components/modal/index.js.map +1 -0
- package/dist/components/modal/style.css +150 -0
- package/dist/components/nav-menu/index.d.ts +35 -0
- package/dist/components/nav-menu/index.d.ts.map +1 -0
- package/dist/components/nav-menu/index.js +47 -0
- package/dist/components/nav-menu/index.js.map +1 -0
- package/dist/components/nav-menu/style.css +241 -0
- package/dist/components/pagination/index.d.ts +32 -0
- package/dist/components/pagination/index.d.ts.map +1 -0
- package/dist/components/pagination/index.js +35 -0
- package/dist/components/pagination/index.js.map +1 -0
- package/dist/components/pagination/style.css +150 -0
- package/dist/components/radio/index.d.ts +45 -0
- package/dist/components/radio/index.d.ts.map +1 -0
- package/dist/components/radio/index.js +48 -0
- package/dist/components/radio/index.js.map +1 -0
- package/dist/components/radio/style.css +294 -0
- package/dist/components/select/index.d.ts +30 -0
- package/dist/components/select/index.d.ts.map +1 -0
- package/dist/components/select/index.js +16 -0
- package/dist/components/select/index.js.map +1 -0
- package/dist/components/select/style.css +255 -0
- package/dist/components/sidebar/index.d.ts +19 -0
- package/dist/components/sidebar/index.d.ts.map +1 -0
- package/dist/components/sidebar/index.js +23 -0
- package/dist/components/sidebar/index.js.map +1 -0
- package/dist/components/sidebar/style.css +270 -0
- package/dist/components/slider/index.d.ts +29 -0
- package/dist/components/slider/index.d.ts.map +1 -0
- package/dist/components/slider/index.js +24 -0
- package/dist/components/slider/index.js.map +1 -0
- package/dist/components/slider/style.css +206 -0
- package/dist/components/src/index.d.ts +28 -0
- package/dist/components/src/index.d.ts.map +1 -0
- package/dist/components/steps/index.d.ts +41 -0
- package/dist/components/steps/index.d.ts.map +1 -0
- package/dist/components/steps/index.js +32 -0
- package/dist/components/steps/index.js.map +1 -0
- package/dist/components/steps/style.css +286 -0
- package/dist/components/switch/index.d.ts +16 -0
- package/dist/components/switch/index.d.ts.map +1 -0
- package/dist/components/switch/index.js +17 -0
- package/dist/components/switch/index.js.map +1 -0
- package/dist/components/switch/style.css +160 -0
- package/dist/components/table/index.d.ts +49 -0
- package/dist/components/table/index.d.ts.map +1 -0
- package/dist/components/table/index.js +74 -0
- package/dist/components/table/index.js.map +1 -0
- package/dist/components/table/style.css +131 -0
- package/dist/components/tabs/index.d.ts +34 -0
- package/dist/components/tabs/index.d.ts.map +1 -0
- package/dist/components/tabs/index.js +21 -0
- package/dist/components/tabs/index.js.map +1 -0
- package/dist/components/tabs/style.css +146 -0
- package/dist/components/time-picker/index.d.ts +56 -0
- package/dist/components/time-picker/index.d.ts.map +1 -0
- package/dist/components/time-picker/index.js +84 -0
- package/dist/components/time-picker/index.js.map +1 -0
- package/dist/components/time-picker/style.css +258 -0
- package/dist/components/toast/index.d.ts +41 -0
- package/dist/components/toast/index.d.ts.map +1 -0
- package/dist/components/toast/index.js +24 -0
- package/dist/components/toast/index.js.map +1 -0
- package/dist/components/toast/style.css +117 -0
- package/dist/components/toolbars/index.d.ts +31 -0
- package/dist/components/toolbars/index.d.ts.map +1 -0
- package/dist/components/toolbars/index.js +32 -0
- package/dist/components/toolbars/index.js.map +1 -0
- package/dist/components/toolbars/style.css +220 -0
- package/dist/components/tooltip/index.d.ts +31 -0
- package/dist/components/tooltip/index.d.ts.map +1 -0
- package/dist/components/tooltip/index.js +17 -0
- package/dist/components/tooltip/index.js.map +1 -0
- package/dist/components/tooltip/style.css +138 -0
- package/dist/date-picker/index.d.ts +2 -2
- package/dist/date-picker/index.js +34 -1
- package/dist/date-picker/index.js.map +1 -0
- package/dist/date-picker/style.css +491 -1
- package/dist/divider/index.d.ts +2 -2
- package/dist/divider/index.js +34 -1
- package/dist/divider/index.js.map +1 -0
- package/dist/divider/style.css +100 -1
- package/dist/float-button/index.d.ts +2 -2
- package/dist/float-button/index.js +34 -1
- package/dist/float-button/index.js.map +1 -0
- package/dist/float-button/style.css +176 -1
- package/dist/form/index.d.ts +2 -2
- package/dist/form/index.js +34 -1
- package/dist/form/index.js.map +1 -0
- package/dist/form/style.css +79 -1
- package/dist/grid/index.d.ts +2 -2
- package/dist/grid/index.js +34 -1
- package/dist/grid/index.js.map +1 -0
- package/dist/grid/style.css +189 -1
- package/dist/icon/index.d.ts +2 -2
- package/dist/icon/index.js +34 -1
- package/dist/icon/index.js.map +1 -0
- package/dist/icon/style.css +28 -1
- package/dist/icons/react/add_circle.js +26 -0
- package/dist/icons/react/add_circle.js.map +1 -0
- package/dist/icons/react/arrow_back.js +26 -0
- package/dist/icons/react/arrow_back.js.map +1 -0
- package/dist/icons/react/arrow_drop_down.js +26 -0
- package/dist/icons/react/arrow_drop_down.js.map +1 -0
- package/dist/icons/react/arrow_forward.js +26 -0
- package/dist/icons/react/arrow_forward.js.map +1 -0
- package/dist/icons/react/calendar_month.js +26 -0
- package/dist/icons/react/calendar_month.js.map +1 -0
- package/dist/icons/react/check.js +26 -0
- package/dist/icons/react/check.js.map +1 -0
- package/dist/icons/react/chevron_right.js +26 -0
- package/dist/icons/react/chevron_right.js.map +1 -0
- package/dist/icons/react/close.js +26 -0
- package/dist/icons/react/close.js.map +1 -0
- package/dist/icons/react/config.js +26 -0
- package/dist/icons/react/config.js.map +1 -0
- package/dist/icons/react/dark_mode.js +26 -0
- package/dist/icons/react/dark_mode.js.map +1 -0
- package/dist/icons/react/do_not_disturb_on.js +26 -0
- package/dist/icons/react/do_not_disturb_on.js.map +1 -0
- package/dist/icons/react/error.js +26 -0
- package/dist/icons/react/error.js.map +1 -0
- package/dist/icons/react/home.js +29 -0
- package/dist/icons/react/home.js.map +1 -0
- package/dist/icons/react/index.js +27 -0
- package/dist/icons/react/index.js.map +1 -0
- package/dist/icons/react/info.js +26 -0
- package/dist/icons/react/info.js.map +1 -0
- package/dist/icons/react/logo_Block.js +26 -0
- package/dist/icons/react/logo_Block.js.map +1 -0
- package/dist/icons/react/logo_Horizontal.js +26 -0
- package/dist/icons/react/logo_Horizontal.js.map +1 -0
- package/dist/icons/react/looks_3.js +26 -0
- package/dist/icons/react/looks_3.js.map +1 -0
- package/dist/icons/react/looks_one.js +26 -0
- package/dist/icons/react/looks_one.js.map +1 -0
- package/dist/icons/react/looks_two.js +26 -0
- package/dist/icons/react/looks_two.js.map +1 -0
- package/dist/icons/react/menu.js +26 -0
- package/dist/icons/react/menu.js.map +1 -0
- package/dist/icons/react/menu_open.js +26 -0
- package/dist/icons/react/menu_open.js.map +1 -0
- package/dist/icons/react/more_horiz.js +29 -0
- package/dist/icons/react/more_horiz.js.map +1 -0
- package/dist/icons/react/schedule.js +26 -0
- package/dist/icons/react/schedule.js.map +1 -0
- package/dist/icons/react/search.js +26 -0
- package/dist/icons/react/search.js.map +1 -0
- package/dist/icons/react/sunny.js +26 -0
- package/dist/icons/react/sunny.js.map +1 -0
- package/dist/icons/react/warning.js +26 -0
- package/dist/icons/react/warning.js.map +1 -0
- package/dist/index.css +5214 -0
- package/dist/index.css.map +1 -0
- package/dist/input/index.d.ts +2 -2
- package/dist/input/index.js +34 -1
- package/dist/input/index.js.map +1 -0
- package/dist/input/style.css +110 -1
- package/dist/input-bar/index.d.ts +2 -2
- package/dist/input-bar/index.js +34 -1
- package/dist/input-bar/index.js.map +1 -0
- package/dist/input-bar/style.css +180 -1
- package/dist/input-number/index.d.ts +1 -1
- package/dist/input-number/index.js +34 -1
- package/dist/input-number/index.js.map +1 -0
- package/dist/input-number/style.css +109 -1
- package/dist/modal/index.d.ts +2 -2
- package/dist/modal/index.js +34 -1
- package/dist/modal/index.js.map +1 -0
- package/dist/modal/style.css +150 -1
- package/dist/nav-menu/index.d.ts +2 -2
- package/dist/nav-menu/index.js +34 -1
- package/dist/nav-menu/index.js.map +1 -0
- package/dist/nav-menu/style.css +241 -1
- package/dist/pagination/index.d.ts +1 -1
- package/dist/pagination/index.js +34 -1
- package/dist/pagination/index.js.map +1 -0
- package/dist/pagination/style.css +150 -1
- package/dist/radio/index.d.ts +3 -3
- package/dist/radio/index.js +34 -2
- package/dist/radio/index.js.map +1 -0
- package/dist/radio/style.css +294 -1
- package/dist/select/index.d.ts +2 -2
- package/dist/select/index.js +34 -1
- package/dist/select/index.js.map +1 -0
- package/dist/select/style.css +255 -1
- package/dist/sidebar/index.d.ts +2 -2
- package/dist/sidebar/index.js +34 -1
- package/dist/sidebar/index.js.map +1 -0
- package/dist/sidebar/style.css +270 -1
- package/dist/slider/index.d.ts +2 -2
- package/dist/slider/index.js +34 -1
- package/dist/slider/index.js.map +1 -0
- package/dist/slider/style.css +206 -1
- package/dist/src/index.js +33 -31
- package/dist/src/index.js.map +1 -0
- package/dist/steps/index.d.ts +1 -1
- package/dist/steps/index.js +34 -1
- package/dist/steps/index.js.map +1 -0
- package/dist/steps/style.css +286 -1
- package/dist/switch/index.d.ts +2 -2
- package/dist/switch/index.js +34 -1
- package/dist/switch/index.js.map +1 -0
- package/dist/switch/style.css +160 -1
- package/dist/table/index.d.ts +1 -1
- package/dist/table/index.js +34 -1
- package/dist/table/index.js.map +1 -0
- package/dist/table/style.css +131 -1
- package/dist/tabs/index.d.ts +2 -2
- package/dist/tabs/index.js +34 -1
- package/dist/tabs/index.js.map +1 -0
- package/dist/tabs/style.css +146 -1
- package/dist/time-picker/index.d.ts +2 -2
- package/dist/time-picker/index.js +34 -1
- package/dist/time-picker/index.js.map +1 -0
- package/dist/time-picker/style.css +258 -1
- package/dist/toast/index.d.ts +4 -4
- package/dist/toast/index.js +38 -3
- package/dist/toast/index.js.map +1 -0
- package/dist/toast/style.css +117 -1
- package/dist/toolbars/index.d.ts +3 -3
- package/dist/toolbars/index.js +34 -1
- package/dist/toolbars/index.js.map +1 -0
- package/dist/toolbars/style.css +220 -1
- package/dist/tooltip/index.d.ts +1 -1
- package/dist/tooltip/index.js +34 -1
- package/dist/tooltip/index.js.map +1 -0
- package/dist/tooltip/style.css +138 -1
- package/dist/utils/src/index.js +6 -0
- package/dist/utils/src/index.js.map +1 -0
- package/package.json +7 -7
- package/dist/tsconfig.tsbuildinfo +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Sidebar.js","sources":["../../../../../adapter-react/components/sidebar/Sidebar.tsx"],"sourcesContent":["import {\n type HTMLAttributes,\n type MouseEvent,\n type MutableRefObject,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimport {\n findNavMenuItemPath,\n hasNavMenuChildren,\n type NavMenuValue,\n} from '@cssui/components/nav-menu'\nimport {\n getSidebarClassNames,\n getSidebarItemClassNames,\n type SidebarItem,\n type SidebarProps as BaseSidebarProps,\n} from '@cssui/components/sidebar'\nimport { cn } from '@cssui/utils'\nimport { useMergedState } from '../../hooks'\nimport { createComponent, forwardRef, withInstall } from '../../runtime'\nimport Icon from '../icon/Icon'\n\nimport '@cssui/components/sidebar/style.css'\n\nexport interface SidebarProps\n extends Omit<BaseSidebarProps, 'className'>, Omit<HTMLAttributes<HTMLElement>, 'onChange'> {\n value?: NavMenuValue\n defaultValue?: NavMenuValue\n collapsed?: boolean\n onChange?: (value: NavMenuValue, item: SidebarItem, event: MouseEvent<HTMLElement>) => void\n}\n\nconst SidebarComponent = createComponent(\n forwardRef<HTMLElement, SidebarProps>((props, ref) => {\n const {\n items = [],\n value,\n defaultValue,\n collapsed = false,\n className,\n onChange,\n ...restProps\n } = props\n\n const [currentValue, setCurrentValue] = useMergedState<NavMenuValue | undefined>(defaultValue, {\n value,\n })\n const selectedPath = useMemo(\n () => findNavMenuItemPath(items, currentValue),\n [items, currentValue]\n )\n const selectedAncestorValues = useMemo(\n () => selectedPath.slice(0, -1).map(item => item.value),\n [selectedPath]\n )\n const selectedRootValue = selectedPath[0]?.value\n\n const [expandedValues, setExpandedValues] = useState<NavMenuValue[]>(selectedAncestorValues)\n const [openRootValue, setOpenRootValue] = useState<NavMenuValue | undefined>(\n selectedRootValue ?? items[0]?.value\n )\n const skipSyncOpenRootRef = useRef(false)\n const rootRef = useRef<HTMLElement | null>(null)\n\n const setRootRef = (node: HTMLElement | null) => {\n rootRef.current = node\n\n if (typeof ref === 'function') {\n ref(node)\n return\n }\n\n if (ref) {\n ;(ref as MutableRefObject<HTMLElement | null>).current = node\n }\n }\n\n useEffect(() => {\n setExpandedValues(prev => Array.from(new Set([...prev, ...selectedAncestorValues])))\n }, [currentValue, selectedAncestorValues])\n\n useEffect(() => {\n if (!collapsed) {\n return\n }\n\n if (skipSyncOpenRootRef.current) {\n skipSyncOpenRootRef.current = false\n return\n }\n\n setOpenRootValue(previous => selectedRootValue ?? previous ?? items[0]?.value)\n }, [collapsed, items, selectedRootValue])\n\n useEffect(() => {\n if (!collapsed || openRootValue === undefined) {\n return\n }\n\n const handlePointerDown = (event: PointerEvent) => {\n const target = event.target as Node | null\n\n if (!target || !rootRef.current || rootRef.current.contains(target)) {\n return\n }\n\n setOpenRootValue(undefined)\n }\n\n document.addEventListener('pointerdown', handlePointerDown)\n\n return () => {\n document.removeEventListener('pointerdown', handlePointerDown)\n }\n }, [collapsed, openRootValue])\n\n const expandedSet = useMemo(\n () => new Set<NavMenuValue>([...expandedValues, ...selectedAncestorValues]),\n [expandedValues, selectedAncestorValues]\n )\n const openRootItem = useMemo(\n () => items.find(item => item.value === openRootValue),\n [items, openRootValue]\n )\n\n const toggleExpanded = (value: NavMenuValue) => {\n setExpandedValues(prev =>\n prev.includes(value) ? prev.filter(item => item !== value) : [...prev, value]\n )\n }\n\n const handlePanelBack = () => {\n setOpenRootValue(undefined)\n }\n\n const handleSelect = (\n item: SidebarItem,\n event: MouseEvent<HTMLButtonElement | HTMLAnchorElement>,\n level: number\n ) => {\n if (item.disabled) {\n event.preventDefault()\n return\n }\n\n if (collapsed && level === 0) {\n setOpenRootValue(item.value)\n\n if (!hasNavMenuChildren(item)) {\n setCurrentValue(item.value)\n onChange?.(item.value, item, event as MouseEvent<HTMLElement>)\n }\n\n return\n }\n\n if (hasNavMenuChildren(item)) {\n toggleExpanded(item.value)\n return\n }\n\n setCurrentValue(item.value)\n\n if (collapsed && level > 0) {\n skipSyncOpenRootRef.current = true\n setOpenRootValue(undefined)\n }\n\n onChange?.(item.value, item, event as MouseEvent<HTMLElement>)\n }\n\n const renderList = (list: SidebarItem[], level: number, iconOnly = false) => (\n <ul className={cn('css-sidebar__list', level > 0 ? 'css-sidebar__submenu' : undefined)}>\n {list.map(item => {\n const active = currentValue === item.value && !hasNavMenuChildren(item)\n const expanded =\n hasNavMenuChildren(item) &&\n (iconOnly ? openRootValue === item.value : expandedSet.has(item.value))\n const classes = cn(\n getSidebarItemClassNames({\n active,\n expanded,\n disabled: item.disabled,\n }),\n iconOnly && 'css-sidebar__item--icon-only'\n )\n const content = iconOnly ? (\n <span className=\"css-sidebar__item-main\">\n <span className=\"css-sidebar__item-icon\">\n {item.icon ? (\n <Icon name={item.icon as any} size={20} />\n ) : (\n <span className=\"css-sidebar__item-symbol\">{item.label.slice(0, 1)}</span>\n )}\n </span>\n </span>\n ) : (\n <>\n <span className=\"css-sidebar__item-main\">\n {item.icon && (\n <span className=\"css-sidebar__item-icon\">\n <Icon name={item.icon as any} size={20} />\n </span>\n )}\n <span className=\"css-sidebar__item-label\">{item.label}</span>\n </span>\n {hasNavMenuChildren(item) && (\n <span className=\"css-sidebar__item-arrow\">\n <Icon name=\"ChevronRight\" size={20} />\n </span>\n )}\n </>\n )\n const style = iconOnly\n ? { padding: '12px 0' }\n : { padding: '8px', paddingLeft: 12 + level * 16 }\n\n return (\n <li key={item.value}>\n {item.href && !hasNavMenuChildren(item) ? (\n <a\n href={item.disabled ? undefined : item.href}\n className={classes}\n style={style}\n aria-disabled={item.disabled || undefined}\n onClick={event => handleSelect(item, event, level)}\n >\n {content}\n </a>\n ) : (\n <button\n type=\"button\"\n className={classes}\n style={style}\n aria-expanded={hasNavMenuChildren(item) ? expanded : undefined}\n onClick={event => handleSelect(item, event, level)}\n >\n {content}\n </button>\n )}\n {!iconOnly && hasNavMenuChildren(item) && expanded\n ? renderList(item.children ?? [], level + 1)\n : null}\n </li>\n )\n })}\n </ul>\n )\n\n const renderCollapsedPanelList = (list: SidebarItem[], level = 0) => (\n <ul className={cn(level === 0 ? 'css-sidebar__panel-list' : 'css-sidebar__panel-sublist')}>\n {list.map(item => {\n const active = currentValue === item.value && !hasNavMenuChildren(item)\n const expanded = hasNavMenuChildren(item)\n const nestedLinkClass =\n level > 0\n ? level > 1\n ? 'css-sidebar__panel-link--deep'\n : 'css-sidebar__panel-link--nested'\n : undefined\n\n if (item.href && !hasNavMenuChildren(item)) {\n return (\n <li key={item.value} className=\"css-sidebar__panel-entry\">\n <a\n href={item.disabled ? undefined : item.href}\n className={cn(\n 'css-sidebar__panel-link',\n active && 'css-sidebar__panel-link--active',\n nestedLinkClass\n )}\n aria-disabled={item.disabled || undefined}\n onClick={event => handleSelect(item, event, level + 1)}\n >\n {item.label}\n </a>\n </li>\n )\n }\n\n return (\n <li\n key={item.value}\n className={\n hasNavMenuChildren(item) ? 'css-sidebar__panel-group' : 'css-sidebar__panel-entry'\n }\n >\n <button\n type=\"button\"\n className={cn(\n hasNavMenuChildren(item)\n ? 'css-sidebar__panel-section'\n : 'css-sidebar__panel-link',\n hasNavMenuChildren(item) && expanded && 'css-sidebar__panel-section--expanded',\n !hasNavMenuChildren(item) && active && 'css-sidebar__panel-link--active',\n !hasNavMenuChildren(item) && nestedLinkClass\n )}\n onClick={event => handleSelect(item, event, level + 1)}\n >\n {item.label}\n </button>\n {hasNavMenuChildren(item)\n ? renderCollapsedPanelList(item.children ?? [], level + 1)\n : null}\n </li>\n )\n })}\n </ul>\n )\n\n return (\n <aside\n ref={setRootRef}\n className={cn(getSidebarClassNames(), collapsed && 'css-sidebar--collapsed', className)}\n aria-label=\"侧边导航\"\n {...restProps}\n >\n {collapsed ? (\n <>\n {renderList(items, 0, true)}\n {openRootItem && hasNavMenuChildren(openRootItem) ? (\n <div className=\"css-sidebar__panel\">\n <div className=\"css-sidebar__panel-header\">\n <button\n type=\"button\"\n className=\"css-sidebar__panel-header-button\"\n onClick={handlePanelBack}\n >\n <span className=\"css-sidebar__panel-header-icon\">\n <Icon name=\"ArrowBack\" size={18} />\n </span>\n <span className=\"css-sidebar__panel-header-label\">{openRootItem.label}</span>\n </button>\n </div>\n <div className=\"css-sidebar__panel-body\">\n {renderCollapsedPanelList(openRootItem.children ?? [], 0)}\n </div>\n </div>\n ) : null}\n </>\n ) : (\n renderList(items, 0)\n )}\n </aside>\n )\n })\n)\n\nSidebarComponent.displayName = 'CssSidebar'\n\nexport const Sidebar = withInstall(SidebarComponent)\n\nexport default Sidebar\n"],"names":["value","Icon"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/sidebar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type SliderProps as BaseSliderProps } from '../../../components/slider/index';
|
|
2
|
+
import '../../../components/slider/style.css';
|
|
3
|
+
export interface SliderProps extends BaseSliderProps {
|
|
4
|
+
/** 非受控默认值 */
|
|
5
|
+
defaultValue?: number;
|
|
6
|
+
}
|
|
7
|
+
export declare const Slider: import("../..").ComponentWithInstall<import("react").ForwardRefExoticComponent<SliderProps & import("react").RefAttributes<HTMLInputElement>>>;
|
|
8
|
+
export default Slider;
|
|
9
|
+
//# sourceMappingURL=Slider.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../components/slider/Slider.tsx"],"names":[],"mappings":"AACA,OAAO,EAIL,KAAK,WAAW,IAAI,eAAe,EAEpC,MAAM,0BAA0B,CAAA;AAIjC,OAAO,oCAAoC,CAAA;AAE3C,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD,aAAa;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AA+JD,eAAO,MAAM,MAAM,gJAA+B,CAAA;AAClD,eAAe,MAAM,CAAA"}
|
|
@@ -0,0 +1,150 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useState, useRef, useCallback } from 'react';
|
|
3
|
+
import { calcValueFromPosition, getSliderClassNames, getSliderPercent } from '../../../components/slider/index.js';
|
|
4
|
+
import { createComponent } from '../../runtime/createComponent.js';
|
|
5
|
+
import { withInstall } from '../../runtime/withInstall.js';
|
|
6
|
+
import { forwardRef } from '../../runtime/forwardRef.js';
|
|
7
|
+
import { cn } from '../../../utils/src/index.js';
|
|
8
|
+
|
|
9
|
+
const SliderComponent = createComponent(
|
|
10
|
+
forwardRef((props, ref) => {
|
|
11
|
+
const {
|
|
12
|
+
label,
|
|
13
|
+
value: controlledValue,
|
|
14
|
+
defaultValue,
|
|
15
|
+
min = 0,
|
|
16
|
+
max = 10,
|
|
17
|
+
step = 1,
|
|
18
|
+
disabled = false,
|
|
19
|
+
type = "default",
|
|
20
|
+
onChange
|
|
21
|
+
} = props;
|
|
22
|
+
const [internalValue, setInternalValue] = useState(controlledValue ?? defaultValue ?? min);
|
|
23
|
+
const [isDragging, setIsDragging] = useState(false);
|
|
24
|
+
const trackRef = useRef(null);
|
|
25
|
+
const isControlled = controlledValue !== void 0;
|
|
26
|
+
const currentValue = isControlled ? controlledValue : internalValue;
|
|
27
|
+
const percent = getSliderPercent(currentValue, min, max);
|
|
28
|
+
const updateValue = useCallback(
|
|
29
|
+
(newValue) => {
|
|
30
|
+
const clamped = Math.min(Math.max(newValue, min), max);
|
|
31
|
+
if (!isControlled) {
|
|
32
|
+
setInternalValue(clamped);
|
|
33
|
+
}
|
|
34
|
+
onChange?.(clamped);
|
|
35
|
+
},
|
|
36
|
+
[onChange, isControlled, min, max]
|
|
37
|
+
);
|
|
38
|
+
const handleMove = useCallback(
|
|
39
|
+
(clientX) => {
|
|
40
|
+
if (!trackRef.current || disabled) return;
|
|
41
|
+
const rect = trackRef.current.getBoundingClientRect();
|
|
42
|
+
const newValue = calcValueFromPosition(clientX, rect, min, max, step);
|
|
43
|
+
updateValue(newValue);
|
|
44
|
+
},
|
|
45
|
+
[disabled, min, max, step, updateValue]
|
|
46
|
+
);
|
|
47
|
+
const handlePointerDown = useCallback(
|
|
48
|
+
(e) => {
|
|
49
|
+
if (disabled) return;
|
|
50
|
+
e.preventDefault();
|
|
51
|
+
setIsDragging(true);
|
|
52
|
+
handleMove(e.clientX);
|
|
53
|
+
const handleMouseMove = (ev) => handleMove(ev.clientX);
|
|
54
|
+
const handleMouseUp = () => {
|
|
55
|
+
setIsDragging(false);
|
|
56
|
+
document.removeEventListener("mousemove", handleMouseMove);
|
|
57
|
+
document.removeEventListener("mouseup", handleMouseUp);
|
|
58
|
+
document.body.style.userSelect = "";
|
|
59
|
+
document.body.style.cursor = "";
|
|
60
|
+
};
|
|
61
|
+
document.body.style.userSelect = "none";
|
|
62
|
+
document.body.style.cursor = "grabbing";
|
|
63
|
+
document.addEventListener("mousemove", handleMouseMove);
|
|
64
|
+
document.addEventListener("mouseup", handleMouseUp);
|
|
65
|
+
},
|
|
66
|
+
[disabled, handleMove]
|
|
67
|
+
);
|
|
68
|
+
const handleTouchStart = useCallback(
|
|
69
|
+
(e) => {
|
|
70
|
+
if (disabled) return;
|
|
71
|
+
e.preventDefault();
|
|
72
|
+
setIsDragging(true);
|
|
73
|
+
handleMove(e.touches[0].clientX);
|
|
74
|
+
const handleTouchMove = (ev) => {
|
|
75
|
+
ev.preventDefault();
|
|
76
|
+
handleMove(ev.touches[0].clientX);
|
|
77
|
+
};
|
|
78
|
+
const handleTouchEnd = () => {
|
|
79
|
+
setIsDragging(false);
|
|
80
|
+
document.removeEventListener("touchmove", handleTouchMove);
|
|
81
|
+
document.removeEventListener("touchend", handleTouchEnd);
|
|
82
|
+
document.removeEventListener("touchcancel", handleTouchEnd);
|
|
83
|
+
};
|
|
84
|
+
document.addEventListener("touchmove", handleTouchMove, { passive: false });
|
|
85
|
+
document.addEventListener("touchend", handleTouchEnd);
|
|
86
|
+
document.addEventListener("touchcancel", handleTouchEnd);
|
|
87
|
+
},
|
|
88
|
+
[disabled, handleMove]
|
|
89
|
+
);
|
|
90
|
+
const handleInputChange = useCallback(
|
|
91
|
+
(e) => {
|
|
92
|
+
const raw = Number(e.target.value);
|
|
93
|
+
if (isNaN(raw)) return;
|
|
94
|
+
const clamped = Math.min(Math.max(raw, min), max);
|
|
95
|
+
if (!isControlled) {
|
|
96
|
+
setInternalValue(clamped);
|
|
97
|
+
}
|
|
98
|
+
onChange?.(clamped);
|
|
99
|
+
},
|
|
100
|
+
[isControlled, min, max, onChange]
|
|
101
|
+
);
|
|
102
|
+
const content = /* @__PURE__ */ jsxs("div", { className: cn(getSliderClassNames({ type, disabled })), children: [
|
|
103
|
+
type === "input" && /* @__PURE__ */ jsx("div", { className: "css-slider__input-wrapper", children: /* @__PURE__ */ jsx(
|
|
104
|
+
"input",
|
|
105
|
+
{
|
|
106
|
+
ref,
|
|
107
|
+
type: "number",
|
|
108
|
+
className: "css-slider__input-box",
|
|
109
|
+
value: currentValue,
|
|
110
|
+
min,
|
|
111
|
+
max,
|
|
112
|
+
step,
|
|
113
|
+
disabled,
|
|
114
|
+
onChange: handleInputChange
|
|
115
|
+
}
|
|
116
|
+
) }),
|
|
117
|
+
/* @__PURE__ */ jsxs(
|
|
118
|
+
"div",
|
|
119
|
+
{
|
|
120
|
+
ref: trackRef,
|
|
121
|
+
className: "css-slider__track",
|
|
122
|
+
onMouseDown: handlePointerDown,
|
|
123
|
+
onTouchStart: handleTouchStart,
|
|
124
|
+
children: [
|
|
125
|
+
/* @__PURE__ */ jsx("div", { className: "css-slider__fill", style: { width: `${percent * 100}%` } }),
|
|
126
|
+
/* @__PURE__ */ jsx(
|
|
127
|
+
"div",
|
|
128
|
+
{
|
|
129
|
+
className: cn("css-slider__thumb", isDragging && "css-slider__thumb--dragging"),
|
|
130
|
+
style: { left: `${percent * 100}%` }
|
|
131
|
+
}
|
|
132
|
+
)
|
|
133
|
+
]
|
|
134
|
+
}
|
|
135
|
+
),
|
|
136
|
+
/* @__PURE__ */ jsxs("div", { className: "css-slider__labels", children: [
|
|
137
|
+
/* @__PURE__ */ jsx("span", { className: "css-slider__label--min", children: min }),
|
|
138
|
+
/* @__PURE__ */ jsx("span", { className: "css-slider__label--max", children: max })
|
|
139
|
+
] })
|
|
140
|
+
] });
|
|
141
|
+
return label ? /* @__PURE__ */ jsxs("div", { className: "css-slider-field", children: [
|
|
142
|
+
/* @__PURE__ */ jsx("span", { className: "css-slider-field__label", children: label }),
|
|
143
|
+
content
|
|
144
|
+
] }) : content;
|
|
145
|
+
})
|
|
146
|
+
);
|
|
147
|
+
const Slider = withInstall(SliderComponent);
|
|
148
|
+
|
|
149
|
+
export { Slider, Slider as default };
|
|
150
|
+
//# sourceMappingURL=Slider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Slider.js","sources":["../../../../../adapter-react/components/slider/Slider.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from 'react'\nimport {\n getSliderClassNames,\n getSliderPercent,\n calcValueFromPosition,\n type SliderProps as BaseSliderProps,\n type SliderType,\n} from '@cssui/components/slider'\nimport { forwardRef, createComponent, withInstall } from '../../runtime'\nimport { cn } from '@cssui/utils'\n\nimport '@cssui/components/slider/style.css'\n\nexport interface SliderProps extends BaseSliderProps {\n /** 非受控默认值 */\n defaultValue?: number\n}\n\nconst SliderComponent = createComponent(\n forwardRef<HTMLInputElement, SliderProps>((props, ref) => {\n const {\n label,\n value: controlledValue,\n defaultValue,\n min = 0,\n max = 10,\n step = 1,\n disabled = false,\n type = 'default' as SliderType,\n onChange,\n } = props\n\n const [internalValue, setInternalValue] = useState(controlledValue ?? defaultValue ?? min)\n const [isDragging, setIsDragging] = useState(false)\n const trackRef = useRef<HTMLDivElement>(null)\n\n const isControlled = controlledValue !== undefined\n const currentValue = isControlled ? controlledValue : internalValue\n\n const percent = getSliderPercent(currentValue, min, max)\n\n const updateValue = useCallback(\n (newValue: number) => {\n const clamped = Math.min(Math.max(newValue, min), max)\n if (!isControlled) {\n setInternalValue(clamped)\n }\n onChange?.(clamped)\n },\n [onChange, isControlled, min, max]\n )\n\n /** 从鼠标位置计算值并更新 */\n const handleMove = useCallback(\n (clientX: number) => {\n if (!trackRef.current || disabled) return\n const rect = trackRef.current.getBoundingClientRect()\n const newValue = calcValueFromPosition(clientX, rect, min, max, step)\n updateValue(newValue)\n },\n [disabled, min, max, step, updateValue]\n )\n\n /** 鼠标按下 → 开始拖拽 */\n const handlePointerDown = useCallback(\n (e: React.MouseEvent) => {\n if (disabled) return\n e.preventDefault()\n setIsDragging(true)\n handleMove(e.clientX)\n\n const handleMouseMove = (ev: MouseEvent) => handleMove(ev.clientX)\n const handleMouseUp = () => {\n setIsDragging(false)\n document.removeEventListener('mousemove', handleMouseMove)\n document.removeEventListener('mouseup', handleMouseUp)\n document.body.style.userSelect = ''\n document.body.style.cursor = ''\n }\n\n document.body.style.userSelect = 'none'\n document.body.style.cursor = 'grabbing'\n document.addEventListener('mousemove', handleMouseMove)\n document.addEventListener('mouseup', handleMouseUp)\n },\n [disabled, handleMove]\n )\n\n /** 触摸开始 → 开始拖拽 */\n const handleTouchStart = useCallback(\n (e: React.TouchEvent) => {\n if (disabled) return\n e.preventDefault()\n setIsDragging(true)\n handleMove(e.touches[0].clientX)\n\n const handleTouchMove = (ev: TouchEvent) => {\n ev.preventDefault()\n handleMove(ev.touches[0].clientX)\n }\n const handleTouchEnd = () => {\n setIsDragging(false)\n document.removeEventListener('touchmove', handleTouchMove)\n document.removeEventListener('touchend', handleTouchEnd)\n document.removeEventListener('touchcancel', handleTouchEnd)\n }\n\n document.addEventListener('touchmove', handleTouchMove, { passive: false })\n document.addEventListener('touchend', handleTouchEnd)\n document.addEventListener('touchcancel', handleTouchEnd)\n },\n [disabled, handleMove]\n )\n\n /** input 输入框变更 */\n const handleInputChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n const raw = Number(e.target.value)\n if (isNaN(raw)) return\n const clamped = Math.min(Math.max(raw, min), max)\n if (!isControlled) {\n setInternalValue(clamped)\n }\n onChange?.(clamped)\n },\n [isControlled, min, max, onChange]\n )\n\n const content = (\n <div className={cn(getSliderClassNames({ type, disabled }))}>\n {type === 'input' && (\n <div className=\"css-slider__input-wrapper\">\n <input\n ref={ref}\n type=\"number\"\n className=\"css-slider__input-box\"\n value={currentValue}\n min={min}\n max={max}\n step={step}\n disabled={disabled}\n onChange={handleInputChange}\n />\n </div>\n )}\n <div\n ref={trackRef}\n className=\"css-slider__track\"\n onMouseDown={handlePointerDown}\n onTouchStart={handleTouchStart}\n >\n <div className=\"css-slider__fill\" style={{ width: `${percent * 100}%` }} />\n <div\n className={cn('css-slider__thumb', isDragging && 'css-slider__thumb--dragging')}\n style={{ left: `${percent * 100}%` }}\n />\n </div>\n <div className=\"css-slider__labels\">\n <span className=\"css-slider__label--min\">{min}</span>\n <span className=\"css-slider__label--max\">{max}</span>\n </div>\n </div>\n )\n\n return label ? (\n <div className=\"css-slider-field\">\n <span className=\"css-slider-field__label\">{label}</span>\n {content}\n </div>\n ) : (\n content\n )\n })\n)\n\nexport const Slider = withInstall(SliderComponent)\nexport default Slider\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/slider/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { type StepsProps as BaseStepsProps } from '../../../components/steps/index';
|
|
2
|
+
import '../../../components/steps/style.css';
|
|
3
|
+
export interface StepsProps extends Omit<BaseStepsProps, 'current'> {
|
|
4
|
+
current?: number;
|
|
5
|
+
defaultCurrent?: number;
|
|
6
|
+
onChange?: (current: number) => void;
|
|
7
|
+
onAction?: (index: number) => void;
|
|
8
|
+
}
|
|
9
|
+
export declare const Steps: import("../..").ComponentWithInstall<import("react").ForwardRefExoticComponent<StepsProps & import("react").RefAttributes<HTMLDivElement>>>;
|
|
10
|
+
export default Steps;
|
|
11
|
+
//# sourceMappingURL=Steps.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Steps.d.ts","sourceRoot":"","sources":["../../../components/steps/Steps.tsx"],"names":[],"mappings":"AACA,OAAO,EAIL,KAAK,UAAU,IAAI,cAAc,EAClC,MAAM,yBAAyB,CAAA;AAKhC,OAAO,mCAAmC,CAAA;AAE1C,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC;IACjE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AA2LD,eAAO,MAAM,KAAK,6IAA8B,CAAA;AAEhD,eAAe,KAAK,CAAA"}
|
|
@@ -0,0 +1,172 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { getStepsClassNames, getStepItemClassNames } from '../../../components/steps/index.js';
|
|
3
|
+
import IconComponent from '../icon/Icon.js';
|
|
4
|
+
import { Button } from '../button/Button.js';
|
|
5
|
+
import { createComponent } from '../../runtime/createComponent.js';
|
|
6
|
+
import { withInstall } from '../../runtime/withInstall.js';
|
|
7
|
+
import { forwardRef } from '../../runtime/forwardRef.js';
|
|
8
|
+
|
|
9
|
+
function getStepStatus(index, current) {
|
|
10
|
+
if (index < current) return "done";
|
|
11
|
+
if (index === current) return "active";
|
|
12
|
+
return "wait";
|
|
13
|
+
}
|
|
14
|
+
function renderCircle(index, status) {
|
|
15
|
+
if (status === "done") {
|
|
16
|
+
return /* @__PURE__ */ jsx("span", { className: "css-steps__circle", children: /* @__PURE__ */ jsx("span", { className: "css-steps__circle-icon", children: /* @__PURE__ */ jsx(IconComponent, { name: "Check", size: 10 }) }) });
|
|
17
|
+
}
|
|
18
|
+
return /* @__PURE__ */ jsx("span", { className: "css-steps__circle", children: index + 1 });
|
|
19
|
+
}
|
|
20
|
+
function renderMobileProgress(current, total) {
|
|
21
|
+
const radius = 22;
|
|
22
|
+
const circumference = 2 * Math.PI * radius;
|
|
23
|
+
const isDone = current >= total - 1;
|
|
24
|
+
const progress = isDone ? 1 : (current + 1) / total;
|
|
25
|
+
const fillLength = circumference * progress;
|
|
26
|
+
const text = isDone ? "Done" : `${current + 1} of ${total}`;
|
|
27
|
+
return /* @__PURE__ */ jsxs("div", { className: "css-steps__progress-ring", children: [
|
|
28
|
+
/* @__PURE__ */ jsxs("svg", { viewBox: "0 0 48 48", children: [
|
|
29
|
+
/* @__PURE__ */ jsx("circle", { className: "css-steps__progress-ring-bg", cx: "24", cy: "24", r: radius }),
|
|
30
|
+
/* @__PURE__ */ jsx(
|
|
31
|
+
"circle",
|
|
32
|
+
{
|
|
33
|
+
className: "css-steps__progress-ring-fill",
|
|
34
|
+
cx: "24",
|
|
35
|
+
cy: "24",
|
|
36
|
+
r: radius,
|
|
37
|
+
strokeDasharray: `${fillLength} ${circumference}`
|
|
38
|
+
}
|
|
39
|
+
)
|
|
40
|
+
] }),
|
|
41
|
+
/* @__PURE__ */ jsx("span", { className: "css-steps__progress-ring-text", children: text })
|
|
42
|
+
] });
|
|
43
|
+
}
|
|
44
|
+
const StepsComponent = createComponent(
|
|
45
|
+
forwardRef((props, ref) => {
|
|
46
|
+
const {
|
|
47
|
+
steps,
|
|
48
|
+
current: controlledCurrent,
|
|
49
|
+
defaultCurrent = 1,
|
|
50
|
+
direction = "horizontal",
|
|
51
|
+
variant = "default",
|
|
52
|
+
className,
|
|
53
|
+
onChange,
|
|
54
|
+
onAction,
|
|
55
|
+
...restProps
|
|
56
|
+
} = props;
|
|
57
|
+
const isControlled = controlledCurrent !== void 0;
|
|
58
|
+
const current = isControlled ? controlledCurrent : defaultCurrent;
|
|
59
|
+
const total = steps.length;
|
|
60
|
+
if (variant === "circle") {
|
|
61
|
+
const currentStep = steps[Math.min(current, total - 1)];
|
|
62
|
+
const nextStep = current + 1 < total ? steps[current + 1] : null;
|
|
63
|
+
return /* @__PURE__ */ jsx(
|
|
64
|
+
"div",
|
|
65
|
+
{
|
|
66
|
+
ref,
|
|
67
|
+
className: getStepsClassNames({ direction, variant, className }),
|
|
68
|
+
...restProps,
|
|
69
|
+
children: /* @__PURE__ */ jsxs("div", { className: "css-steps__task-header", children: [
|
|
70
|
+
renderMobileProgress(current, total),
|
|
71
|
+
/* @__PURE__ */ jsxs("div", { className: "css-steps__task-info", children: [
|
|
72
|
+
/* @__PURE__ */ jsx("div", { className: "css-steps__task-title", children: currentStep?.title }),
|
|
73
|
+
nextStep ? /* @__PURE__ */ jsxs("div", { className: "css-steps__task-next", children: [
|
|
74
|
+
"\u4E0B\u4E00\u6B65\uFF1A\u6B65\u9AA4 ",
|
|
75
|
+
String(current + 2).padStart(2, "0")
|
|
76
|
+
] }) : /* @__PURE__ */ jsx("div", { className: "css-steps__task-next", children: "\u5DF2\u7ECF\u662F\u6700\u540E\u4E00\u6B65" })
|
|
77
|
+
] })
|
|
78
|
+
] })
|
|
79
|
+
}
|
|
80
|
+
);
|
|
81
|
+
}
|
|
82
|
+
if (variant === "task") {
|
|
83
|
+
return /* @__PURE__ */ jsx(
|
|
84
|
+
"div",
|
|
85
|
+
{
|
|
86
|
+
ref,
|
|
87
|
+
className: getStepsClassNames({ direction: "vertical", variant, className }),
|
|
88
|
+
role: "list",
|
|
89
|
+
...restProps,
|
|
90
|
+
children: steps.map((step, index) => {
|
|
91
|
+
const status = getStepStatus(index, current);
|
|
92
|
+
return /* @__PURE__ */ jsxs(
|
|
93
|
+
"div",
|
|
94
|
+
{
|
|
95
|
+
className: getStepItemClassNames({ status, disabled: step.disabled }),
|
|
96
|
+
role: "listitem",
|
|
97
|
+
"aria-current": status === "active" ? "step" : void 0,
|
|
98
|
+
onClick: () => {
|
|
99
|
+
if (!step.disabled && onChange) {
|
|
100
|
+
onChange(index);
|
|
101
|
+
}
|
|
102
|
+
},
|
|
103
|
+
children: [
|
|
104
|
+
renderCircle(index, status),
|
|
105
|
+
/* @__PURE__ */ jsxs("div", { className: "css-steps__content", children: [
|
|
106
|
+
/* @__PURE__ */ jsx("div", { className: "css-steps__title", children: step.title }),
|
|
107
|
+
step.description && /* @__PURE__ */ jsx("div", { className: "css-steps__description", children: step.description }),
|
|
108
|
+
(step.action || step.icon) && /* @__PURE__ */ jsx("div", { className: "css-steps__action", children: /* @__PURE__ */ jsx(
|
|
109
|
+
Button,
|
|
110
|
+
{
|
|
111
|
+
type: "primary",
|
|
112
|
+
size: "sm",
|
|
113
|
+
icon: step.icon,
|
|
114
|
+
disabled: step.disabled || status !== "active",
|
|
115
|
+
onClick: (e) => {
|
|
116
|
+
e.stopPropagation();
|
|
117
|
+
if (onAction && !step.disabled && status === "active") {
|
|
118
|
+
onAction(index);
|
|
119
|
+
}
|
|
120
|
+
},
|
|
121
|
+
children: step.action
|
|
122
|
+
}
|
|
123
|
+
) })
|
|
124
|
+
] })
|
|
125
|
+
]
|
|
126
|
+
},
|
|
127
|
+
index
|
|
128
|
+
);
|
|
129
|
+
})
|
|
130
|
+
}
|
|
131
|
+
);
|
|
132
|
+
}
|
|
133
|
+
return /* @__PURE__ */ jsx(
|
|
134
|
+
"div",
|
|
135
|
+
{
|
|
136
|
+
ref,
|
|
137
|
+
className: getStepsClassNames({ direction, variant, className }),
|
|
138
|
+
role: "list",
|
|
139
|
+
...restProps,
|
|
140
|
+
children: steps.map((step, index) => {
|
|
141
|
+
const status = getStepStatus(index, current);
|
|
142
|
+
return /* @__PURE__ */ jsxs(
|
|
143
|
+
"div",
|
|
144
|
+
{
|
|
145
|
+
className: getStepItemClassNames({ status, disabled: step.disabled }),
|
|
146
|
+
role: "listitem",
|
|
147
|
+
"aria-current": status === "active" ? "step" : void 0,
|
|
148
|
+
onClick: () => {
|
|
149
|
+
if (!step.disabled && onChange) {
|
|
150
|
+
onChange(index);
|
|
151
|
+
}
|
|
152
|
+
},
|
|
153
|
+
children: [
|
|
154
|
+
renderCircle(index, status),
|
|
155
|
+
/* @__PURE__ */ jsxs("div", { className: "css-steps__content", children: [
|
|
156
|
+
/* @__PURE__ */ jsx("div", { className: "css-steps__title", children: step.title }),
|
|
157
|
+
direction === "vertical" && step.description && /* @__PURE__ */ jsx("div", { className: "css-steps__description", children: step.description })
|
|
158
|
+
] })
|
|
159
|
+
]
|
|
160
|
+
},
|
|
161
|
+
index
|
|
162
|
+
);
|
|
163
|
+
})
|
|
164
|
+
}
|
|
165
|
+
);
|
|
166
|
+
})
|
|
167
|
+
);
|
|
168
|
+
StepsComponent.displayName = "CssSteps";
|
|
169
|
+
const Steps = withInstall(StepsComponent);
|
|
170
|
+
|
|
171
|
+
export { Steps };
|
|
172
|
+
//# sourceMappingURL=Steps.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Steps.js","sources":["../../../../../adapter-react/components/steps/Steps.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport {\n getStepsClassNames,\n getStepItemClassNames,\n type StepItem as StepItemType,\n type StepsProps as BaseStepsProps,\n} from '@cssui/components/steps'\nimport { Icon } from '../icon'\nimport { Button } from '../button'\nimport { createComponent, forwardRef, withInstall } from '../../runtime'\n\nimport '@cssui/components/steps/style.css'\n\nexport interface StepsProps extends Omit<BaseStepsProps, 'current'> {\n current?: number\n defaultCurrent?: number\n onChange?: (current: number) => void\n onAction?: (index: number) => void\n}\n\nfunction getStepStatus(index: number, current: number): 'wait' | 'active' | 'done' {\n if (index < current) return 'done'\n if (index === current) return 'active'\n return 'wait'\n}\n\nfunction renderCircle(index: number, status: 'wait' | 'active' | 'done') {\n if (status === 'done') {\n return (\n <span className=\"css-steps__circle\">\n <span className=\"css-steps__circle-icon\">\n <Icon name=\"Check\" size={10} />\n </span>\n </span>\n )\n }\n return <span className=\"css-steps__circle\">{index + 1}</span>\n}\n\nfunction renderMobileProgress(current: number, total: number) {\n const radius = 22\n const circumference = 2 * Math.PI * radius\n const isDone = current >= total - 1\n const progress = isDone ? 1 : (current + 1) / total\n const fillLength = circumference * progress\n\n const text = isDone ? 'Done' : `${current + 1} of ${total}`\n\n return (\n <div className=\"css-steps__progress-ring\">\n <svg viewBox=\"0 0 48 48\">\n <circle className=\"css-steps__progress-ring-bg\" cx=\"24\" cy=\"24\" r={radius} />\n <circle\n className=\"css-steps__progress-ring-fill\"\n cx=\"24\"\n cy=\"24\"\n r={radius}\n strokeDasharray={`${fillLength} ${circumference}`}\n />\n </svg>\n <span className=\"css-steps__progress-ring-text\">{text}</span>\n </div>\n )\n}\n\nconst StepsComponent = createComponent(\n forwardRef<HTMLDivElement, StepsProps>((props, ref) => {\n const {\n steps,\n current: controlledCurrent,\n defaultCurrent = 1,\n direction = 'horizontal',\n variant = 'default',\n className,\n onChange,\n onAction,\n ...restProps\n } = props\n\n const isControlled = controlledCurrent !== undefined\n const current = isControlled ? controlledCurrent : defaultCurrent\n const total = steps.length\n\n // Circle variant: circular progress ring\n if (variant === 'circle') {\n const currentStep = steps[Math.min(current, total - 1)]\n const nextStep = current + 1 < total ? steps[current + 1] : null\n\n return (\n <div\n ref={ref}\n className={getStepsClassNames({ direction, variant, className })}\n {...restProps}\n >\n <div className=\"css-steps__task-header\">\n {renderMobileProgress(current, total)}\n <div className=\"css-steps__task-info\">\n <div className=\"css-steps__task-title\">{currentStep?.title}</div>\n {nextStep ? (\n <div className=\"css-steps__task-next\">\n 下一步:步骤 {String(current + 2).padStart(2, '0')}\n </div>\n ) : (\n <div className=\"css-steps__task-next\">已经是最后一步</div>\n )}\n </div>\n </div>\n </div>\n )\n }\n\n // Task variant: vertical steps with action buttons\n if (variant === 'task') {\n return (\n <div\n ref={ref}\n className={getStepsClassNames({ direction: 'vertical', variant, className })}\n role=\"list\"\n {...restProps}\n >\n {steps.map((step, index) => {\n const status = getStepStatus(index, current)\n return (\n <div\n key={index}\n className={getStepItemClassNames({ status, disabled: step.disabled })}\n role=\"listitem\"\n aria-current={status === 'active' ? 'step' : undefined}\n onClick={() => {\n if (!step.disabled && onChange) {\n onChange(index)\n }\n }}\n >\n {renderCircle(index, status)}\n <div className=\"css-steps__content\">\n <div className=\"css-steps__title\">{step.title}</div>\n {step.description && (\n <div className=\"css-steps__description\">{step.description}</div>\n )}\n {(step.action || step.icon) && (\n <div className=\"css-steps__action\">\n <Button\n type=\"primary\"\n size=\"sm\"\n icon={step.icon}\n disabled={step.disabled || status !== 'active'}\n onClick={e => {\n e.stopPropagation()\n if (onAction && !step.disabled && status === 'active') {\n onAction(index)\n }\n }}\n >\n {step.action}\n </Button>\n </div>\n )}\n </div>\n </div>\n )\n })}\n </div>\n )\n }\n\n // Default variant: horizontal or vertical steps\n return (\n <div\n ref={ref}\n className={getStepsClassNames({ direction, variant, className })}\n role=\"list\"\n {...restProps}\n >\n {steps.map((step, index) => {\n const status = getStepStatus(index, current)\n return (\n <div\n key={index}\n className={getStepItemClassNames({ status, disabled: step.disabled })}\n role=\"listitem\"\n aria-current={status === 'active' ? 'step' : undefined}\n onClick={() => {\n if (!step.disabled && onChange) {\n onChange(index)\n }\n }}\n >\n {renderCircle(index, status)}\n <div className=\"css-steps__content\">\n <div className=\"css-steps__title\">{step.title}</div>\n {direction === 'vertical' && step.description && (\n <div className=\"css-steps__description\">{step.description}</div>\n )}\n </div>\n </div>\n )\n })}\n </div>\n )\n })\n)\n\nStepsComponent.displayName = 'CssSteps'\n\nexport const Steps = withInstall(StepsComponent)\n\nexport default Steps\n"],"names":["Icon"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/steps/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React, { type MouseEvent } from 'react';
|
|
2
|
+
import { type SwitchProps as BaseSwitchProps } from '../../../components/switch/index';
|
|
3
|
+
import '../../../components/switch/style.css';
|
|
4
|
+
export interface SwitchProps extends Omit<BaseSwitchProps, 'onChange' | 'checked'> {
|
|
5
|
+
checked?: boolean;
|
|
6
|
+
defaultChecked?: boolean;
|
|
7
|
+
onChange?: (checked: boolean, event: MouseEvent<HTMLButtonElement> | KeyboardEvent) => void;
|
|
8
|
+
}
|
|
9
|
+
export declare const Switch: import("../..").ComponentWithInstall<React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>>;
|
|
10
|
+
export default Switch;
|
|
11
|
+
//# sourceMappingURL=Switch.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../components/switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAsB,KAAK,UAAU,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,EAAuB,KAAK,WAAW,IAAI,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAKnG,OAAO,oCAAoC,CAAA;AAE3C,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC;IAChF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,GAAG,aAAa,KAAK,IAAI,CAAA;CAC5F;AAmGD,eAAO,MAAM,MAAM,6HAA+B,CAAA;AAElD,eAAe,MAAM,CAAA"}
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { getSwitchClassNames } from '../../../components/switch/index.js';
|
|
3
|
+
import { createComponent } from '../../runtime/createComponent.js';
|
|
4
|
+
import { withInstall } from '../../runtime/withInstall.js';
|
|
5
|
+
import { forwardRef } from '../../runtime/forwardRef.js';
|
|
6
|
+
import 'react';
|
|
7
|
+
import { cn } from '../../../utils/src/index.js';
|
|
8
|
+
import { useControlled } from '../../hooks/useControlled.js';
|
|
9
|
+
|
|
10
|
+
const SwitchComponent = createComponent(
|
|
11
|
+
forwardRef((props, ref) => {
|
|
12
|
+
const {
|
|
13
|
+
label,
|
|
14
|
+
checked: checkedProp,
|
|
15
|
+
defaultChecked,
|
|
16
|
+
disabled,
|
|
17
|
+
loading,
|
|
18
|
+
size = "md",
|
|
19
|
+
activeColor,
|
|
20
|
+
inactiveColor,
|
|
21
|
+
className,
|
|
22
|
+
onChange,
|
|
23
|
+
style: customStyle,
|
|
24
|
+
...restProps
|
|
25
|
+
} = props;
|
|
26
|
+
const [checked, setChecked] = useControlled({
|
|
27
|
+
value: checkedProp,
|
|
28
|
+
defaultValue: defaultChecked ?? false,
|
|
29
|
+
onChange: (_val) => {
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
const toggle = (event) => {
|
|
33
|
+
if (disabled || loading) return;
|
|
34
|
+
const newValue = !checked;
|
|
35
|
+
setChecked(newValue);
|
|
36
|
+
onChange?.(newValue, event);
|
|
37
|
+
};
|
|
38
|
+
const switchClassName = getSwitchClassNames({
|
|
39
|
+
checked: checked ?? false,
|
|
40
|
+
disabled,
|
|
41
|
+
loading,
|
|
42
|
+
size
|
|
43
|
+
});
|
|
44
|
+
const style = {};
|
|
45
|
+
if (activeColor && checked) {
|
|
46
|
+
style.backgroundColor = activeColor;
|
|
47
|
+
}
|
|
48
|
+
if (inactiveColor && !checked) {
|
|
49
|
+
style.backgroundColor = inactiveColor;
|
|
50
|
+
}
|
|
51
|
+
const handleKeyDown = (e) => {
|
|
52
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
53
|
+
e.preventDefault();
|
|
54
|
+
toggle(e.nativeEvent);
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
const content = /* @__PURE__ */ jsxs(
|
|
58
|
+
"button",
|
|
59
|
+
{
|
|
60
|
+
ref,
|
|
61
|
+
type: "button",
|
|
62
|
+
role: "switch",
|
|
63
|
+
"aria-checked": checked,
|
|
64
|
+
"aria-disabled": disabled,
|
|
65
|
+
className: cn(switchClassName, className),
|
|
66
|
+
style: { ...style, ...customStyle },
|
|
67
|
+
onClick: toggle,
|
|
68
|
+
onKeyDown: handleKeyDown,
|
|
69
|
+
disabled,
|
|
70
|
+
...restProps,
|
|
71
|
+
children: [
|
|
72
|
+
/* @__PURE__ */ jsx(
|
|
73
|
+
"input",
|
|
74
|
+
{
|
|
75
|
+
type: "checkbox",
|
|
76
|
+
className: "css-switch__input",
|
|
77
|
+
checked: checked ?? false,
|
|
78
|
+
disabled,
|
|
79
|
+
readOnly: true,
|
|
80
|
+
tabIndex: -1,
|
|
81
|
+
"aria-hidden": "true"
|
|
82
|
+
}
|
|
83
|
+
),
|
|
84
|
+
/* @__PURE__ */ jsx("span", { className: "css-switch__handle", children: loading && /* @__PURE__ */ jsx("div", { className: "css-switch__loading-icon" }) })
|
|
85
|
+
]
|
|
86
|
+
}
|
|
87
|
+
);
|
|
88
|
+
return label ? /* @__PURE__ */ jsxs("span", { className: "css-switch-field", children: [
|
|
89
|
+
/* @__PURE__ */ jsx("span", { className: "css-switch-field__label", children: label }),
|
|
90
|
+
content
|
|
91
|
+
] }) : content;
|
|
92
|
+
})
|
|
93
|
+
);
|
|
94
|
+
SwitchComponent.displayName = "CssSwitch";
|
|
95
|
+
const Switch = withInstall(SwitchComponent);
|
|
96
|
+
|
|
97
|
+
export { Switch, Switch as default };
|
|
98
|
+
//# sourceMappingURL=Switch.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Switch.js","sources":["../../../../../adapter-react/components/switch/Switch.tsx"],"sourcesContent":["import React, { type CSSProperties, type MouseEvent } from 'react'\nimport { getSwitchClassNames, type SwitchProps as BaseSwitchProps } from '@cssui/components/switch'\nimport { createComponent, forwardRef, withInstall } from '../../runtime'\nimport { useControlled } from '../../hooks'\nimport { cn } from '@cssui/utils'\n\nimport '@cssui/components/switch/style.css'\n\nexport interface SwitchProps extends Omit<BaseSwitchProps, 'onChange' | 'checked'> {\n checked?: boolean\n defaultChecked?: boolean\n onChange?: (checked: boolean, event: MouseEvent<HTMLButtonElement> | KeyboardEvent) => void\n}\n\nconst SwitchComponent = createComponent(\n forwardRef<HTMLButtonElement, SwitchProps>((props, ref) => {\n const {\n label,\n checked: checkedProp,\n defaultChecked,\n disabled,\n loading,\n size = 'md',\n activeColor,\n inactiveColor,\n className,\n onChange,\n style: customStyle,\n ...restProps\n } = props as SwitchProps & { style?: CSSProperties }\n\n const [checked, setChecked] = useControlled({\n value: checkedProp,\n defaultValue: defaultChecked ?? false,\n onChange: _val => {\n // We handle the event in the toggle function\n },\n })\n\n const toggle = (event: MouseEvent<HTMLButtonElement> | KeyboardEvent) => {\n if (disabled || loading) return\n\n const newValue = !checked\n setChecked(newValue)\n onChange?.(newValue, event)\n }\n\n const switchClassName = getSwitchClassNames({\n checked: checked ?? false,\n disabled,\n loading,\n size,\n })\n\n const style: React.CSSProperties = {}\n if (activeColor && checked) {\n style.backgroundColor = activeColor\n }\n if (inactiveColor && !checked) {\n style.backgroundColor = inactiveColor\n }\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault()\n toggle(e.nativeEvent)\n }\n }\n\n const content = (\n <button\n ref={ref}\n type=\"button\"\n role=\"switch\"\n aria-checked={checked}\n aria-disabled={disabled}\n className={cn(switchClassName, className)}\n style={{ ...style, ...customStyle }}\n onClick={toggle}\n onKeyDown={handleKeyDown}\n disabled={disabled}\n {...restProps}\n >\n <input\n type=\"checkbox\"\n className=\"css-switch__input\"\n checked={checked ?? false}\n disabled={disabled}\n readOnly\n tabIndex={-1}\n aria-hidden=\"true\"\n />\n <span className=\"css-switch__handle\">\n {loading && <div className=\"css-switch__loading-icon\" />}\n </span>\n </button>\n )\n\n return label ? (\n <span className=\"css-switch-field\">\n <span className=\"css-switch-field__label\">{label}</span>\n {content}\n </span>\n ) : (\n content\n )\n })\n)\n\nSwitchComponent.displayName = 'CssSwitch'\n\nexport const Switch = withInstall(SwitchComponent)\n\nexport default Switch\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/switch/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA"}
|