@itcase/ui 1.3.30 → 1.3.32
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-c3ZkPu8e.js → Group-BKJmVwPZ.js} +4 -4
- package/dist/{Group-BY8OkVsS.js → Group-Bkz3RO18.js} +4 -4
- 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 +15 -15
- 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 +16 -16
- 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/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 +0 -10
- 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/Group/Group.css +2 -0
- 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/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/direction/direction.css +2 -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 +1 -1
- 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/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/gap/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,233 @@
|
|
|
1
|
+
import { _ as __assign } from './tslib.es6-5FtW-kfi.js';
|
|
2
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { useRef, useCallback } 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 { T as Text } from './Text-C6NSmetx.js';
|
|
8
|
+
import { T as Tooltip } from './Tooltip-BYgzNVYI.js';
|
|
9
|
+
|
|
10
|
+
var labelAppearanceAccent = {
|
|
11
|
+
accent: {
|
|
12
|
+
fill: 'accentPrimary',
|
|
13
|
+
labelTextColor: 'accentTextPrimary',
|
|
14
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
15
|
+
},
|
|
16
|
+
accentTertiary: {
|
|
17
|
+
fill: 'accentTertiary',
|
|
18
|
+
labelTextColor: 'accentTextPrimary',
|
|
19
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
20
|
+
},
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
var labelAppearanceDanger = {
|
|
24
|
+
danger: {
|
|
25
|
+
fill: 'dangerPrimary',
|
|
26
|
+
fillHover: 'dangerPrimaryHover',
|
|
27
|
+
labelTextColor: 'dangerTextSecondary',
|
|
28
|
+
labelTextColorHover: 'dangerTextSecondary',
|
|
29
|
+
loaderFill: 'dangerPrimary',
|
|
30
|
+
loaderItemFill: 'dangerItemPrimary',
|
|
31
|
+
},
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
var labelAppearanceError = {
|
|
35
|
+
error: {
|
|
36
|
+
fill: 'errorPrimary',
|
|
37
|
+
fillHover: 'errorPrimaryHover',
|
|
38
|
+
labelTextColor: 'errorTextPrimary',
|
|
39
|
+
labelTextColorHover: 'errorTextPrimary',
|
|
40
|
+
loaderFill: 'errorPrimary',
|
|
41
|
+
loaderItemFill: 'errorItemPrimary',
|
|
42
|
+
},
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
var labelAppearanceInfo = {
|
|
46
|
+
accent: {
|
|
47
|
+
fill: 'accentPrimary',
|
|
48
|
+
fillHover: 'accentPrimaryHover',
|
|
49
|
+
borderColor: 'accentBorderPrimary',
|
|
50
|
+
labelTextColor: 'accentTextPrimary',
|
|
51
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
52
|
+
loaderFill: 'accentPrimary',
|
|
53
|
+
loaderItemFill: 'accentItemPrimary',
|
|
54
|
+
},
|
|
55
|
+
accentSecondary: {
|
|
56
|
+
fill: 'accentPrimary',
|
|
57
|
+
fillHover: 'accentPrimaryHover',
|
|
58
|
+
borderColor: 'accentBorderPrimary',
|
|
59
|
+
labelTextColor: 'accentTextSecondary',
|
|
60
|
+
labelTextColorHover: 'accentTextSecondary',
|
|
61
|
+
loaderFill: 'accentPrimary',
|
|
62
|
+
loaderItemFill: 'accentItemPrimary',
|
|
63
|
+
},
|
|
64
|
+
};
|
|
65
|
+
|
|
66
|
+
var labelAppearancePrimary = {
|
|
67
|
+
primary: {
|
|
68
|
+
fill: 'primaryPrimary',
|
|
69
|
+
labelTextColor: 'primaryTextPrimary',
|
|
70
|
+
labelTextColorHover: 'primaryTextPrimary',
|
|
71
|
+
},
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
var labelAppearanceSecondary = {
|
|
75
|
+
secondary: {
|
|
76
|
+
fill: 'secondaryPrimary',
|
|
77
|
+
labelTextColor: 'secondaryTextPrimary',
|
|
78
|
+
labelTextColorHover: 'secondaryTextPrimary',
|
|
79
|
+
},
|
|
80
|
+
};
|
|
81
|
+
|
|
82
|
+
var labelAppearanceSize = {
|
|
83
|
+
sizeXXL: {
|
|
84
|
+
labelTextSize: 'xxl',
|
|
85
|
+
size: 'xxl',
|
|
86
|
+
iconAfterFillSize: 24,
|
|
87
|
+
iconAfterSize: 24,
|
|
88
|
+
iconBeforeFillSize: 24,
|
|
89
|
+
iconBeforeSize: 24,
|
|
90
|
+
},
|
|
91
|
+
sizeXL: {
|
|
92
|
+
labelTextSize: 'l',
|
|
93
|
+
iconAfterFillSize: 24,
|
|
94
|
+
iconAfterSize: 24,
|
|
95
|
+
iconBeforeFillSize: 24,
|
|
96
|
+
iconBeforeSize: 24,
|
|
97
|
+
size: 'xl',
|
|
98
|
+
},
|
|
99
|
+
sizeL: {
|
|
100
|
+
labelTextSize: 'l',
|
|
101
|
+
iconAfterFillSize: 24,
|
|
102
|
+
iconAfterSize: 24,
|
|
103
|
+
iconBeforeFillSize: 24,
|
|
104
|
+
iconBeforeSize: 24,
|
|
105
|
+
size: 'l',
|
|
106
|
+
},
|
|
107
|
+
sizeM: {
|
|
108
|
+
labelTextSize: 'm',
|
|
109
|
+
iconAfterFillSize: 24,
|
|
110
|
+
iconAfterSize: 24,
|
|
111
|
+
iconBeforeFillSize: 24,
|
|
112
|
+
iconBeforeSize: 24,
|
|
113
|
+
size: 'm',
|
|
114
|
+
},
|
|
115
|
+
sizeS: {
|
|
116
|
+
labelTextSize: 's',
|
|
117
|
+
iconAfterFillSize: 20,
|
|
118
|
+
iconAfterSize: 20,
|
|
119
|
+
iconBeforeFillSize: 20,
|
|
120
|
+
iconBeforeSize: 20,
|
|
121
|
+
size: 's',
|
|
122
|
+
},
|
|
123
|
+
sizeXS: {
|
|
124
|
+
labelTextSize: 'xs',
|
|
125
|
+
iconAfterFillSize: 16,
|
|
126
|
+
iconAfterSize: 16,
|
|
127
|
+
iconBeforeFillSize: 16,
|
|
128
|
+
iconBeforeSize: 16,
|
|
129
|
+
size: 'xs',
|
|
130
|
+
},
|
|
131
|
+
sizeXXS: {
|
|
132
|
+
labelTextSize: 'xs',
|
|
133
|
+
iconAfterFillSize: 14,
|
|
134
|
+
iconAfterSize: 14,
|
|
135
|
+
iconBeforeFillSize: 14,
|
|
136
|
+
iconBeforeSize: 14,
|
|
137
|
+
size: 'xxs',
|
|
138
|
+
},
|
|
139
|
+
};
|
|
140
|
+
|
|
141
|
+
var labelAppearanceStyle = {
|
|
142
|
+
full: {
|
|
143
|
+
borderColor: null,
|
|
144
|
+
},
|
|
145
|
+
ghost: {
|
|
146
|
+
fill: null,
|
|
147
|
+
borderColor: null,
|
|
148
|
+
},
|
|
149
|
+
outlined: {
|
|
150
|
+
fill: null,
|
|
151
|
+
},
|
|
152
|
+
solid: {
|
|
153
|
+
borderColor: null,
|
|
154
|
+
},
|
|
155
|
+
};
|
|
156
|
+
|
|
157
|
+
var labelAppearanceSuccess = {
|
|
158
|
+
success: {
|
|
159
|
+
fill: 'successPrimary',
|
|
160
|
+
fillHover: 'successPrimaryHover',
|
|
161
|
+
labelTextColor: 'successTextSecondary',
|
|
162
|
+
labelTextColorHover: 'successTextSecondary',
|
|
163
|
+
loaderFill: 'successPrimary',
|
|
164
|
+
loaderItemFill: 'successItemPrimary',
|
|
165
|
+
},
|
|
166
|
+
};
|
|
167
|
+
|
|
168
|
+
var labelAppearanceSurface = {
|
|
169
|
+
surfacePrimary: {
|
|
170
|
+
fill: 'surfacePrimary',
|
|
171
|
+
fillHover: 'surfacePrimaryHover',
|
|
172
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
173
|
+
labelTextColorHover: 'surfaceTextPrimary',
|
|
174
|
+
},
|
|
175
|
+
surfaceSecondary: {
|
|
176
|
+
fill: 'surfaceSecondary',
|
|
177
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
178
|
+
labelTextColorHover: 'surfaceTextPrimary',
|
|
179
|
+
},
|
|
180
|
+
surfaceTertiary: {
|
|
181
|
+
fill: 'surfaceTertiary',
|
|
182
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
183
|
+
labelTextColorHover: 'surfaceTextPrimary',
|
|
184
|
+
},
|
|
185
|
+
surfaceQuaternary: {
|
|
186
|
+
fill: 'surfaceQuaternary',
|
|
187
|
+
labelTextColor: 'surfaceTextInverse',
|
|
188
|
+
labelTextColorHover: 'surfaceTextInverse',
|
|
189
|
+
},
|
|
190
|
+
};
|
|
191
|
+
|
|
192
|
+
var labelAppearanceWarning = {
|
|
193
|
+
warning: {
|
|
194
|
+
fill: 'warningPrimary',
|
|
195
|
+
fillHover: 'warningPrimaryHover',
|
|
196
|
+
labelTextColor: 'warningTextSecondary',
|
|
197
|
+
labelTextColorHover: 'warningTextSecondary',
|
|
198
|
+
loaderFill: 'warningPrimary',
|
|
199
|
+
loaderItemFill: 'warningItemPrimary',
|
|
200
|
+
},
|
|
201
|
+
};
|
|
202
|
+
|
|
203
|
+
var labelAppearance = __assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({}, labelAppearanceSize), labelAppearanceStyle), labelAppearanceAccent), labelAppearanceDanger), labelAppearanceError), labelAppearanceInfo), labelAppearancePrimary), labelAppearanceSecondary), labelAppearanceSuccess), labelAppearanceSurface), labelAppearanceWarning);
|
|
204
|
+
|
|
205
|
+
var labelConfig = {
|
|
206
|
+
appearance: labelAppearance,
|
|
207
|
+
setAppearance: function (appearanceConfig) {
|
|
208
|
+
labelConfig.appearance = appearanceConfig;
|
|
209
|
+
},
|
|
210
|
+
};
|
|
211
|
+
function Label(props) {
|
|
212
|
+
var className = props.className, type = props.type, appearance = props.appearance, children = props.children, label = props.label, labelTextWrap = props.labelTextWrap, cursor = props.cursor, dataTour = props.dataTour, mode = props.mode, showTooltip = props.showTooltip, tooltipAlignment = props.tooltipAlignment, tooltipAppearance = props.tooltipAppearance, tooltipArrowPosition = props.tooltipArrowPosition, tooltipContent = props.tooltipContent, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, before = props.before, after = props.after, set = props.set, onClick = props.onClick;
|
|
213
|
+
var tooltipRef = useRef(null);
|
|
214
|
+
var onMouseEnterLabel = useCallback(function () {
|
|
215
|
+
var _a;
|
|
216
|
+
(_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.openTooltip();
|
|
217
|
+
}, []);
|
|
218
|
+
var onMouseLeaveLabel = useCallback(function () {
|
|
219
|
+
var _a;
|
|
220
|
+
(_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.closeTooltip();
|
|
221
|
+
}, []);
|
|
222
|
+
var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultApperance, appearance) {
|
|
223
|
+
var _a;
|
|
224
|
+
return (__assign(__assign({}, resultApperance), (_a = labelConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
|
|
225
|
+
}, {});
|
|
226
|
+
var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
227
|
+
var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
|
|
228
|
+
// @ts-expect-error
|
|
229
|
+
var labelStyles = useStyles(props).styles;
|
|
230
|
+
return (jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), set && "label_set_".concat(set), mode && "label_mode_".concat(mode), onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__text", textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, size: labelTextSize, children: label })) : (jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsx(Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), after] }));
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
export { Label as L, labelAppearance as a, labelConfig as l };
|
|
@@ -0,0 +1,237 @@
|
|
|
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 Text = require('./Text-C49zj3jO.js');
|
|
10
|
+
var Tooltip = require('./Tooltip-DpBQQoNo.js');
|
|
11
|
+
|
|
12
|
+
var labelAppearanceAccent = {
|
|
13
|
+
accent: {
|
|
14
|
+
fill: 'accentPrimary',
|
|
15
|
+
labelTextColor: 'accentTextPrimary',
|
|
16
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
17
|
+
},
|
|
18
|
+
accentTertiary: {
|
|
19
|
+
fill: 'accentTertiary',
|
|
20
|
+
labelTextColor: 'accentTextPrimary',
|
|
21
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
22
|
+
},
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
var labelAppearanceDanger = {
|
|
26
|
+
danger: {
|
|
27
|
+
fill: 'dangerPrimary',
|
|
28
|
+
fillHover: 'dangerPrimaryHover',
|
|
29
|
+
labelTextColor: 'dangerTextSecondary',
|
|
30
|
+
labelTextColorHover: 'dangerTextSecondary',
|
|
31
|
+
loaderFill: 'dangerPrimary',
|
|
32
|
+
loaderItemFill: 'dangerItemPrimary',
|
|
33
|
+
},
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
var labelAppearanceError = {
|
|
37
|
+
error: {
|
|
38
|
+
fill: 'errorPrimary',
|
|
39
|
+
fillHover: 'errorPrimaryHover',
|
|
40
|
+
labelTextColor: 'errorTextPrimary',
|
|
41
|
+
labelTextColorHover: 'errorTextPrimary',
|
|
42
|
+
loaderFill: 'errorPrimary',
|
|
43
|
+
loaderItemFill: 'errorItemPrimary',
|
|
44
|
+
},
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
var labelAppearanceInfo = {
|
|
48
|
+
accent: {
|
|
49
|
+
fill: 'accentPrimary',
|
|
50
|
+
fillHover: 'accentPrimaryHover',
|
|
51
|
+
borderColor: 'accentBorderPrimary',
|
|
52
|
+
labelTextColor: 'accentTextPrimary',
|
|
53
|
+
labelTextColorHover: 'accentTextPrimary',
|
|
54
|
+
loaderFill: 'accentPrimary',
|
|
55
|
+
loaderItemFill: 'accentItemPrimary',
|
|
56
|
+
},
|
|
57
|
+
accentSecondary: {
|
|
58
|
+
fill: 'accentPrimary',
|
|
59
|
+
fillHover: 'accentPrimaryHover',
|
|
60
|
+
borderColor: 'accentBorderPrimary',
|
|
61
|
+
labelTextColor: 'accentTextSecondary',
|
|
62
|
+
labelTextColorHover: 'accentTextSecondary',
|
|
63
|
+
loaderFill: 'accentPrimary',
|
|
64
|
+
loaderItemFill: 'accentItemPrimary',
|
|
65
|
+
},
|
|
66
|
+
};
|
|
67
|
+
|
|
68
|
+
var labelAppearancePrimary = {
|
|
69
|
+
primary: {
|
|
70
|
+
fill: 'primaryPrimary',
|
|
71
|
+
labelTextColor: 'primaryTextPrimary',
|
|
72
|
+
labelTextColorHover: 'primaryTextPrimary',
|
|
73
|
+
},
|
|
74
|
+
};
|
|
75
|
+
|
|
76
|
+
var labelAppearanceSecondary = {
|
|
77
|
+
secondary: {
|
|
78
|
+
fill: 'secondaryPrimary',
|
|
79
|
+
labelTextColor: 'secondaryTextPrimary',
|
|
80
|
+
labelTextColorHover: 'secondaryTextPrimary',
|
|
81
|
+
},
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
var labelAppearanceSize = {
|
|
85
|
+
sizeXXL: {
|
|
86
|
+
labelTextSize: 'xxl',
|
|
87
|
+
size: 'xxl',
|
|
88
|
+
iconAfterFillSize: 24,
|
|
89
|
+
iconAfterSize: 24,
|
|
90
|
+
iconBeforeFillSize: 24,
|
|
91
|
+
iconBeforeSize: 24,
|
|
92
|
+
},
|
|
93
|
+
sizeXL: {
|
|
94
|
+
labelTextSize: 'l',
|
|
95
|
+
iconAfterFillSize: 24,
|
|
96
|
+
iconAfterSize: 24,
|
|
97
|
+
iconBeforeFillSize: 24,
|
|
98
|
+
iconBeforeSize: 24,
|
|
99
|
+
size: 'xl',
|
|
100
|
+
},
|
|
101
|
+
sizeL: {
|
|
102
|
+
labelTextSize: 'l',
|
|
103
|
+
iconAfterFillSize: 24,
|
|
104
|
+
iconAfterSize: 24,
|
|
105
|
+
iconBeforeFillSize: 24,
|
|
106
|
+
iconBeforeSize: 24,
|
|
107
|
+
size: 'l',
|
|
108
|
+
},
|
|
109
|
+
sizeM: {
|
|
110
|
+
labelTextSize: 'm',
|
|
111
|
+
iconAfterFillSize: 24,
|
|
112
|
+
iconAfterSize: 24,
|
|
113
|
+
iconBeforeFillSize: 24,
|
|
114
|
+
iconBeforeSize: 24,
|
|
115
|
+
size: 'm',
|
|
116
|
+
},
|
|
117
|
+
sizeS: {
|
|
118
|
+
labelTextSize: 's',
|
|
119
|
+
iconAfterFillSize: 20,
|
|
120
|
+
iconAfterSize: 20,
|
|
121
|
+
iconBeforeFillSize: 20,
|
|
122
|
+
iconBeforeSize: 20,
|
|
123
|
+
size: 's',
|
|
124
|
+
},
|
|
125
|
+
sizeXS: {
|
|
126
|
+
labelTextSize: 'xs',
|
|
127
|
+
iconAfterFillSize: 16,
|
|
128
|
+
iconAfterSize: 16,
|
|
129
|
+
iconBeforeFillSize: 16,
|
|
130
|
+
iconBeforeSize: 16,
|
|
131
|
+
size: 'xs',
|
|
132
|
+
},
|
|
133
|
+
sizeXXS: {
|
|
134
|
+
labelTextSize: 'xs',
|
|
135
|
+
iconAfterFillSize: 14,
|
|
136
|
+
iconAfterSize: 14,
|
|
137
|
+
iconBeforeFillSize: 14,
|
|
138
|
+
iconBeforeSize: 14,
|
|
139
|
+
size: 'xxs',
|
|
140
|
+
},
|
|
141
|
+
};
|
|
142
|
+
|
|
143
|
+
var labelAppearanceStyle = {
|
|
144
|
+
full: {
|
|
145
|
+
borderColor: null,
|
|
146
|
+
},
|
|
147
|
+
ghost: {
|
|
148
|
+
fill: null,
|
|
149
|
+
borderColor: null,
|
|
150
|
+
},
|
|
151
|
+
outlined: {
|
|
152
|
+
fill: null,
|
|
153
|
+
},
|
|
154
|
+
solid: {
|
|
155
|
+
borderColor: null,
|
|
156
|
+
},
|
|
157
|
+
};
|
|
158
|
+
|
|
159
|
+
var labelAppearanceSuccess = {
|
|
160
|
+
success: {
|
|
161
|
+
fill: 'successPrimary',
|
|
162
|
+
fillHover: 'successPrimaryHover',
|
|
163
|
+
labelTextColor: 'successTextSecondary',
|
|
164
|
+
labelTextColorHover: 'successTextSecondary',
|
|
165
|
+
loaderFill: 'successPrimary',
|
|
166
|
+
loaderItemFill: 'successItemPrimary',
|
|
167
|
+
},
|
|
168
|
+
};
|
|
169
|
+
|
|
170
|
+
var labelAppearanceSurface = {
|
|
171
|
+
surfacePrimary: {
|
|
172
|
+
fill: 'surfacePrimary',
|
|
173
|
+
fillHover: 'surfacePrimaryHover',
|
|
174
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
175
|
+
labelTextColorHover: 'surfaceTextPrimary',
|
|
176
|
+
},
|
|
177
|
+
surfaceSecondary: {
|
|
178
|
+
fill: 'surfaceSecondary',
|
|
179
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
180
|
+
labelTextColorHover: 'surfaceTextPrimary',
|
|
181
|
+
},
|
|
182
|
+
surfaceTertiary: {
|
|
183
|
+
fill: 'surfaceTertiary',
|
|
184
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
185
|
+
labelTextColorHover: 'surfaceTextPrimary',
|
|
186
|
+
},
|
|
187
|
+
surfaceQuaternary: {
|
|
188
|
+
fill: 'surfaceQuaternary',
|
|
189
|
+
labelTextColor: 'surfaceTextInverse',
|
|
190
|
+
labelTextColorHover: 'surfaceTextInverse',
|
|
191
|
+
},
|
|
192
|
+
};
|
|
193
|
+
|
|
194
|
+
var labelAppearanceWarning = {
|
|
195
|
+
warning: {
|
|
196
|
+
fill: 'warningPrimary',
|
|
197
|
+
fillHover: 'warningPrimaryHover',
|
|
198
|
+
labelTextColor: 'warningTextSecondary',
|
|
199
|
+
labelTextColorHover: 'warningTextSecondary',
|
|
200
|
+
loaderFill: 'warningPrimary',
|
|
201
|
+
loaderItemFill: 'warningItemPrimary',
|
|
202
|
+
},
|
|
203
|
+
};
|
|
204
|
+
|
|
205
|
+
var labelAppearance = 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({}, labelAppearanceSize), labelAppearanceStyle), labelAppearanceAccent), labelAppearanceDanger), labelAppearanceError), labelAppearanceInfo), labelAppearancePrimary), labelAppearanceSecondary), labelAppearanceSuccess), labelAppearanceSurface), labelAppearanceWarning);
|
|
206
|
+
|
|
207
|
+
var labelConfig = {
|
|
208
|
+
appearance: labelAppearance,
|
|
209
|
+
setAppearance: function (appearanceConfig) {
|
|
210
|
+
labelConfig.appearance = appearanceConfig;
|
|
211
|
+
},
|
|
212
|
+
};
|
|
213
|
+
function Label(props) {
|
|
214
|
+
var className = props.className, type = props.type, appearance = props.appearance, children = props.children, label = props.label, labelTextWrap = props.labelTextWrap, cursor = props.cursor, dataTour = props.dataTour, mode = props.mode, showTooltip = props.showTooltip, tooltipAlignment = props.tooltipAlignment, tooltipAppearance = props.tooltipAppearance, tooltipArrowPosition = props.tooltipArrowPosition, tooltipContent = props.tooltipContent, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, before = props.before, after = props.after, set = props.set, onClick = props.onClick;
|
|
215
|
+
var tooltipRef = React.useRef(null);
|
|
216
|
+
var onMouseEnterLabel = React.useCallback(function () {
|
|
217
|
+
var _a;
|
|
218
|
+
(_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.openTooltip();
|
|
219
|
+
}, []);
|
|
220
|
+
var onMouseLeaveLabel = React.useCallback(function () {
|
|
221
|
+
var _a;
|
|
222
|
+
(_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.closeTooltip();
|
|
223
|
+
}, []);
|
|
224
|
+
var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultApperance, appearance) {
|
|
225
|
+
var _a;
|
|
226
|
+
return (tslib_es6.__assign(tslib_es6.__assign({}, resultApperance), (_a = labelConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
|
|
227
|
+
}, {});
|
|
228
|
+
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
229
|
+
var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
|
|
230
|
+
// @ts-expect-error
|
|
231
|
+
var labelStyles = useStyles.useStyles(props).styles;
|
|
232
|
+
return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), set && "label_set_".concat(set), mode && "label_mode_".concat(mode), onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__text", textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, size: labelTextSize, children: label })) : (jsxRuntime.jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsxRuntime.jsx(Tooltip.Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), after] }));
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
exports.Label = Label;
|
|
236
|
+
exports.labelAppearance = labelAppearance;
|
|
237
|
+
exports.labelConfig = labelConfig;
|
|
@@ -4,8 +4,8 @@ var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
|
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var clsx = require('clsx');
|
|
7
|
-
var
|
|
8
|
-
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
7
|
+
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
8
|
+
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
9
9
|
|
|
10
10
|
var linkConfig = {
|
|
11
11
|
LinkComponent: 'a',
|
|
@@ -20,11 +20,11 @@ var linkConfig = {
|
|
|
20
20
|
// },
|
|
21
21
|
// }
|
|
22
22
|
function Link(props) {
|
|
23
|
-
var
|
|
23
|
+
var className = props.className, children = props.children, text = props.text, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, style = props.style, target = props.target, _a = props.underline, underline = _a === void 0 ? 'underline' : _a, before = props.before, after = props.after, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
24
24
|
// @ts-expect-error
|
|
25
25
|
var appearanceConfig = linkConfig.appearance && linkConfig.appearance[appearance];
|
|
26
|
-
var
|
|
27
|
-
var
|
|
26
|
+
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
27
|
+
var directionClass = propsGenerator.directionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textColorClass = propsGenerator.textColorClass, textColorHoverClass = propsGenerator.textColorHoverClass, textGradientClass = propsGenerator.textGradientClass, textStyleClass = propsGenerator.textStyleClass, textWeightClass = propsGenerator.textWeightClass, heightClass = propsGenerator.heightClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, svgFillClass = propsGenerator.svgFillClass, svgFillHoverClass = propsGenerator.svgFillHoverClass, widthClass = propsGenerator.widthClass;
|
|
28
28
|
// @ts-expect-error
|
|
29
29
|
var styles = useStyles.useStyles(props).styles;
|
|
30
30
|
return (jsxRuntime.jsxs(LinkWrapper, { className: clsx(className, 'link', widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), directionClass && "link_direction_".concat(directionClass), sizeClass && "text_size_".concat(sizeClass), svgFillClass && "svg_fill_".concat(svgFillClass), svgFillHoverClass && "svg_fill_hover_".concat(svgFillHoverClass), underline && "link_underline_".concat(underline), 'text', (textColorClass ||
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { a as __rest, _ as __assign } from './tslib.es6-5FtW-kfi.js';
|
|
2
2
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import clsx from 'clsx';
|
|
5
|
-
import {
|
|
6
|
-
import { useStyles } from './hooks/useStyles.js';
|
|
5
|
+
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
6
|
+
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
7
7
|
|
|
8
8
|
var linkConfig = {
|
|
9
9
|
LinkComponent: 'a',
|
|
@@ -18,11 +18,11 @@ var linkConfig = {
|
|
|
18
18
|
// },
|
|
19
19
|
// }
|
|
20
20
|
function Link(props) {
|
|
21
|
-
var
|
|
21
|
+
var className = props.className, children = props.children, text = props.text, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, style = props.style, target = props.target, _a = props.underline, underline = _a === void 0 ? 'underline' : _a, before = props.before, after = props.after, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
22
22
|
// @ts-expect-error
|
|
23
23
|
var appearanceConfig = linkConfig.appearance && linkConfig.appearance[appearance];
|
|
24
|
-
var
|
|
25
|
-
var
|
|
24
|
+
var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
25
|
+
var directionClass = propsGenerator.directionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textColorClass = propsGenerator.textColorClass, textColorHoverClass = propsGenerator.textColorHoverClass, textGradientClass = propsGenerator.textGradientClass, textStyleClass = propsGenerator.textStyleClass, textWeightClass = propsGenerator.textWeightClass, heightClass = propsGenerator.heightClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, svgFillClass = propsGenerator.svgFillClass, svgFillHoverClass = propsGenerator.svgFillHoverClass, widthClass = propsGenerator.widthClass;
|
|
26
26
|
// @ts-expect-error
|
|
27
27
|
var styles = useStyles(props).styles;
|
|
28
28
|
return (jsxs(LinkWrapper, { className: clsx(className, 'link', widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), directionClass && "link_direction_".concat(directionClass), sizeClass && "text_size_".concat(sizeClass), svgFillClass && "svg_fill_".concat(svgFillClass), svgFillHoverClass && "svg_fill_hover_".concat(svgFillHoverClass), underline && "link_underline_".concat(underline), 'text', (textColorClass ||
|
|
@@ -0,0 +1,69 @@
|
|
|
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
|
+
var Text = require('./Text-C49zj3jO.js');
|
|
9
|
+
|
|
10
|
+
var loaderAppearanceAccent = {
|
|
11
|
+
accent: {
|
|
12
|
+
fill: 'accentPrimary',
|
|
13
|
+
itemFill: 'accentItemPrimary',
|
|
14
|
+
},
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
var loaderAppearancePrimary = {
|
|
18
|
+
primary: {
|
|
19
|
+
fill: 'primaryPrimary',
|
|
20
|
+
itemFill: 'primaryItemPrimary',
|
|
21
|
+
},
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
var loaderAppearanceSecondary = {
|
|
25
|
+
secondary: {
|
|
26
|
+
fill: 'secondaryPrimary',
|
|
27
|
+
itemFill: 'secondaryItemPrimary',
|
|
28
|
+
},
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
var loaderAppearanceSurface = {
|
|
32
|
+
surfacePrimary: {
|
|
33
|
+
fill: 'surfacePrimary',
|
|
34
|
+
itemFill: 'surfaceItemPrimary',
|
|
35
|
+
},
|
|
36
|
+
surfaceSecondary: {
|
|
37
|
+
fill: 'surfaceSecondary',
|
|
38
|
+
itemFill: 'surfaceItemPrimary',
|
|
39
|
+
},
|
|
40
|
+
surfaceTertiary: {
|
|
41
|
+
fill: 'surfaceTertiary',
|
|
42
|
+
itemFill: 'surfaceItemPrimary',
|
|
43
|
+
},
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
var loaderAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, loaderAppearanceAccent), loaderAppearancePrimary), loaderAppearanceSecondary), loaderAppearanceSurface);
|
|
47
|
+
|
|
48
|
+
var loaderConfig = {
|
|
49
|
+
appearance: loaderAppearance,
|
|
50
|
+
setAppearance: function (appearanceConfig) {
|
|
51
|
+
loaderConfig.appearance = appearanceConfig;
|
|
52
|
+
},
|
|
53
|
+
};
|
|
54
|
+
function Loader(props) {
|
|
55
|
+
var className = props.className, type = props.type, appearance = props.appearance, children = props.children, text = props.text;
|
|
56
|
+
var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultApperance, appearance) {
|
|
57
|
+
var _a;
|
|
58
|
+
return (tslib_es6.__assign(tslib_es6.__assign({}, resultApperance), (_a = loaderConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
|
|
59
|
+
}, {});
|
|
60
|
+
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
61
|
+
var fillClass = propsGenerator.fillClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, heightClass = propsGenerator.heightClass, itemFillClass = propsGenerator.itemFillClass, positionClass = propsGenerator.positionClass, widthClass = propsGenerator.widthClass;
|
|
62
|
+
// @ts-expect-error
|
|
63
|
+
var loader = useStyles.useStyles(props).styles;
|
|
64
|
+
return (jsxRuntime.jsxs("div", { className: clsx('loader', positionClass && "position_".concat(positionClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), className, type && "loader_type_".concat(type)), style: loader, children: [children || (jsxRuntime.jsxs("div", { className: "loader__inner", children: [jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsxRuntime.jsx(Text.Text, { className: "loader__text", textColor: textColor, size: textSize, children: text }))] }));
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
exports.Loader = Loader;
|
|
68
|
+
exports.loaderAppearance = loaderAppearance;
|
|
69
|
+
exports.loaderConfig = loaderConfig;
|