@salutejs/plasma-new-hope 0.109.1-canary.1301.10056808859.0 → 0.109.1-dev.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Accordion/Accordion.js +1 -1
- package/cjs/components/Accordion/Accordion.js.map +1 -1
- package/cjs/components/Accordion/Accordion.tokens.js +1 -4
- package/cjs/components/Accordion/Accordion.tokens.js.map +1 -1
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js +9 -16
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js.map +1 -1
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +4 -4
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js.map +1 -1
- package/cjs/components/Accordion/utils/index.js +3 -4
- package/cjs/components/Accordion/utils/index.js.map +1 -1
- package/cjs/components/Autocomplete/Autocomplete.css +60 -0
- package/cjs/components/Autocomplete/Autocomplete.js +189 -0
- package/cjs/components/Autocomplete/Autocomplete.js.map +1 -0
- package/cjs/components/Autocomplete/Autocomplete.styles.js +78 -0
- package/cjs/components/Autocomplete/Autocomplete.styles.js.map +1 -0
- package/cjs/components/Autocomplete/Autocomplete.styles_4wbmok.css +5 -0
- package/cjs/components/Autocomplete/Autocomplete.tokens.js +93 -0
- package/cjs/components/Autocomplete/Autocomplete.tokens.js.map +1 -0
- package/cjs/components/Autocomplete/hooks/useKeyboardNavigation.js +112 -0
- package/cjs/components/Autocomplete/hooks/useKeyboardNavigation.js.map +1 -0
- package/cjs/components/Autocomplete/reducers/focusedReducer.js +47 -0
- package/cjs/components/Autocomplete/reducers/focusedReducer.js.map +1 -0
- package/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.css +2 -0
- package/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.js +41 -0
- package/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.js.map +1 -0
- package/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js +21 -0
- package/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js.map +1 -0
- package/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles_lpdinw.css +2 -0
- package/cjs/components/Autocomplete/ui/TextField/TextField.styles.js +23 -0
- package/cjs/components/Autocomplete/ui/TextField/TextField.styles.js.map +1 -0
- package/cjs/components/Autocomplete/ui/TextField/TextField.styles_sx1sq7.css +1 -0
- package/cjs/components/EmptyState/EmptyState.css +30 -0
- package/cjs/components/EmptyState/EmptyState.js +39 -0
- package/cjs/components/EmptyState/EmptyState.js.map +1 -0
- package/cjs/components/EmptyState/EmptyState.styles.js +41 -0
- package/cjs/components/EmptyState/EmptyState.styles.js.map +1 -0
- package/cjs/components/EmptyState/EmptyState.styles_1o24i5h.css +4 -0
- package/cjs/components/EmptyState/EmptyState.tokens.js +21 -0
- package/cjs/components/EmptyState/EmptyState.tokens.js.map +1 -0
- package/cjs/components/TextField/TextField.js +2 -2
- package/cjs/components/TextField/TextField.js.map +1 -1
- package/cjs/hooks/useOutsideClick.js +26 -0
- package/cjs/hooks/useOutsideClick.js.map +1 -0
- package/cjs/index.css +16 -0
- package/cjs/index.js +12 -0
- package/cjs/index.js.map +1 -1
- package/emotion/cjs/components/Accordion/Accordion.js +1 -1
- package/emotion/cjs/components/Accordion/Accordion.tokens.js +1 -4
- package/emotion/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js +7 -19
- package/emotion/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +4 -4
- package/emotion/cjs/components/Accordion/utils/index.js +3 -4
- package/emotion/cjs/components/Autocomplete/Autocomplete.js +193 -0
- package/emotion/cjs/components/Autocomplete/Autocomplete.styles.js +43 -0
- package/emotion/cjs/components/Autocomplete/Autocomplete.tokens.js +91 -0
- package/emotion/cjs/components/Autocomplete/Autocomplete.types.js +5 -0
- package/emotion/cjs/components/Autocomplete/hooks/useKeyboardNavigation.js +114 -0
- package/emotion/cjs/components/Autocomplete/index.js +25 -0
- package/emotion/cjs/components/Autocomplete/reducers/focusedReducer.js +46 -0
- package/emotion/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.js +42 -0
- package/emotion/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js +25 -0
- package/emotion/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.type.js +5 -0
- package/emotion/cjs/components/Autocomplete/ui/TextField/TextField.js +12 -0
- package/emotion/cjs/components/Autocomplete/ui/TextField/TextField.styles.js +17 -0
- package/emotion/cjs/components/Autocomplete/ui/index.js +27 -0
- package/emotion/cjs/components/EmptyState/EmptyState.js +39 -0
- package/emotion/cjs/components/EmptyState/EmptyState.styles.js +29 -0
- package/emotion/cjs/components/EmptyState/EmptyState.tokens.js +20 -0
- package/emotion/cjs/components/EmptyState/EmptyState.types.js +5 -0
- package/emotion/cjs/components/EmptyState/index.js +25 -0
- package/emotion/cjs/components/TextField/TextField.js +3 -3
- package/emotion/cjs/examples/plasma_b2c/components/Accordion/Accordion.config.js +6 -6
- package/emotion/cjs/examples/plasma_b2c/components/Accordion/Accordion.stories.tsx +3 -5
- package/emotion/cjs/examples/plasma_b2c/components/Autocomplete/Autocomplete.config.js +39 -0
- package/emotion/cjs/examples/plasma_b2c/components/Autocomplete/Autocomplete.js +11 -0
- package/emotion/cjs/examples/plasma_b2c/components/Autocomplete/Autocomplete.stories.tsx +134 -0
- package/emotion/cjs/examples/plasma_b2c/components/Dropdown/Dropdown.config.js +5 -5
- package/emotion/cjs/examples/plasma_b2c/components/EmptyState/EmptyState.config.js +21 -0
- package/emotion/cjs/examples/plasma_b2c/components/EmptyState/EmptyState.js +11 -0
- package/emotion/cjs/examples/plasma_b2c/components/EmptyState/EmptyState.stories.tsx +44 -0
- package/emotion/cjs/examples/plasma_b2c/components/Overlay/Overlay.stories.tsx +1 -1
- package/emotion/cjs/examples/plasma_web/components/Accordion/Accordion.config.js +8 -8
- package/emotion/cjs/examples/plasma_web/components/Accordion/Accordion.stories.tsx +4 -6
- package/emotion/cjs/examples/plasma_web/components/Autocomplete/Autocomplete.config.js +39 -0
- package/emotion/cjs/examples/plasma_web/components/Autocomplete/Autocomplete.js +11 -0
- package/emotion/cjs/examples/plasma_web/components/Autocomplete/Autocomplete.stories.tsx +134 -0
- package/emotion/cjs/examples/plasma_web/components/Dropdown/Dropdown.config.js +5 -5
- package/emotion/cjs/examples/plasma_web/components/EmptyState/EmptyState.config.js +21 -0
- package/emotion/cjs/examples/plasma_web/components/EmptyState/EmptyState.js +11 -0
- package/emotion/cjs/examples/plasma_web/components/EmptyState/EmptyState.stories.tsx +44 -0
- package/emotion/cjs/examples/plasma_web/components/Overlay/Overlay.stories.tsx +1 -1
- package/emotion/cjs/examples/sds_engineer/components/Overlay/Overlay.stories.tsx +1 -1
- package/emotion/cjs/hooks/index.js +7 -0
- package/emotion/cjs/hooks/useOutsideClick.js +24 -0
- package/emotion/cjs/index.js +22 -0
- package/emotion/es/components/Accordion/Accordion.js +1 -1
- package/emotion/es/components/Accordion/Accordion.tokens.js +1 -4
- package/emotion/es/components/Accordion/ui/AccordionItem/AccordionItem.js +7 -20
- package/emotion/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +4 -4
- package/emotion/es/components/Accordion/utils/index.js +3 -4
- package/emotion/es/components/Autocomplete/Autocomplete.js +185 -0
- package/emotion/es/components/Autocomplete/Autocomplete.styles.js +36 -0
- package/emotion/es/components/Autocomplete/Autocomplete.tokens.js +85 -0
- package/emotion/es/components/Autocomplete/Autocomplete.types.js +1 -0
- package/emotion/es/components/Autocomplete/hooks/useKeyboardNavigation.js +108 -0
- package/emotion/es/components/Autocomplete/index.js +2 -0
- package/emotion/es/components/Autocomplete/reducers/focusedReducer.js +40 -0
- package/emotion/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.js +33 -0
- package/emotion/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js +18 -0
- package/emotion/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.type.js +1 -0
- package/emotion/es/components/Autocomplete/ui/TextField/TextField.js +1 -0
- package/emotion/es/components/Autocomplete/ui/TextField/TextField.styles.js +10 -0
- package/emotion/es/components/Autocomplete/ui/index.js +2 -0
- package/emotion/es/components/EmptyState/EmptyState.js +31 -0
- package/emotion/es/components/EmptyState/EmptyState.styles.js +22 -0
- package/emotion/es/components/EmptyState/EmptyState.tokens.js +14 -0
- package/emotion/es/components/EmptyState/EmptyState.types.js +1 -0
- package/emotion/es/components/EmptyState/index.js +2 -0
- package/emotion/es/components/TextField/TextField.js +3 -3
- package/emotion/es/examples/plasma_b2c/components/Accordion/Accordion.config.js +6 -6
- package/emotion/es/examples/plasma_b2c/components/Accordion/Accordion.stories.tsx +3 -5
- package/emotion/es/examples/plasma_b2c/components/Autocomplete/Autocomplete.config.js +33 -0
- package/emotion/es/examples/plasma_b2c/components/Autocomplete/Autocomplete.js +5 -0
- package/emotion/es/examples/plasma_b2c/components/Autocomplete/Autocomplete.stories.tsx +134 -0
- package/emotion/es/examples/plasma_b2c/components/Dropdown/Dropdown.config.js +5 -5
- package/emotion/es/examples/plasma_b2c/components/EmptyState/EmptyState.config.js +15 -0
- package/emotion/es/examples/plasma_b2c/components/EmptyState/EmptyState.js +5 -0
- package/emotion/es/examples/plasma_b2c/components/EmptyState/EmptyState.stories.tsx +44 -0
- package/emotion/es/examples/plasma_b2c/components/Overlay/Overlay.stories.tsx +1 -1
- package/emotion/es/examples/plasma_web/components/Accordion/Accordion.config.js +8 -8
- package/emotion/es/examples/plasma_web/components/Accordion/Accordion.stories.tsx +4 -6
- package/emotion/es/examples/plasma_web/components/Autocomplete/Autocomplete.config.js +33 -0
- package/emotion/es/examples/plasma_web/components/Autocomplete/Autocomplete.js +5 -0
- package/emotion/es/examples/plasma_web/components/Autocomplete/Autocomplete.stories.tsx +134 -0
- package/emotion/es/examples/plasma_web/components/Dropdown/Dropdown.config.js +5 -5
- package/emotion/es/examples/plasma_web/components/EmptyState/EmptyState.config.js +15 -0
- package/emotion/es/examples/plasma_web/components/EmptyState/EmptyState.js +5 -0
- package/emotion/es/examples/plasma_web/components/EmptyState/EmptyState.stories.tsx +44 -0
- package/emotion/es/examples/plasma_web/components/Overlay/Overlay.stories.tsx +1 -1
- package/emotion/es/examples/sds_engineer/components/Overlay/Overlay.stories.tsx +1 -1
- package/emotion/es/hooks/index.js +1 -0
- package/emotion/es/hooks/useOutsideClick.js +18 -0
- package/emotion/es/index.js +3 -1
- package/es/components/Accordion/Accordion.js +1 -1
- package/es/components/Accordion/Accordion.js.map +1 -1
- package/es/components/Accordion/Accordion.tokens.js +1 -4
- package/es/components/Accordion/Accordion.tokens.js.map +1 -1
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.js +8 -15
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.js.map +1 -1
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +4 -4
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js.map +1 -1
- package/es/components/Accordion/utils/index.js +3 -4
- package/es/components/Accordion/utils/index.js.map +1 -1
- package/es/components/Autocomplete/Autocomplete.css +60 -0
- package/es/components/Autocomplete/Autocomplete.js +184 -0
- package/es/components/Autocomplete/Autocomplete.js.map +1 -0
- package/es/components/Autocomplete/Autocomplete.styles.js +70 -0
- package/es/components/Autocomplete/Autocomplete.styles.js.map +1 -0
- package/es/components/Autocomplete/Autocomplete.styles_4wbmok.css +5 -0
- package/es/components/Autocomplete/Autocomplete.tokens.js +88 -0
- package/es/components/Autocomplete/Autocomplete.tokens.js.map +1 -0
- package/es/components/Autocomplete/hooks/useKeyboardNavigation.js +107 -0
- package/es/components/Autocomplete/hooks/useKeyboardNavigation.js.map +1 -0
- package/es/components/Autocomplete/reducers/focusedReducer.js +43 -0
- package/es/components/Autocomplete/reducers/focusedReducer.js.map +1 -0
- package/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.css +2 -0
- package/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.js +37 -0
- package/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.js.map +1 -0
- package/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js +16 -0
- package/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js.map +1 -0
- package/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles_lpdinw.css +2 -0
- package/es/components/Autocomplete/ui/TextField/TextField.styles.js +19 -0
- package/es/components/Autocomplete/ui/TextField/TextField.styles.js.map +1 -0
- package/es/components/Autocomplete/ui/TextField/TextField.styles_sx1sq7.css +1 -0
- package/es/components/EmptyState/EmptyState.css +30 -0
- package/es/components/EmptyState/EmptyState.js +34 -0
- package/es/components/EmptyState/EmptyState.js.map +1 -0
- package/es/components/EmptyState/EmptyState.styles.js +34 -0
- package/es/components/EmptyState/EmptyState.styles.js.map +1 -0
- package/es/components/EmptyState/EmptyState.styles_1o24i5h.css +4 -0
- package/es/components/EmptyState/EmptyState.tokens.js +17 -0
- package/es/components/EmptyState/EmptyState.tokens.js.map +1 -0
- package/es/components/TextField/TextField.js +2 -2
- package/es/components/TextField/TextField.js.map +1 -1
- package/es/hooks/useOutsideClick.js +22 -0
- package/es/hooks/useOutsideClick.js.map +1 -0
- package/es/index.css +16 -0
- package/es/index.js +5 -0
- package/es/index.js.map +1 -1
- package/package.json +2 -2
- package/styled-components/cjs/components/Accordion/Accordion.js +1 -1
- package/styled-components/cjs/components/Accordion/Accordion.tokens.js +1 -4
- package/styled-components/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js +7 -19
- package/styled-components/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +4 -4
- package/styled-components/cjs/components/Accordion/utils/index.js +3 -4
- package/styled-components/cjs/components/Autocomplete/Autocomplete.js +193 -0
- package/styled-components/cjs/components/Autocomplete/Autocomplete.styles.js +40 -0
- package/styled-components/cjs/components/Autocomplete/Autocomplete.tokens.js +91 -0
- package/styled-components/cjs/components/Autocomplete/Autocomplete.types.js +5 -0
- package/styled-components/cjs/components/Autocomplete/hooks/useKeyboardNavigation.js +114 -0
- package/styled-components/cjs/components/Autocomplete/index.js +25 -0
- package/styled-components/cjs/components/Autocomplete/reducers/focusedReducer.js +46 -0
- package/styled-components/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.js +42 -0
- package/styled-components/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js +23 -0
- package/styled-components/cjs/components/Autocomplete/ui/SuggestionItem/SuggestionItem.type.js +5 -0
- package/styled-components/cjs/components/Autocomplete/ui/TextField/TextField.js +12 -0
- package/styled-components/cjs/components/Autocomplete/ui/TextField/TextField.styles.js +16 -0
- package/styled-components/cjs/components/Autocomplete/ui/index.js +27 -0
- package/styled-components/cjs/components/EmptyState/EmptyState.js +39 -0
- package/styled-components/cjs/components/EmptyState/EmptyState.styles.js +25 -0
- package/styled-components/cjs/components/EmptyState/EmptyState.tokens.js +20 -0
- package/styled-components/cjs/components/EmptyState/EmptyState.types.js +5 -0
- package/styled-components/cjs/components/EmptyState/index.js +25 -0
- package/styled-components/cjs/components/TextField/TextField.js +2 -2
- package/styled-components/cjs/examples/plasma_b2c/components/Accordion/Accordion.config.js +2 -2
- package/styled-components/cjs/examples/plasma_b2c/components/Accordion/Accordion.stories.tsx +3 -5
- package/styled-components/cjs/examples/plasma_b2c/components/Autocomplete/Autocomplete.config.js +39 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Autocomplete/Autocomplete.js +11 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Autocomplete/Autocomplete.stories.tsx +134 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Dropdown/Dropdown.config.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/EmptyState/EmptyState.config.js +21 -0
- package/styled-components/cjs/examples/plasma_b2c/components/EmptyState/EmptyState.js +11 -0
- package/styled-components/cjs/examples/plasma_b2c/components/EmptyState/EmptyState.stories.tsx +44 -0
- package/styled-components/cjs/examples/plasma_web/components/Accordion/Accordion.config.js +2 -2
- package/styled-components/cjs/examples/plasma_web/components/Accordion/Accordion.stories.tsx +4 -6
- package/styled-components/cjs/examples/plasma_web/components/Autocomplete/Autocomplete.config.js +39 -0
- package/styled-components/cjs/examples/plasma_web/components/Autocomplete/Autocomplete.js +11 -0
- package/styled-components/cjs/examples/plasma_web/components/Autocomplete/Autocomplete.stories.tsx +134 -0
- package/styled-components/cjs/examples/plasma_web/components/Dropdown/Dropdown.config.js +1 -1
- package/styled-components/cjs/examples/plasma_web/components/EmptyState/EmptyState.config.js +21 -0
- package/styled-components/cjs/examples/plasma_web/components/EmptyState/EmptyState.js +11 -0
- package/styled-components/cjs/examples/plasma_web/components/EmptyState/EmptyState.stories.tsx +44 -0
- package/styled-components/cjs/hooks/index.js +7 -0
- package/styled-components/cjs/hooks/useOutsideClick.js +24 -0
- package/styled-components/cjs/index.js +22 -0
- package/styled-components/es/components/Accordion/Accordion.js +1 -1
- package/styled-components/es/components/Accordion/Accordion.tokens.js +1 -4
- package/styled-components/es/components/Accordion/ui/AccordionItem/AccordionItem.js +7 -20
- package/styled-components/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +4 -4
- package/styled-components/es/components/Accordion/utils/index.js +3 -4
- package/styled-components/es/components/Autocomplete/Autocomplete.js +185 -0
- package/styled-components/es/components/Autocomplete/Autocomplete.styles.js +32 -0
- package/styled-components/es/components/Autocomplete/Autocomplete.tokens.js +85 -0
- package/styled-components/es/components/Autocomplete/Autocomplete.types.js +1 -0
- package/styled-components/es/components/Autocomplete/hooks/useKeyboardNavigation.js +108 -0
- package/styled-components/es/components/Autocomplete/index.js +2 -0
- package/styled-components/es/components/Autocomplete/reducers/focusedReducer.js +40 -0
- package/styled-components/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.js +33 -0
- package/styled-components/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js +16 -0
- package/styled-components/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.type.js +1 -0
- package/styled-components/es/components/Autocomplete/ui/TextField/TextField.js +1 -0
- package/styled-components/es/components/Autocomplete/ui/TextField/TextField.styles.js +9 -0
- package/styled-components/es/components/Autocomplete/ui/index.js +2 -0
- package/styled-components/es/components/EmptyState/EmptyState.js +31 -0
- package/styled-components/es/components/EmptyState/EmptyState.styles.js +18 -0
- package/styled-components/es/components/EmptyState/EmptyState.tokens.js +14 -0
- package/styled-components/es/components/EmptyState/EmptyState.types.js +1 -0
- package/styled-components/es/components/EmptyState/index.js +2 -0
- package/styled-components/es/components/TextField/TextField.js +2 -2
- package/styled-components/es/examples/plasma_b2c/components/Accordion/Accordion.config.js +2 -2
- package/styled-components/es/examples/plasma_b2c/components/Accordion/Accordion.stories.tsx +3 -5
- package/styled-components/es/examples/plasma_b2c/components/Autocomplete/Autocomplete.config.js +33 -0
- package/styled-components/es/examples/plasma_b2c/components/Autocomplete/Autocomplete.js +5 -0
- package/styled-components/es/examples/plasma_b2c/components/Autocomplete/Autocomplete.stories.tsx +134 -0
- package/styled-components/es/examples/plasma_b2c/components/Dropdown/Dropdown.config.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/EmptyState/EmptyState.config.js +15 -0
- package/styled-components/es/examples/plasma_b2c/components/EmptyState/EmptyState.js +5 -0
- package/styled-components/es/examples/plasma_b2c/components/EmptyState/EmptyState.stories.tsx +44 -0
- package/styled-components/es/examples/plasma_web/components/Accordion/Accordion.config.js +2 -2
- package/styled-components/es/examples/plasma_web/components/Accordion/Accordion.stories.tsx +4 -6
- package/styled-components/es/examples/plasma_web/components/Autocomplete/Autocomplete.config.js +33 -0
- package/styled-components/es/examples/plasma_web/components/Autocomplete/Autocomplete.js +5 -0
- package/styled-components/es/examples/plasma_web/components/Autocomplete/Autocomplete.stories.tsx +134 -0
- package/styled-components/es/examples/plasma_web/components/Dropdown/Dropdown.config.js +1 -1
- package/styled-components/es/examples/plasma_web/components/EmptyState/EmptyState.config.js +15 -0
- package/styled-components/es/examples/plasma_web/components/EmptyState/EmptyState.js +5 -0
- package/styled-components/es/examples/plasma_web/components/EmptyState/EmptyState.stories.tsx +44 -0
- package/styled-components/es/hooks/index.js +1 -0
- package/styled-components/es/hooks/useOutsideClick.js +18 -0
- package/styled-components/es/index.js +3 -1
- package/types/components/Accordion/Accordion.tokens.d.ts +0 -3
- package/types/components/Accordion/Accordion.tokens.d.ts.map +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.d.ts.map +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.styles.d.ts.map +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.types.d.ts +0 -5
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.types.d.ts.map +1 -1
- package/types/components/Accordion/utils/index.d.ts +2 -4
- package/types/components/Accordion/utils/index.d.ts.map +1 -1
- package/types/components/Autocomplete/Autocomplete.d.ts +24 -0
- package/types/components/Autocomplete/Autocomplete.d.ts.map +1 -0
- package/types/components/Autocomplete/Autocomplete.styles.d.ts +19 -0
- package/types/components/Autocomplete/Autocomplete.styles.d.ts.map +1 -0
- package/types/components/Autocomplete/Autocomplete.tokens.d.ts +84 -0
- package/types/components/Autocomplete/Autocomplete.tokens.d.ts.map +1 -0
- package/types/components/Autocomplete/Autocomplete.types.d.ts +84 -0
- package/types/components/Autocomplete/Autocomplete.types.d.ts.map +1 -0
- package/types/components/Autocomplete/hooks/useKeyboardNavigation.d.ts +31 -0
- package/types/components/Autocomplete/hooks/useKeyboardNavigation.d.ts.map +1 -0
- package/types/components/Autocomplete/index.d.ts +3 -0
- package/types/components/Autocomplete/index.d.ts.map +1 -0
- package/types/components/Autocomplete/reducers/focusedReducer.d.ts +17 -0
- package/types/components/Autocomplete/reducers/focusedReducer.d.ts.map +1 -0
- package/types/components/Autocomplete/ui/SuggestionItem/SuggestionItem.d.ts +4 -0
- package/types/components/Autocomplete/ui/SuggestionItem/SuggestionItem.d.ts.map +1 -0
- package/types/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.d.ts +4 -0
- package/types/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.d.ts.map +1 -0
- package/types/components/Autocomplete/ui/SuggestionItem/SuggestionItem.type.d.ts +8 -0
- package/types/components/Autocomplete/ui/SuggestionItem/SuggestionItem.type.d.ts.map +1 -0
- package/types/components/Autocomplete/ui/TextField/TextField.d.ts +2 -0
- package/types/components/Autocomplete/ui/TextField/TextField.d.ts.map +1 -0
- package/types/components/Autocomplete/ui/TextField/TextField.styles.d.ts +41 -0
- package/types/components/Autocomplete/ui/TextField/TextField.styles.d.ts.map +1 -0
- package/types/components/Autocomplete/ui/index.d.ts +3 -0
- package/types/components/Autocomplete/ui/index.d.ts.map +1 -0
- package/types/components/EmptyState/EmptyState.d.ts +18 -0
- package/types/components/EmptyState/EmptyState.d.ts.map +1 -0
- package/types/components/EmptyState/EmptyState.styles.d.ts +48 -0
- package/types/components/EmptyState/EmptyState.styles.d.ts.map +1 -0
- package/types/components/EmptyState/EmptyState.tokens.d.ts +15 -0
- package/types/components/EmptyState/EmptyState.tokens.d.ts.map +1 -0
- package/types/components/EmptyState/EmptyState.types.d.ts +8 -0
- package/types/components/EmptyState/EmptyState.types.d.ts.map +1 -0
- package/types/components/EmptyState/index.d.ts +3 -0
- package/types/components/EmptyState/index.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/Accordion/Accordion.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Autocomplete/Autocomplete.config.d.ts +32 -0
- package/types/examples/plasma_b2c/components/Autocomplete/Autocomplete.config.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/Autocomplete/Autocomplete.d.ts +26 -0
- package/types/examples/plasma_b2c/components/Autocomplete/Autocomplete.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/EmptyState/EmptyState.config.d.ts +14 -0
- package/types/examples/plasma_b2c/components/EmptyState/EmptyState.config.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/EmptyState/EmptyState.d.ts +25 -0
- package/types/examples/plasma_b2c/components/EmptyState/EmptyState.d.ts.map +1 -0
- package/types/examples/plasma_web/components/Accordion/Accordion.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Autocomplete/Autocomplete.config.d.ts +32 -0
- package/types/examples/plasma_web/components/Autocomplete/Autocomplete.config.d.ts.map +1 -0
- package/types/examples/plasma_web/components/Autocomplete/Autocomplete.d.ts +26 -0
- package/types/examples/plasma_web/components/Autocomplete/Autocomplete.d.ts.map +1 -0
- package/types/examples/plasma_web/components/EmptyState/EmptyState.config.d.ts +14 -0
- package/types/examples/plasma_web/components/EmptyState/EmptyState.config.d.ts.map +1 -0
- package/types/examples/plasma_web/components/EmptyState/EmptyState.d.ts +25 -0
- package/types/examples/plasma_web/components/EmptyState/EmptyState.d.ts.map +1 -0
- package/types/hooks/index.d.ts +1 -0
- package/types/hooks/index.d.ts.map +1 -1
- package/types/hooks/useOutsideClick.d.ts +3 -0
- package/types/hooks/useOutsideClick.d.ts.map +1 -0
- package/types/index.d.ts +2 -0
- package/types/index.d.ts.map +1 -1
@@ -0,0 +1,185 @@
|
|
1
|
+
var _excluded = ["value", "onChange", "suggestions", "view", "size", "labelPlacement", "disabled", "readOnly", "label", "leftHelper", "contentLeft", "contentRight", "textBefore", "textAfter", "onScroll", "listMaxHeight", "listWidth", "filter", "onSuggestionSelect", "threshold", "renderList", "renderListEnd", "onSearch"];
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
4
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
5
|
+
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); }
|
6
|
+
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; }
|
7
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
8
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
9
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
10
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
11
|
+
import React, { forwardRef, useState, useReducer } from 'react';
|
12
|
+
import { safeUseId } from '@salutejs/plasma-core';
|
13
|
+
import { useDidMountEffect, useOutsideClick } from '../../hooks';
|
14
|
+
import { getPlacements } from '../../utils';
|
15
|
+
import { focusedReducer } from './reducers/focusedReducer';
|
16
|
+
import { SuggestionItem, StyledTextField } from './ui';
|
17
|
+
import { StyledPopover, Ul, LeftHelper, base, InfiniteLoaderWrapper } from './Autocomplete.styles';
|
18
|
+
import { useKeyNavigation } from './hooks/useKeyboardNavigation';
|
19
|
+
|
20
|
+
/**
|
21
|
+
* Компонент Autocomplete. Поле ввода с подсказками в выпадающем списке.
|
22
|
+
*/
|
23
|
+
export var autocompleteRoot = function autocompleteRoot(Root) {
|
24
|
+
return /*#__PURE__*/forwardRef(function (_ref, ref) {
|
25
|
+
var outerValue = _ref.value,
|
26
|
+
onChange = _ref.onChange,
|
27
|
+
suggestions = _ref.suggestions,
|
28
|
+
view = _ref.view,
|
29
|
+
size = _ref.size,
|
30
|
+
labelPlacement = _ref.labelPlacement,
|
31
|
+
disabled = _ref.disabled,
|
32
|
+
readOnly = _ref.readOnly,
|
33
|
+
label = _ref.label,
|
34
|
+
leftHelper = _ref.leftHelper,
|
35
|
+
contentLeft = _ref.contentLeft,
|
36
|
+
contentRight = _ref.contentRight,
|
37
|
+
textBefore = _ref.textBefore,
|
38
|
+
textAfter = _ref.textAfter,
|
39
|
+
onScroll = _ref.onScroll,
|
40
|
+
listMaxHeight = _ref.listMaxHeight,
|
41
|
+
listWidth = _ref.listWidth,
|
42
|
+
filter = _ref.filter,
|
43
|
+
onSuggestionSelect = _ref.onSuggestionSelect,
|
44
|
+
_ref$threshold = _ref.threshold,
|
45
|
+
threshold = _ref$threshold === void 0 ? 2 : _ref$threshold,
|
46
|
+
renderList = _ref.renderList,
|
47
|
+
renderListEnd = _ref.renderListEnd,
|
48
|
+
onSearch = _ref.onSearch,
|
49
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
50
|
+
var _useReducer = useReducer(focusedReducer, null),
|
51
|
+
_useReducer2 = _slicedToArray(_useReducer, 2),
|
52
|
+
focused = _useReducer2[0],
|
53
|
+
dispatchFocused = _useReducer2[1];
|
54
|
+
var _useState = useState(''),
|
55
|
+
_useState2 = _slicedToArray(_useState, 2),
|
56
|
+
innerValue = _useState2[0],
|
57
|
+
setInnerValue = _useState2[1];
|
58
|
+
var _useState3 = useState(false),
|
59
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
60
|
+
isOpen = _useState4[0],
|
61
|
+
setIsOpen = _useState4[1];
|
62
|
+
var listId = safeUseId();
|
63
|
+
var value = outerValue || innerValue;
|
64
|
+
var helperTextId = safeUseId();
|
65
|
+
var targetRef = useOutsideClick(function () {
|
66
|
+
setIsOpen(false);
|
67
|
+
});
|
68
|
+
var handleFocus = function handleFocus() {
|
69
|
+
if (value.toString().length >= threshold) {
|
70
|
+
setIsOpen(true);
|
71
|
+
}
|
72
|
+
};
|
73
|
+
var handleItemClick = function handleItemClick(e) {
|
74
|
+
setInnerValue(e.label);
|
75
|
+
if (onSuggestionSelect) {
|
76
|
+
onSuggestionSelect(e);
|
77
|
+
}
|
78
|
+
setIsOpen(false);
|
79
|
+
};
|
80
|
+
var handleChange = function handleChange(e) {
|
81
|
+
var currentValue = e.target.value;
|
82
|
+
setInnerValue(currentValue);
|
83
|
+
if (onChange) {
|
84
|
+
onChange(e);
|
85
|
+
}
|
86
|
+
if (currentValue.toString().length >= threshold) {
|
87
|
+
setIsOpen(true);
|
88
|
+
} else {
|
89
|
+
setIsOpen(false);
|
90
|
+
}
|
91
|
+
};
|
92
|
+
var defaultFilterCallback = function defaultFilterCallback(_ref2) {
|
93
|
+
var label = _ref2.label;
|
94
|
+
return label.toLowerCase().includes(value.toString().toLowerCase());
|
95
|
+
};
|
96
|
+
var finalResults = (suggestions === null || suggestions === void 0 ? void 0 : suggestions.filter(filter || defaultFilterCallback)) || [];
|
97
|
+
var _useKeyNavigation = useKeyNavigation({
|
98
|
+
isOpen: isOpen,
|
99
|
+
setIsOpen: setIsOpen,
|
100
|
+
focused: focused,
|
101
|
+
dispatchFocused: dispatchFocused,
|
102
|
+
finalResults: finalResults,
|
103
|
+
handleItemClick: handleItemClick
|
104
|
+
}),
|
105
|
+
onKeyDown = _useKeyNavigation.onKeyDown;
|
106
|
+
useDidMountEffect(function () {
|
107
|
+
dispatchFocused({
|
108
|
+
type: 'reset'
|
109
|
+
});
|
110
|
+
}, [value]);
|
111
|
+
return /*#__PURE__*/React.createElement(Root, {
|
112
|
+
view: view,
|
113
|
+
size: size,
|
114
|
+
labelPlacement: labelPlacement,
|
115
|
+
disabled: disabled,
|
116
|
+
readOnly: readOnly
|
117
|
+
}, /*#__PURE__*/React.createElement(StyledPopover, {
|
118
|
+
isOpen: isOpen,
|
119
|
+
offset: [0, 0],
|
120
|
+
placement: getPlacements('bottom'),
|
121
|
+
isFocusTrapped: false,
|
122
|
+
target: /*#__PURE__*/React.createElement(StyledTextField, _extends({
|
123
|
+
value: value,
|
124
|
+
onChange: handleChange,
|
125
|
+
onSearch: focused === null ? onSearch : undefined,
|
126
|
+
ref: ref,
|
127
|
+
size: size,
|
128
|
+
view: view,
|
129
|
+
labelPlacement: labelPlacement,
|
130
|
+
disabled: disabled,
|
131
|
+
readOnly: readOnly,
|
132
|
+
label: label,
|
133
|
+
contentLeft: contentLeft,
|
134
|
+
contentRight: contentRight,
|
135
|
+
textBefore: textBefore,
|
136
|
+
textAfter: textAfter,
|
137
|
+
onFocus: handleFocus,
|
138
|
+
onKeyDown: onKeyDown,
|
139
|
+
role: "combobox",
|
140
|
+
"aria-autocomplete": "list",
|
141
|
+
"aria-controls": listId,
|
142
|
+
"aria-expanded": isOpen,
|
143
|
+
"aria-activedescendant": "".concat(listId, "/").concat(focused),
|
144
|
+
"aria-describedby": helperTextId
|
145
|
+
}, rest)),
|
146
|
+
preventOverflow: false,
|
147
|
+
ref: targetRef,
|
148
|
+
listWidth: listWidth
|
149
|
+
}, renderList && renderList(finalResults) || Boolean(finalResults.length) && /*#__PURE__*/React.createElement(Ul, {
|
150
|
+
id: listId,
|
151
|
+
role: "listbox",
|
152
|
+
"aria-label": label,
|
153
|
+
onScroll: onScroll,
|
154
|
+
listMaxHeight: listMaxHeight
|
155
|
+
}, finalResults.map(function (suggestion, index) {
|
156
|
+
return /*#__PURE__*/React.createElement(SuggestionItem, {
|
157
|
+
key: index,
|
158
|
+
item: suggestion,
|
159
|
+
onClick: handleItemClick,
|
160
|
+
id: "".concat(listId, "/").concat(index),
|
161
|
+
focused: focused === index
|
162
|
+
});
|
163
|
+
}), renderListEnd && /*#__PURE__*/React.createElement(InfiniteLoaderWrapper, null, renderListEnd()))), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, {
|
164
|
+
id: helperTextId,
|
165
|
+
disabled: disabled,
|
166
|
+
readOnly: readOnly
|
167
|
+
}, leftHelper));
|
168
|
+
});
|
169
|
+
};
|
170
|
+
export var autocompleteConfig = {
|
171
|
+
name: 'Autocomplete',
|
172
|
+
tag: 'div',
|
173
|
+
layout: autocompleteRoot,
|
174
|
+
base: base,
|
175
|
+
defaults: {
|
176
|
+
view: 'default',
|
177
|
+
size: 'l',
|
178
|
+
labelPlacement: 'outer'
|
179
|
+
},
|
180
|
+
variations: {
|
181
|
+
view: {
|
182
|
+
css: ''
|
183
|
+
}
|
184
|
+
}
|
185
|
+
};
|
@@ -0,0 +1,32 @@
|
|
1
|
+
import styled from 'styled-components';
|
2
|
+
import { css } from 'styled-components';
|
3
|
+
import { popoverClasses, popoverConfig } from '../Popover';
|
4
|
+
import { component } from '../../engines';
|
5
|
+
import { tokens } from './Autocomplete.tokens';
|
6
|
+
export var base = /*#__PURE__*/css([".", ",.", "{display:block;}"], popoverClasses.wrapper, popoverClasses.target);
|
7
|
+
var Popover = /*#__PURE__*/component(popoverConfig);
|
8
|
+
export var StyledPopover = /*#__PURE__*/styled(Popover).withConfig({
|
9
|
+
componentId: "plasma-new-hope__sc-ff6pwi-0"
|
10
|
+
})([".", "{display:block;width:", ";}"], /*#__PURE__*/String(popoverClasses.root), function (_ref) {
|
11
|
+
var listWidth = _ref.listWidth;
|
12
|
+
return listWidth || '100%';
|
13
|
+
});
|
14
|
+
export var Ul = /*#__PURE__*/styled.ul.withConfig({
|
15
|
+
componentId: "plasma-new-hope__sc-ff6pwi-1"
|
16
|
+
})(["box-sizing:border-box;background:var(", ");box-shadow:var(", ");border-radius:var(", ");height:auto;max-height:", ";overflow-y:scroll;margin:0;padding:var(", ");"], tokens.background, tokens.boxShadow, tokens.borderRadius, function (_ref2) {
|
17
|
+
var listMaxHeight = _ref2.listMaxHeight;
|
18
|
+
return listMaxHeight || 'none';
|
19
|
+
}, tokens.padding);
|
20
|
+
export var LeftHelper = /*#__PURE__*/styled.div.withConfig({
|
21
|
+
componentId: "plasma-new-hope__sc-ff6pwi-2"
|
22
|
+
})(["color:", ";margin-top:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");opacity:var(", ");cursor:", ";"], function (_ref3) {
|
23
|
+
var readOnly = _ref3.readOnly,
|
24
|
+
disabled = _ref3.disabled;
|
25
|
+
return readOnly && !disabled ? "var(".concat(tokens.textFieldLeftHelperColorReadOnly, ")") : "var(".concat(tokens.textFieldLeftHelperColor, ")");
|
26
|
+
}, tokens.textFieldLeftHelperOffset, tokens.textFieldLeftHelperFontFamily, tokens.textFieldLeftHelperFontSize, tokens.textFieldLeftHelperFontStyle, tokens.textFieldLeftHelperFontWeight, tokens.textFieldLeftHelperLetterSpacing, tokens.textFieldLeftHelperLineHeight, tokens.textFieldDisabledOpacity, function (_ref4) {
|
27
|
+
var disabled = _ref4.disabled;
|
28
|
+
return disabled ? 'not-allowed' : 'auto';
|
29
|
+
});
|
30
|
+
export var InfiniteLoaderWrapper = /*#__PURE__*/styled.li.withConfig({
|
31
|
+
componentId: "plasma-new-hope__sc-ff6pwi-3"
|
32
|
+
})(["display:flex;align-items:center;justify-content:center;box-sizing:content-box;min-height:var(", ");"], tokens.textFieldHeight);
|
@@ -0,0 +1,85 @@
|
|
1
|
+
export var classes = {
|
2
|
+
suggestionItemIsFocused: 'suggestion-item-is-focused'
|
3
|
+
};
|
4
|
+
export var tokens = {
|
5
|
+
// Токены для TextField
|
6
|
+
textFieldColor: '--plasma-autocomplete-textfield-color',
|
7
|
+
textFieldBackgroundColor: '--plasma-autocomplete-textfield-background-color',
|
8
|
+
textFieldBackgroundColorHover: '--plasma-autocomplete-textfield-background-color-hover',
|
9
|
+
textFieldBackgroundColorFocus: '--plasma-autocomplete-textfield-background-color-focus',
|
10
|
+
textFieldBorderColor: '--plasma-autocomplete-textfield-border-color',
|
11
|
+
textFieldBorderColorHover: '--plasma-autocomplete-textfield-border-color-hover',
|
12
|
+
textFieldBorderColorFocus: '--plasma-autocomplete-textfield-border-color-focus',
|
13
|
+
textFieldColorReadOnly: '--plasma-autocomplete-textfield-color-readonly',
|
14
|
+
textFieldBackgroundColorReadOnly: '--plasma-autocomplete-textfield-bg-color-readonly',
|
15
|
+
textFieldBorderColorReadOnly: '--plasma-autocomplete-textfield-border-color-readonly',
|
16
|
+
textFieldPlaceholderColorReadOnly: '--plasma-autocomplete-textfield__placeholder-color-readonly',
|
17
|
+
textFieldCaretColor: '--plasma-autocomplete-textfield-caret-color',
|
18
|
+
textFieldPlaceholderColor: '--plasma-autocomplete-textfield-placeholder-color',
|
19
|
+
textFieldHeight: '--plasma-autocomplete-textfield-height',
|
20
|
+
textFieldBorderWidth: '--plasma-autocomplete-textfield-border-width',
|
21
|
+
textFieldBorderRadius: '--plasma-autocomplete-textfield-border-radius',
|
22
|
+
textFieldPadding: '--plasma-autocomplete-textfield-padding',
|
23
|
+
textFieldLeftContentMargin: '--plasma-autocomplete-textfield__left-content-margin',
|
24
|
+
textFieldRightContentMargin: '--plasma-autocomplete-textfield__right-content-margin',
|
25
|
+
textFieldFontFamily: '--plasma-autocomplete-textfield-font-family',
|
26
|
+
textFieldFontStyle: '--plasma-autocomplete-textfield-font-style',
|
27
|
+
textFieldFontSize: '--plasma-autocomplete-textfield-font-size',
|
28
|
+
textFieldFontWeight: '--plasma-autocomplete-textfield-font-weight',
|
29
|
+
textFieldLetterSpacing: '--plasma-autocomplete-textfield-letter-spacing',
|
30
|
+
textFieldLineHeight: '--plasma-autocomplete-textfield-line-height',
|
31
|
+
textFieldLabelColor: '--plasma-autocomplete-textfield-label-color',
|
32
|
+
textFieldLabelColorReadOnly: '--plasma-autocomplete-textfield__label-color-readonly',
|
33
|
+
textFieldLabelOffset: '--plasma-autocomplete-textfield__label-offset',
|
34
|
+
textFieldLabelFontFamily: '--plasma-autocomplete-textfield__label-font-family',
|
35
|
+
textFieldLabelFontStyle: '--plasma-autocomplete-textfield__label-font-style',
|
36
|
+
textFieldLabelFontSize: '--plasma-autocomplete-textfield__label-font-size',
|
37
|
+
textFieldLabelFontWeight: '--plasma-autocomplete-textfield__label-font-weight',
|
38
|
+
textFieldLabelLetterSpacing: '--plasma-autocomplete-textfield__label-letter-spacing',
|
39
|
+
textFieldLabelLineHeight: '--plasma-autocomplete-textfield__label-line-height',
|
40
|
+
textFieldLabelInnerFontFamily: '--plasma-autocomplete-textfield-placement_inner__label-font-family',
|
41
|
+
textFieldLabelInnerFontStyle: '--plasma-autocomplete-textfield-placement_inner__label-font-style',
|
42
|
+
textFieldLabelInnerFontSize: '--plasma-autocomplete-textfield-placement_inner__label-font-size',
|
43
|
+
textFieldLabelInnerFontWeight: '--plasma-autocomplete-textfield-placement_inner__label-font-weight',
|
44
|
+
textFieldLabelInnerLetterSpacing: '--plasma-autocomplete-textfield-placement_inner__label-letter-spacing',
|
45
|
+
textFieldLabelInnerLineHeight: '--plasma-autocomplete-textfield-placement_inner__label-line-height',
|
46
|
+
textFieldLabelInnerPadding: '--plasma-autocomplete-textfield-placement_inner__label-padding',
|
47
|
+
textFieldContentLabelInnerPadding: '--plasma-autocomplete-textfield-placement_inner__content-padding',
|
48
|
+
textFieldLeftHelperColor: '--plasma-autocomplete-textfield__left-helper-color',
|
49
|
+
textFieldLeftHelperColorReadOnly: '--plasma-autocomplete-textfield__left-helper-color-readonly',
|
50
|
+
textFieldLeftHelperOffset: '--plasma-autocomplete-textfield__left-helper-offset',
|
51
|
+
textFieldLeftHelperFontFamily: '--plasma-autocomplete-textfield__left-helper-font-family',
|
52
|
+
textFieldLeftHelperFontStyle: '--plasma-autocomplete-textfield__left-helper-font-style',
|
53
|
+
textFieldLeftHelperFontSize: '--plasma-autocomplete-textfield__left-helper-font-size',
|
54
|
+
textFieldLeftHelperFontWeight: '--plasma-autocomplete-textfield__left-helper-font-weight',
|
55
|
+
textFieldLeftHelperLetterSpacing: '--plasma-autocomplete-textfield__left-helper-letter-spacing',
|
56
|
+
textFieldLeftHelperLineHeight: '--plasma-autocomplete-textfield__left-helper-line-height',
|
57
|
+
textFieldTextBeforeColor: '--plasma-autocomplete-textfield__before-text-color',
|
58
|
+
textFieldTextAfterColor: '--plasma-autocomplete-textfield__after-text-color',
|
59
|
+
textFieldTextBeforeMargin: '--plasma-autocomplete-textfield__before-text-margin',
|
60
|
+
textFieldTextAfterMargin: '--plasma-autocomplete-textfield__after-text-margin',
|
61
|
+
textFieldDisabledOpacity: '--plasma-autocomplete-textfield-disabled-opacity',
|
62
|
+
textFieldFocusColor: '--plasma-autocomplete-textfield-focus-color',
|
63
|
+
// Токены для дропдауна
|
64
|
+
background: '--plasma-autocomplete-background',
|
65
|
+
boxShadow: '--plasma-autocomplete-box-shadow',
|
66
|
+
borderRadius: '--plasma-autocomplete-border-radius',
|
67
|
+
padding: '--plasma-autocomplete-padding',
|
68
|
+
itemPadding: '--plasma-autocomplete-item-padding',
|
69
|
+
itemBorderRadius: '--plasma-autocomplete-item-border-radius',
|
70
|
+
itemFontFamily: '--plasma-autocomplete-item-font-family',
|
71
|
+
itemFontSize: '--plasma-autocomplete-item-font-size',
|
72
|
+
itemFontStyle: '--plasma-autocomplete-item-font-style',
|
73
|
+
itemFontWeight: '--plasma-autocomplete-item-font-weight',
|
74
|
+
itemFontLetterSpacing: '--plasma-autocomplete-item-font-letter-spacing',
|
75
|
+
itemFontLineHeight: '--plasma-autocomplete-item-font-line-height',
|
76
|
+
itemBackground: '--plasma-autocomplete-item-background',
|
77
|
+
itemBackgroundHover: '--plasma-autocomplete-item-background-hover',
|
78
|
+
itemColor: '--plasma-autocomplete-item-color',
|
79
|
+
focusColor: '--plasma-autocomplete-focus-color',
|
80
|
+
infiniteLoaderSpinnerColor: '--plasma-autocomplete-infinite-loader-spinner-color',
|
81
|
+
infiniteLoaderSpinnerSize: '--plasma-autocomplete-infinite-loader-spinner-size',
|
82
|
+
infiniteLoaderGap: '--plasma-autocomplete-infinite-loader-gap',
|
83
|
+
emptyStateGap: '--plasma-autocomplete-empty-state-gap',
|
84
|
+
emptyStatePadding: '--plasma-autocomplete-empty-state-padding'
|
85
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,108 @@
|
|
1
|
+
export var keys = {
|
2
|
+
Enter: 'Enter',
|
3
|
+
Space: 'Space',
|
4
|
+
Tab: 'Tab',
|
5
|
+
Escape: 'Escape',
|
6
|
+
ArrowLeft: 'ArrowLeft',
|
7
|
+
ArrowRight: 'ArrowRight',
|
8
|
+
ArrowUp: 'ArrowUp',
|
9
|
+
ArrowDown: 'ArrowDown',
|
10
|
+
Home: 'Home',
|
11
|
+
End: 'End',
|
12
|
+
PageUp: 'PageUp',
|
13
|
+
PageDown: 'PageDown'
|
14
|
+
};
|
15
|
+
export var useKeyNavigation = function useKeyNavigation(_ref) {
|
16
|
+
var isOpen = _ref.isOpen,
|
17
|
+
setIsOpen = _ref.setIsOpen,
|
18
|
+
focused = _ref.focused,
|
19
|
+
dispatchFocused = _ref.dispatchFocused,
|
20
|
+
finalResults = _ref.finalResults,
|
21
|
+
handleItemClick = _ref.handleItemClick;
|
22
|
+
var onKeyDown = function onKeyDown(event) {
|
23
|
+
switch (event.code) {
|
24
|
+
case keys.ArrowDown:
|
25
|
+
{
|
26
|
+
if (!isOpen) {
|
27
|
+
setIsOpen(true);
|
28
|
+
dispatchFocused({
|
29
|
+
type: 'setFirstItem'
|
30
|
+
});
|
31
|
+
break;
|
32
|
+
}
|
33
|
+
dispatchFocused({
|
34
|
+
type: 'setNextItem',
|
35
|
+
listLength: finalResults.length
|
36
|
+
});
|
37
|
+
break;
|
38
|
+
}
|
39
|
+
case keys.ArrowUp:
|
40
|
+
{
|
41
|
+
if (!isOpen) {
|
42
|
+
setIsOpen(true);
|
43
|
+
dispatchFocused({
|
44
|
+
type: 'setLastItem',
|
45
|
+
listLength: finalResults.length
|
46
|
+
});
|
47
|
+
break;
|
48
|
+
}
|
49
|
+
dispatchFocused({
|
50
|
+
type: 'setPrevItem',
|
51
|
+
listLength: finalResults.length
|
52
|
+
});
|
53
|
+
break;
|
54
|
+
}
|
55
|
+
case keys.Home:
|
56
|
+
{
|
57
|
+
if (!isOpen) {
|
58
|
+
return;
|
59
|
+
}
|
60
|
+
dispatchFocused({
|
61
|
+
type: 'setFirstItem'
|
62
|
+
});
|
63
|
+
break;
|
64
|
+
}
|
65
|
+
case keys.End:
|
66
|
+
{
|
67
|
+
if (!isOpen) {
|
68
|
+
return;
|
69
|
+
}
|
70
|
+
dispatchFocused({
|
71
|
+
type: 'setLastItem',
|
72
|
+
listLength: finalResults.length
|
73
|
+
});
|
74
|
+
break;
|
75
|
+
}
|
76
|
+
case keys.Enter:
|
77
|
+
{
|
78
|
+
if (!isOpen || focused === null) {
|
79
|
+
return;
|
80
|
+
}
|
81
|
+
dispatchFocused({
|
82
|
+
type: 'reset'
|
83
|
+
});
|
84
|
+
handleItemClick(finalResults[focused]);
|
85
|
+
break;
|
86
|
+
}
|
87
|
+
case keys.Tab:
|
88
|
+
case keys.Escape:
|
89
|
+
{
|
90
|
+
if (!isOpen) {
|
91
|
+
return;
|
92
|
+
}
|
93
|
+
setIsOpen(false);
|
94
|
+
dispatchFocused({
|
95
|
+
type: 'reset'
|
96
|
+
});
|
97
|
+
break;
|
98
|
+
}
|
99
|
+
default:
|
100
|
+
{
|
101
|
+
break;
|
102
|
+
}
|
103
|
+
}
|
104
|
+
};
|
105
|
+
return {
|
106
|
+
onKeyDown: onKeyDown
|
107
|
+
};
|
108
|
+
};
|
@@ -0,0 +1,40 @@
|
|
1
|
+
export function focusedReducer(state, action) {
|
2
|
+
switch (action.type) {
|
3
|
+
case 'reset':
|
4
|
+
{
|
5
|
+
return null;
|
6
|
+
}
|
7
|
+
case 'setNextItem':
|
8
|
+
{
|
9
|
+
if (state === action.listLength - 1) {
|
10
|
+
return state;
|
11
|
+
}
|
12
|
+
if (state === null) {
|
13
|
+
return 0;
|
14
|
+
}
|
15
|
+
return state + 1;
|
16
|
+
}
|
17
|
+
case 'setPrevItem':
|
18
|
+
{
|
19
|
+
if (state === 0) {
|
20
|
+
return state;
|
21
|
+
}
|
22
|
+
if (state === null) {
|
23
|
+
return action.listLength - 1;
|
24
|
+
}
|
25
|
+
return state - 1;
|
26
|
+
}
|
27
|
+
case 'setFirstItem':
|
28
|
+
{
|
29
|
+
return 0;
|
30
|
+
}
|
31
|
+
case 'setLastItem':
|
32
|
+
{
|
33
|
+
return action.listLength - 1;
|
34
|
+
}
|
35
|
+
default:
|
36
|
+
{
|
37
|
+
return state;
|
38
|
+
}
|
39
|
+
}
|
40
|
+
}
|
@@ -0,0 +1,33 @@
|
|
1
|
+
import React, { useEffect, useRef } from 'react';
|
2
|
+
import { classes } from '../../Autocomplete.tokens';
|
3
|
+
import { StyledText, Wrapper } from './SuggestionItem.styles';
|
4
|
+
export var SuggestionItem = function SuggestionItem(_ref) {
|
5
|
+
var item = _ref.item,
|
6
|
+
id = _ref.id,
|
7
|
+
onClick = _ref.onClick,
|
8
|
+
focused = _ref.focused;
|
9
|
+
var ref = useRef(null);
|
10
|
+
var focusedClass = focused ? classes.suggestionItemIsFocused : undefined;
|
11
|
+
var handleClick = function handleClick() {
|
12
|
+
if (onClick) {
|
13
|
+
onClick(item);
|
14
|
+
}
|
15
|
+
};
|
16
|
+
useEffect(function () {
|
17
|
+
if (focusedClass && ref !== null && ref !== void 0 && ref.current) {
|
18
|
+
ref.current.scrollIntoView({
|
19
|
+
behavior: 'smooth',
|
20
|
+
block: 'center',
|
21
|
+
inline: 'center'
|
22
|
+
});
|
23
|
+
}
|
24
|
+
}, [focusedClass]);
|
25
|
+
return /*#__PURE__*/React.createElement(Wrapper, {
|
26
|
+
id: id,
|
27
|
+
role: "option",
|
28
|
+
"aria-selected": focused,
|
29
|
+
onClick: handleClick,
|
30
|
+
ref: ref,
|
31
|
+
className: focusedClass
|
32
|
+
}, item.contentLeft, /*#__PURE__*/React.createElement(StyledText, null, item.label), item.contentRight);
|
33
|
+
};
|
package/styled-components/es/components/Autocomplete/ui/SuggestionItem/SuggestionItem.styles.js
ADDED
@@ -0,0 +1,16 @@
|
|
1
|
+
import styled from 'styled-components';
|
2
|
+
import { tokens, classes } from '../../Autocomplete.tokens';
|
3
|
+
import { addFocus, applyEllipsis } from '../../../../mixins';
|
4
|
+
export var StyledText = /*#__PURE__*/styled.div.withConfig({
|
5
|
+
componentId: "plasma-new-hope__sc-1m9plqu-0"
|
6
|
+
})(["", ";flex:1;"], /*#__PURE__*/applyEllipsis());
|
7
|
+
export var Wrapper = /*#__PURE__*/styled.li.withConfig({
|
8
|
+
componentId: "plasma-new-hope__sc-1m9plqu-1"
|
9
|
+
})(["display:flex;align-items:center;margin:0;box-sizing:content-box;padding:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");background:var(", ");color:var(", ");border-radius:var(", ");user-select:none;&:hover{cursor:pointer;background:var(", ");}:focus{outline:none;}", ";"], tokens.itemPadding, tokens.itemFontFamily, tokens.itemFontSize, tokens.itemFontStyle, tokens.itemFontWeight, tokens.itemFontLetterSpacing, tokens.itemFontLineHeight, tokens.itemBackground, tokens.itemColor, tokens.itemBorderRadius, tokens.itemBackgroundHover, /*#__PURE__*/addFocus({
|
10
|
+
outlineSize: '0.0625rem',
|
11
|
+
outlineOffset: '0',
|
12
|
+
outlineColor: /*#__PURE__*/"var(".concat(tokens.focusColor, ")"),
|
13
|
+
outlineRadius: /*#__PURE__*/"var(".concat(tokens.itemBorderRadius, ")"),
|
14
|
+
hasTransition: false,
|
15
|
+
customFocusRules: /*#__PURE__*/"\n &.".concat(classes.suggestionItemIsFocused, ":before {\n outline: none;\n box-shadow: 0 0 0 0.0625rem var(").concat(tokens.focusColor, ");\n }\n ")
|
16
|
+
}));
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1 @@
|
|
1
|
+
export { StyledTextField } from './TextField.styles';
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import styled from 'styled-components';
|
2
|
+
import { textFieldConfig, textFieldTokens } from '../../../TextField';
|
3
|
+
import { component, mergeConfig } from '../../../../engines';
|
4
|
+
import { tokens as autocompleteTokens } from '../../Autocomplete.tokens';
|
5
|
+
var mergedConfig = /*#__PURE__*/mergeConfig(textFieldConfig);
|
6
|
+
var TextField = /*#__PURE__*/component(mergedConfig);
|
7
|
+
export var StyledTextField = /*#__PURE__*/styled(TextField).withConfig({
|
8
|
+
componentId: "plasma-new-hope__sc-1rp2ggs-0"
|
9
|
+
})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], textFieldTokens.color, autocompleteTokens.textFieldColor, textFieldTokens.backgroundColor, autocompleteTokens.textFieldBackgroundColor, textFieldTokens.backgroundColorHover, autocompleteTokens.textFieldBackgroundColorHover, textFieldTokens.backgroundColorFocus, autocompleteTokens.textFieldBackgroundColorFocus, textFieldTokens.borderColor, autocompleteTokens.textFieldBorderColor, textFieldTokens.borderColorHover, autocompleteTokens.textFieldBorderColorHover, textFieldTokens.borderColorFocus, autocompleteTokens.textFieldBorderColorFocus, textFieldTokens.colorReadOnly, autocompleteTokens.textFieldColorReadOnly, textFieldTokens.backgroundColorReadOnly, autocompleteTokens.textFieldBackgroundColorReadOnly, textFieldTokens.borderColorReadOnly, autocompleteTokens.textFieldBorderColorReadOnly, textFieldTokens.placeholderColorReadOnly, autocompleteTokens.textFieldPlaceholderColorReadOnly, textFieldTokens.caretColor, autocompleteTokens.textFieldCaretColor, textFieldTokens.placeholderColor, autocompleteTokens.textFieldPlaceholderColor, textFieldTokens.height, autocompleteTokens.textFieldHeight, textFieldTokens.borderWidth, autocompleteTokens.textFieldBorderWidth, textFieldTokens.borderRadius, autocompleteTokens.textFieldBorderRadius, textFieldTokens.padding, autocompleteTokens.textFieldPadding, textFieldTokens.leftContentMargin, autocompleteTokens.textFieldLeftContentMargin, textFieldTokens.rightContentMargin, autocompleteTokens.textFieldRightContentMargin, textFieldTokens.fontFamily, autocompleteTokens.textFieldFontFamily, textFieldTokens.fontStyle, autocompleteTokens.textFieldFontStyle, textFieldTokens.fontSize, autocompleteTokens.textFieldFontSize, textFieldTokens.fontWeight, autocompleteTokens.textFieldFontWeight, textFieldTokens.letterSpacing, autocompleteTokens.textFieldLetterSpacing, textFieldTokens.lineHeight, autocompleteTokens.textFieldLineHeight, textFieldTokens.labelColor, autocompleteTokens.textFieldLabelColor, textFieldTokens.labelColorReadOnly, autocompleteTokens.textFieldLabelColorReadOnly, textFieldTokens.labelOffset, autocompleteTokens.textFieldLabelOffset, textFieldTokens.labelFontFamily, autocompleteTokens.textFieldLabelFontFamily, textFieldTokens.labelFontStyle, autocompleteTokens.textFieldLabelFontStyle, textFieldTokens.labelFontSize, autocompleteTokens.textFieldLabelFontSize, textFieldTokens.labelFontWeight, autocompleteTokens.textFieldLabelFontWeight, textFieldTokens.labelLetterSpacing, autocompleteTokens.textFieldLabelLetterSpacing, textFieldTokens.labelLineHeight, autocompleteTokens.textFieldLabelLineHeight, textFieldTokens.labelInnerFontFamily, autocompleteTokens.textFieldLabelInnerFontFamily, textFieldTokens.labelInnerFontStyle, autocompleteTokens.textFieldLabelInnerFontStyle, textFieldTokens.labelInnerFontSize, autocompleteTokens.textFieldLabelInnerFontSize, textFieldTokens.labelInnerFontWeight, autocompleteTokens.textFieldLabelInnerFontWeight, textFieldTokens.labelInnerLetterSpacing, autocompleteTokens.textFieldLabelInnerLetterSpacing, textFieldTokens.labelInnerLineHeight, autocompleteTokens.textFieldLabelInnerLineHeight, textFieldTokens.labelInnerPadding, autocompleteTokens.textFieldLabelInnerPadding, textFieldTokens.contentLabelInnerPadding, autocompleteTokens.textFieldContentLabelInnerPadding, textFieldTokens.leftHelperColor, autocompleteTokens.textFieldLeftHelperColor, textFieldTokens.leftHelperColorReadOnly, autocompleteTokens.textFieldLeftHelperColorReadOnly, textFieldTokens.leftHelperOffset, autocompleteTokens.textFieldLeftHelperOffset, textFieldTokens.leftHelperFontFamily, autocompleteTokens.textFieldLeftHelperFontFamily, textFieldTokens.leftHelperFontStyle, autocompleteTokens.textFieldLeftHelperFontStyle, textFieldTokens.leftHelperFontSize, autocompleteTokens.textFieldLeftHelperFontSize, textFieldTokens.leftHelperFontWeight, autocompleteTokens.textFieldLeftHelperFontWeight, textFieldTokens.leftHelperLetterSpacing, autocompleteTokens.textFieldLeftHelperLetterSpacing, textFieldTokens.leftHelperLineHeight, autocompleteTokens.textFieldLeftHelperLineHeight, textFieldTokens.textBeforeColor, autocompleteTokens.textFieldTextBeforeColor, textFieldTokens.textAfterColor, autocompleteTokens.textFieldTextAfterColor, textFieldTokens.textBeforeMargin, autocompleteTokens.textFieldTextBeforeMargin, textFieldTokens.textAfterMargin, autocompleteTokens.textFieldTextAfterMargin, textFieldTokens.disabledOpacity, autocompleteTokens.textFieldDisabledOpacity, textFieldTokens.focusColor, autocompleteTokens.textFieldFocusColor);
|
@@ -0,0 +1,31 @@
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
2
|
+
import React, { forwardRef } from 'react';
|
3
|
+
import { Wrapper, StyledButton, IconWrapper, Description } from './EmptyState.styles';
|
4
|
+
|
5
|
+
/**
|
6
|
+
* Компонент для альтернативного показа содержимого выпадающего списка.
|
7
|
+
*/
|
8
|
+
export var emptyStateRoot = function emptyStateRoot(Root) {
|
9
|
+
return /*#__PURE__*/forwardRef(function (props, ref) {
|
10
|
+
var icon = props.icon,
|
11
|
+
description = props.description,
|
12
|
+
buttonText = props.buttonText,
|
13
|
+
buttonAction = props.buttonAction;
|
14
|
+
return /*#__PURE__*/React.createElement(Root, _extends({}, props, {
|
15
|
+
ref: ref
|
16
|
+
}), /*#__PURE__*/React.createElement(Wrapper, null, icon && /*#__PURE__*/React.createElement(IconWrapper, null, icon), /*#__PURE__*/React.createElement(Description, null, description), buttonText && /*#__PURE__*/React.createElement(StyledButton, {
|
17
|
+
stretching: "filled",
|
18
|
+
onClick: buttonAction
|
19
|
+
}, buttonText)));
|
20
|
+
});
|
21
|
+
};
|
22
|
+
export var emptyStateConfig = {
|
23
|
+
name: 'EmptyState',
|
24
|
+
tag: 'div',
|
25
|
+
layout: emptyStateRoot,
|
26
|
+
base: '',
|
27
|
+
defaults: {
|
28
|
+
size: 'l'
|
29
|
+
},
|
30
|
+
variations: {}
|
31
|
+
};
|
@@ -0,0 +1,18 @@
|
|
1
|
+
import styled from 'styled-components';
|
2
|
+
import { buttonConfig, buttonTokens } from '../Button';
|
3
|
+
import { component, mergeConfig } from '../../engines';
|
4
|
+
import { tokens } from './EmptyState.tokens';
|
5
|
+
var mergedButtonConfig = /*#__PURE__*/mergeConfig(buttonConfig);
|
6
|
+
var Button = /*#__PURE__*/component(mergedButtonConfig);
|
7
|
+
export var StyledButton = /*#__PURE__*/styled(Button).withConfig({
|
8
|
+
componentId: "plasma-new-hope__sc-1071zo6-0"
|
9
|
+
})(["", ":var(--text-primary);", ":var(--text-primary-active);", ":var(--text-primary-hover);", ":none;", ":0;", ":var(", ");", ":0;", ":var(", ");", ":var(", ");", ":var(", ");", ":600;", ":var(", ");", ":var(", ");margin:var(", ");"], buttonTokens.buttonColor, buttonTokens.buttonColorActive, buttonTokens.buttonColorHover, buttonTokens.buttonBackgroundColor, buttonTokens.buttonPadding, buttonTokens.buttonHeight, tokens.buttonHeight, buttonTokens.buttonRadius, buttonTokens.buttonFontFamily, tokens.fontFamily, buttonTokens.buttonFontSize, tokens.fontSize, buttonTokens.buttonFontStyle, tokens.fontStyle, buttonTokens.buttonFontWeight, buttonTokens.buttonLetterSpacing, tokens.fontLetterSpacing, buttonTokens.buttonLineHeight, tokens.fontLineHeight, tokens.buttonMargin);
|
10
|
+
export var Wrapper = /*#__PURE__*/styled.div.withConfig({
|
11
|
+
componentId: "plasma-new-hope__sc-1071zo6-1"
|
12
|
+
})(["display:flex;flex-direction:column;align-items:center;background:var(--surface-solid-card);box-shadow:0 4px 14px -4px rgba(8,8,8,0.08),0 1px 4px -1px rgba(0,0,0,0.04);border-radius:var(", ");padding:var(", ");text-align:center;"], tokens.borderRadius, tokens.padding);
|
13
|
+
export var IconWrapper = /*#__PURE__*/styled.div.withConfig({
|
14
|
+
componentId: "plasma-new-hope__sc-1071zo6-2"
|
15
|
+
})(["margin:var(", ");line-height:0;"], tokens.iconMargin);
|
16
|
+
export var Description = /*#__PURE__*/styled.div.withConfig({
|
17
|
+
componentId: "plasma-new-hope__sc-1071zo6-3"
|
18
|
+
})(["margin:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");"], tokens.descriptionMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.fontLetterSpacing, tokens.fontLineHeight);
|
@@ -0,0 +1,14 @@
|
|
1
|
+
export var tokens = {
|
2
|
+
borderRadius: '--plasma-emptystate-border-radius',
|
3
|
+
padding: '--plasma-emptystate-padding',
|
4
|
+
iconMargin: '--plasma-emptystate-icon-margin',
|
5
|
+
descriptionMargin: '--plasma-emptystate-description-margin',
|
6
|
+
buttonMargin: '--plasma-emptystate-button-margin',
|
7
|
+
buttonHeight: '--plasma-emptystate-button-height',
|
8
|
+
fontFamily: '--plasma-emptystate-font-family',
|
9
|
+
fontSize: '--plasma-emptystate-font-size',
|
10
|
+
fontStyle: '--plasma-emptystate-font-style',
|
11
|
+
fontWeight: '--plasma-emptystate-font-weight',
|
12
|
+
fontLetterSpacing: '--plasma-emptystate-font-letter-spacing',
|
13
|
+
fontLineHeight: '--plasma-emptystate-font-line-height'
|
14
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -183,7 +183,7 @@ export var textFieldRoot = function textFieldRoot(Root) {
|
|
183
183
|
},
|
184
184
|
onClick: onChipClick
|
185
185
|
});
|
186
|
-
})), /*#__PURE__*/React.createElement(Input, _extends({
|
186
|
+
})), /*#__PURE__*/React.createElement(Input, _extends({
|
187
187
|
ref: inputForkRef,
|
188
188
|
id: innerId,
|
189
189
|
"aria-labelledby": labelId,
|
@@ -193,7 +193,7 @@ export var textFieldRoot = function textFieldRoot(Root) {
|
|
193
193
|
readOnly: !disabled && readOnly,
|
194
194
|
onChange: handleChange,
|
195
195
|
onKeyDown: handleOnKeyDown
|
196
|
-
})), labelInside && /*#__PURE__*/React.createElement(Label, {
|
196
|
+
}, rest)), labelInside && /*#__PURE__*/React.createElement(Label, {
|
197
197
|
id: labelId,
|
198
198
|
htmlFor: innerId
|
199
199
|
}, innerLabelValue), textAfter && /*#__PURE__*/React.createElement(StyledTextAfter, null, textAfter)), contentRight && /*#__PURE__*/React.createElement(StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, {
|