@itcase/ui 1.3.31 → 1.3.34
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/Badge-BX4N91_C.js +250 -0
- package/dist/Badge-CGHosmYx.js +246 -0
- package/dist/Button-D1m2MxZA.js +291 -0
- package/dist/Button-DZ3z7f-A.js +287 -0
- package/dist/Divider-BQcBkzt1.js +30 -0
- package/dist/Divider-ImOOytuN.js +34 -0
- package/dist/{DropdownItem-FNOztnTT.js → DropdownItem-BiiEhR49.js} +12 -16
- package/dist/{DropdownItem-Bq-oPnWX.js → DropdownItem-g5jWbyJy.js} +12 -16
- package/dist/Group-Chtnas-J.js +40 -0
- package/dist/Group-DiMnEfge.js +36 -0
- package/dist/{Icon-pUvizy3W.js → Icon-GVGrUu_Z.js} +6 -6
- package/dist/{Icon-BdHr6E6M.js → Icon-htF_V35Y.js} +7 -7
- package/dist/{Image-BbBG_UGI.js → Image-BEGwuGBM.js} +4 -4
- package/dist/{Image-D-QHhsrC.js → Image-DWfyapuD.js} +4 -4
- package/dist/{Input-BrV5_NoV.js → Input-COFdaiTe.js} +3 -3
- package/dist/{Input-ffioh1sj.js → Input-Dwvk-poq.js} +3 -3
- package/dist/Label-Dpeq55TV.js +233 -0
- package/dist/Label-XTFwl1aq.js +237 -0
- package/dist/{Link-CxWmYMyL.js → Link-B38Hn4G2.js} +5 -5
- package/dist/{Link-DN2LhPjD.js → Link-BhJ5BdyS.js} +6 -6
- package/dist/Loader-CBEbIRnd.js +69 -0
- package/dist/Loader-CsPvc-9g.js +65 -0
- package/dist/{MenuItem-CLDNk2l8.js → MenuItem-Cjlnmfwh.js} +6 -6
- package/dist/{MenuItem-amqx61Y0.js → MenuItem-PJkuGghn.js} +6 -6
- package/dist/{Overlay-B9nOIfLe.js → Overlay-BKh07Vb2.js} +4 -4
- package/dist/{Overlay-Yf9EEclM.js → Overlay-DiCjwUv4.js} +4 -4
- package/dist/{Text-Beslj4Ns.js → Text-C49zj3jO.js} +7 -7
- package/dist/{Text-JayJa3hj.js → Text-C6NSmetx.js} +7 -7
- package/dist/{Title-BfKF5WvZ.js → Title-BWWyRwLY.js} +4 -4
- package/dist/{Title-C7Qv9WfS.js → Title-Dck3eHNM.js} +4 -4
- package/dist/{Tooltip-AodzD-7D.js → Tooltip-BYgzNVYI.js} +18 -14
- package/dist/{Tooltip-BDEyAnd-.js → Tooltip-DpBQQoNo.js} +18 -14
- package/dist/cjs/components/Accordion.js +25 -29
- package/dist/cjs/components/Avatar.js +22 -20
- package/dist/cjs/components/Badge.js +12 -7
- package/dist/cjs/components/Breadcrumbs.js +16 -21
- package/dist/cjs/components/Button.js +13 -13
- package/dist/cjs/components/Card.js +9 -9
- package/dist/cjs/components/Cell.js +32 -17
- package/dist/cjs/components/Checkbox.js +13 -13
- package/dist/cjs/components/Checkmark.js +25 -23
- package/dist/cjs/components/Chips.js +22 -17
- package/dist/cjs/components/Choice.js +13 -13
- package/dist/cjs/components/Code.js +9 -19
- package/dist/cjs/components/CookiesWarning.js +15 -15
- package/dist/cjs/components/DadataHintField.js +4 -3
- package/dist/cjs/components/DatePicker.js +43 -19
- package/dist/cjs/components/Divider.js +7 -7
- package/dist/cjs/components/Dot.js +7 -7
- package/dist/cjs/components/Dropdown.js +9 -9
- package/dist/cjs/components/Flex.js +12 -11
- package/dist/cjs/components/Grid.js +12 -12
- package/dist/cjs/components/Group.js +6 -6
- package/dist/cjs/components/HTMLContent.js +7 -7
- package/dist/cjs/components/HeroTitle.js +9 -9
- package/dist/cjs/components/Icon.js +10 -10
- package/dist/cjs/components/Image.js +6 -6
- package/dist/cjs/components/Input.js +4 -3
- package/dist/cjs/components/InputMask.js +16 -15
- package/dist/cjs/components/InputPassword.js +12 -16
- package/dist/cjs/components/Label.js +10 -10
- package/dist/cjs/components/Link.js +6 -6
- package/dist/cjs/components/List.js +13 -12
- package/dist/cjs/components/Loader.js +8 -8
- package/dist/cjs/components/Logo.js +17 -15
- package/dist/cjs/components/Menu.js +11 -15
- package/dist/cjs/components/MenuItem.js +8 -8
- package/dist/cjs/components/Modal.js +11 -16
- package/dist/cjs/components/ModalSheetBottom.js +3 -3
- package/dist/cjs/components/Notification.js +8 -8
- package/dist/cjs/components/Overlay.js +6 -6
- package/dist/cjs/components/Pagination.js +14 -14
- package/dist/cjs/components/Panel.js +9 -9
- package/dist/cjs/components/Radio.js +16 -19
- package/dist/cjs/components/RangeSlider.js +7 -7
- package/dist/cjs/components/Response.js +15 -15
- package/dist/cjs/components/SVGContent.js +7 -7
- package/dist/cjs/components/ScrollOnDrag.js +8 -11
- package/dist/cjs/components/ScrollToView.js +9 -9
- package/dist/cjs/components/Search.js +16 -19
- package/dist/cjs/components/Segmented.js +8 -8
- package/dist/cjs/components/Select.js +34 -34
- package/dist/cjs/components/Swiper.js +11 -14
- package/dist/cjs/components/Switch.js +1 -1
- package/dist/cjs/components/Tab.js +17 -13
- package/dist/cjs/components/Text.js +6 -6
- package/dist/cjs/components/Textarea.js +8 -11
- package/dist/cjs/components/Tile.js +24 -20
- package/dist/cjs/components/Title.js +8 -8
- package/dist/cjs/components/Tooltip.js +9 -9
- package/dist/cjs/components/Video.js +4 -3
- package/dist/cjs/context/UIContext.js +48 -17
- package/dist/cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js +120 -0
- package/dist/cjs/hooks/useDevicePropsGenerator.js +17 -0
- package/dist/cjs/hooks/useDeviceTargetClass.js +8 -3
- package/dist/cjs/hooks/useMediaQueries/useMediaQueries.js +129 -0
- package/dist/cjs/hooks/useMediaQueries.js +4 -122
- package/dist/cjs/hooks/{styleAttributes.js → useStyles/styleAttributes.js} +8 -1
- package/dist/cjs/hooks/useStyles/useStyles.js +190 -0
- package/dist/cjs/hooks/useStyles.js +10 -174
- package/dist/components/Accordion.js +26 -30
- package/dist/components/Avatar.js +22 -20
- package/dist/components/Badge.js +13 -8
- package/dist/components/Breadcrumbs.js +17 -22
- package/dist/components/Button.js +13 -13
- package/dist/components/Card.js +10 -10
- package/dist/components/Cell.js +33 -18
- package/dist/components/Checkbox.js +14 -14
- package/dist/components/Checkmark.js +25 -23
- package/dist/components/Chips.js +22 -17
- package/dist/components/Choice.js +14 -14
- package/dist/components/Code.js +10 -20
- package/dist/components/CookiesWarning.js +16 -16
- package/dist/components/DadataHintField.js +5 -4
- package/dist/components/DatePicker.js +44 -20
- package/dist/components/Divider.js +7 -7
- package/dist/components/Dot.js +8 -8
- package/dist/components/Dropdown.js +10 -10
- package/dist/components/Flex.js +13 -12
- package/dist/components/Grid.js +13 -13
- package/dist/components/Group.js +7 -7
- package/dist/components/HTMLContent.js +8 -8
- package/dist/components/HeroTitle.js +9 -9
- package/dist/components/Icon.js +11 -11
- package/dist/components/Image.js +7 -7
- package/dist/components/Input.js +5 -4
- package/dist/components/InputMask.js +17 -16
- package/dist/components/InputPassword.js +13 -17
- package/dist/components/Label.js +10 -10
- package/dist/components/Link.js +7 -7
- package/dist/components/List.js +14 -13
- package/dist/components/Loader.js +8 -8
- package/dist/components/Logo.js +17 -15
- package/dist/components/Menu.js +12 -16
- package/dist/components/MenuItem.js +9 -9
- package/dist/components/Modal.js +12 -17
- package/dist/components/ModalSheetBottom.js +4 -4
- package/dist/components/Notification.js +9 -9
- package/dist/components/Overlay.js +7 -7
- package/dist/components/Pagination.js +15 -15
- package/dist/components/Panel.js +10 -10
- package/dist/components/Radio.js +17 -20
- package/dist/components/RangeSlider.js +8 -8
- package/dist/components/Response.js +16 -16
- package/dist/components/SVGContent.js +8 -8
- package/dist/components/ScrollOnDrag.js +9 -12
- package/dist/components/ScrollToView.js +10 -10
- package/dist/components/Search.js +17 -20
- package/dist/components/Segmented.js +9 -9
- package/dist/components/Select.js +35 -35
- package/dist/components/Swiper.js +12 -15
- package/dist/components/Switch.js +1 -1
- package/dist/components/Tab.js +18 -14
- package/dist/components/Text.js +7 -7
- package/dist/components/Textarea.js +9 -12
- package/dist/components/Tile.js +24 -20
- package/dist/components/Title.js +8 -8
- package/dist/components/Tooltip.js +9 -9
- package/dist/components/Video.js +4 -3
- package/dist/context/Notifications.js +1 -1
- package/dist/context/UIContext.js +50 -18
- package/dist/css/components/Accordion/Accordion.css +5 -8
- package/dist/css/components/Accordion/Accordion.tokens.css +2 -1
- package/dist/css/components/Avatar/Avatar.css +8 -8
- package/dist/css/components/Badge/Badge.css +48 -26
- package/dist/css/components/Badge/Badge.tokens.css +48 -18
- package/dist/css/components/Button/Button.css +67 -303
- package/dist/css/components/Button/Button.tokens.css +37 -115
- package/dist/css/components/Cell/Cell.css +2 -2
- package/dist/css/components/Checkbox/Checkbox.css +6 -4
- package/dist/css/components/Checkmark/Checkmark.css +11 -10
- package/dist/css/components/Checkmark/Checkmark.tokens.css +20 -14
- package/dist/css/components/Chips/Chips.css +47 -43
- package/dist/css/components/Chips/Chips.tokens.css +35 -7
- package/dist/css/components/DadataHintField/DadataHintField.css +0 -8
- package/dist/css/components/DadataHintField/DadataHintField.tokens.css +7 -2
- package/dist/css/components/DatePicker/DatePicker.css +102 -69
- package/dist/css/components/DatePicker/DatePicker.tokens.css +7 -2
- package/dist/css/components/Divider/Divider.css +0 -12
- package/dist/css/components/Divider/Divider.tokens.css +12 -0
- package/dist/css/components/Flex/Flex.css +0 -1
- package/dist/css/components/Grid/Grid.css +1 -5
- package/dist/css/components/HeroTitle/HeroTitle.css +2 -2
- package/dist/css/components/Icon/Icon.css +13 -14
- package/dist/css/components/Icon/Icon.tokens.css +2 -1
- package/dist/css/components/Image/Image.css +3 -3
- package/dist/css/components/Label/Label.css +2 -2
- package/dist/css/components/Loader/Loader.css +12 -5
- package/dist/css/components/Logo/Logo.css +3 -19
- package/dist/css/components/Menu/Menu.css +9 -1
- package/dist/css/components/MenuItem/MenuItem.css +0 -10
- package/dist/css/components/MenuItem/MenuItem.tokens.css +9 -1
- package/dist/css/components/Radio/Radio.css +0 -3
- package/dist/css/components/Radio/Radio.tokens.css +2 -1
- package/dist/css/components/ScrollToView/ScrollToView.css +4 -4
- package/dist/css/components/Select/Select.css +25 -0
- package/dist/css/components/Select/Select.tokens.css +8 -13
- package/dist/css/components/Swiper/Swiper.css +2 -3
- package/dist/css/components/Switch/Switch.css +0 -7
- package/dist/css/components/Text/Text.css +2 -2
- package/dist/css/components/Title/Title.css +2 -2
- package/dist/css/components/Tooltip/Tooltip.css +15 -21
- package/dist/css/components/Tooltip/Tooltip.tokens.css +13 -0
- package/dist/css/styles/fill/fill.css +14 -9
- package/dist/css/styles/fill/fill_active.css +6 -3
- package/dist/css/styles/fill/fill_active_hover.css +8 -6
- package/dist/css/styles/fill/fill_disabled.css +6 -3
- package/dist/css/styles/fill/fill_hover.css +6 -3
- package/dist/css/styles/shape-strength/shape-strength.css +22 -0
- package/dist/css/styles/svg-color/svg_fill.css +27 -17
- package/dist/css/styles/svg-color/svg_fill_hover.css +12 -10
- package/dist/css/styles/svg-color/svg_path_fill.css +13 -9
- package/dist/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js +118 -0
- package/dist/hooks/useDevicePropsGenerator.js +11 -0
- package/dist/hooks/useDeviceTargetClass.js +8 -3
- package/dist/hooks/useMediaQueries/useMediaQueries.js +127 -0
- package/dist/hooks/useMediaQueries.js +3 -125
- package/dist/hooks/{styleAttributes.js → useStyles/styleAttributes.js} +8 -1
- package/dist/hooks/useStyles/useStyles.js +188 -0
- package/dist/hooks/useStyles.js +9 -177
- package/dist/stories/AlignContent.mdx +1 -1
- package/dist/stories/AlignItems.mdx +1 -1
- package/dist/stories/AlignSelf.mdx +1 -1
- package/dist/stories/Appearance.mdx +1 -1
- package/dist/stories/Avatar.mdx +1 -1
- package/dist/stories/Checkbox.mdx +1 -1
- package/dist/stories/Checkmark.mdx +7 -3
- package/dist/stories/Chips.mdx +1 -1
- package/dist/stories/Choice.mdx +1 -1
- package/dist/stories/Code.mdx +1 -1
- package/dist/stories/Columns.mdx +1 -1
- package/dist/stories/Components.mdx +197 -0
- package/dist/stories/DatePicker.mdx +1 -1
- package/dist/stories/Dev.mdx +1 -1
- package/dist/stories/DevMode.mdx +1 -1
- package/dist/stories/Direction.mdx +1 -1
- package/dist/stories/Divider.mdx +1 -1
- package/dist/stories/Dot.mdx +1 -1
- package/dist/stories/Drawer.mdx +1 -1
- package/dist/stories/Dropdown.mdx +2 -2
- package/dist/stories/DropdownItem.mdx +1 -1
- package/dist/stories/Group.mdx +1 -1
- package/dist/stories/Grow.mdx +1 -1
- package/dist/stories/HeroTitle.mdx +1 -1
- package/dist/stories/Icon.mdx +1 -1
- package/dist/stories/Image.mdx +1 -1
- package/dist/stories/Input.mdx +1 -1
- package/dist/stories/InputPassword.mdx +1 -1
- package/dist/stories/JustifyContent.mdx +1 -1
- package/dist/stories/Label.mdx +1 -1
- package/dist/stories/Loader.mdx +1 -1
- package/dist/stories/Logo.mdx +1 -1
- package/dist/stories/MenuItem.mdx +1 -1
- package/dist/stories/Message.mdx +1 -1
- package/dist/stories/Notification.mdx +1 -1
- package/dist/stories/Order.mdx +1 -1
- package/dist/stories/Overview.mdx +1 -1
- package/dist/stories/Pagination.mdx +1 -1
- package/dist/stories/Playground.mdx +1 -1
- package/dist/stories/Radio.mdx +1 -1
- package/dist/stories/Response.mdx +1 -1
- package/dist/stories/SearchInput.mdx +1 -1
- package/dist/stories/Segmented.mdx +1 -1
- package/dist/stories/Size.mdx +6 -26
- package/dist/stories/Skeleton.mdx +1 -1
- package/dist/stories/State.mdx +1 -1
- package/dist/stories/Switch.mdx +1 -1
- package/dist/stories/Text.mdx +1 -1
- package/dist/stories/Textarea.mdx +1 -1
- package/dist/stories/Tile.mdx +1 -1
- package/dist/stories/Title.mdx +1 -1
- package/dist/stories/Tooltip.mdx +1 -1
- package/dist/stories/WithTooltip.mdx +1 -1
- package/dist/stories/Wrap.mdx +1 -1
- package/dist/{tslib.es6-Bwu1Cn-t.js → tslib.es6-5FtW-kfi.js} +1 -1
- package/dist/types/appearance/defaultAppearance.d.ts +33 -0
- package/dist/types/appearance/index.d.ts +3 -0
- package/dist/types/appearance/styleAppearance.d.ts +14 -0
- package/dist/types/components/Accordion/Accordion.interface.d.ts +1 -1
- package/dist/types/components/Avatar/Avatar.interface.d.ts +1 -1
- package/dist/types/components/Badge/Badge.d.ts +0 -6
- package/dist/types/components/Badge/Badge.interface.d.ts +1 -1
- package/dist/types/components/Badge/appearance/badgeAccent.d.ts +39 -0
- package/dist/types/components/Badge/appearance/badgeDanger.d.ts +11 -0
- package/dist/types/components/Badge/appearance/badgeDisabled.d.ts +10 -0
- package/dist/types/components/Badge/appearance/badgeError.d.ts +12 -0
- package/dist/types/components/Badge/appearance/badgeInfo.d.ts +18 -0
- package/dist/types/components/Badge/appearance/badgePrimary.d.ts +11 -0
- package/dist/types/components/Badge/appearance/badgeSecondary.d.ts +11 -0
- package/dist/types/components/Badge/appearance/badgeSize.d.ts +32 -0
- package/dist/types/components/Badge/appearance/badgeStyle.d.ts +16 -0
- package/dist/types/components/Badge/appearance/badgeSuccess.d.ts +11 -0
- package/dist/types/components/Badge/appearance/badgeSurface.d.ts +29 -0
- package/dist/types/components/Badge/appearance/badgeWarning.d.ts +11 -0
- package/dist/types/components/Breadcrumbs/Breadcrumbs.d.ts +0 -5
- package/dist/types/components/Breadcrumbs/Breadcrumbs.interface.d.ts +1 -1
- package/dist/types/components/Button/Button.interface.d.ts +1 -1
- package/dist/types/components/Button/appearance/buttonAccent.d.ts +50 -0
- package/dist/types/components/Button/appearance/buttonDanger.d.ts +11 -0
- package/dist/types/components/Button/appearance/buttonError.d.ts +11 -0
- package/dist/types/components/Button/appearance/buttonInfo.d.ts +21 -0
- package/dist/types/components/Button/appearance/buttonPrimary.d.ts +8 -0
- package/dist/types/components/Button/appearance/buttonSecondary.d.ts +8 -0
- package/dist/types/components/Button/appearance/buttonSize.d.ts +59 -0
- package/dist/types/components/Button/appearance/buttonStyle.d.ts +16 -0
- package/dist/types/components/Button/appearance/buttonSuccess.d.ts +11 -0
- package/dist/types/components/Button/appearance/buttonSurface.d.ts +25 -0
- package/dist/types/components/Button/appearance/buttonWarning.d.ts +11 -0
- package/dist/types/components/Button/stories/args.d.ts +49 -49
- package/dist/types/components/Card/Card.interface.d.ts +1 -1
- package/dist/types/components/Cell/Cell.interface.d.ts +1 -1
- package/dist/types/components/Checkbox/Checkbox.interface.d.ts +1 -1
- package/dist/types/components/Checkmark/Checkmark.interface.d.ts +1 -1
- package/dist/types/components/Chips/Chips.interface.d.ts +1 -1
- package/dist/types/components/Chips/stories/args.d.ts +2 -2
- package/dist/types/components/Choice/Choice.interface.d.ts +1 -1
- package/dist/types/components/Code/Code.d.ts +0 -15
- package/dist/types/components/Code/Code.interface.d.ts +1 -1
- package/dist/types/components/DadataHintField/DadataHintField.interface.d.ts +1 -1
- package/dist/types/components/Divider/Divider.d.ts +0 -5
- package/dist/types/components/Divider/Divider.interface.d.ts +1 -1
- package/dist/types/components/Dot/Dot.interface.d.ts +1 -1
- package/dist/types/components/Drawer/Drawer.interface.d.ts +1 -1
- package/dist/types/components/Dropdown/Dropdown.interface.d.ts +1 -1
- package/dist/types/components/Dropdown/DropdownItem.d.ts +0 -7
- package/dist/types/components/Flex/Flex.interface.d.ts +1 -1
- package/dist/types/components/Flex/stories/args.d.ts +1 -1
- package/dist/types/components/Grid/Grid.interface.d.ts +1 -1
- package/dist/types/components/Grid/stories/args.d.ts +2 -2
- package/dist/types/components/Group/Group.interface.d.ts +1 -1
- package/dist/types/components/Group/stories/args.d.ts +2 -2
- package/dist/types/components/HTMLContent/HTMLContent.interface.d.ts +1 -1
- package/dist/types/components/HeroTitle/HeroTitle.interface.d.ts +1 -1
- package/dist/types/components/Icon/Icon.interface.d.ts +1 -1
- package/dist/types/components/Image/Image.interface.d.ts +1 -1
- package/dist/types/components/Input/Input.interface.d.ts +1 -1
- package/dist/types/components/InputMask/Input.interface.d.ts +1 -1
- package/dist/types/components/InputPassword/InputPassword.d.ts +0 -6
- package/dist/types/components/InputPassword/InputPassword.interface.d.ts +1 -1
- package/dist/types/components/Label/Label.interface.d.ts +1 -1
- package/dist/types/components/Label/appearance/labelAccent.d.ts +13 -0
- package/dist/types/components/Label/appearance/labelDanger.d.ts +11 -0
- package/dist/types/components/Label/appearance/labelError.d.ts +11 -0
- package/dist/types/components/Label/appearance/labelGradient.d.ts +11 -0
- package/dist/types/components/Label/appearance/labelInfo.d.ts +21 -0
- package/dist/types/components/Label/appearance/labelPrimary.d.ts +8 -0
- package/dist/types/components/Label/appearance/labelSecondary.d.ts +8 -0
- package/dist/types/components/Label/appearance/labelSize.d.ts +59 -0
- package/dist/types/components/Label/appearance/labelStyle.d.ts +16 -0
- package/dist/types/components/Label/appearance/labelSuccess.d.ts +11 -0
- package/dist/types/components/Label/appearance/labelSurface.d.ts +24 -0
- package/dist/types/components/Label/appearance/labelWarning.d.ts +11 -0
- package/dist/types/components/Link/Link.interface.d.ts +1 -1
- package/dist/types/components/List/List.interface.d.ts +1 -1
- package/dist/types/components/Loader/Loader.interface.d.ts +1 -1
- package/dist/types/components/Loader/appearance/loaderAccent.d.ts +7 -0
- package/dist/types/components/Loader/appearance/loaderPrimary.d.ts +7 -0
- package/dist/types/components/Loader/appearance/loaderSecondary.d.ts +7 -0
- package/dist/types/components/Loader/appearance/loaderSurface.d.ts +15 -0
- package/dist/types/components/Logo/Logo.interface.d.ts +1 -1
- package/dist/types/components/Menu/Menu.d.ts +0 -5
- package/dist/types/components/Menu/Menu.interface.d.ts +1 -1
- package/dist/types/components/MenuItem/MenuItem.interface.d.ts +1 -1
- package/dist/types/components/Modal/Modal.interface.d.ts +1 -1
- package/dist/types/components/Notification/Notification.interface.d.ts +1 -1
- package/dist/types/components/Overlay/Overlay.interface.d.ts +1 -1
- package/dist/types/components/Pagination/Pagination.interface.d.ts +1 -1
- package/dist/types/components/Panel/Panel.interface.d.ts +1 -1
- package/dist/types/components/Radio/Radio.d.ts +0 -5
- package/dist/types/components/Radio/Radio.interface.d.ts +1 -1
- package/dist/types/components/RangeSlider/RangeSlider.interface.d.ts +1 -1
- package/dist/types/components/Response/Response.interface.d.ts +1 -1
- package/dist/types/components/Response/stories/args.d.ts +4 -4
- package/dist/types/components/SVGContent/SVGContent.interface.d.ts +1 -1
- package/dist/types/components/ScrollOnDrag/ScrollOnDrag.d.ts +0 -5
- package/dist/types/components/ScrollOnDrag/ScrollOnDrag.interface.d.ts +1 -1
- package/dist/types/components/Scrollbar/Scrollbar.interface.d.ts +1 -1
- package/dist/types/components/Search/Search.interface.d.ts +1 -1
- package/dist/types/components/Segmented/Segmented.interface.d.ts +1 -1
- package/dist/types/components/Swiper/Swiper.d.ts +0 -5
- package/dist/types/components/Swiper/Swiper.interface.d.ts +1 -1
- package/dist/types/components/Switch/Switch.interface.d.ts +1 -1
- package/dist/types/components/Tab/Tab.interface.d.ts +1 -1
- package/dist/types/components/Tab/stories/args.d.ts +3 -3
- package/dist/types/components/Text/Text.interface.d.ts +1 -1
- package/dist/types/components/Textarea/Textarea.d.ts +0 -5
- package/dist/types/components/Textarea/Textarea.interface.d.ts +1 -1
- package/dist/types/components/Tile/Tile.d.ts +0 -5
- package/dist/types/components/Tile/Tile.interface.d.ts +1 -1
- package/dist/types/components/Title/Title.interface.d.ts +1 -1
- package/dist/types/components/Tooltip/Tooltip.interface.d.ts +1 -1
- package/dist/types/components/Video/Video.interface.d.ts +1 -1
- package/dist/types/context/UIContext.d.ts +8 -12
- package/dist/types/hooks/useDevicePropsGenerator/index.d.ts +1 -0
- package/dist/types/hooks/useDevicePropsGenerator/useDevicePropsGenerator.d.ts +3 -0
- package/dist/types/hooks/{useDeviceTargetClassGenerator.interface.d.ts → useDevicePropsGenerator/useDevicePropsGenerator.interface.d.ts} +2 -2
- package/dist/types/hooks/useMediaQueries/index.d.ts +1 -0
- package/dist/types/hooks/useStyles/index.d.ts +1 -0
- package/dist/types/hooks/useStyles/styleAttributes.d.ts +4 -0
- package/dist/types/types/componentProps/appearanceKeys.d.ts +1 -1
- package/dist/types/types/componentProps/borderColor.d.ts +1 -1
- package/dist/types/types/componentProps/fill.d.ts +1 -1
- package/package.json +15 -12
- package/dist/Badge-5gtVywXB.js +0 -111
- package/dist/Badge-DhOJoJgc.js +0 -115
- package/dist/Button-BSnodY9v.js +0 -103
- package/dist/Button-Kcw2DdY0.js +0 -99
- package/dist/Divider-DBvDCUqP.js +0 -30
- package/dist/Divider-Goh6mpPK.js +0 -34
- package/dist/Group-BY8OkVsS.js +0 -38
- package/dist/Group-c3ZkPu8e.js +0 -34
- package/dist/Label-CBwPiUuf.js +0 -97
- package/dist/Label-DgyUhGTQ.js +0 -93
- package/dist/Loader-Dn036JwE.js +0 -56
- package/dist/Loader-K_DJmah6.js +0 -52
- package/dist/cjs/hooks/useDeviceTargetClassGenerator.interface.js +0 -3
- package/dist/cjs/hooks/useDeviceTargetClassGenerator.js +0 -98
- package/dist/css/styles/column-gap/column-gap.css +0 -7
- package/dist/css/styles/gap/gap.css +0 -7
- package/dist/css/styles/row-gap/row-gap.css +0 -7
- package/dist/hooks/useDeviceTargetClassGenerator.interface.js +0 -1
- package/dist/hooks/useDeviceTargetClassGenerator.js +0 -96
- package/dist/stories/Badge.mdx +0 -20
- package/dist/stories/Button.mdx +0 -47
- package/dist/types/components/Badge/stories/args.d.ts +0 -69
- package/dist/types/hooks/styleAttributes.d.ts +0 -2
- package/dist/types/hooks/useDeviceTargetClassGenerator.d.ts +0 -3
- /package/dist/cjs/{hooks.js → hooks/useDevicePropsGenerator/useDevicePropsGenerator.interface.js} +0 -0
- /package/dist/cjs/hooks/{styleAttributes.interface.js → useStyles/styleAttributes.interface.js} +0 -0
- /package/dist/{hooks.js → hooks/useDevicePropsGenerator/useDevicePropsGenerator.interface.js} +0 -0
- /package/dist/hooks/{styleAttributes.interface.js → useStyles/styleAttributes.interface.js} +0 -0
- /package/dist/types/hooks/{useMediaQueries.d.ts → useMediaQueries/useMediaQueries.d.ts} +0 -0
- /package/dist/types/hooks/{styleAttributes.interface.d.ts → useStyles/styleAttributes.interface.d.ts} +0 -0
- /package/dist/types/hooks/{useStyles.d.ts → useStyles/useStyles.d.ts} +0 -0
|
@@ -0,0 +1,291 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var clsx = require('clsx');
|
|
7
|
+
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
8
|
+
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
9
|
+
var Icon = require('./Icon-GVGrUu_Z.js');
|
|
10
|
+
var Link = require('./Link-B38Hn4G2.js');
|
|
11
|
+
var Loader = require('./Loader-CBEbIRnd.js');
|
|
12
|
+
var Text = require('./Text-C49zj3jO.js');
|
|
13
|
+
|
|
14
|
+
var buttonAppearanceAccent = {
|
|
15
|
+
accent: {
|
|
16
|
+
fill: 'accentPrimary',
|
|
17
|
+
fillHover: 'accentPrimaryHover',
|
|
18
|
+
borderColor: 'accentBorderPrimary',
|
|
19
|
+
labelTextColor: 'accentTextPrimary',
|
|
20
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
21
|
+
iconAfterFillIcon: 'accentItemPrimary',
|
|
22
|
+
iconBeforeFillIcon: 'accentItemPrimary',
|
|
23
|
+
loaderFill: 'accentPrimary',
|
|
24
|
+
loaderItemFill: 'accentItemPrimary',
|
|
25
|
+
},
|
|
26
|
+
accentPrimary: {
|
|
27
|
+
fill: 'accentPrimary',
|
|
28
|
+
fillHover: 'accentPrimaryHover',
|
|
29
|
+
borderColor: 'accentBorderPrimary',
|
|
30
|
+
labelTextColor: 'accentTextPrimary',
|
|
31
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
32
|
+
iconAfterFillIcon: 'accentItemPrimary',
|
|
33
|
+
iconBeforeFillIcon: 'accentItemPrimary',
|
|
34
|
+
loaderFill: 'accentPrimary',
|
|
35
|
+
loaderItemFill: 'accentItemPrimary',
|
|
36
|
+
},
|
|
37
|
+
accentSecondary: {
|
|
38
|
+
fill: 'accentPrimary',
|
|
39
|
+
fillHover: 'accentPrimaryHover',
|
|
40
|
+
borderColor: 'accentBorderPrimary',
|
|
41
|
+
labelTextColor: 'accentTextSecondary',
|
|
42
|
+
labelTextColorHover: 'accentTextSecondary',
|
|
43
|
+
loaderFill: 'accentPrimary',
|
|
44
|
+
loaderItemFill: 'accentItemPrimary',
|
|
45
|
+
},
|
|
46
|
+
full: {},
|
|
47
|
+
solid: {
|
|
48
|
+
fill: 'accentPrimary',
|
|
49
|
+
borderColor: null,
|
|
50
|
+
labelTextColor: 'accentTextPrimary',
|
|
51
|
+
},
|
|
52
|
+
outlined: {
|
|
53
|
+
fill: null,
|
|
54
|
+
borderColor: 'accentBorderPrimary',
|
|
55
|
+
labelTextColor: 'accentTextSecondary',
|
|
56
|
+
},
|
|
57
|
+
ghost: {
|
|
58
|
+
fill: null,
|
|
59
|
+
borderColor: null,
|
|
60
|
+
labelTextColor: 'accentTextSecondary',
|
|
61
|
+
},
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
var buttonAppearanceDanger = {
|
|
65
|
+
danger: {
|
|
66
|
+
fill: 'dangerPrimary',
|
|
67
|
+
fillHover: 'dangerPrimaryHover',
|
|
68
|
+
labelTextColor: 'dangerTextSecondary',
|
|
69
|
+
labelTextColorHover: 'dangerTextSecondary',
|
|
70
|
+
loaderFill: 'dangerPrimary',
|
|
71
|
+
loaderItemFill: 'dangerItemPrimary',
|
|
72
|
+
},
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
var buttonAppearanceError = {
|
|
76
|
+
error: {
|
|
77
|
+
fill: 'errorPrimary',
|
|
78
|
+
fillHover: 'errorPrimaryHover',
|
|
79
|
+
labelTextColor: 'errorTextPrimary',
|
|
80
|
+
labelTextColorHover: 'errorTextPrimary',
|
|
81
|
+
loaderFill: 'errorPrimary',
|
|
82
|
+
loaderItemFill: 'errorItemPrimary',
|
|
83
|
+
},
|
|
84
|
+
};
|
|
85
|
+
|
|
86
|
+
var buttonAppearanceInfo = {
|
|
87
|
+
info: {
|
|
88
|
+
fill: 'accentPrimary',
|
|
89
|
+
fillHover: 'accentPrimaryHover',
|
|
90
|
+
borderColor: 'accentBorderPrimary',
|
|
91
|
+
labelTextColor: 'accentTextPrimary',
|
|
92
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
93
|
+
loaderFill: 'accentPrimary',
|
|
94
|
+
loaderItemFill: 'accentItemPrimary',
|
|
95
|
+
},
|
|
96
|
+
infoSecondary: {
|
|
97
|
+
fill: 'accentPrimary',
|
|
98
|
+
fillHover: 'accentPrimaryHover',
|
|
99
|
+
borderColor: 'accentBorderPrimary',
|
|
100
|
+
labelTextColor: 'accentTextSecondary',
|
|
101
|
+
labelTextColorHover: 'accentTextSecondary',
|
|
102
|
+
loaderFill: 'accentPrimary',
|
|
103
|
+
loaderItemFill: 'accentItemPrimary',
|
|
104
|
+
},
|
|
105
|
+
};
|
|
106
|
+
|
|
107
|
+
var buttonAppearancePrimary = {
|
|
108
|
+
primary: {
|
|
109
|
+
fill: 'primaryPrimary',
|
|
110
|
+
fillHover: 'primaryPrimaryHover',
|
|
111
|
+
labelTextColor: 'primaryTextPrimary',
|
|
112
|
+
},
|
|
113
|
+
};
|
|
114
|
+
|
|
115
|
+
var buttonAppearanceSecondary = {
|
|
116
|
+
secondary: {
|
|
117
|
+
fill: 'secondaryPrimary',
|
|
118
|
+
fillHover: 'secondaryPrimaryHover',
|
|
119
|
+
labelTextColor: 'secondaryTextPrimary',
|
|
120
|
+
},
|
|
121
|
+
};
|
|
122
|
+
|
|
123
|
+
var buttonAppearanceSize = {
|
|
124
|
+
sizeXXL: {
|
|
125
|
+
labelTextSize: 'xxl',
|
|
126
|
+
size: 'xxl',
|
|
127
|
+
iconAfterFillSize: 24,
|
|
128
|
+
iconAfterSize: 24,
|
|
129
|
+
iconBeforeFillSize: 24,
|
|
130
|
+
iconBeforeSize: 24,
|
|
131
|
+
},
|
|
132
|
+
sizeXL: {
|
|
133
|
+
labelTextSize: 'l',
|
|
134
|
+
iconAfterFillSize: 24,
|
|
135
|
+
iconAfterSize: 24,
|
|
136
|
+
iconBeforeFillSize: 24,
|
|
137
|
+
iconBeforeSize: 24,
|
|
138
|
+
size: 'xl',
|
|
139
|
+
},
|
|
140
|
+
sizeL: {
|
|
141
|
+
labelTextSize: 'l',
|
|
142
|
+
iconAfterFillSize: 24,
|
|
143
|
+
iconAfterSize: 24,
|
|
144
|
+
iconBeforeFillSize: 24,
|
|
145
|
+
iconBeforeSize: 24,
|
|
146
|
+
size: 'l',
|
|
147
|
+
},
|
|
148
|
+
sizeM: {
|
|
149
|
+
labelTextSize: 'm',
|
|
150
|
+
iconAfterFillSize: 24,
|
|
151
|
+
iconAfterSize: 24,
|
|
152
|
+
iconBeforeFillSize: 24,
|
|
153
|
+
iconBeforeSize: 24,
|
|
154
|
+
size: 'm',
|
|
155
|
+
},
|
|
156
|
+
sizeS: {
|
|
157
|
+
labelTextSize: 's',
|
|
158
|
+
iconAfterFillSize: 20,
|
|
159
|
+
iconAfterSize: 20,
|
|
160
|
+
iconBeforeFillSize: 20,
|
|
161
|
+
iconBeforeSize: 20,
|
|
162
|
+
size: 's',
|
|
163
|
+
},
|
|
164
|
+
sizeXS: {
|
|
165
|
+
labelTextSize: 'xs',
|
|
166
|
+
iconAfterFillSize: 16,
|
|
167
|
+
iconAfterSize: 16,
|
|
168
|
+
iconBeforeFillSize: 16,
|
|
169
|
+
iconBeforeSize: 16,
|
|
170
|
+
size: 'xs',
|
|
171
|
+
},
|
|
172
|
+
sizeXXS: {
|
|
173
|
+
labelTextSize: 'xs',
|
|
174
|
+
iconAfterFillSize: 14,
|
|
175
|
+
iconAfterSize: 14,
|
|
176
|
+
iconBeforeFillSize: 14,
|
|
177
|
+
iconBeforeSize: 14,
|
|
178
|
+
size: 'xxs',
|
|
179
|
+
},
|
|
180
|
+
};
|
|
181
|
+
|
|
182
|
+
var buttonAppearanceStyle = {
|
|
183
|
+
full: {
|
|
184
|
+
borderColor: null,
|
|
185
|
+
},
|
|
186
|
+
ghost: {
|
|
187
|
+
fill: null,
|
|
188
|
+
borderColor: null,
|
|
189
|
+
},
|
|
190
|
+
outlined: {
|
|
191
|
+
fill: null,
|
|
192
|
+
},
|
|
193
|
+
solid: {
|
|
194
|
+
borderColor: null,
|
|
195
|
+
},
|
|
196
|
+
};
|
|
197
|
+
|
|
198
|
+
var buttonAppearanceSuccess = {
|
|
199
|
+
success: {
|
|
200
|
+
fill: 'successPrimary',
|
|
201
|
+
fillHover: 'successPrimaryHover',
|
|
202
|
+
labelTextColor: 'successTextSecondary',
|
|
203
|
+
labelTextColorHover: 'successTextSecondary',
|
|
204
|
+
loaderFill: 'successPrimary',
|
|
205
|
+
loaderItemFill: 'successItemPrimary',
|
|
206
|
+
},
|
|
207
|
+
};
|
|
208
|
+
|
|
209
|
+
var buttonAppearanceSurface = {
|
|
210
|
+
surfacePrimary: {
|
|
211
|
+
fill: 'surfacePrimary',
|
|
212
|
+
fillHover: 'surfacePrimaryHover',
|
|
213
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
214
|
+
},
|
|
215
|
+
surfaceSecondary: {
|
|
216
|
+
fill: 'surfaceSecondary',
|
|
217
|
+
fillHover: 'surfaceSecondaryHover',
|
|
218
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
219
|
+
loaderFill: 'surfaceSecondary',
|
|
220
|
+
loaderItemFill: 'surfaceItemPrimary',
|
|
221
|
+
},
|
|
222
|
+
surfaceTertiary: {
|
|
223
|
+
fill: 'surfaceTertiary',
|
|
224
|
+
fillHover: 'surfaceTertiaryHover',
|
|
225
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
226
|
+
},
|
|
227
|
+
surfaceQuaternary: {
|
|
228
|
+
fill: 'surfaceQuaternary',
|
|
229
|
+
fillHover: 'surfaceQuaternaryHover',
|
|
230
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
231
|
+
},
|
|
232
|
+
};
|
|
233
|
+
|
|
234
|
+
var buttonAppearanceWarning = {
|
|
235
|
+
warning: {
|
|
236
|
+
fill: 'warningPrimary',
|
|
237
|
+
fillHover: 'warningPrimaryHover',
|
|
238
|
+
labelTextColor: 'warningTextSecondary',
|
|
239
|
+
labelTextColorHover: 'warningTextSecondary',
|
|
240
|
+
loaderFill: 'warningPrimary',
|
|
241
|
+
loaderItemFill: 'warningItemPrimary',
|
|
242
|
+
},
|
|
243
|
+
};
|
|
244
|
+
|
|
245
|
+
var buttonAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, buttonAppearanceSize), buttonAppearanceStyle), buttonAppearanceAccent), buttonAppearanceDanger), buttonAppearanceError), buttonAppearanceInfo), buttonAppearancePrimary), buttonAppearanceSecondary), buttonAppearanceSuccess), buttonAppearanceSurface), buttonAppearanceWarning);
|
|
246
|
+
|
|
247
|
+
var buttonConfig = {
|
|
248
|
+
appearance: buttonAppearance,
|
|
249
|
+
setAppearance: function (appearanceConfig) {
|
|
250
|
+
buttonConfig.appearance = appearanceConfig;
|
|
251
|
+
},
|
|
252
|
+
};
|
|
253
|
+
var Button = React.forwardRef(function Button(props, ref) {
|
|
254
|
+
var className = props.className, appearance = props.appearance, children = props.children, label = props.label, Badge = props.Badge, dataTestId = props.dataTestId, dataTour = props.dataTour, href = props.href, _a = props.htmlType, htmlType = _a === void 0 ? 'button' : _a, icon = props.icon, iconAfter = props.iconAfter, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeSrc = props.iconBeforeSrc, iconSrc = props.iconSrc, link = props.link, _b = props.loadertype, loadertype = _b === void 0 ? 'simple' : _b, _c = props.loading, loading = _c === void 0 ? false : _c, rel = props.rel, target = props.target, before = props.before, after = props.after, isDisabled = props.isDisabled, isLoading = props.isLoading, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
255
|
+
var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultApperance, appearance) {
|
|
256
|
+
var _a;
|
|
257
|
+
return (tslib_es6.__assign(tslib_es6.__assign({}, resultApperance), (_a = buttonConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
|
|
258
|
+
}, {});
|
|
259
|
+
if (loading) {
|
|
260
|
+
console.warn('DEPRECATED: prop Loading is deprecated, use isLoading');
|
|
261
|
+
}
|
|
262
|
+
var _isLoading = isLoading !== null && isLoading !== void 0 ? isLoading : loading;
|
|
263
|
+
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
264
|
+
var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextSizeMobile = propsGenerator.labelTextSizeMobile, labelTextTruncate = propsGenerator.labelTextTruncate, labelTextWeight = propsGenerator.labelTextWeight, labelTextWidth = propsGenerator.labelTextWidth, labelTextWrap = propsGenerator.labelTextWrap, elevationClass = propsGenerator.elevationClass, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconFill = propsGenerator.iconFill, iconFillIcon = propsGenerator.iconFillIcon, iconFillSize = propsGenerator.iconFillSize, iconShape = propsGenerator.iconShape, iconSize = propsGenerator.iconSize, loaderFill = propsGenerator.loaderFill, loaderItemFill = propsGenerator.loaderItemFill, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
|
|
265
|
+
var shapeStrengthClass = propsGenerator.getClassName('shapeStrength', {
|
|
266
|
+
replace: [/\./, '-'],
|
|
267
|
+
});
|
|
268
|
+
// @ts-expect-error
|
|
269
|
+
var _d = useStyles.useStyles(props), labelStyles = _d.label, buttonStyles = _d.styles;
|
|
270
|
+
var buttonTypeClass = after ||
|
|
271
|
+
before ||
|
|
272
|
+
icon ||
|
|
273
|
+
iconAfter ||
|
|
274
|
+
iconAfterSrc ||
|
|
275
|
+
iconBefore ||
|
|
276
|
+
iconBeforeSrc ||
|
|
277
|
+
iconSrc;
|
|
278
|
+
return (jsxRuntime.jsx(Link.LinkWrapper, { className: clsx(className, 'button', label && buttonTypeClass
|
|
279
|
+
? 'button_type_default'
|
|
280
|
+
: label
|
|
281
|
+
? 'buttom_type_label'
|
|
282
|
+
: buttonTypeClass
|
|
283
|
+
? 'button_type_icon'
|
|
284
|
+
: '', borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass
|
|
285
|
+
? "shape-strength_".concat(shapeStrengthClass)
|
|
286
|
+
: shapeClass === 'rounded' && 'shape-strength_default', sizeClass && "button_size_".concat(sizeClass), widthClass && "button_width_".concat(widthClass), elevationClass && "elevation_".concat(elevationClass), onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', _isLoading && 'button_state_loading'), type: htmlType, disabled: isDisabled, "data-testid": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", href: link || href, rel: rel, style: buttonStyles, target: target, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxs("div", { className: "button__wrapper", ref: ref, children: [_isLoading && (jsxRuntime.jsx(Loader.Loader, { className: clsx(className, 'button__loader', shapeClass), type: loadertype, fill: loaderFill, itemFill: loaderItemFill })), before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon_before", fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntime.jsx(Text.Text, { className: "button__label", width: labelTextWidth, textColor: labelTextColor, textColorHover: labelTextColorHover, textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, size: labelTextSize, sizeMobile: labelTextSizeMobile, style: labelStyles, children: children || label })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon_after", fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
|
|
287
|
+
});
|
|
288
|
+
|
|
289
|
+
exports.Button = Button;
|
|
290
|
+
exports.buttonAppearance = buttonAppearance;
|
|
291
|
+
exports.buttonConfig = buttonConfig;
|
|
@@ -0,0 +1,287 @@
|
|
|
1
|
+
import { _ as __assign } from './tslib.es6-5FtW-kfi.js';
|
|
2
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import clsx from 'clsx';
|
|
5
|
+
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
6
|
+
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
7
|
+
import { I as Icon } from './Icon-htF_V35Y.js';
|
|
8
|
+
import { L as LinkWrapper } from './Link-BhJ5BdyS.js';
|
|
9
|
+
import { L as Loader } from './Loader-CsPvc-9g.js';
|
|
10
|
+
import { T as Text } from './Text-C6NSmetx.js';
|
|
11
|
+
|
|
12
|
+
var buttonAppearanceAccent = {
|
|
13
|
+
accent: {
|
|
14
|
+
fill: 'accentPrimary',
|
|
15
|
+
fillHover: 'accentPrimaryHover',
|
|
16
|
+
borderColor: 'accentBorderPrimary',
|
|
17
|
+
labelTextColor: 'accentTextPrimary',
|
|
18
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
19
|
+
iconAfterFillIcon: 'accentItemPrimary',
|
|
20
|
+
iconBeforeFillIcon: 'accentItemPrimary',
|
|
21
|
+
loaderFill: 'accentPrimary',
|
|
22
|
+
loaderItemFill: 'accentItemPrimary',
|
|
23
|
+
},
|
|
24
|
+
accentPrimary: {
|
|
25
|
+
fill: 'accentPrimary',
|
|
26
|
+
fillHover: 'accentPrimaryHover',
|
|
27
|
+
borderColor: 'accentBorderPrimary',
|
|
28
|
+
labelTextColor: 'accentTextPrimary',
|
|
29
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
30
|
+
iconAfterFillIcon: 'accentItemPrimary',
|
|
31
|
+
iconBeforeFillIcon: 'accentItemPrimary',
|
|
32
|
+
loaderFill: 'accentPrimary',
|
|
33
|
+
loaderItemFill: 'accentItemPrimary',
|
|
34
|
+
},
|
|
35
|
+
accentSecondary: {
|
|
36
|
+
fill: 'accentPrimary',
|
|
37
|
+
fillHover: 'accentPrimaryHover',
|
|
38
|
+
borderColor: 'accentBorderPrimary',
|
|
39
|
+
labelTextColor: 'accentTextSecondary',
|
|
40
|
+
labelTextColorHover: 'accentTextSecondary',
|
|
41
|
+
loaderFill: 'accentPrimary',
|
|
42
|
+
loaderItemFill: 'accentItemPrimary',
|
|
43
|
+
},
|
|
44
|
+
full: {},
|
|
45
|
+
solid: {
|
|
46
|
+
fill: 'accentPrimary',
|
|
47
|
+
borderColor: null,
|
|
48
|
+
labelTextColor: 'accentTextPrimary',
|
|
49
|
+
},
|
|
50
|
+
outlined: {
|
|
51
|
+
fill: null,
|
|
52
|
+
borderColor: 'accentBorderPrimary',
|
|
53
|
+
labelTextColor: 'accentTextSecondary',
|
|
54
|
+
},
|
|
55
|
+
ghost: {
|
|
56
|
+
fill: null,
|
|
57
|
+
borderColor: null,
|
|
58
|
+
labelTextColor: 'accentTextSecondary',
|
|
59
|
+
},
|
|
60
|
+
};
|
|
61
|
+
|
|
62
|
+
var buttonAppearanceDanger = {
|
|
63
|
+
danger: {
|
|
64
|
+
fill: 'dangerPrimary',
|
|
65
|
+
fillHover: 'dangerPrimaryHover',
|
|
66
|
+
labelTextColor: 'dangerTextSecondary',
|
|
67
|
+
labelTextColorHover: 'dangerTextSecondary',
|
|
68
|
+
loaderFill: 'dangerPrimary',
|
|
69
|
+
loaderItemFill: 'dangerItemPrimary',
|
|
70
|
+
},
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
var buttonAppearanceError = {
|
|
74
|
+
error: {
|
|
75
|
+
fill: 'errorPrimary',
|
|
76
|
+
fillHover: 'errorPrimaryHover',
|
|
77
|
+
labelTextColor: 'errorTextPrimary',
|
|
78
|
+
labelTextColorHover: 'errorTextPrimary',
|
|
79
|
+
loaderFill: 'errorPrimary',
|
|
80
|
+
loaderItemFill: 'errorItemPrimary',
|
|
81
|
+
},
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
var buttonAppearanceInfo = {
|
|
85
|
+
info: {
|
|
86
|
+
fill: 'accentPrimary',
|
|
87
|
+
fillHover: 'accentPrimaryHover',
|
|
88
|
+
borderColor: 'accentBorderPrimary',
|
|
89
|
+
labelTextColor: 'accentTextPrimary',
|
|
90
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
91
|
+
loaderFill: 'accentPrimary',
|
|
92
|
+
loaderItemFill: 'accentItemPrimary',
|
|
93
|
+
},
|
|
94
|
+
infoSecondary: {
|
|
95
|
+
fill: 'accentPrimary',
|
|
96
|
+
fillHover: 'accentPrimaryHover',
|
|
97
|
+
borderColor: 'accentBorderPrimary',
|
|
98
|
+
labelTextColor: 'accentTextSecondary',
|
|
99
|
+
labelTextColorHover: 'accentTextSecondary',
|
|
100
|
+
loaderFill: 'accentPrimary',
|
|
101
|
+
loaderItemFill: 'accentItemPrimary',
|
|
102
|
+
},
|
|
103
|
+
};
|
|
104
|
+
|
|
105
|
+
var buttonAppearancePrimary = {
|
|
106
|
+
primary: {
|
|
107
|
+
fill: 'primaryPrimary',
|
|
108
|
+
fillHover: 'primaryPrimaryHover',
|
|
109
|
+
labelTextColor: 'primaryTextPrimary',
|
|
110
|
+
},
|
|
111
|
+
};
|
|
112
|
+
|
|
113
|
+
var buttonAppearanceSecondary = {
|
|
114
|
+
secondary: {
|
|
115
|
+
fill: 'secondaryPrimary',
|
|
116
|
+
fillHover: 'secondaryPrimaryHover',
|
|
117
|
+
labelTextColor: 'secondaryTextPrimary',
|
|
118
|
+
},
|
|
119
|
+
};
|
|
120
|
+
|
|
121
|
+
var buttonAppearanceSize = {
|
|
122
|
+
sizeXXL: {
|
|
123
|
+
labelTextSize: 'xxl',
|
|
124
|
+
size: 'xxl',
|
|
125
|
+
iconAfterFillSize: 24,
|
|
126
|
+
iconAfterSize: 24,
|
|
127
|
+
iconBeforeFillSize: 24,
|
|
128
|
+
iconBeforeSize: 24,
|
|
129
|
+
},
|
|
130
|
+
sizeXL: {
|
|
131
|
+
labelTextSize: 'l',
|
|
132
|
+
iconAfterFillSize: 24,
|
|
133
|
+
iconAfterSize: 24,
|
|
134
|
+
iconBeforeFillSize: 24,
|
|
135
|
+
iconBeforeSize: 24,
|
|
136
|
+
size: 'xl',
|
|
137
|
+
},
|
|
138
|
+
sizeL: {
|
|
139
|
+
labelTextSize: 'l',
|
|
140
|
+
iconAfterFillSize: 24,
|
|
141
|
+
iconAfterSize: 24,
|
|
142
|
+
iconBeforeFillSize: 24,
|
|
143
|
+
iconBeforeSize: 24,
|
|
144
|
+
size: 'l',
|
|
145
|
+
},
|
|
146
|
+
sizeM: {
|
|
147
|
+
labelTextSize: 'm',
|
|
148
|
+
iconAfterFillSize: 24,
|
|
149
|
+
iconAfterSize: 24,
|
|
150
|
+
iconBeforeFillSize: 24,
|
|
151
|
+
iconBeforeSize: 24,
|
|
152
|
+
size: 'm',
|
|
153
|
+
},
|
|
154
|
+
sizeS: {
|
|
155
|
+
labelTextSize: 's',
|
|
156
|
+
iconAfterFillSize: 20,
|
|
157
|
+
iconAfterSize: 20,
|
|
158
|
+
iconBeforeFillSize: 20,
|
|
159
|
+
iconBeforeSize: 20,
|
|
160
|
+
size: 's',
|
|
161
|
+
},
|
|
162
|
+
sizeXS: {
|
|
163
|
+
labelTextSize: 'xs',
|
|
164
|
+
iconAfterFillSize: 16,
|
|
165
|
+
iconAfterSize: 16,
|
|
166
|
+
iconBeforeFillSize: 16,
|
|
167
|
+
iconBeforeSize: 16,
|
|
168
|
+
size: 'xs',
|
|
169
|
+
},
|
|
170
|
+
sizeXXS: {
|
|
171
|
+
labelTextSize: 'xs',
|
|
172
|
+
iconAfterFillSize: 14,
|
|
173
|
+
iconAfterSize: 14,
|
|
174
|
+
iconBeforeFillSize: 14,
|
|
175
|
+
iconBeforeSize: 14,
|
|
176
|
+
size: 'xxs',
|
|
177
|
+
},
|
|
178
|
+
};
|
|
179
|
+
|
|
180
|
+
var buttonAppearanceStyle = {
|
|
181
|
+
full: {
|
|
182
|
+
borderColor: null,
|
|
183
|
+
},
|
|
184
|
+
ghost: {
|
|
185
|
+
fill: null,
|
|
186
|
+
borderColor: null,
|
|
187
|
+
},
|
|
188
|
+
outlined: {
|
|
189
|
+
fill: null,
|
|
190
|
+
},
|
|
191
|
+
solid: {
|
|
192
|
+
borderColor: null,
|
|
193
|
+
},
|
|
194
|
+
};
|
|
195
|
+
|
|
196
|
+
var buttonAppearanceSuccess = {
|
|
197
|
+
success: {
|
|
198
|
+
fill: 'successPrimary',
|
|
199
|
+
fillHover: 'successPrimaryHover',
|
|
200
|
+
labelTextColor: 'successTextSecondary',
|
|
201
|
+
labelTextColorHover: 'successTextSecondary',
|
|
202
|
+
loaderFill: 'successPrimary',
|
|
203
|
+
loaderItemFill: 'successItemPrimary',
|
|
204
|
+
},
|
|
205
|
+
};
|
|
206
|
+
|
|
207
|
+
var buttonAppearanceSurface = {
|
|
208
|
+
surfacePrimary: {
|
|
209
|
+
fill: 'surfacePrimary',
|
|
210
|
+
fillHover: 'surfacePrimaryHover',
|
|
211
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
212
|
+
},
|
|
213
|
+
surfaceSecondary: {
|
|
214
|
+
fill: 'surfaceSecondary',
|
|
215
|
+
fillHover: 'surfaceSecondaryHover',
|
|
216
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
217
|
+
loaderFill: 'surfaceSecondary',
|
|
218
|
+
loaderItemFill: 'surfaceItemPrimary',
|
|
219
|
+
},
|
|
220
|
+
surfaceTertiary: {
|
|
221
|
+
fill: 'surfaceTertiary',
|
|
222
|
+
fillHover: 'surfaceTertiaryHover',
|
|
223
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
224
|
+
},
|
|
225
|
+
surfaceQuaternary: {
|
|
226
|
+
fill: 'surfaceQuaternary',
|
|
227
|
+
fillHover: 'surfaceQuaternaryHover',
|
|
228
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
229
|
+
},
|
|
230
|
+
};
|
|
231
|
+
|
|
232
|
+
var buttonAppearanceWarning = {
|
|
233
|
+
warning: {
|
|
234
|
+
fill: 'warningPrimary',
|
|
235
|
+
fillHover: 'warningPrimaryHover',
|
|
236
|
+
labelTextColor: 'warningTextSecondary',
|
|
237
|
+
labelTextColorHover: 'warningTextSecondary',
|
|
238
|
+
loaderFill: 'warningPrimary',
|
|
239
|
+
loaderItemFill: 'warningItemPrimary',
|
|
240
|
+
},
|
|
241
|
+
};
|
|
242
|
+
|
|
243
|
+
var buttonAppearance = __assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({}, buttonAppearanceSize), buttonAppearanceStyle), buttonAppearanceAccent), buttonAppearanceDanger), buttonAppearanceError), buttonAppearanceInfo), buttonAppearancePrimary), buttonAppearanceSecondary), buttonAppearanceSuccess), buttonAppearanceSurface), buttonAppearanceWarning);
|
|
244
|
+
|
|
245
|
+
var buttonConfig = {
|
|
246
|
+
appearance: buttonAppearance,
|
|
247
|
+
setAppearance: function (appearanceConfig) {
|
|
248
|
+
buttonConfig.appearance = appearanceConfig;
|
|
249
|
+
},
|
|
250
|
+
};
|
|
251
|
+
var Button = React.forwardRef(function Button(props, ref) {
|
|
252
|
+
var className = props.className, appearance = props.appearance, children = props.children, label = props.label, Badge = props.Badge, dataTestId = props.dataTestId, dataTour = props.dataTour, href = props.href, _a = props.htmlType, htmlType = _a === void 0 ? 'button' : _a, icon = props.icon, iconAfter = props.iconAfter, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeSrc = props.iconBeforeSrc, iconSrc = props.iconSrc, link = props.link, _b = props.loadertype, loadertype = _b === void 0 ? 'simple' : _b, _c = props.loading, loading = _c === void 0 ? false : _c, rel = props.rel, target = props.target, before = props.before, after = props.after, isDisabled = props.isDisabled, isLoading = props.isLoading, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
253
|
+
var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultApperance, appearance) {
|
|
254
|
+
var _a;
|
|
255
|
+
return (__assign(__assign({}, resultApperance), (_a = buttonConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
|
|
256
|
+
}, {});
|
|
257
|
+
if (loading) {
|
|
258
|
+
console.warn('DEPRECATED: prop Loading is deprecated, use isLoading');
|
|
259
|
+
}
|
|
260
|
+
var _isLoading = isLoading !== null && isLoading !== void 0 ? isLoading : loading;
|
|
261
|
+
var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
262
|
+
var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextSizeMobile = propsGenerator.labelTextSizeMobile, labelTextTruncate = propsGenerator.labelTextTruncate, labelTextWeight = propsGenerator.labelTextWeight, labelTextWidth = propsGenerator.labelTextWidth, labelTextWrap = propsGenerator.labelTextWrap, elevationClass = propsGenerator.elevationClass, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconFill = propsGenerator.iconFill, iconFillIcon = propsGenerator.iconFillIcon, iconFillSize = propsGenerator.iconFillSize, iconShape = propsGenerator.iconShape, iconSize = propsGenerator.iconSize, loaderFill = propsGenerator.loaderFill, loaderItemFill = propsGenerator.loaderItemFill, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
|
|
263
|
+
var shapeStrengthClass = propsGenerator.getClassName('shapeStrength', {
|
|
264
|
+
replace: [/\./, '-'],
|
|
265
|
+
});
|
|
266
|
+
// @ts-expect-error
|
|
267
|
+
var _d = useStyles(props), labelStyles = _d.label, buttonStyles = _d.styles;
|
|
268
|
+
var buttonTypeClass = after ||
|
|
269
|
+
before ||
|
|
270
|
+
icon ||
|
|
271
|
+
iconAfter ||
|
|
272
|
+
iconAfterSrc ||
|
|
273
|
+
iconBefore ||
|
|
274
|
+
iconBeforeSrc ||
|
|
275
|
+
iconSrc;
|
|
276
|
+
return (jsx(LinkWrapper, { className: clsx(className, 'button', label && buttonTypeClass
|
|
277
|
+
? 'button_type_default'
|
|
278
|
+
: label
|
|
279
|
+
? 'buttom_type_label'
|
|
280
|
+
: buttonTypeClass
|
|
281
|
+
? 'button_type_icon'
|
|
282
|
+
: '', borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass
|
|
283
|
+
? "shape-strength_".concat(shapeStrengthClass)
|
|
284
|
+
: shapeClass === 'rounded' && 'shape-strength_default', sizeClass && "button_size_".concat(sizeClass), widthClass && "button_width_".concat(widthClass), elevationClass && "elevation_".concat(elevationClass), onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', _isLoading && 'button_state_loading'), type: htmlType, disabled: isDisabled, "data-testid": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", href: link || href, rel: rel, style: buttonStyles, target: target, onClick: onClick, onMouseDown: onMouseDown, children: jsxs("div", { className: "button__wrapper", ref: ref, children: [_isLoading && (jsx(Loader, { className: clsx(className, 'button__loader', shapeClass), type: loadertype, fill: loaderFill, itemFill: loaderItemFill })), before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "button__icon_before", fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsx(Icon, { className: "button__icon", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsx(Text, { className: "button__label", width: labelTextWidth, textColor: labelTextColor, textColorHover: labelTextColorHover, textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, size: labelTextSize, sizeMobile: labelTextSizeMobile, style: labelStyles, children: children || label })), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "button__icon_after", fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
|
|
285
|
+
});
|
|
286
|
+
|
|
287
|
+
export { Button as B, buttonAppearance as a, buttonConfig as b };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { _ as __assign } from './tslib.es6-5FtW-kfi.js';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import clsx from 'clsx';
|
|
4
|
+
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
5
|
+
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
6
|
+
|
|
7
|
+
var dividerAppearance = {
|
|
8
|
+
dev: {},
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
var dividerConfig = {
|
|
12
|
+
appearance: dividerAppearance,
|
|
13
|
+
setAppearance: function (appearanceConfig) {
|
|
14
|
+
dividerConfig.appearance = appearanceConfig;
|
|
15
|
+
},
|
|
16
|
+
};
|
|
17
|
+
function Divider(props) {
|
|
18
|
+
var className = props.className, appearance = props.appearance;
|
|
19
|
+
var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultApperance, appearance) {
|
|
20
|
+
var _a;
|
|
21
|
+
return (__assign(__assign({}, resultApperance), (_a = dividerConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
|
|
22
|
+
}, {});
|
|
23
|
+
var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
24
|
+
var directionClass = propsGenerator.directionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, fillDisabledClass = propsGenerator.fillDisabledClass, _a = propsGenerator.sizeClass, sizeClass = _a === void 0 ? 'xs' : _a, widthClass = propsGenerator.widthClass;
|
|
25
|
+
// @ts-expect-error
|
|
26
|
+
var hrStyles = useStyles(props).styles;
|
|
27
|
+
return (jsx("hr", { className: clsx(className, 'divider', widthClass && "width_".concat(widthClass), directionClass && "divider_direction_".concat(directionClass), sizeClass && "divider_size_".concat(sizeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass)), style: hrStyles }));
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
export { Divider as D, dividerAppearance as a, dividerConfig as d };
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
var clsx = require('clsx');
|
|
6
|
+
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
7
|
+
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
8
|
+
|
|
9
|
+
var dividerAppearance = {
|
|
10
|
+
dev: {},
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
var dividerConfig = {
|
|
14
|
+
appearance: dividerAppearance,
|
|
15
|
+
setAppearance: function (appearanceConfig) {
|
|
16
|
+
dividerConfig.appearance = appearanceConfig;
|
|
17
|
+
},
|
|
18
|
+
};
|
|
19
|
+
function Divider(props) {
|
|
20
|
+
var className = props.className, appearance = props.appearance;
|
|
21
|
+
var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultApperance, appearance) {
|
|
22
|
+
var _a;
|
|
23
|
+
return (tslib_es6.__assign(tslib_es6.__assign({}, resultApperance), (_a = dividerConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
|
|
24
|
+
}, {});
|
|
25
|
+
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
26
|
+
var directionClass = propsGenerator.directionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, fillDisabledClass = propsGenerator.fillDisabledClass, _a = propsGenerator.sizeClass, sizeClass = _a === void 0 ? 'xs' : _a, widthClass = propsGenerator.widthClass;
|
|
27
|
+
// @ts-expect-error
|
|
28
|
+
var hrStyles = useStyles.useStyles(props).styles;
|
|
29
|
+
return (jsxRuntime.jsx("hr", { className: clsx(className, 'divider', widthClass && "width_".concat(widthClass), directionClass && "divider_direction_".concat(directionClass), sizeClass && "divider_size_".concat(sizeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass)), style: hrStyles }));
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
exports.Divider = Divider;
|
|
33
|
+
exports.dividerAppearance = dividerAppearance;
|
|
34
|
+
exports.dividerConfig = dividerConfig;
|