@salutejs/plasma-new-hope 0.174.0-canary.1505.11515852860.0 → 0.174.0-canary.1511.11518967304.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Combobox/ComboboxNew/Combobox.js +22 -27
- package/cjs/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/utils/initialItemsTransform.js +5 -9
- package/cjs/components/Combobox/ComboboxNew/utils/initialItemsTransform.js.map +1 -1
- package/cjs/components/NumberInput/NumberInput.css +54 -0
- package/cjs/components/NumberInput/NumberInput.js +188 -0
- package/cjs/components/NumberInput/NumberInput.js.map +1 -0
- package/cjs/components/NumberInput/NumberInput.styles.js +9 -0
- package/cjs/components/NumberInput/NumberInput.styles.js.map +1 -0
- package/cjs/components/NumberInput/NumberInput.styles_jeawjl.css +1 -0
- package/cjs/components/NumberInput/NumberInput.tokens.js +90 -0
- package/cjs/components/NumberInput/NumberInput.tokens.js.map +1 -0
- package/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +19 -0
- package/cjs/components/NumberInput/ui/ActionButton/ActionButton.js.map +1 -0
- package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +22 -0
- package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js.map +1 -0
- package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles_x642ct.css +1 -0
- package/cjs/components/NumberInput/ui/Input/Input.css +15 -0
- package/cjs/components/NumberInput/ui/Input/Input.js +190 -0
- package/cjs/components/NumberInput/ui/Input/Input.js.map +1 -0
- package/cjs/components/NumberInput/ui/Input/Input.styles.js +96 -0
- package/cjs/components/NumberInput/ui/Input/Input.styles.js.map +1 -0
- package/cjs/components/NumberInput/ui/Input/Input.styles_jszc0c.css +8 -0
- package/cjs/components/NumberInput/utils/index.js +8 -0
- package/cjs/components/NumberInput/utils/index.js.map +1 -0
- package/cjs/components/NumberInput/variations/_background-type/base.js +9 -0
- package/cjs/components/NumberInput/variations/_background-type/base.js.map +1 -0
- package/cjs/components/NumberInput/variations/_background-type/base_1jmdljr.css +1 -0
- package/cjs/components/NumberInput/variations/_clear/base.js +9 -0
- package/cjs/components/NumberInput/variations/_clear/base.js.map +1 -0
- package/cjs/components/NumberInput/variations/_clear/base_3l8dqb.css +1 -0
- package/cjs/components/NumberInput/variations/_disabled/base.js +9 -0
- package/cjs/components/NumberInput/variations/_disabled/base.js.map +1 -0
- package/cjs/components/NumberInput/variations/_disabled/base_1sl0mh8.css +1 -0
- package/cjs/components/NumberInput/variations/_segmentation/base.js +9 -0
- package/cjs/components/NumberInput/variations/_segmentation/base.js.map +1 -0
- package/cjs/components/NumberInput/variations/_segmentation/base_nl8ve.css +1 -0
- package/cjs/components/NumberInput/variations/_shape/base.js +9 -0
- package/cjs/components/NumberInput/variations/_shape/base.js.map +1 -0
- package/cjs/components/NumberInput/variations/_shape/base_k05biw.css +1 -0
- package/cjs/components/NumberInput/variations/_size/base.js +9 -0
- package/cjs/components/NumberInput/variations/_size/base.js.map +1 -0
- package/cjs/components/NumberInput/variations/_size/base_1pju5qf.css +1 -0
- package/cjs/components/NumberInput/variations/_view/base.js +9 -0
- package/cjs/components/NumberInput/variations/_view/base.js.map +1 -0
- package/cjs/components/NumberInput/variations/_view/base_cghr9q.css +1 -0
- package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.js +2 -2
- package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.js.map +1 -1
- package/cjs/components/Select/Select.js +25 -13
- package/cjs/components/Select/Select.js.map +1 -1
- package/cjs/components/Select/hooks/useKeyboardNavigation.js +1 -1
- package/cjs/components/Select/hooks/useKeyboardNavigation.js.map +1 -1
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +1 -1
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +1 -1
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js.map +1 -1
- package/cjs/components/Select/utils/getButtonLabel.js +1 -1
- package/cjs/components/Select/utils/getButtonLabel.js.map +1 -1
- package/cjs/components/Select/utils/initialItemsTransform.js +6 -9
- package/cjs/components/Select/utils/initialItemsTransform.js.map +1 -1
- package/cjs/index.css +25 -0
- package/cjs/index.js +6 -0
- package/cjs/index.js.map +1 -1
- package/emotion/cjs/components/Combobox/ComboboxNew/Combobox.js +22 -26
- package/emotion/cjs/components/Combobox/ComboboxNew/utils/index.js +1 -8
- package/emotion/cjs/components/Combobox/ComboboxNew/utils/initialItemsTransform.js +5 -19
- package/emotion/cjs/components/NumberInput/NumberInput.js +198 -0
- package/emotion/cjs/components/NumberInput/NumberInput.styles.js +17 -0
- package/emotion/cjs/components/NumberInput/NumberInput.tokens.js +87 -0
- package/emotion/cjs/components/NumberInput/NumberInput.types.js +5 -0
- package/emotion/cjs/components/NumberInput/index.js +31 -0
- package/emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +18 -0
- package/emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +16 -0
- package/emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.types.js +5 -0
- package/emotion/cjs/components/NumberInput/ui/Input/Input.js +198 -0
- package/emotion/cjs/components/NumberInput/ui/Input/Input.styles.js +82 -0
- package/emotion/cjs/components/NumberInput/ui/Input/Input.types.js +5 -0
- package/emotion/cjs/components/NumberInput/ui/index.js +19 -0
- package/emotion/cjs/components/NumberInput/utils/index.js +7 -0
- package/emotion/cjs/components/NumberInput/variations/_background-type/base.js +10 -0
- package/emotion/cjs/components/NumberInput/variations/_background-type/tokens.json +6 -0
- package/emotion/cjs/components/NumberInput/variations/_clear/base.js +12 -0
- package/emotion/cjs/components/NumberInput/variations/_clear/tokens.json +5 -0
- package/emotion/cjs/components/NumberInput/variations/_disabled/base.js +9 -0
- package/emotion/cjs/components/NumberInput/variations/_disabled/tokens.json +4 -0
- package/emotion/cjs/components/NumberInput/variations/_segmentation/base.js +12 -0
- package/emotion/cjs/components/NumberInput/variations/_segmentation/tokens.json +1 -0
- package/emotion/cjs/components/NumberInput/variations/_shape/base.js +11 -0
- package/emotion/cjs/components/NumberInput/variations/_shape/tokens.json +1 -0
- package/emotion/cjs/components/NumberInput/variations/_size/base.js +13 -0
- package/emotion/cjs/components/NumberInput/variations/_size/tokens.json +22 -0
- package/emotion/cjs/components/NumberInput/variations/_view/base.js +13 -0
- package/emotion/cjs/components/NumberInput/variations/_view/tokens.json +14 -0
- package/emotion/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.js +2 -2
- package/emotion/cjs/components/Select/Select.js +25 -12
- package/emotion/cjs/components/Select/hooks/useKeyboardNavigation.js +1 -1
- package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +1 -1
- package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +13 -13
- package/emotion/cjs/components/Select/utils/getButtonLabel.js +1 -1
- package/emotion/cjs/components/Select/utils/index.js +1 -8
- package/emotion/cjs/components/Select/utils/initialItemsTransform.js +6 -19
- package/emotion/cjs/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +0 -6
- package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +48 -0
- package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.js +11 -0
- package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +109 -0
- package/emotion/cjs/examples/plasma_web/components/Combobox/Combobox.stories.tsx +0 -6
- package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.config.js +48 -0
- package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.js +11 -0
- package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +109 -0
- package/emotion/cjs/index.js +11 -0
- package/emotion/es/components/Combobox/ComboboxNew/Combobox.js +23 -27
- package/emotion/es/components/Combobox/ComboboxNew/utils/index.js +1 -2
- package/emotion/es/components/Combobox/ComboboxNew/utils/initialItemsTransform.js +5 -19
- package/emotion/es/components/NumberInput/NumberInput.js +190 -0
- package/emotion/es/components/NumberInput/NumberInput.styles.js +11 -0
- package/emotion/es/components/NumberInput/NumberInput.tokens.js +81 -0
- package/emotion/es/components/NumberInput/NumberInput.types.js +1 -0
- package/emotion/es/components/NumberInput/index.js +2 -0
- package/emotion/es/components/NumberInput/ui/ActionButton/ActionButton.js +11 -0
- package/emotion/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +9 -0
- package/emotion/es/components/NumberInput/ui/ActionButton/ActionButton.types.js +1 -0
- package/emotion/es/components/NumberInput/ui/Input/Input.js +189 -0
- package/emotion/es/components/NumberInput/ui/Input/Input.styles.js +75 -0
- package/emotion/es/components/NumberInput/ui/Input/Input.types.js +1 -0
- package/emotion/es/components/NumberInput/ui/index.js +2 -0
- package/emotion/es/components/NumberInput/utils/index.js +1 -0
- package/emotion/es/components/NumberInput/variations/_background-type/base.js +4 -0
- package/emotion/es/components/NumberInput/variations/_background-type/tokens.json +6 -0
- package/emotion/es/components/NumberInput/variations/_clear/base.js +6 -0
- package/emotion/es/components/NumberInput/variations/_clear/tokens.json +5 -0
- package/emotion/es/components/NumberInput/variations/_disabled/base.js +3 -0
- package/emotion/es/components/NumberInput/variations/_disabled/tokens.json +4 -0
- package/emotion/es/components/NumberInput/variations/_segmentation/base.js +6 -0
- package/emotion/es/components/NumberInput/variations/_segmentation/tokens.json +1 -0
- package/emotion/es/components/NumberInput/variations/_shape/base.js +5 -0
- package/emotion/es/components/NumberInput/variations/_shape/tokens.json +1 -0
- package/emotion/es/components/NumberInput/variations/_size/base.js +7 -0
- package/emotion/es/components/NumberInput/variations/_size/tokens.json +22 -0
- package/emotion/es/components/NumberInput/variations/_view/base.js +7 -0
- package/emotion/es/components/NumberInput/variations/_view/tokens.json +14 -0
- package/emotion/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.js +2 -2
- package/emotion/es/components/Select/Select.js +26 -13
- package/emotion/es/components/Select/hooks/useKeyboardNavigation.js +1 -1
- package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.js +1 -1
- package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +13 -13
- package/emotion/es/components/Select/utils/getButtonLabel.js +1 -1
- package/emotion/es/components/Select/utils/index.js +1 -2
- package/emotion/es/components/Select/utils/initialItemsTransform.js +6 -19
- package/emotion/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +0 -6
- package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +42 -0
- package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.js +5 -0
- package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +109 -0
- package/emotion/es/examples/plasma_web/components/Combobox/Combobox.stories.tsx +0 -6
- package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.config.js +42 -0
- package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.js +5 -0
- package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +109 -0
- package/emotion/es/index.js +2 -1
- package/es/components/Combobox/ComboboxNew/Combobox.js +22 -27
- package/es/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/es/components/Combobox/ComboboxNew/utils/initialItemsTransform.js +5 -9
- package/es/components/Combobox/ComboboxNew/utils/initialItemsTransform.js.map +1 -1
- package/es/components/NumberInput/NumberInput.css +54 -0
- package/es/components/NumberInput/NumberInput.js +183 -0
- package/es/components/NumberInput/NumberInput.js.map +1 -0
- package/es/components/NumberInput/NumberInput.styles.js +5 -0
- package/es/components/NumberInput/NumberInput.styles.js.map +1 -0
- package/es/components/NumberInput/NumberInput.styles_jeawjl.css +1 -0
- package/es/components/NumberInput/NumberInput.tokens.js +84 -0
- package/es/components/NumberInput/NumberInput.tokens.js.map +1 -0
- package/es/components/NumberInput/ui/ActionButton/ActionButton.js +15 -0
- package/es/components/NumberInput/ui/ActionButton/ActionButton.js.map +1 -0
- package/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +18 -0
- package/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js.map +1 -0
- package/es/components/NumberInput/ui/ActionButton/ActionButton.styles_x642ct.css +1 -0
- package/es/components/NumberInput/ui/Input/Input.css +15 -0
- package/es/components/NumberInput/ui/Input/Input.js +186 -0
- package/es/components/NumberInput/ui/Input/Input.js.map +1 -0
- package/es/components/NumberInput/ui/Input/Input.styles.js +85 -0
- package/es/components/NumberInput/ui/Input/Input.styles.js.map +1 -0
- package/es/components/NumberInput/ui/Input/Input.styles_jszc0c.css +8 -0
- package/es/components/NumberInput/utils/index.js +4 -0
- package/es/components/NumberInput/utils/index.js.map +1 -0
- package/es/components/NumberInput/variations/_background-type/base.js +5 -0
- package/es/components/NumberInput/variations/_background-type/base.js.map +1 -0
- package/es/components/NumberInput/variations/_background-type/base_1jmdljr.css +1 -0
- package/es/components/NumberInput/variations/_clear/base.js +5 -0
- package/es/components/NumberInput/variations/_clear/base.js.map +1 -0
- package/es/components/NumberInput/variations/_clear/base_3l8dqb.css +1 -0
- package/es/components/NumberInput/variations/_disabled/base.js +5 -0
- package/es/components/NumberInput/variations/_disabled/base.js.map +1 -0
- package/es/components/NumberInput/variations/_disabled/base_1sl0mh8.css +1 -0
- package/es/components/NumberInput/variations/_segmentation/base.js +5 -0
- package/es/components/NumberInput/variations/_segmentation/base.js.map +1 -0
- package/es/components/NumberInput/variations/_segmentation/base_nl8ve.css +1 -0
- package/es/components/NumberInput/variations/_shape/base.js +5 -0
- package/es/components/NumberInput/variations/_shape/base.js.map +1 -0
- package/es/components/NumberInput/variations/_shape/base_k05biw.css +1 -0
- package/es/components/NumberInput/variations/_size/base.js +5 -0
- package/es/components/NumberInput/variations/_size/base.js.map +1 -0
- package/es/components/NumberInput/variations/_size/base_1pju5qf.css +1 -0
- package/es/components/NumberInput/variations/_view/base.js +5 -0
- package/es/components/NumberInput/variations/_view/base.js.map +1 -0
- package/es/components/NumberInput/variations/_view/base_cghr9q.css +1 -0
- package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.js +2 -2
- package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.js.map +1 -1
- package/es/components/Select/Select.js +26 -14
- package/es/components/Select/Select.js.map +1 -1
- package/es/components/Select/hooks/useKeyboardNavigation.js +1 -1
- package/es/components/Select/hooks/useKeyboardNavigation.js.map +1 -1
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.js +1 -1
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +1 -1
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js.map +1 -1
- package/es/components/Select/utils/getButtonLabel.js +1 -1
- package/es/components/Select/utils/getButtonLabel.js.map +1 -1
- package/es/components/Select/utils/initialItemsTransform.js +6 -9
- package/es/components/Select/utils/initialItemsTransform.js.map +1 -1
- package/es/index.css +25 -0
- package/es/index.js +2 -0
- package/es/index.js.map +1 -1
- package/package.json +2 -2
- package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.js +22 -26
- package/styled-components/cjs/components/Combobox/ComboboxNew/utils/index.js +1 -8
- package/styled-components/cjs/components/Combobox/ComboboxNew/utils/initialItemsTransform.js +5 -19
- package/styled-components/cjs/components/NumberInput/NumberInput.js +198 -0
- package/styled-components/cjs/components/NumberInput/NumberInput.styles.js +8 -0
- package/styled-components/cjs/components/NumberInput/NumberInput.tokens.js +87 -0
- package/styled-components/cjs/components/NumberInput/NumberInput.types.js +5 -0
- package/styled-components/cjs/components/NumberInput/index.js +31 -0
- package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +18 -0
- package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +15 -0
- package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.types.js +5 -0
- package/styled-components/cjs/components/NumberInput/ui/Input/Input.js +198 -0
- package/styled-components/cjs/components/NumberInput/ui/Input/Input.styles.js +49 -0
- package/styled-components/cjs/components/NumberInput/ui/Input/Input.types.js +5 -0
- package/styled-components/cjs/components/NumberInput/ui/index.js +19 -0
- package/styled-components/cjs/components/NumberInput/utils/index.js +7 -0
- package/styled-components/cjs/components/NumberInput/variations/_background-type/base.js +10 -0
- package/styled-components/cjs/components/NumberInput/variations/_background-type/tokens.json +6 -0
- package/styled-components/cjs/components/NumberInput/variations/_clear/base.js +12 -0
- package/styled-components/cjs/components/NumberInput/variations/_clear/tokens.json +5 -0
- package/styled-components/cjs/components/NumberInput/variations/_disabled/base.js +9 -0
- package/styled-components/cjs/components/NumberInput/variations/_disabled/tokens.json +4 -0
- package/styled-components/cjs/components/NumberInput/variations/_segmentation/base.js +12 -0
- package/styled-components/cjs/components/NumberInput/variations/_segmentation/tokens.json +1 -0
- package/styled-components/cjs/components/NumberInput/variations/_shape/base.js +11 -0
- package/styled-components/cjs/components/NumberInput/variations/_shape/tokens.json +1 -0
- package/styled-components/cjs/components/NumberInput/variations/_size/base.js +13 -0
- package/styled-components/cjs/components/NumberInput/variations/_size/tokens.json +22 -0
- package/styled-components/cjs/components/NumberInput/variations/_view/base.js +13 -0
- package/styled-components/cjs/components/NumberInput/variations/_view/tokens.json +14 -0
- package/styled-components/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.js +2 -2
- package/styled-components/cjs/components/Select/Select.js +25 -12
- package/styled-components/cjs/components/Select/hooks/useKeyboardNavigation.js +1 -1
- package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +1 -1
- package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +1 -1
- package/styled-components/cjs/components/Select/utils/getButtonLabel.js +1 -1
- package/styled-components/cjs/components/Select/utils/index.js +1 -8
- package/styled-components/cjs/components/Select/utils/initialItemsTransform.js +6 -19
- package/styled-components/cjs/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +0 -6
- package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +48 -0
- package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.js +11 -0
- package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +109 -0
- package/styled-components/cjs/examples/plasma_web/components/Combobox/Combobox.stories.tsx +0 -6
- package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.config.js +48 -0
- package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.js +11 -0
- package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +109 -0
- package/styled-components/cjs/index.js +11 -0
- package/styled-components/es/components/Combobox/ComboboxNew/Combobox.js +23 -27
- package/styled-components/es/components/Combobox/ComboboxNew/utils/index.js +1 -2
- package/styled-components/es/components/Combobox/ComboboxNew/utils/initialItemsTransform.js +5 -19
- package/styled-components/es/components/NumberInput/NumberInput.js +190 -0
- package/styled-components/es/components/NumberInput/NumberInput.styles.js +2 -0
- package/styled-components/es/components/NumberInput/NumberInput.tokens.js +81 -0
- package/styled-components/es/components/NumberInput/NumberInput.types.js +1 -0
- package/styled-components/es/components/NumberInput/index.js +2 -0
- package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.js +11 -0
- package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +8 -0
- package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.types.js +1 -0
- package/styled-components/es/components/NumberInput/ui/Input/Input.js +189 -0
- package/styled-components/es/components/NumberInput/ui/Input/Input.styles.js +42 -0
- package/styled-components/es/components/NumberInput/ui/Input/Input.types.js +1 -0
- package/styled-components/es/components/NumberInput/ui/index.js +2 -0
- package/styled-components/es/components/NumberInput/utils/index.js +1 -0
- package/styled-components/es/components/NumberInput/variations/_background-type/base.js +4 -0
- package/styled-components/es/components/NumberInput/variations/_background-type/tokens.json +6 -0
- package/styled-components/es/components/NumberInput/variations/_clear/base.js +6 -0
- package/styled-components/es/components/NumberInput/variations/_clear/tokens.json +5 -0
- package/styled-components/es/components/NumberInput/variations/_disabled/base.js +3 -0
- package/styled-components/es/components/NumberInput/variations/_disabled/tokens.json +4 -0
- package/styled-components/es/components/NumberInput/variations/_segmentation/base.js +6 -0
- package/styled-components/es/components/NumberInput/variations/_segmentation/tokens.json +1 -0
- package/styled-components/es/components/NumberInput/variations/_shape/base.js +5 -0
- package/styled-components/es/components/NumberInput/variations/_shape/tokens.json +1 -0
- package/styled-components/es/components/NumberInput/variations/_size/base.js +7 -0
- package/styled-components/es/components/NumberInput/variations/_size/tokens.json +22 -0
- package/styled-components/es/components/NumberInput/variations/_view/base.js +7 -0
- package/styled-components/es/components/NumberInput/variations/_view/tokens.json +14 -0
- package/styled-components/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.js +2 -2
- package/styled-components/es/components/Select/Select.js +26 -13
- package/styled-components/es/components/Select/hooks/useKeyboardNavigation.js +1 -1
- package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.js +1 -1
- package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +1 -1
- package/styled-components/es/components/Select/utils/getButtonLabel.js +1 -1
- package/styled-components/es/components/Select/utils/index.js +1 -2
- package/styled-components/es/components/Select/utils/initialItemsTransform.js +6 -19
- package/styled-components/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +0 -6
- package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +42 -0
- package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.js +5 -0
- package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +109 -0
- package/styled-components/es/examples/plasma_web/components/Combobox/Combobox.stories.tsx +0 -6
- package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.config.js +42 -0
- package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.js +5 -0
- package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +109 -0
- package/styled-components/es/index.js +2 -1
- package/types/components/Combobox/ComboboxNew/Combobox.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts +3 -14
- package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/utils/index.d.ts +0 -1
- package/types/components/Combobox/ComboboxNew/utils/index.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/utils/initialItemsTransform.d.ts.map +1 -1
- package/types/components/NumberInput/NumberInput.d.ts +42 -0
- package/types/components/NumberInput/NumberInput.d.ts.map +1 -0
- package/types/components/NumberInput/NumberInput.styles.d.ts +2 -0
- package/types/components/NumberInput/NumberInput.styles.d.ts.map +1 -0
- package/types/components/NumberInput/NumberInput.tokens.d.ts +76 -0
- package/types/components/NumberInput/NumberInput.tokens.d.ts.map +1 -0
- package/types/components/NumberInput/NumberInput.types.d.ts +112 -0
- package/types/components/NumberInput/NumberInput.types.d.ts.map +1 -0
- package/types/components/NumberInput/index.d.ts +3 -0
- package/types/components/NumberInput/index.d.ts.map +1 -0
- package/types/components/NumberInput/ui/ActionButton/ActionButton.d.ts +4 -0
- package/types/components/NumberInput/ui/ActionButton/ActionButton.d.ts.map +1 -0
- package/types/components/NumberInput/ui/ActionButton/ActionButton.styles.d.ts +45 -0
- package/types/components/NumberInput/ui/ActionButton/ActionButton.styles.d.ts.map +1 -0
- package/types/components/NumberInput/ui/ActionButton/ActionButton.types.d.ts +7 -0
- package/types/components/NumberInput/ui/ActionButton/ActionButton.types.d.ts.map +1 -0
- package/types/components/NumberInput/ui/Input/Input.d.ts +16 -0
- package/types/components/NumberInput/ui/Input/Input.d.ts.map +1 -0
- package/types/components/NumberInput/ui/Input/Input.styles.d.ts +30 -0
- package/types/components/NumberInput/ui/Input/Input.styles.d.ts.map +1 -0
- package/types/components/NumberInput/ui/Input/Input.types.d.ts +16 -0
- package/types/components/NumberInput/ui/Input/Input.types.d.ts.map +1 -0
- package/types/components/NumberInput/ui/index.d.ts +3 -0
- package/types/components/NumberInput/ui/index.d.ts.map +1 -0
- package/types/components/NumberInput/utils/index.d.ts +2 -0
- package/types/components/NumberInput/utils/index.d.ts.map +1 -0
- package/types/components/NumberInput/variations/_background-type/base.d.ts +2 -0
- package/types/components/NumberInput/variations/_background-type/base.d.ts.map +1 -0
- package/types/components/NumberInput/variations/_clear/base.d.ts +2 -0
- package/types/components/NumberInput/variations/_clear/base.d.ts.map +1 -0
- package/types/components/NumberInput/variations/_disabled/base.d.ts +2 -0
- package/types/components/NumberInput/variations/_disabled/base.d.ts.map +1 -0
- package/types/components/NumberInput/variations/_segmentation/base.d.ts +2 -0
- package/types/components/NumberInput/variations/_segmentation/base.d.ts.map +1 -0
- package/types/components/NumberInput/variations/_shape/base.d.ts +2 -0
- package/types/components/NumberInput/variations/_shape/base.d.ts.map +1 -0
- package/types/components/NumberInput/variations/_size/base.d.ts +2 -0
- package/types/components/NumberInput/variations/_size/base.d.ts.map +1 -0
- package/types/components/NumberInput/variations/_view/base.d.ts +2 -0
- package/types/components/NumberInput/variations/_view/base.d.ts.map +1 -0
- package/types/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.d.ts +8 -8
- package/types/components/Select/Select.d.ts +2 -2
- package/types/components/Select/Select.d.ts.map +1 -1
- package/types/components/Select/Select.types.d.ts +1 -2
- package/types/components/Select/Select.types.d.ts.map +1 -1
- package/types/components/Select/hooks/useKeyboardNavigation.d.ts +2 -2
- package/types/components/Select/hooks/useKeyboardNavigation.d.ts.map +1 -1
- package/types/components/Select/ui/Target/Target.types.d.ts +2 -2
- package/types/components/Select/ui/Target/Target.types.d.ts.map +1 -1
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.styles.d.ts +4 -4
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.styles.d.ts.map +1 -1
- package/types/components/Select/utils/index.d.ts +0 -1
- package/types/components/Select/utils/index.d.ts.map +1 -1
- package/types/components/Select/utils/initialItemsTransform.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Combobox/Combobox.d.ts +6 -30
- package/types/examples/plasma_b2c/components/Combobox/Combobox.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/NumberInput/NumberInput.config.d.ts +41 -0
- package/types/examples/plasma_b2c/components/NumberInput/NumberInput.config.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/NumberInput/NumberInput.d.ts +84 -0
- package/types/examples/plasma_b2c/components/NumberInput/NumberInput.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/Select/Select.d.ts +8 -8
- package/types/examples/plasma_web/components/Combobox/Combobox.d.ts +6 -30
- package/types/examples/plasma_web/components/Combobox/Combobox.d.ts.map +1 -1
- package/types/examples/plasma_web/components/NumberInput/NumberInput.config.d.ts +41 -0
- package/types/examples/plasma_web/components/NumberInput/NumberInput.config.d.ts.map +1 -0
- package/types/examples/plasma_web/components/NumberInput/NumberInput.d.ts +84 -0
- package/types/examples/plasma_web/components/NumberInput/NumberInput.d.ts.map +1 -0
- package/types/examples/plasma_web/components/Select/Select.d.ts +8 -8
- package/types/index.d.ts +1 -0
- package/types/index.d.ts.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/utils/getInitialValue.js +0 -21
- package/cjs/components/Combobox/ComboboxNew/utils/getInitialValue.js.map +0 -1
- package/cjs/components/Select/utils/getInitialValue.js +0 -21
- package/cjs/components/Select/utils/getInitialValue.js.map +0 -1
- package/emotion/cjs/components/Combobox/ComboboxNew/utils/getInitialValue.js +0 -20
- package/emotion/cjs/components/Select/utils/getInitialValue.js +0 -20
- package/emotion/es/components/Combobox/ComboboxNew/utils/getInitialValue.js +0 -14
- package/emotion/es/components/Select/utils/getInitialValue.js +0 -14
- package/es/components/Combobox/ComboboxNew/utils/getInitialValue.js +0 -17
- package/es/components/Combobox/ComboboxNew/utils/getInitialValue.js.map +0 -1
- package/es/components/Select/utils/getInitialValue.js +0 -17
- package/es/components/Select/utils/getInitialValue.js.map +0 -1
- package/styled-components/cjs/components/Combobox/ComboboxNew/utils/getInitialValue.js +0 -20
- package/styled-components/cjs/components/Select/utils/getInitialValue.js +0 -20
- package/styled-components/es/components/Combobox/ComboboxNew/utils/getInitialValue.js +0 -14
- package/styled-components/es/components/Select/utils/getInitialValue.js +0 -14
- package/types/components/Combobox/ComboboxNew/utils/getInitialValue.d.ts +0 -4
- package/types/components/Combobox/ComboboxNew/utils/getInitialValue.d.ts.map +0 -1
- package/types/components/Select/utils/getInitialValue.d.ts +0 -4
- package/types/components/Select/utils/getInitialValue.d.ts.map +0 -1
@@ -5,5 +5,4 @@ export { updateSingleAncestors } from './updateSingleAncestors';
|
|
5
5
|
export { sizeToIconSize } from './sizeToIconSize';
|
6
6
|
export { getCorrectHeight } from './getCorrectHeight';
|
7
7
|
export { getButtonLabel } from './getButtonLabel';
|
8
|
-
export { getView } from './getView';
|
9
|
-
export { getInitialValue } from './getInitialValue';
|
8
|
+
export { getView } from './getView';
|
@@ -1,25 +1,12 @@
|
|
1
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
2
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
3
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
4
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
5
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
6
|
-
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
7
|
-
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
8
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
9
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
10
|
-
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
11
|
-
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
12
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
13
1
|
// Проходимся по массиву items и добавляем в каждый item ключ parent, который ссылается на item родителя.
|
14
2
|
// Дает возможность прохода к корневому элементу (снизу вверх).
|
15
|
-
|
3
|
+
|
16
4
|
export var initialItemsTransform = function initialItemsTransform(items, parent) {
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
itemCopy.items = initialItemsTransform(itemCopy.items, itemCopy);
|
5
|
+
items.forEach(function (item) {
|
6
|
+
item.parent = parent;
|
7
|
+
if (item.items) {
|
8
|
+
item.items = initialItemsTransform(item.items, item);
|
22
9
|
}
|
23
|
-
return itemCopy;
|
24
10
|
});
|
11
|
+
return items;
|
25
12
|
};
|
@@ -68,10 +68,6 @@ const meta: Meta<StorySelectProps> = {
|
|
68
68
|
control: { type: 'boolean' },
|
69
69
|
if: { arg: 'alwaysOpened', truthy: false },
|
70
70
|
},
|
71
|
-
targetAmount: {
|
72
|
-
control: { type: 'number' },
|
73
|
-
if: { arg: 'isTargetAmount', truthy: true },
|
74
|
-
},
|
75
71
|
},
|
76
72
|
args: {
|
77
73
|
label: 'Label',
|
@@ -82,7 +78,6 @@ const meta: Meta<StorySelectProps> = {
|
|
82
78
|
view: 'default',
|
83
79
|
enableContentLeft: false,
|
84
80
|
isTargetAmount: false,
|
85
|
-
targetAmount: undefined,
|
86
81
|
variant: 'normal',
|
87
82
|
alwaysOpened: false,
|
88
83
|
disabled: false,
|
@@ -99,7 +94,6 @@ const meta: Meta<StorySelectProps> = {
|
|
99
94
|
'placeholder',
|
100
95
|
'helperText',
|
101
96
|
'isTargetAmount',
|
102
|
-
'targetAmount',
|
103
97
|
'closeAfterSelect',
|
104
98
|
'alwaysOpened',
|
105
99
|
'variant',
|
@@ -0,0 +1,42 @@
|
|
1
|
+
import { css } from 'styled-components';
|
2
|
+
import { numberInputTokens as tokens } from '../../../../components/NumberInput';
|
3
|
+
export var config = {
|
4
|
+
defaults: {
|
5
|
+
view: 'default',
|
6
|
+
size: 'l',
|
7
|
+
shape: 'cornered',
|
8
|
+
inputBackgroundType: 'fill'
|
9
|
+
},
|
10
|
+
variations: {
|
11
|
+
view: {
|
12
|
+
"default": /*#__PURE__*/css(["", ":var(--text-accent);", ":var(--text-negative);", ":var(--text-primary);", ":var(--inverse-text-primary);", ":var(--text-tertiary);", ":var(--on-dark-text-tertiary);", ":var(--surface-transparent-secondary);", ":var(--on-dark-surface-transparent-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-hover);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-active);", ":0.4;", ":inherit;", ":inherit;"], tokens.caretColor, tokens.errorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.backgroundColorFocus, tokens.backgroundColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid),
|
13
|
+
secondary: /*#__PURE__*/css(["", ":var(--text-accent);", ":var(--text-negative);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);", ":0.4;", ":inherit;", ":inherit;"], tokens.caretColor, tokens.errorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.backgroundColorFocus, tokens.backgroundColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid),
|
14
|
+
accent: /*#__PURE__*/css(["", ":var(--text-accent);", ":var(--inverse-text-primary);", ":var(--text-negative);", ":var(--text-primary);", ":var(--inverse-text-primary);", ":var(--text-tertiary);", ":var(--on-dark-text-tertiary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary);", ":var(--surface-accent);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--inverse-text-primary);", ":var(--surface-accent-hover);", ":var(--inverse-text-primary);", ":var(--surface-accent-active);", ":0.4;", ":inherit;", ":inherit;"], tokens.caretColor, tokens.caretColorSolid, tokens.errorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.backgroundColorFocus, tokens.backgroundColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid)
|
15
|
+
},
|
16
|
+
size: {
|
17
|
+
l: /*#__PURE__*/css(["", ":11.75rem;", ":3.5rem;", ":3.5rem;", ":1.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.875rem;", ":0.375rem;", ":0 0.125rem;", ":0.875rem;", ":3.5rem;", ":1.063rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
|
18
|
+
m: /*#__PURE__*/css(["", ":10.25rem;", ":3rem;", ":3rem;", ":1.25rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.75rem;", ":0.25rem;", ":0 0.125rem;", ":0.75rem;", ":3rem;", ":0.875rem 1rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
|
19
|
+
s: /*#__PURE__*/css(["", ":8.75rem;", ":2.5rem;", ":2.5rem;", ":1rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.625rem;", ":0.25rem;", ":0 0.125rem;", ":0.625rem;", ":2.5rem;", ":0.688rem 0.875rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
|
20
|
+
xs: /*#__PURE__*/css(["", ":6.875rem;", ":2rem;", ":2rem;", ":0.75rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.5rem;", ":0.125rem;", ":0 0.125rem;", ":0.5rem;", ":2rem;", ":0.563rem 0.625rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.25rem;", ":0.25rem;", ":1rem;"], tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize)
|
21
|
+
},
|
22
|
+
shape: {
|
23
|
+
cornered: /*#__PURE__*/css([""]),
|
24
|
+
pilled: /*#__PURE__*/css(["", ":50%;"], tokens.iconButtonRadius)
|
25
|
+
},
|
26
|
+
inputBackgroundType: {
|
27
|
+
fill: /*#__PURE__*/css(["", ":var(--surface-transparent-primary);", ":var(--surface-transparent-primary);"], tokens.backgroundColor, tokens.backgroundColorHover),
|
28
|
+
clear: /*#__PURE__*/css(["", ":transparent;", ":transparent;"], tokens.backgroundColor, tokens.backgroundColorHover)
|
29
|
+
},
|
30
|
+
segmentation: {
|
31
|
+
"default": /*#__PURE__*/css([""]),
|
32
|
+
segmented: /*#__PURE__*/css([""]),
|
33
|
+
solid: /*#__PURE__*/css(["", ":0;"], tokens.iconButtonSegmentationRadius)
|
34
|
+
},
|
35
|
+
clear: {
|
36
|
+
"true": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-tertiary);"], tokens.colorClear, tokens.iconButtonColorClear, tokens.additionalTextColorClear)
|
37
|
+
},
|
38
|
+
disabled: {
|
39
|
+
"true": /*#__PURE__*/css(["", ":0.4;"], tokens.disabledOpacity)
|
40
|
+
}
|
41
|
+
}
|
42
|
+
};
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import { numberInputConfig } from '../../../../components/NumberInput';
|
2
|
+
import { component, mergeConfig } from '../../../../engines';
|
3
|
+
import { config } from './NumberInput.config';
|
4
|
+
var mergedConfig = /*#__PURE__*/mergeConfig(numberInputConfig, config);
|
5
|
+
export var NumberInput = /*#__PURE__*/component(mergedConfig);
|
package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx
ADDED
@@ -0,0 +1,109 @@
|
|
1
|
+
import React, { ComponentProps, useState } from 'react';
|
2
|
+
import type { StoryObj, Meta } from '@storybook/react';
|
3
|
+
import { action } from '@storybook/addon-actions';
|
4
|
+
|
5
|
+
import { WithTheme } from '../../../_helpers';
|
6
|
+
|
7
|
+
import { NumberInput } from './NumberInput';
|
8
|
+
|
9
|
+
const onChange = action('onChange');
|
10
|
+
const onDecrement = action('onDecrement');
|
11
|
+
const onIncrement = action('onIncrement');
|
12
|
+
|
13
|
+
const views = ['default', 'secondary', 'accent'];
|
14
|
+
const sizes = ['l', 'm', 's', 'xs'];
|
15
|
+
const shapes = ['cornered', 'pilled'];
|
16
|
+
const inputBackgroundTypes = ['fill', 'clear'];
|
17
|
+
const segmentation = ['default', 'segmented', 'solid'];
|
18
|
+
|
19
|
+
const meta: Meta<typeof NumberInput> = {
|
20
|
+
title: 'plasma_b2c/NumberInput',
|
21
|
+
component: NumberInput,
|
22
|
+
decorators: [WithTheme],
|
23
|
+
argTypes: {
|
24
|
+
min: {
|
25
|
+
control: {
|
26
|
+
type: 'number',
|
27
|
+
},
|
28
|
+
},
|
29
|
+
max: {
|
30
|
+
control: {
|
31
|
+
type: 'number',
|
32
|
+
},
|
33
|
+
},
|
34
|
+
view: {
|
35
|
+
options: views,
|
36
|
+
control: {
|
37
|
+
type: 'select',
|
38
|
+
},
|
39
|
+
},
|
40
|
+
size: {
|
41
|
+
options: sizes,
|
42
|
+
control: {
|
43
|
+
type: 'inline-radio',
|
44
|
+
},
|
45
|
+
},
|
46
|
+
shape: {
|
47
|
+
options: shapes,
|
48
|
+
control: {
|
49
|
+
type: 'inline-radio',
|
50
|
+
},
|
51
|
+
},
|
52
|
+
inputBackgroundType: {
|
53
|
+
options: inputBackgroundTypes,
|
54
|
+
control: {
|
55
|
+
type: 'inline-radio',
|
56
|
+
},
|
57
|
+
},
|
58
|
+
segmentation: {
|
59
|
+
options: segmentation,
|
60
|
+
control: {
|
61
|
+
type: 'select',
|
62
|
+
},
|
63
|
+
},
|
64
|
+
},
|
65
|
+
};
|
66
|
+
|
67
|
+
export default meta;
|
68
|
+
|
69
|
+
type StoryPropsDefault = ComponentProps<typeof NumberInput>;
|
70
|
+
|
71
|
+
const StoryDefault = (args: StoryPropsDefault) => {
|
72
|
+
const [value, setValue] = useState(5);
|
73
|
+
|
74
|
+
const handleChange = (_: any, newValue: number) => {
|
75
|
+
setValue(newValue);
|
76
|
+
onChange(newValue);
|
77
|
+
};
|
78
|
+
|
79
|
+
return (
|
80
|
+
<NumberInput
|
81
|
+
{...args}
|
82
|
+
value={value}
|
83
|
+
onChange={handleChange}
|
84
|
+
onDecrement={onDecrement}
|
85
|
+
onIncrement={onIncrement}
|
86
|
+
/>
|
87
|
+
);
|
88
|
+
};
|
89
|
+
|
90
|
+
export const Default: StoryObj<StoryPropsDefault> = {
|
91
|
+
args: {
|
92
|
+
view: 'default',
|
93
|
+
size: 'l',
|
94
|
+
shape: 'cornered',
|
95
|
+
inputBackgroundType: 'fill',
|
96
|
+
segmentation: 'default',
|
97
|
+
clear: false,
|
98
|
+
min: 0,
|
99
|
+
max: 9,
|
100
|
+
step: 1,
|
101
|
+
width: 188,
|
102
|
+
isManualInput: false,
|
103
|
+
textBefore: '',
|
104
|
+
textAfter: '',
|
105
|
+
isLoading: false,
|
106
|
+
disabled: false,
|
107
|
+
},
|
108
|
+
render: StoryDefault,
|
109
|
+
};
|
@@ -68,10 +68,6 @@ const meta: Meta<StorySelectProps> = {
|
|
68
68
|
control: { type: 'boolean' },
|
69
69
|
if: { arg: 'alwaysOpened', truthy: false },
|
70
70
|
},
|
71
|
-
targetAmount: {
|
72
|
-
control: { type: 'number' },
|
73
|
-
if: { arg: 'isTargetAmount', truthy: true },
|
74
|
-
},
|
75
71
|
},
|
76
72
|
args: {
|
77
73
|
label: 'Label',
|
@@ -82,7 +78,6 @@ const meta: Meta<StorySelectProps> = {
|
|
82
78
|
view: 'default',
|
83
79
|
enableContentLeft: false,
|
84
80
|
isTargetAmount: false,
|
85
|
-
targetAmount: undefined,
|
86
81
|
variant: 'normal',
|
87
82
|
alwaysOpened: false,
|
88
83
|
disabled: false,
|
@@ -99,7 +94,6 @@ const meta: Meta<StorySelectProps> = {
|
|
99
94
|
'placeholder',
|
100
95
|
'helperText',
|
101
96
|
'isTargetAmount',
|
102
|
-
'targetAmount',
|
103
97
|
'closeAfterSelect',
|
104
98
|
'alwaysOpened',
|
105
99
|
'variant',
|
@@ -0,0 +1,42 @@
|
|
1
|
+
import { css } from 'styled-components';
|
2
|
+
import { numberInputTokens as tokens } from '../../../../components/NumberInput';
|
3
|
+
export var config = {
|
4
|
+
defaults: {
|
5
|
+
view: 'default',
|
6
|
+
size: 'l',
|
7
|
+
shape: 'cornered',
|
8
|
+
inputBackgroundType: 'fill'
|
9
|
+
},
|
10
|
+
variations: {
|
11
|
+
view: {
|
12
|
+
"default": /*#__PURE__*/css(["", ":var(--text-accent);", ":var(--text-negative);", ":var(--text-primary);", ":var(--inverse-text-primary);", ":var(--text-tertiary);", ":var(--on-dark-text-tertiary);", ":var(--surface-accent);", ":var(--surface-accent);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-hover);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-active);", ":0.4;", ":inherit;", ":inherit;"], tokens.caretColor, tokens.errorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.borderColorFocus, tokens.borderColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid),
|
13
|
+
secondary: /*#__PURE__*/css(["", ":var(--text-accent);", ":var(--text-negative);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--surface-accent);", ":var(--surface-accent);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);", ":0.4;", ":inherit;", ":inherit;"], tokens.caretColor, tokens.errorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.borderColorFocus, tokens.borderColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid),
|
14
|
+
accent: /*#__PURE__*/css(["", ":var(--text-accent);", ":var(--inverse-text-primary);", ":var(--text-negative);", ":var(--text-primary);", ":var(--inverse-text-primary);", ":var(--text-tertiary);", ":var(--on-dark-text-tertiary);", ":var(--surface-accent);", ":var(--light-background-primary);", ":var(--surface-accent);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--inverse-text-primary);", ":var(--surface-accent-hover);", ":var(--inverse-text-primary);", ":var(--surface-accent-active);", ":0.4;", ":inherit;", ":inherit;"], tokens.caretColor, tokens.caretColorSolid, tokens.errorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.borderColorFocus, tokens.borderColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid)
|
15
|
+
},
|
16
|
+
size: {
|
17
|
+
l: /*#__PURE__*/css(["", ":11.75rem;", ":3.5rem;", ":3.5rem;", ":1.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.875rem;", ":0.375rem;", ":0 0.125rem;", ":0.875rem;", ":3.5rem;", ":0.063rem;", ":1.063rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.inputWrapperBorderWidth, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
|
18
|
+
m: /*#__PURE__*/css(["", ":10.25rem;", ":3rem;", ":3rem;", ":1.25rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.75rem;", ":0.25rem;", ":0 0.125rem;", ":0.75rem;", ":3rem;", ":0.063rem;", ":0.875rem 1rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.inputWrapperBorderWidth, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
|
19
|
+
s: /*#__PURE__*/css(["", ":8.75rem;", ":2.5rem;", ":2.5rem;", ":1rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.625rem;", ":0.25rem;", ":0 0.125rem;", ":0.625rem;", ":2.5rem;", ":0.063rem;", ":0.688rem 0.875rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.inputWrapperBorderWidth, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
|
20
|
+
xs: /*#__PURE__*/css(["", ":6.875rem;", ":2rem;", ":2rem;", ":0.75rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.5rem;", ":0.125rem;", ":0 0.125rem;", ":0.5rem;", ":2rem;", ":0.063rem;", ":0.563rem 0.625rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.25rem;", ":0.25rem;", ":1rem;"], tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.inputWrapperBorderWidth, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize)
|
21
|
+
},
|
22
|
+
shape: {
|
23
|
+
cornered: /*#__PURE__*/css([""]),
|
24
|
+
pilled: /*#__PURE__*/css(["", ":50%;"], tokens.iconButtonRadius)
|
25
|
+
},
|
26
|
+
inputBackgroundType: {
|
27
|
+
fill: /*#__PURE__*/css(["", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);"], tokens.borderColor, tokens.borderColorHover),
|
28
|
+
clear: /*#__PURE__*/css(["", ":transparent;", ":transparent;"], tokens.borderColor, tokens.borderColorHover)
|
29
|
+
},
|
30
|
+
segmentation: {
|
31
|
+
"default": /*#__PURE__*/css([""]),
|
32
|
+
segmented: /*#__PURE__*/css([""]),
|
33
|
+
solid: /*#__PURE__*/css(["", ":0;"], tokens.iconButtonSegmentationRadius)
|
34
|
+
},
|
35
|
+
clear: {
|
36
|
+
"true": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-tertiary);"], tokens.colorClear, tokens.iconButtonColorClear, tokens.additionalTextColorClear)
|
37
|
+
},
|
38
|
+
disabled: {
|
39
|
+
"true": /*#__PURE__*/css(["", ":0.4;"], tokens.disabledOpacity)
|
40
|
+
}
|
41
|
+
}
|
42
|
+
};
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import { numberInputConfig } from '../../../../components/NumberInput';
|
2
|
+
import { component, mergeConfig } from '../../../../engines';
|
3
|
+
import { config } from './NumberInput.config';
|
4
|
+
var mergedConfig = /*#__PURE__*/mergeConfig(numberInputConfig, config);
|
5
|
+
export var NumberInput = /*#__PURE__*/component(mergedConfig);
|
package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx
ADDED
@@ -0,0 +1,109 @@
|
|
1
|
+
import React, { ComponentProps, useState } from 'react';
|
2
|
+
import type { StoryObj, Meta } from '@storybook/react';
|
3
|
+
import { action } from '@storybook/addon-actions';
|
4
|
+
|
5
|
+
import { WithTheme } from '../../../_helpers';
|
6
|
+
|
7
|
+
import { NumberInput } from './NumberInput';
|
8
|
+
|
9
|
+
const onChange = action('onChange');
|
10
|
+
const onDecrement = action('onDecrement');
|
11
|
+
const onIncrement = action('onIncrement');
|
12
|
+
|
13
|
+
const views = ['default', 'secondary', 'accent'];
|
14
|
+
const sizes = ['l', 'm', 's', 'xs'];
|
15
|
+
const shapes = ['cornered', 'pilled'];
|
16
|
+
const inputBackgroundTypes = ['fill', 'clear'];
|
17
|
+
const segmentation = ['default', 'segmented', 'solid'];
|
18
|
+
|
19
|
+
const meta: Meta<typeof NumberInput> = {
|
20
|
+
title: 'plasma_web/NumberInput',
|
21
|
+
component: NumberInput,
|
22
|
+
decorators: [WithTheme],
|
23
|
+
argTypes: {
|
24
|
+
min: {
|
25
|
+
control: {
|
26
|
+
type: 'number',
|
27
|
+
},
|
28
|
+
},
|
29
|
+
max: {
|
30
|
+
control: {
|
31
|
+
type: 'number',
|
32
|
+
},
|
33
|
+
},
|
34
|
+
view: {
|
35
|
+
options: views,
|
36
|
+
control: {
|
37
|
+
type: 'select',
|
38
|
+
},
|
39
|
+
},
|
40
|
+
size: {
|
41
|
+
options: sizes,
|
42
|
+
control: {
|
43
|
+
type: 'inline-radio',
|
44
|
+
},
|
45
|
+
},
|
46
|
+
shape: {
|
47
|
+
options: shapes,
|
48
|
+
control: {
|
49
|
+
type: 'inline-radio',
|
50
|
+
},
|
51
|
+
},
|
52
|
+
inputBackgroundType: {
|
53
|
+
options: inputBackgroundTypes,
|
54
|
+
control: {
|
55
|
+
type: 'inline-radio',
|
56
|
+
},
|
57
|
+
},
|
58
|
+
segmentation: {
|
59
|
+
options: segmentation,
|
60
|
+
control: {
|
61
|
+
type: 'select',
|
62
|
+
},
|
63
|
+
},
|
64
|
+
},
|
65
|
+
};
|
66
|
+
|
67
|
+
export default meta;
|
68
|
+
|
69
|
+
type StoryPropsDefault = ComponentProps<typeof NumberInput>;
|
70
|
+
|
71
|
+
const StoryDefault = (args: StoryPropsDefault) => {
|
72
|
+
const [value, setValue] = useState(5);
|
73
|
+
|
74
|
+
const handleChange = (_: any, newValue: number) => {
|
75
|
+
setValue(newValue);
|
76
|
+
onChange(newValue);
|
77
|
+
};
|
78
|
+
|
79
|
+
return (
|
80
|
+
<NumberInput
|
81
|
+
{...args}
|
82
|
+
value={value}
|
83
|
+
onChange={handleChange}
|
84
|
+
onDecrement={onDecrement}
|
85
|
+
onIncrement={onIncrement}
|
86
|
+
/>
|
87
|
+
);
|
88
|
+
};
|
89
|
+
|
90
|
+
export const Default: StoryObj<StoryPropsDefault> = {
|
91
|
+
args: {
|
92
|
+
view: 'default',
|
93
|
+
size: 'l',
|
94
|
+
shape: 'cornered',
|
95
|
+
inputBackgroundType: 'fill',
|
96
|
+
segmentation: 'default',
|
97
|
+
clear: false,
|
98
|
+
min: 0,
|
99
|
+
max: 9,
|
100
|
+
step: 1,
|
101
|
+
width: 188,
|
102
|
+
isManualInput: false,
|
103
|
+
textBefore: '',
|
104
|
+
textAfter: '',
|
105
|
+
isLoading: false,
|
106
|
+
disabled: false,
|
107
|
+
},
|
108
|
+
render: StoryDefault,
|
109
|
+
};
|
@@ -60,4 +60,5 @@ export * from './components/Autocomplete';
|
|
60
60
|
export * from './components/EmptyState';
|
61
61
|
export * from './components/Editable';
|
62
62
|
export * from './components/Mask';
|
63
|
-
export * from './components/Attach';
|
63
|
+
export * from './components/Attach';
|
64
|
+
export * from './components/NumberInput';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4F,MAAM,OAAO,CAAC;AAIjH,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;
|
1
|
+
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4F,MAAM,OAAO,CAAC;AAIjH,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAoB7C,OAAO,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKnE,eAAO,MAAM,OAAO,4BAAgD,CAAC;AAErE;;GAEG;AACH,eAAO,MAAM,YAAY,SAAU,UAAU,gBAAgB,EAAE,KAAK,aAAa,EAAE,OAAO,CAAC,CAAC,+IAuYtF,CAAC;AAEP,eAAO,MAAM,cAAc;;;mBAzYQ,UAAU,gBAAgB,EAAE,KAAK,aAAa,EAAE,OAAO,CAAC,CAAC;;;;;;;;;;;;;;;;;;CA8Z3F,CAAC"}
|
@@ -4,7 +4,7 @@ import { FocusedPathState } from './reducers';
|
|
4
4
|
import { ItemOption, ItemOptionTransformed } from './ui/Inner/ui/Item/Item.types';
|
5
5
|
import type { ValueToCheckedMapType, ValueToItemMapType } from './hooks/getPathMaps';
|
6
6
|
declare type Placement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
|
7
|
-
declare type IsMultiselect
|
7
|
+
declare type IsMultiselect = {
|
8
8
|
multiple?: false;
|
9
9
|
value?: string;
|
10
10
|
onChange?: (value: string) => void;
|
@@ -13,22 +13,11 @@ declare type IsMultiselect<T extends ItemOption = ItemOption> = {
|
|
13
13
|
* @default false
|
14
14
|
*/
|
15
15
|
isTargetAmount?: never | false;
|
16
|
-
/**
|
17
|
-
* Ручная настройка количества выбранных элементов. Только при isTargetAmount === true.
|
18
|
-
* @default undefined
|
19
|
-
*/
|
20
|
-
targetAmount?: never;
|
21
|
-
renderValue?: never;
|
22
16
|
} | {
|
23
17
|
multiple: true;
|
24
18
|
value?: Array<string>;
|
25
19
|
onChange?: (value: Array<string>) => void;
|
26
|
-
isTargetAmount?:
|
27
|
-
targetAmount?: number;
|
28
|
-
/**
|
29
|
-
* Callback для кастомной настройки значения в селекте.
|
30
|
-
*/
|
31
|
-
renderValue?: (item: T) => string;
|
20
|
+
isTargetAmount?: boolean;
|
32
21
|
};
|
33
22
|
declare type ViewStateProps = {
|
34
23
|
/**
|
@@ -153,7 +142,7 @@ export declare type ComboboxProps<T extends ItemOption = ItemOption> = {
|
|
153
142
|
* @default outer
|
154
143
|
*/
|
155
144
|
labelPlacement?: 'outer' | 'inner';
|
156
|
-
} & ViewStateProps & IsMultiselect
|
145
|
+
} & ViewStateProps & IsMultiselect & Omit<ButtonHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'>;
|
157
146
|
export declare type FloatingPopoverProps = {
|
158
147
|
target: React.ReactNode | ((ref: React.MutableRefObject<HTMLElement | null>) => React.ReactNode);
|
159
148
|
children: React.ReactNode;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAClF,OAAO,KAAK,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAErF,aAAK,SAAS,GACR,KAAK,GACL,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,WAAW,GACX,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,MAAM,GACN,YAAY,GACZ,UAAU,CAAC;AAEjB,aAAK,aAAa,
|
1
|
+
{"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.types.ts"],"names":[],"mappings":"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"}
|
@@ -5,5 +5,4 @@ export { updateSingleAncestors } from './updateSingleAncestors';
|
|
5
5
|
export { sizeToIconSize } from './sizeToIconSize';
|
6
6
|
export { filterItems } from './filterItems';
|
7
7
|
export { getItemId } from './getItemId';
|
8
|
-
export { getInitialValue } from './getInitialValue';
|
9
8
|
//# sourceMappingURL=index.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ComboboxNew/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ComboboxNew/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"initialItemsTransform.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ComboboxNew/utils/initialItemsTransform.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;
|
1
|
+
{"version":3,"file":"initialItemsTransform.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ComboboxNew/utils/initialItemsTransform.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAIvE,eAAO,MAAM,qBAAqB,UACvB,MAAM,qBAAqB,CAAC,iDAEpC,MAAM,qBAAqB,CAU7B,CAAC"}
|
@@ -0,0 +1,42 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import type { RootProps } from '../../engines';
|
3
|
+
import type { NumberInputProps, NumberInputRootProps } from './NumberInput.types';
|
4
|
+
export declare const numberInputRoot: (Root: RootProps<HTMLDivElement, NumberInputRootProps>) => React.ForwardRefExoticComponent<NumberInputProps & React.RefAttributes<HTMLInputElement>>;
|
5
|
+
export declare const numberInputConfig: {
|
6
|
+
name: string;
|
7
|
+
tag: string;
|
8
|
+
layout: (Root: RootProps<HTMLDivElement, NumberInputRootProps>) => React.ForwardRefExoticComponent<NumberInputProps & React.RefAttributes<HTMLInputElement>>;
|
9
|
+
base: import("@linaria/core").LinariaClassName;
|
10
|
+
variations: {
|
11
|
+
view: {
|
12
|
+
css: import("@linaria/core").LinariaClassName;
|
13
|
+
};
|
14
|
+
size: {
|
15
|
+
css: import("@linaria/core").LinariaClassName;
|
16
|
+
};
|
17
|
+
shape: {
|
18
|
+
css: import("@linaria/core").LinariaClassName;
|
19
|
+
};
|
20
|
+
inputBackgroundType: {
|
21
|
+
css: import("@linaria/core").LinariaClassName;
|
22
|
+
};
|
23
|
+
segmentation: {
|
24
|
+
css: import("@linaria/core").LinariaClassName;
|
25
|
+
};
|
26
|
+
clear: {
|
27
|
+
css: import("@linaria/core").LinariaClassName;
|
28
|
+
attrs: boolean;
|
29
|
+
};
|
30
|
+
disabled: {
|
31
|
+
css: import("@linaria/core").LinariaClassName;
|
32
|
+
attrs: boolean;
|
33
|
+
};
|
34
|
+
};
|
35
|
+
defaults: {
|
36
|
+
view: string;
|
37
|
+
size: string;
|
38
|
+
shape: string;
|
39
|
+
segmentation: string;
|
40
|
+
};
|
41
|
+
};
|
42
|
+
//# sourceMappingURL=NumberInput.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../src/components/NumberInput/NumberInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8C,MAAM,OAAO,CAAC;AAEnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAI/C,OAAO,KAAK,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAYlF,eAAO,MAAM,eAAe,SAAU,UAAU,cAAc,EAAE,oBAAoB,CAAC,8FAuJhF,CAAC;AAEN,eAAO,MAAM,iBAAiB;;;mBAzJQ,UAAU,cAAc,EAAE,oBAAoB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6LpF,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"NumberInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/NumberInput/NumberInput.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,0CAGhB,CAAC"}
|