@webiny/ui 0.0.0-mt-3 → 0.0.0-unstable.085ff6572f
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Accordion/Accordion.d.ts +5 -5
- package/Accordion/Accordion.js +22 -22
- package/Accordion/Accordion.js.map +1 -0
- package/Accordion/Accordion.stories.js +26 -23
- package/Accordion/Accordion.stories.js.map +1 -0
- package/Accordion/AccordionItem.d.ts +27 -8
- package/Accordion/AccordionItem.js +91 -84
- package/Accordion/AccordionItem.js.map +1 -0
- package/Accordion/AccordionItemActions.d.ts +8 -0
- package/Accordion/AccordionItemActions.js +28 -0
- package/Accordion/AccordionItemActions.js.map +1 -0
- package/Accordion/index.js +27 -2
- package/Accordion/index.js.map +1 -0
- package/Alert/Alert.d.ts +4 -4
- package/Alert/Alert.js +19 -15
- package/Alert/Alert.js.map +1 -0
- package/Alert/Alert.stories.js +16 -13
- package/Alert/Alert.stories.js.map +1 -0
- package/Alert/index.js +16 -1
- package/Alert/index.js.map +1 -0
- package/AutoComplete/AutoComplete.d.ts +13 -19
- package/AutoComplete/AutoComplete.js +150 -149
- package/AutoComplete/AutoComplete.js.map +1 -0
- package/AutoComplete/AutoComplete.stories.js +20 -17
- package/AutoComplete/AutoComplete.stories.js.map +1 -0
- package/AutoComplete/MultiAutoComplete.d.ts +44 -40
- package/AutoComplete/MultiAutoComplete.js +304 -311
- package/AutoComplete/MultiAutoComplete.js.map +1 -0
- package/AutoComplete/MultiAutoComplete.stories.js +31 -28
- package/AutoComplete/MultiAutoComplete.stories.js.map +1 -0
- package/AutoComplete/index.js +27 -2
- package/AutoComplete/index.js.map +1 -0
- package/AutoComplete/styles.js +33 -4
- package/AutoComplete/styles.js.map +1 -0
- package/AutoComplete/types.d.ts +4 -3
- package/AutoComplete/types.js +5 -1
- package/AutoComplete/types.js.map +1 -0
- package/AutoComplete/utils.d.ts +11 -5
- package/AutoComplete/utils.js +15 -8
- package/AutoComplete/utils.js.map +1 -0
- package/Avatar/Avatar.d.ts +5 -11
- package/Avatar/Avatar.js +37 -28
- package/Avatar/Avatar.js.map +1 -0
- package/Avatar/Avatar.stories.js +13 -10
- package/Avatar/Avatar.stories.js.map +1 -0
- package/Avatar/index.js +16 -1
- package/Avatar/index.js.map +1 -0
- package/Button/Button.d.ts +39 -24
- package/Button/Button.js +74 -83
- package/Button/Button.js.map +1 -0
- package/Button/Button.stories.js +32 -29
- package/Button/Button.stories.js.map +1 -0
- package/Button/Button.styles.d.ts +6 -0
- package/Button/Button.styles.js +13 -0
- package/Button/Button.styles.js.map +1 -0
- package/Button/CopyButton/CopyButton.d.ts +4 -7
- package/Button/CopyButton/CopyButton.js +18 -18
- package/Button/CopyButton/CopyButton.js.map +1 -0
- package/Button/CopyButton/CopyButton.stories.js +13 -10
- package/Button/CopyButton/CopyButton.stories.js.map +1 -0
- package/Button/IconButton/IconButton.d.ts +4 -7
- package/Button/IconButton/IconButton.js +16 -15
- package/Button/IconButton/IconButton.js.map +1 -0
- package/Button/IconButton/IconButton.stories.js +22 -19
- package/Button/IconButton/IconButton.stories.js.map +1 -0
- package/Button/index.js +38 -3
- package/Button/index.js.map +1 -0
- package/Carousel/Carousel.d.ts +3 -3
- package/Carousel/Carousel.js +24 -25
- package/Carousel/Carousel.js.map +1 -0
- package/Carousel/Carouser.stories.js +20 -17
- package/Carousel/Carouser.stories.js.map +1 -0
- package/Carousel/index.js +13 -1
- package/Carousel/index.js.map +1 -0
- package/Checkbox/Checkbox.d.ts +6 -9
- package/Checkbox/Checkbox.js +40 -44
- package/Checkbox/Checkbox.js.map +1 -0
- package/Checkbox/Checkbox.stories.js +19 -16
- package/Checkbox/Checkbox.stories.js.map +1 -0
- package/Checkbox/Checkbox.styles.js +9 -4
- package/Checkbox/Checkbox.styles.js.map +1 -0
- package/Checkbox/CheckboxGroup.d.ts +2 -2
- package/Checkbox/CheckboxGroup.js +34 -35
- package/Checkbox/CheckboxGroup.js.map +1 -0
- package/Checkbox/CheckboxGroup.stories.js +23 -20
- package/Checkbox/CheckboxGroup.stories.js.map +1 -0
- package/Checkbox/index.js +20 -2
- package/Checkbox/index.js.map +1 -0
- package/Chips/Chip.d.ts +3 -8
- package/Chips/Chip.js +15 -8
- package/Chips/Chip.js.map +1 -0
- package/Chips/Chips.d.ts +4 -4
- package/Chips/Chips.js +21 -14
- package/Chips/Chips.js.map +1 -0
- package/Chips/Chips.stories.js +25 -18
- package/Chips/Chips.stories.js.map +1 -0
- package/Chips/index.d.ts +0 -1
- package/Chips/index.js +27 -3
- package/Chips/index.js.map +1 -0
- package/Chips/styles.js +19 -9
- package/Chips/styles.js.map +1 -0
- package/CodeEditor/CodeEditor.d.ts +5 -8
- package/CodeEditor/CodeEditor.js +42 -49
- package/CodeEditor/CodeEditor.js.map +1 -0
- package/CodeEditor/CodeEditor.stories.js +20 -17
- package/CodeEditor/CodeEditor.stories.js.map +1 -0
- package/CodeEditor/index.js +16 -1
- package/CodeEditor/index.js.map +1 -0
- package/ColorPicker/ColorPicker.d.ts +9 -10
- package/ColorPicker/ColorPicker.js +54 -66
- package/ColorPicker/ColorPicker.js.map +1 -0
- package/ColorPicker/ColorPicker.stories.js +18 -15
- package/ColorPicker/ColorPicker.stories.js.map +1 -0
- package/ColorPicker/index.js +16 -1
- package/ColorPicker/index.js.map +1 -0
- package/ConfirmationDialog/ConfirmationDialog.d.ts +13 -13
- package/ConfirmationDialog/ConfirmationDialog.js +76 -96
- package/ConfirmationDialog/ConfirmationDialog.js.map +1 -0
- package/ConfirmationDialog/ConfirmationDialog.stories.js +15 -12
- package/ConfirmationDialog/ConfirmationDialog.stories.js.map +1 -0
- package/ConfirmationDialog/index.js +27 -2
- package/ConfirmationDialog/index.js.map +1 -0
- package/ConfirmationDialog/withConfirmation.d.ts +2 -2
- package/ConfirmationDialog/withConfirmation.js +14 -6
- package/ConfirmationDialog/withConfirmation.js.map +1 -0
- package/DataTable/DataTable.d.ts +75 -0
- package/DataTable/DataTable.js +198 -0
- package/DataTable/DataTable.js.map +1 -0
- package/DataTable/DataTable.stories.d.ts +1 -0
- package/DataTable/DataTable.stories.js +74 -0
- package/DataTable/DataTable.stories.js.map +1 -0
- package/DataTable/README.md +72 -0
- package/DataTable/index.d.ts +1 -0
- package/DataTable/index.js +16 -0
- package/DataTable/index.js.map +1 -0
- package/DataTable/styled.d.ts +30 -0
- package/DataTable/styled.js +36 -0
- package/DataTable/styled.js.map +1 -0
- package/DelayedOnChange/DelayedOnChange.d.ts +40 -0
- package/DelayedOnChange/DelayedOnChange.js +113 -0
- package/DelayedOnChange/DelayedOnChange.js.map +1 -0
- package/DelayedOnChange/index.d.ts +2 -0
- package/DelayedOnChange/index.js +20 -0
- package/DelayedOnChange/index.js.map +1 -0
- package/DelayedOnChange/withDelayedOnChange.d.ts +3 -0
- package/DelayedOnChange/withDelayedOnChange.js +31 -0
- package/DelayedOnChange/withDelayedOnChange.js.map +1 -0
- package/Dialog/Dialog.d.ts +22 -30
- package/Dialog/Dialog.js +59 -55
- package/Dialog/Dialog.js.map +1 -0
- package/Dialog/Dialog.stories.js +19 -16
- package/Dialog/Dialog.stories.js.map +1 -0
- package/Dialog/index.js +16 -1
- package/Dialog/index.js.map +1 -0
- package/Drawer/Drawer.d.ts +1 -1
- package/Drawer/Drawer.js +14 -9
- package/Drawer/Drawer.js.map +1 -0
- package/Drawer/Drawer.stories.js +18 -15
- package/Drawer/Drawer.stories.js.map +1 -0
- package/Drawer/index.js +16 -1
- package/Drawer/index.js.map +1 -0
- package/DynamicFieldset/Fieldset.d.ts +26 -16
- package/DynamicFieldset/Fieldset.js +69 -74
- package/DynamicFieldset/Fieldset.js.map +1 -0
- package/DynamicFieldset/index.js +13 -1
- package/DynamicFieldset/index.js.map +1 -0
- package/Elevation/Elevation.d.ts +1 -1
- package/Elevation/Elevation.js +12 -6
- package/Elevation/Elevation.js.map +1 -0
- package/Elevation/Elevation.stories.js +19 -16
- package/Elevation/Elevation.stories.js.map +1 -0
- package/Elevation/index.js +16 -1
- package/Elevation/index.js.map +1 -0
- package/FormElementMessage/FormElementMessage.d.ts +1 -1
- package/FormElementMessage/FormElementMessage.js +11 -6
- package/FormElementMessage/FormElementMessage.js.map +1 -0
- package/FormElementMessage/index.js +12 -1
- package/FormElementMessage/index.js.map +1 -0
- package/FullName/FullName.js +7 -7
- package/FullName/FullName.js.map +1 -0
- package/FullName/index.js +16 -1
- package/FullName/index.js.map +1 -0
- package/Grid/Grid.d.ts +1 -1
- package/Grid/Grid.js +19 -10
- package/Grid/Grid.js.map +1 -0
- package/Grid/Grid.stories.js +15 -12
- package/Grid/Grid.stories.js.map +1 -0
- package/Grid/index.js +16 -1
- package/Grid/index.js.map +1 -0
- package/Helpers/ClassNames.d.ts +4 -3
- package/Helpers/ClassNames.js +16 -14
- package/Helpers/ClassNames.js.map +1 -0
- package/Helpers/index.js +12 -2
- package/Helpers/index.js.map +1 -0
- package/Icon/Icon.d.ts +3 -6
- package/Icon/Icon.js +15 -12
- package/Icon/Icon.js.map +1 -0
- package/Icon/Icon.stories.js +23 -20
- package/Icon/Icon.stories.js.map +1 -0
- package/Icon/index.js +16 -1
- package/Icon/index.js.map +1 -0
- package/Image/Image.d.ts +5 -4
- package/Image/Image.js +17 -13
- package/Image/Image.js.map +1 -0
- package/Image/Image.stories.js +14 -11
- package/Image/Image.stories.js.map +1 -0
- package/Image/index.js +16 -1
- package/Image/index.js.map +1 -0
- package/ImageEditor/ImageEditor.d.ts +33 -34
- package/ImageEditor/ImageEditor.js +129 -163
- package/ImageEditor/ImageEditor.js.map +1 -0
- package/ImageEditor/index.js +16 -1
- package/ImageEditor/index.js.map +1 -0
- package/ImageEditor/toolbar/crop.js +26 -22
- package/ImageEditor/toolbar/crop.js.map +1 -0
- package/ImageEditor/toolbar/filter.js +63 -59
- package/ImageEditor/toolbar/filter.js.map +1 -0
- package/ImageEditor/toolbar/flip.js +27 -25
- package/ImageEditor/toolbar/flip.js.map +1 -0
- package/ImageEditor/toolbar/icons/index.js +61 -8
- package/ImageEditor/toolbar/icons/index.js.map +1 -0
- package/ImageEditor/toolbar/index.js +34 -4
- package/ImageEditor/toolbar/index.js.map +1 -0
- package/ImageEditor/toolbar/rotate.js +55 -61
- package/ImageEditor/toolbar/rotate.js.map +1 -0
- package/ImageEditor/toolbar/types.d.ts +23 -12
- package/ImageEditor/toolbar/types.js +5 -1
- package/ImageEditor/toolbar/types.js.map +1 -0
- package/ImageUpload/Image.d.ts +6 -6
- package/ImageUpload/Image.js +52 -54
- package/ImageUpload/Image.js.map +1 -0
- package/ImageUpload/ImageEditorDialog.d.ts +11 -6
- package/ImageUpload/ImageEditorDialog.js +47 -46
- package/ImageUpload/ImageEditorDialog.js.map +1 -0
- package/ImageUpload/MultiImageUpload.d.ts +10 -31
- package/ImageUpload/MultiImageUpload.js +194 -222
- package/ImageUpload/MultiImageUpload.js.map +1 -0
- package/ImageUpload/MultiImageUpload.stories.js +18 -15
- package/ImageUpload/MultiImageUpload.stories.js.map +1 -0
- package/ImageUpload/SingleImageUpload.d.ts +16 -37
- package/ImageUpload/SingleImageUpload.js +96 -106
- package/ImageUpload/SingleImageUpload.js.map +1 -0
- package/ImageUpload/SingleImageUpload.stories.js +19 -16
- package/ImageUpload/SingleImageUpload.stories.js.map +1 -0
- package/ImageUpload/index.js +34 -4
- package/ImageUpload/index.js.map +1 -0
- package/ImageUpload/styled.d.ts +30 -14
- package/ImageUpload/styled.js +25 -16
- package/ImageUpload/styled.js.map +1 -0
- package/Input/Input.d.ts +6 -19
- package/Input/Input.js +102 -141
- package/Input/Input.js.map +1 -0
- package/Input/Input.stories.js +49 -46
- package/Input/Input.stories.js.map +1 -0
- package/Input/__tests__/Input.test.js +54 -63
- package/Input/__tests__/Input.test.js.map +1 -0
- package/Input/index.js +16 -1
- package/Input/index.js.map +1 -0
- package/Input/styled.d.ts +4 -0
- package/Input/styled.js +12 -0
- package/Input/styled.js.map +1 -0
- package/List/CollapsibleList/CollapsibleList.stories.js +19 -16
- package/List/CollapsibleList/CollapsibleList.stories.js.map +1 -0
- package/List/CollapsibleList/index.d.ts +2 -2
- package/List/CollapsibleList/index.js +15 -6
- package/List/CollapsibleList/index.js.map +1 -0
- package/List/DataList/DataList.d.ts +24 -43
- package/List/DataList/DataList.js +87 -122
- package/List/DataList/DataList.js.map +1 -0
- package/List/DataList/DataList.stories.js +30 -26
- package/List/DataList/DataList.stories.js.map +1 -0
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.d.ts +14 -12
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.js +29 -20
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.js.map +1 -0
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.d.ts +3 -3
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js +20 -13
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js.map +1 -0
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.d.ts +9 -4
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js +24 -12
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js.map +1 -0
- package/List/DataList/DataListModalOverlay/index.js +32 -3
- package/List/DataList/DataListModalOverlay/index.js.map +1 -0
- package/List/DataList/DataListWithSections.d.ts +45 -0
- package/List/DataList/DataListWithSections.js +312 -0
- package/List/DataList/DataListWithSections.js.map +1 -0
- package/List/DataList/Loader.d.ts +2 -2
- package/List/DataList/Loader.js +48 -52
- package/List/DataList/Loader.js.map +1 -0
- package/List/DataList/NoData.d.ts +2 -2
- package/List/DataList/NoData.js +14 -8
- package/List/DataList/NoData.js.map +1 -0
- package/List/DataList/icons/index.d.ts +1 -1
- package/List/DataList/icons/index.js +54 -38
- package/List/DataList/icons/index.js.map +1 -0
- package/List/DataList/index.d.ts +1 -0
- package/List/DataList/index.js +58 -3
- package/List/DataList/index.js.map +1 -0
- package/List/DataList/types.d.ts +1 -1
- package/List/DataList/types.js +5 -1
- package/List/DataList/types.js.map +1 -0
- package/List/List.d.ts +3 -2
- package/List/List.js +66 -62
- package/List/List.js.map +1 -0
- package/List/List.stories.js +40 -37
- package/List/List.stories.js.map +1 -0
- package/List/icons/index.js +20 -3
- package/List/icons/index.js.map +1 -0
- package/List/index.d.ts +1 -1
- package/List/index.js +70 -3
- package/List/index.js.map +1 -0
- package/Menu/Menu.d.ts +14 -21
- package/Menu/Menu.js +49 -62
- package/Menu/Menu.js.map +1 -0
- package/Menu/Menu.stories.js +17 -14
- package/Menu/Menu.stories.js.map +1 -0
- package/Menu/index.js +16 -1
- package/Menu/index.js.map +1 -0
- package/Mosaic/Mosaic.d.ts +4 -14
- package/Mosaic/Mosaic.js +20 -7
- package/Mosaic/Mosaic.js.map +1 -0
- package/Mosaic/Mosaic.stories.js +31 -28
- package/Mosaic/Mosaic.stories.js.map +1 -0
- package/Mosaic/index.js +16 -1
- package/Mosaic/index.js.map +1 -0
- package/Progress/CircularProgress.d.ts +8 -16
- package/Progress/CircularProgress.js +32 -22
- package/Progress/CircularProgress.js.map +1 -0
- package/Progress/index.js +13 -1
- package/Progress/index.js.map +1 -0
- package/Radio/Radio.d.ts +2 -6
- package/Radio/Radio.js +36 -41
- package/Radio/Radio.js.map +1 -0
- package/Radio/Radio.styles.js +9 -4
- package/Radio/Radio.styles.js.map +1 -0
- package/Radio/RadioGroup.d.ts +1 -6
- package/Radio/RadioGroup.js +30 -34
- package/Radio/RadioGroup.js.map +1 -0
- package/Radio/RadioGroup.stories.js +23 -20
- package/Radio/RadioGroup.stories.js.map +1 -0
- package/Radio/index.js +20 -2
- package/Radio/index.js.map +1 -0
- package/RichTextEditor/RichTextEditor.d.ts +13 -9
- package/RichTextEditor/RichTextEditor.js +79 -78
- package/RichTextEditor/RichTextEditor.js.map +1 -0
- package/RichTextEditor/RichTextEditor.stories.js +15 -11
- package/RichTextEditor/RichTextEditor.stories.js.map +1 -0
- package/RichTextEditor/createPropsFromConfig.d.ts +11 -1
- package/RichTextEditor/createPropsFromConfig.js +16 -5
- package/RichTextEditor/createPropsFromConfig.js.map +1 -0
- package/RichTextEditor/index.d.ts +1 -0
- package/RichTextEditor/index.js +27 -2
- package/RichTextEditor/index.js.map +1 -0
- package/Ripple/Ripple.d.ts +4 -5
- package/Ripple/Ripple.js +11 -6
- package/Ripple/Ripple.js.map +1 -0
- package/Ripple/Ripple.stories.js +45 -42
- package/Ripple/Ripple.stories.js.map +1 -0
- package/Ripple/index.js +16 -1
- package/Ripple/index.js.map +1 -0
- package/Scrollbar/Scrollbar.d.ts +5 -5
- package/Scrollbar/Scrollbar.js +10 -5
- package/Scrollbar/Scrollbar.js.map +1 -0
- package/Scrollbar/Scrollbar.stories.js +12 -9
- package/Scrollbar/Scrollbar.stories.js.map +1 -0
- package/Scrollbar/index.js +16 -1
- package/Scrollbar/index.js.map +1 -0
- package/Section/Section.stories.js +15 -12
- package/Section/Section.stories.js.map +1 -0
- package/Section/index.d.ts +4 -5
- package/Section/index.js +23 -18
- package/Section/index.js.map +1 -0
- package/Select/Select.d.ts +8 -10
- package/Select/Select.js +79 -39
- package/Select/Select.js.map +1 -0
- package/Select/Select.stories.js +28 -25
- package/Select/Select.stories.js.map +1 -0
- package/Select/index.js +16 -1
- package/Select/index.js.map +1 -0
- package/Select/styled.d.ts +8 -0
- package/Select/styled.js +18 -0
- package/Select/styled.js.map +1 -0
- package/Skeleton/README.md +21 -0
- package/Skeleton/Skeleton.d.ts +8 -0
- package/Skeleton/Skeleton.js +22 -0
- package/Skeleton/Skeleton.js.map +1 -0
- package/Skeleton/Skeleton.stories.d.ts +1 -0
- package/Skeleton/Skeleton.stories.js +22 -0
- package/Skeleton/Skeleton.stories.js.map +1 -0
- package/Skeleton/index.d.ts +1 -0
- package/Skeleton/index.js +16 -0
- package/Skeleton/index.js.map +1 -0
- package/Slider/Slider.d.ts +1 -6
- package/Slider/Slider.js +39 -47
- package/Slider/Slider.js.map +1 -0
- package/Slider/Slider.stories.js +20 -17
- package/Slider/Slider.stories.js.map +1 -0
- package/Slider/index.js +13 -1
- package/Slider/index.js.map +1 -0
- package/Snackbar/Snackbar.d.ts +5 -7
- package/Snackbar/Snackbar.js +29 -33
- package/Snackbar/Snackbar.js.map +1 -0
- package/Snackbar/Snackbar.stories.js +29 -38
- package/Snackbar/Snackbar.stories.js.map +1 -0
- package/Snackbar/index.js +18 -1
- package/Snackbar/index.js.map +1 -0
- package/Switch/Switch.d.ts +3 -7
- package/Switch/Switch.js +35 -43
- package/Switch/Switch.js.map +1 -0
- package/Switch/Switch.stories.js +19 -16
- package/Switch/Switch.stories.js.map +1 -0
- package/Switch/index.js +16 -1
- package/Switch/index.js.map +1 -0
- package/Tabs/Tab.d.ts +7 -2
- package/Tabs/Tab.js +30 -9
- package/Tabs/Tab.js.map +1 -0
- package/Tabs/Tabs.d.ts +44 -21
- package/Tabs/Tabs.js +128 -129
- package/Tabs/Tabs.js.map +1 -0
- package/Tabs/Tabs.stories.js +25 -23
- package/Tabs/Tabs.stories.js.map +1 -0
- package/Tabs/index.js +27 -2
- package/Tabs/index.js.map +1 -0
- package/Tags/Tags.d.ts +9 -21
- package/Tags/Tags.js +95 -124
- package/Tags/Tags.js.map +1 -0
- package/Tags/Tags.stories.js +19 -16
- package/Tags/Tags.stories.js.map +1 -0
- package/Tags/index.js +16 -1
- package/Tags/index.js.map +1 -0
- package/Tooltip/Tooltip.d.ts +9 -8
- package/Tooltip/Tooltip.js +33 -33
- package/Tooltip/Tooltip.js.map +1 -0
- package/Tooltip/Tooltip.stories.js +14 -11
- package/Tooltip/Tooltip.stories.js.map +1 -0
- package/Tooltip/index.js +16 -1
- package/Tooltip/index.js.map +1 -0
- package/TopAppBar/TopAppBar.d.ts +1 -1
- package/TopAppBar/TopAppBar.js +13 -9
- package/TopAppBar/TopAppBar.js.map +1 -0
- package/TopAppBar/TopAppBar.stories.js +31 -30
- package/TopAppBar/TopAppBar.stories.js.map +1 -0
- package/TopAppBar/TopAppBarActionItem.d.ts +1 -1
- package/TopAppBar/TopAppBarActionItem.js +10 -5
- package/TopAppBar/TopAppBarActionItem.js.map +1 -0
- package/TopAppBar/TopAppBarNavigationIcon.d.ts +1 -1
- package/TopAppBar/TopAppBarNavigationIcon.js +10 -5
- package/TopAppBar/TopAppBarNavigationIcon.js.map +1 -0
- package/TopAppBar/TopAppBarPrimary.js +13 -9
- package/TopAppBar/TopAppBarPrimary.js.map +1 -0
- package/TopAppBar/TopAppBarSecondary.js +15 -11
- package/TopAppBar/TopAppBarSecondary.js.map +1 -0
- package/TopAppBar/TopAppBarSection.d.ts +1 -1
- package/TopAppBar/TopAppBarSection.js +13 -9
- package/TopAppBar/TopAppBarSection.js.map +1 -0
- package/TopAppBar/TopAppBarTitle.d.ts +1 -1
- package/TopAppBar/TopAppBarTitle.js +13 -9
- package/TopAppBar/TopAppBarTitle.js.map +1 -0
- package/TopAppBar/index.js +82 -7
- package/TopAppBar/index.js.map +1 -0
- package/TopProgressBar/TopProgressBar.d.ts +7 -7
- package/TopProgressBar/TopProgressBar.js +15 -7
- package/TopProgressBar/TopProgressBar.js.map +1 -0
- package/TopProgressBar/TopProgressBar.stories.js +16 -13
- package/TopProgressBar/TopProgressBar.stories.js.map +1 -0
- package/TopProgressBar/hoc/index.js +13 -1
- package/TopProgressBar/hoc/index.js.map +1 -0
- package/TopProgressBar/hoc/withTopProgressBar.d.ts +1 -1
- package/TopProgressBar/hoc/withTopProgressBar.js +14 -9
- package/TopProgressBar/hoc/withTopProgressBar.js.map +1 -0
- package/TopProgressBar/index.js +16 -1
- package/TopProgressBar/index.js.map +1 -0
- package/Typography/Typography.d.ts +5 -5
- package/Typography/Typography.js +10 -5
- package/Typography/Typography.js.map +1 -0
- package/Typography/Typography.stories.js +37 -34
- package/Typography/Typography.stories.js.map +1 -0
- package/Typography/index.js +16 -1
- package/Typography/index.js.map +1 -0
- package/package.json +76 -81
- package/styles.scss +3 -4
- package/types.d.ts +4 -4
- package/types.js +5 -1
- package/types.js.map +1 -0
- package/Chips/ChipIcon.d.ts +0 -4
- package/Chips/ChipIcon.js +0 -8
- package/rmwc/textfield/code/index.d.ts +0 -135
- package/rmwc/textfield/code/index.js +0 -571
- package/rmwc/textfield/next/index.d.ts +0 -135
- package/rmwc/textfield/next/index.js +0 -560
- package/rmwc/textfield/package.json +0 -45
|
@@ -1,28 +1,31 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var
|
|
9
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _react = _interopRequireDefault(require("react"));
|
|
5
|
+
var _react2 = require("@storybook/react");
|
|
6
|
+
var _Story = require("@webiny/storybook-utils/Story");
|
|
7
|
+
var _addonKnobs = require("@storybook/addon-knobs");
|
|
8
|
+
var _README_Checkbox = _interopRequireDefault(require("./README_Checkbox.md"));
|
|
9
|
+
var _form = require("@webiny/form");
|
|
10
|
+
var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
|
11
|
+
var story = (0, _react2.storiesOf)("Components/Checkbox", module);
|
|
12
|
+
story.addDecorator(_addonKnobs.withKnobs);
|
|
10
13
|
story.add("usage - single", function () {
|
|
11
|
-
var disabled = boolean("Disabled", false);
|
|
12
|
-
return /*#__PURE__*/
|
|
14
|
+
var disabled = (0, _addonKnobs.boolean)("Disabled", false);
|
|
15
|
+
return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README_Checkbox.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, null, /*#__PURE__*/_react.default.createElement(_Story.StorySandboxExample, {
|
|
13
16
|
title: "Simple checkbox with a label and description"
|
|
14
|
-
}, /*#__PURE__*/
|
|
17
|
+
}, /*#__PURE__*/_react.default.createElement(_form.Form, null, function (_ref) {
|
|
15
18
|
var Bind = _ref.Bind;
|
|
16
|
-
return /*#__PURE__*/
|
|
19
|
+
return /*#__PURE__*/_react.default.createElement(Bind, {
|
|
17
20
|
name: "rememberMe"
|
|
18
|
-
}, /*#__PURE__*/
|
|
21
|
+
}, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
|
|
19
22
|
label: "Remember me",
|
|
20
23
|
disabled: disabled,
|
|
21
24
|
description: "You won't be logged out after you leave the app."
|
|
22
25
|
}));
|
|
23
|
-
})), /*#__PURE__*/
|
|
26
|
+
})), /*#__PURE__*/_react.default.createElement(_Story.StorySandboxCode, null, "\n <Form>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Checkbox\n label={\"Remember me\"}\n disabled={disabled}\n description={\"You won't be logged out after you leave the app.\"}\n />\n </Bind>\n )}\n </Form>\n ")));
|
|
24
27
|
}, {
|
|
25
28
|
info: {
|
|
26
|
-
propTables: [
|
|
29
|
+
propTables: [_Checkbox.default]
|
|
27
30
|
}
|
|
28
31
|
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","readme","Bind","info","propTables","Checkbox"],"sources":["Checkbox.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\nimport readme from \"./README_Checkbox.md\";\n\nimport { Form } from \"@webiny/form\";\nimport Checkbox from \"./Checkbox\";\n\nconst story = storiesOf(\"Components/Checkbox\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage - single\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple checkbox with a label and description\"}>\n <Form>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Checkbox\n label={\"Remember me\"}\n disabled={disabled}\n description={\n \"You won't be logged out after you leave the app.\"\n }\n />\n </Bind>\n )}\n </Form>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <Form>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Checkbox\n label={\"Remember me\"}\n disabled={disabled}\n description={\"You won't be logged out after you leave the app.\"}\n />\n </Bind>\n )}\n </Form>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Checkbox] } }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AACA;AAEA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,qBAAqB,EAAEC,MAAM,CAAC;AACtDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAE7BJ,KAAK,CAACK,GAAG,CACL,gBAAgB,EAChB,YAAM;EACF,IAAMC,QAAQ,GAAG,IAAAC,mBAAO,EAAC,UAAU,EAAE,KAAK,CAAC;EAE3C,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,wBAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAA+C,gBACvE,6BAAC,UAAI,QACA;IAAA,IAAGC,IAAI,QAAJA,IAAI;IAAA,oBACJ,6BAAC,IAAI;MAAC,IAAI,EAAC;IAAY,gBACnB,6BAAC,iBAAQ;MACL,KAAK,EAAE,aAAc;MACrB,QAAQ,EAAEH,QAAS;MACnB,WAAW,EACP;IACH,EACH,CACC;EAAA,CACV,CACE,CACW,eACtB,6BAAC,uBAAgB,4iBAcE,CACR,CACX;AAEhB,CAAC,EACD;EAAEI,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,iBAAQ;EAAE;AAAE,CAAC,CACvC"}
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.webinyCheckboxTitle = void 0;
|
|
7
|
+
var _emotion = require("emotion");
|
|
2
8
|
/**
|
|
3
9
|
* Controls the helper text below the checkbox.
|
|
4
10
|
* @type {string}
|
|
5
11
|
*/
|
|
6
|
-
|
|
7
|
-
var webinyCheckboxTitle = /*#__PURE__*/css({}, {
|
|
12
|
+
var webinyCheckboxTitle = /*#__PURE__*/(0, _emotion.css)({}, {
|
|
8
13
|
"&.mdc-text-field-helper-text": {
|
|
9
14
|
//paddingLeft: 10,
|
|
10
15
|
textTransform: "uppercase",
|
|
@@ -12,4 +17,4 @@ var webinyCheckboxTitle = /*#__PURE__*/css({}, {
|
|
|
12
17
|
marginBottom: "5px"
|
|
13
18
|
}
|
|
14
19
|
}, "label:webinyCheckboxTitle;");
|
|
15
|
-
|
|
20
|
+
exports.webinyCheckboxTitle = webinyCheckboxTitle;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["webinyCheckboxTitle","css","textTransform","fontWeight","marginBottom"],"sources":["Checkbox.styles.ts"],"sourcesContent":["import { css } from \"emotion\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst webinyCheckboxTitle = css(\n {},\n {\n \"&.mdc-text-field-helper-text\": {\n //paddingLeft: 10,\n textTransform: \"uppercase\",\n fontWeight: \"bold\",\n marginBottom: \"5px\"\n }\n }\n);\n\nexport { webinyCheckboxTitle };\n"],"mappings":";;;;;;AAAA;AAEA;AACA;AACA;AACA;AACA,IAAMA,mBAAmB,gBAAG,IAAAC,YAAG,EAC3B,CAAC,CAAC,EACF;EACI,8BAA8B,EAAE;IAC5B;IACAC,aAAa,EAAE,WAAW;IAC1BC,UAAU,EAAE,MAAM;IAClBC,YAAY,EAAE;EAClB;AACJ,CAAC,+BACJ;AAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from "react";
|
|
2
2
|
import { FormComponentProps } from "../types";
|
|
3
|
-
interface ChildrenRenderProp {
|
|
3
|
+
export interface ChildrenRenderProp {
|
|
4
4
|
onChange: (id: string | number) => () => void;
|
|
5
5
|
getValue: (id: string | number) => boolean;
|
|
6
6
|
}
|
|
@@ -1,49 +1,49 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = void 0;
|
|
8
|
+
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
9
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
10
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
11
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
12
|
+
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
13
|
+
var _react = _interopRequireDefault(require("react"));
|
|
14
|
+
var _Checkbox = require("./Checkbox.styles");
|
|
15
|
+
var _FormElementMessage = require("../FormElementMessage");
|
|
9
16
|
var CheckboxGroup = /*#__PURE__*/function (_React$Component) {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var _super = _createSuper(CheckboxGroup);
|
|
13
|
-
|
|
17
|
+
(0, _inherits2.default)(CheckboxGroup, _React$Component);
|
|
18
|
+
var _super = (0, _createSuper2.default)(CheckboxGroup);
|
|
14
19
|
function CheckboxGroup() {
|
|
15
|
-
|
|
16
|
-
|
|
20
|
+
(0, _classCallCheck2.default)(this, CheckboxGroup);
|
|
17
21
|
return _super.apply(this, arguments);
|
|
18
22
|
}
|
|
19
|
-
|
|
20
|
-
_createClass(CheckboxGroup, [{
|
|
23
|
+
(0, _createClass2.default)(CheckboxGroup, [{
|
|
21
24
|
key: "render",
|
|
22
25
|
value: function render() {
|
|
23
26
|
var _this = this;
|
|
24
|
-
|
|
25
27
|
var _this$props = this.props,
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return /*#__PURE__*/
|
|
34
|
-
className: "mdc-text-field-helper-text mdc-text-field-helper-text--persistent " + webinyCheckboxTitle
|
|
28
|
+
description = _this$props.description,
|
|
29
|
+
label = _this$props.label,
|
|
30
|
+
_this$props$validatio = _this$props.validation,
|
|
31
|
+
validation = _this$props$validatio === void 0 ? {
|
|
32
|
+
isValid: null,
|
|
33
|
+
message: null
|
|
34
|
+
} : _this$props$validatio;
|
|
35
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, label && /*#__PURE__*/_react.default.createElement("div", {
|
|
36
|
+
className: "mdc-text-field-helper-text mdc-text-field-helper-text--persistent " + _Checkbox.webinyCheckboxTitle
|
|
35
37
|
}, label), this.props.children({
|
|
36
38
|
onChange: function onChange(value) {
|
|
37
39
|
return function () {
|
|
38
|
-
var values = Array.isArray(_this.props.value) ? _this.props.value : [];
|
|
40
|
+
var values = Array.isArray(_this.props.value) ? (0, _toConsumableArray2.default)(_this.props.value) : [];
|
|
39
41
|
var index = values.indexOf(value);
|
|
40
|
-
|
|
41
42
|
if (index > -1) {
|
|
42
43
|
values.splice(index, 1);
|
|
43
44
|
} else {
|
|
44
45
|
values.push(value);
|
|
45
46
|
}
|
|
46
|
-
|
|
47
47
|
_this.props.onChange && _this.props.onChange(values);
|
|
48
48
|
};
|
|
49
49
|
},
|
|
@@ -51,13 +51,12 @@ var CheckboxGroup = /*#__PURE__*/function (_React$Component) {
|
|
|
51
51
|
var values = Array.isArray(_this.props.value) ? _this.props.value : [];
|
|
52
52
|
return values.includes(id);
|
|
53
53
|
}
|
|
54
|
-
}), validation.isValid === false && /*#__PURE__*/
|
|
54
|
+
}), validation.isValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
|
|
55
55
|
error: true
|
|
56
|
-
}, validation.message), validation.isValid !== false && description && /*#__PURE__*/
|
|
56
|
+
}, validation.message), validation.isValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
|
|
57
57
|
}
|
|
58
58
|
}]);
|
|
59
|
-
|
|
60
59
|
return CheckboxGroup;
|
|
61
|
-
}(
|
|
62
|
-
|
|
63
|
-
|
|
60
|
+
}(_react.default.Component);
|
|
61
|
+
var _default = CheckboxGroup;
|
|
62
|
+
exports.default = _default;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["CheckboxGroup","props","description","label","validation","isValid","message","webinyCheckboxTitle","children","onChange","value","values","Array","isArray","index","indexOf","splice","push","getValue","id","includes","React","Component"],"sources":["CheckboxGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"./../types\";\nimport { webinyCheckboxTitle } from \"./Checkbox.styles\";\nimport { FormElementMessage } from \"../FormElementMessage\";\n\nexport interface ChildrenRenderProp {\n onChange: (id: string | number) => () => void;\n getValue: (id: string | number) => boolean;\n}\n\ntype Props = FormComponentProps & {\n // Form element's label.\n label?: string;\n\n // Form element's description.\n description?: string;\n\n // An array of Checkbox components.\n children: (props: ChildrenRenderProp) => React.ReactNode;\n};\n\nclass CheckboxGroup extends React.Component<Props> {\n public override render() {\n const { description, label, validation = { isValid: null, message: null } } = this.props;\n\n return (\n <React.Fragment>\n {label && (\n <div\n className={\n \"mdc-text-field-helper-text mdc-text-field-helper-text--persistent \" +\n webinyCheckboxTitle\n }\n >\n {label}\n </div>\n )}\n\n {this.props.children({\n onChange: value => {\n return () => {\n const values = Array.isArray(this.props.value)\n ? [...this.props.value]\n : [];\n const index = values.indexOf(value);\n if (index > -1) {\n values.splice(index, 1);\n } else {\n values.push(value);\n }\n\n this.props.onChange && this.props.onChange(values);\n };\n },\n getValue: id => {\n const values = Array.isArray(this.props.value) ? this.props.value : [];\n return values.includes(id);\n }\n })}\n\n {validation.isValid === false && (\n <FormElementMessage error>{validation.message}</FormElementMessage>\n )}\n\n {validation.isValid !== false && description && (\n <FormElementMessage>{description}</FormElementMessage>\n )}\n </React.Fragment>\n );\n }\n}\n\nexport default CheckboxGroup;\n"],"mappings":";;;;;;;;;;;;AAAA;AAEA;AACA;AAA2D,IAkBrDA,aAAa;EAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA,OACf,kBAAyB;MAAA;MACrB,kBAA8E,IAAI,CAACC,KAAK;QAAhFC,WAAW,eAAXA,WAAW;QAAEC,KAAK,eAALA,KAAK;QAAA,oCAAEC,UAAU;QAAVA,UAAU,sCAAG;UAAEC,OAAO,EAAE,IAAI;UAAEC,OAAO,EAAE;QAAK,CAAC;MAEzE,oBACI,6BAAC,cAAK,CAAC,QAAQ,QACVH,KAAK,iBACF;QACI,SAAS,EACL,oEAAoE,GACpEI;MACH,GAEAJ,KAAK,CAEb,EAEA,IAAI,CAACF,KAAK,CAACO,QAAQ,CAAC;QACjBC,QAAQ,EAAE,kBAAAC,KAAK,EAAI;UACf,OAAO,YAAM;YACT,IAAMC,MAAM,GAAGC,KAAK,CAACC,OAAO,CAAC,KAAI,CAACZ,KAAK,CAACS,KAAK,CAAC,oCACpC,KAAI,CAACT,KAAK,CAACS,KAAK,IACpB,EAAE;YACR,IAAMI,KAAK,GAAGH,MAAM,CAACI,OAAO,CAACL,KAAK,CAAC;YACnC,IAAII,KAAK,GAAG,CAAC,CAAC,EAAE;cACZH,MAAM,CAACK,MAAM,CAACF,KAAK,EAAE,CAAC,CAAC;YAC3B,CAAC,MAAM;cACHH,MAAM,CAACM,IAAI,CAACP,KAAK,CAAC;YACtB;YAEA,KAAI,CAACT,KAAK,CAACQ,QAAQ,IAAI,KAAI,CAACR,KAAK,CAACQ,QAAQ,CAACE,MAAM,CAAC;UACtD,CAAC;QACL,CAAC;QACDO,QAAQ,EAAE,kBAAAC,EAAE,EAAI;UACZ,IAAMR,MAAM,GAAGC,KAAK,CAACC,OAAO,CAAC,KAAI,CAACZ,KAAK,CAACS,KAAK,CAAC,GAAG,KAAI,CAACT,KAAK,CAACS,KAAK,GAAG,EAAE;UACtE,OAAOC,MAAM,CAACS,QAAQ,CAACD,EAAE,CAAC;QAC9B;MACJ,CAAC,CAAC,EAEDf,UAAU,CAACC,OAAO,KAAK,KAAK,iBACzB,6BAAC,sCAAkB;QAAC,KAAK;MAAA,GAAED,UAAU,CAACE,OAAO,CAChD,EAEAF,UAAU,CAACC,OAAO,KAAK,KAAK,IAAIH,WAAW,iBACxC,6BAAC,sCAAkB,QAAEA,WAAW,CACnC,CACY;IAEzB;EAAC;EAAA;AAAA,EAhDuBmB,cAAK,CAACC,SAAS;AAAA,eAmD5BtB,aAAa;AAAA"}
|
|
@@ -1,14 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var
|
|
9
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _react = _interopRequireDefault(require("react"));
|
|
5
|
+
var _react2 = require("@storybook/react");
|
|
6
|
+
var _Story = require("@webiny/storybook-utils/Story");
|
|
7
|
+
var _addonKnobs = require("@storybook/addon-knobs");
|
|
8
|
+
var _README_CheckboxGroup = _interopRequireDefault(require("./README_CheckboxGroup.md"));
|
|
9
|
+
var _form = require("@webiny/form");
|
|
10
|
+
var _ = require(".");
|
|
11
|
+
var story = (0, _react2.storiesOf)("Components/Checkbox", module);
|
|
12
|
+
story.addDecorator(_addonKnobs.withKnobs);
|
|
10
13
|
story.add("usage - group", function () {
|
|
11
|
-
var disabled = boolean("Disabled", false);
|
|
14
|
+
var disabled = (0, _addonKnobs.boolean)("Disabled", false);
|
|
12
15
|
var options = [{
|
|
13
16
|
id: "apple",
|
|
14
17
|
name: "Apple"
|
|
@@ -19,26 +22,26 @@ story.add("usage - group", function () {
|
|
|
19
22
|
id: "orange",
|
|
20
23
|
name: "Orange"
|
|
21
24
|
}];
|
|
22
|
-
return /*#__PURE__*/
|
|
25
|
+
return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README_CheckboxGroup.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, null, /*#__PURE__*/_react.default.createElement(_Story.StorySandboxExample, {
|
|
23
26
|
title: "Simple checkbox with label and description"
|
|
24
|
-
}, /*#__PURE__*/
|
|
27
|
+
}, /*#__PURE__*/_react.default.createElement(_form.Form, {
|
|
25
28
|
data: {
|
|
26
29
|
fruits: ["pear"]
|
|
27
30
|
}
|
|
28
31
|
}, function (_ref) {
|
|
29
32
|
var Bind = _ref.Bind;
|
|
30
|
-
return /*#__PURE__*/
|
|
33
|
+
return /*#__PURE__*/_react.default.createElement(Bind, {
|
|
31
34
|
name: "fruits"
|
|
32
|
-
}, /*#__PURE__*/
|
|
35
|
+
}, /*#__PURE__*/_react.default.createElement(_.CheckboxGroup, {
|
|
33
36
|
label: "Fruits selection",
|
|
34
37
|
description: "Choose only fruits you like."
|
|
35
38
|
}, function (_ref2) {
|
|
36
39
|
var onChange = _ref2.onChange,
|
|
37
|
-
|
|
38
|
-
return /*#__PURE__*/
|
|
40
|
+
getValue = _ref2.getValue;
|
|
41
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, options.map(function (_ref3) {
|
|
39
42
|
var id = _ref3.id,
|
|
40
|
-
|
|
41
|
-
return /*#__PURE__*/
|
|
43
|
+
name = _ref3.name;
|
|
44
|
+
return /*#__PURE__*/_react.default.createElement(_.Checkbox, {
|
|
42
45
|
disabled: disabled,
|
|
43
46
|
key: id,
|
|
44
47
|
label: name,
|
|
@@ -47,9 +50,9 @@ story.add("usage - group", function () {
|
|
|
47
50
|
});
|
|
48
51
|
}));
|
|
49
52
|
}));
|
|
50
|
-
})), /*#__PURE__*/
|
|
53
|
+
})), /*#__PURE__*/_react.default.createElement(_Story.StorySandboxCode, null, "\n <Form data={{fruits: ['pear']}}>\n {({ Bind }) => (\n <Bind name=\"fruits\">\n <CheckboxGroup\n label=\"Fruits selection\"\n description={\"Choose only fruits you like.\"}\n >\n {({ onChange, getValue }) => (\n <React.Fragment>\n {options.map(({id, name}) => (\n <Checkbox\n disabled={disabled}\n key={id}\n label={name}\n value={getValue(id)}\n onChange={onChange(id)}\n />\n ))}\n </React.Fragment>\n )}\n </CheckboxGroup>\n </Bind>\n )}\n </Form>\n ")));
|
|
51
54
|
}, {
|
|
52
55
|
info: {
|
|
53
|
-
propTables: [CheckboxGroup]
|
|
56
|
+
propTables: [_.CheckboxGroup]
|
|
54
57
|
}
|
|
55
58
|
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","options","id","name","readme","fruits","Bind","onChange","getValue","map","info","propTables","CheckboxGroup"],"sources":["CheckboxGroup.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\nimport readme from \"./README_CheckboxGroup.md\";\n\nimport { Form } from \"@webiny/form\";\nimport { Checkbox, CheckboxGroup } from \".\";\n\nconst story = storiesOf(\"Components/Checkbox\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage - group\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n const options = [\n { id: \"apple\", name: \"Apple\" },\n { id: \"pear\", name: \"Pear\" },\n { id: \"orange\", name: \"Orange\" }\n ];\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple checkbox with label and description\"}>\n <Form data={{ fruits: [\"pear\"] }}>\n {({ Bind }) => (\n <Bind name=\"fruits\">\n <CheckboxGroup\n label=\"Fruits selection\"\n description={\"Choose only fruits you like.\"}\n >\n {({ onChange, getValue }) => (\n <React.Fragment>\n {options.map(({ id, name }) => (\n <Checkbox\n disabled={disabled}\n key={id}\n label={name}\n value={getValue(id)}\n onChange={onChange(id)}\n />\n ))}\n </React.Fragment>\n )}\n </CheckboxGroup>\n </Bind>\n )}\n </Form>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <Form data={{fruits: ['pear']}}>\n {({ Bind }) => (\n <Bind name=\"fruits\">\n <CheckboxGroup\n label=\"Fruits selection\"\n description={\"Choose only fruits you like.\"}\n >\n {({ onChange, getValue }) => (\n <React.Fragment>\n {options.map(({id, name}) => (\n <Checkbox\n disabled={disabled}\n key={id}\n label={name}\n value={getValue(id)}\n onChange={onChange(id)}\n />\n ))}\n </React.Fragment>\n )}\n </CheckboxGroup>\n </Bind>\n )}\n </Form>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [CheckboxGroup] } }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AACA;AAEA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,qBAAqB,EAAEC,MAAM,CAAC;AACtDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAE7BJ,KAAK,CAACK,GAAG,CACL,eAAe,EACf,YAAM;EACF,IAAMC,QAAQ,GAAG,IAAAC,mBAAO,EAAC,UAAU,EAAE,KAAK,CAAC;EAE3C,IAAMC,OAAO,GAAG,CACZ;IAAEC,EAAE,EAAE,OAAO;IAAEC,IAAI,EAAE;EAAQ,CAAC,EAC9B;IAAED,EAAE,EAAE,MAAM;IAAEC,IAAI,EAAE;EAAO,CAAC,EAC5B;IAAED,EAAE,EAAE,QAAQ;IAAEC,IAAI,EAAE;EAAS,CAAC,CACnC;EAED,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,6BAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAA6C,gBACrE,6BAAC,UAAI;IAAC,IAAI,EAAE;MAAEC,MAAM,EAAE,CAAC,MAAM;IAAE;EAAE,GAC5B;IAAA,IAAGC,IAAI,QAAJA,IAAI;IAAA,oBACJ,6BAAC,IAAI;MAAC,IAAI,EAAC;IAAQ,gBACf,6BAAC,eAAa;MACV,KAAK,EAAC,kBAAkB;MACxB,WAAW,EAAE;IAA+B,GAE3C;MAAA,IAAGC,QAAQ,SAARA,QAAQ;QAAEC,QAAQ,SAARA,QAAQ;MAAA,oBAClB,6BAAC,cAAK,CAAC,QAAQ,QACVP,OAAO,CAACQ,GAAG,CAAC;QAAA,IAAGP,EAAE,SAAFA,EAAE;UAAEC,IAAI,SAAJA,IAAI;QAAA,oBACpB,6BAAC,UAAQ;UACL,QAAQ,EAAEJ,QAAS;UACnB,GAAG,EAAEG,EAAG;UACR,KAAK,EAAEC,IAAK;UACZ,KAAK,EAAEK,QAAQ,CAACN,EAAE,CAAE;UACpB,QAAQ,EAAEK,QAAQ,CAACL,EAAE;QAAE,EACzB;MAAA,CACL,CAAC,CACW;IAAA,CACpB,CACW,CACb;EAAA,CACV,CACE,CACW,eACtB,6BAAC,uBAAgB,01CA2BE,CACR,CACX;AAEhB,CAAC,EACD;EAAEQ,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,eAAa;EAAE;AAAE,CAAC,CAC5C"}
|
package/Checkbox/index.js
CHANGED
|
@@ -1,2 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
Object.defineProperty(exports, "Checkbox", {
|
|
8
|
+
enumerable: true,
|
|
9
|
+
get: function get() {
|
|
10
|
+
return _Checkbox.default;
|
|
11
|
+
}
|
|
12
|
+
});
|
|
13
|
+
Object.defineProperty(exports, "CheckboxGroup", {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: function get() {
|
|
16
|
+
return _CheckboxGroup.default;
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
|
20
|
+
var _CheckboxGroup = _interopRequireDefault(require("./CheckboxGroup"));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Checkbox } from \"./Checkbox\";\nexport { default as CheckboxGroup } from \"./CheckboxGroup\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AACA"}
|
package/Chips/Chip.d.ts
CHANGED
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from "react";
|
|
2
2
|
import { ChipProps as RmwcChipProps } from "@rmwc/chip";
|
|
3
|
-
export declare type ChipProps = RmwcChipProps
|
|
4
|
-
|
|
5
|
-
* Chip content
|
|
6
|
-
*/
|
|
7
|
-
children?: React.ReactNode;
|
|
8
|
-
};
|
|
9
|
-
export declare const Chip: (props: ChipProps) => JSX.Element;
|
|
3
|
+
export declare type ChipProps = RmwcChipProps;
|
|
4
|
+
export declare const Chip: React.FC<ChipProps>;
|
package/Chips/Chip.js
CHANGED
|
@@ -1,10 +1,17 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.Chip = void 0;
|
|
8
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
9
|
+
var _react = _interopRequireDefault(require("react"));
|
|
10
|
+
var _chip = require("@rmwc/chip");
|
|
2
11
|
var _excluded = ["children"];
|
|
3
|
-
|
|
4
|
-
import { Chip as RmwcChip } from "@rmwc/chip";
|
|
5
|
-
export var Chip = function Chip(props) {
|
|
12
|
+
var Chip = function Chip(props) {
|
|
6
13
|
var children = props.children,
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
14
|
+
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
15
|
+
return /*#__PURE__*/_react.default.createElement(_chip.Chip, rest, children);
|
|
16
|
+
};
|
|
17
|
+
exports.Chip = Chip;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Chip","props","children","rest"],"sources":["Chip.tsx"],"sourcesContent":["import React from \"react\";\nimport { Chip as RmwcChip, ChipProps as RmwcChipProps } from \"@rmwc/chip\";\n\nexport type ChipProps = RmwcChipProps;\n\nexport const Chip: React.FC<ChipProps> = props => {\n const { children, ...rest } = props;\n return <RmwcChip {...rest}>{children}</RmwcChip>;\n};\n"],"mappings":";;;;;;;;AAAA;AACA;AAA0E;AAInE,IAAMA,IAAyB,GAAG,SAA5BA,IAAyB,CAAGC,KAAK,EAAI;EAC9C,IAAQC,QAAQ,GAAcD,KAAK,CAA3BC,QAAQ;IAAKC,IAAI,0CAAKF,KAAK;EACnC,oBAAO,6BAAC,UAAQ,EAAKE,IAAI,EAAGD,QAAQ,CAAY;AACpD,CAAC;AAAC"}
|
package/Chips/Chips.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from "react";
|
|
2
2
|
import { Chip } from "./Chip";
|
|
3
|
-
export
|
|
3
|
+
export interface ChipsProps {
|
|
4
4
|
/**
|
|
5
5
|
* Chips to show
|
|
6
6
|
*/
|
|
@@ -17,5 +17,5 @@ export declare type ChipsProps = {
|
|
|
17
17
|
* Style object.
|
|
18
18
|
*/
|
|
19
19
|
style?: React.CSSProperties;
|
|
20
|
-
}
|
|
21
|
-
export declare const Chips:
|
|
20
|
+
}
|
|
21
|
+
export declare const Chips: React.FC<ChipsProps>;
|
package/Chips/Chips.js
CHANGED
|
@@ -1,17 +1,24 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.Chips = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
12
|
+
var _chip = require("@rmwc/chip");
|
|
13
|
+
var _styles = require("./styles");
|
|
3
14
|
var _excluded = ["children", "className", "disabled"];
|
|
4
|
-
|
|
5
|
-
import classNames from "classnames";
|
|
6
|
-
import { ChipSet } from "@rmwc/chip";
|
|
7
|
-
import { chipIconWrapper, disabledChips } from "./styles";
|
|
8
|
-
export var Chips = function Chips(props) {
|
|
15
|
+
var Chips = function Chips(props) {
|
|
9
16
|
var children = props.children,
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
className: classNames(className, chipIconWrapper, _defineProperty({}, disabledChips, disabled))
|
|
17
|
+
className = props.className,
|
|
18
|
+
disabled = props.disabled,
|
|
19
|
+
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
20
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_chip.ChipSet, Object.assign({}, rest, {
|
|
21
|
+
className: (0, _classnames.default)(className, _styles.chipIconWrapper, (0, _defineProperty2.default)({}, _styles.disabledChips, disabled))
|
|
16
22
|
}), children));
|
|
17
|
-
};
|
|
23
|
+
};
|
|
24
|
+
exports.Chips = Chips;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Chips","props","children","className","disabled","rest","classNames","chipIconWrapper","disabledChips"],"sources":["Chips.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport { ChipSet } from \"@rmwc/chip\";\nimport { Chip } from \"./Chip\";\nimport { chipIconWrapper, disabledChips } from \"./styles\";\n\nexport interface ChipsProps {\n /**\n * Chips to show\n */\n children?: React.ReactElement<typeof Chip> | React.ReactElement<typeof Chip>[];\n\n /**\n * Is chip disabled?\n */\n disabled?: boolean;\n\n /**\n * CSS class name\n */\n className?: string;\n\n /**\n * Style object.\n */\n style?: React.CSSProperties;\n}\n\nexport const Chips: React.FC<ChipsProps> = props => {\n const { children, className, disabled, ...rest } = props;\n\n return (\n <React.Fragment>\n <ChipSet\n {...rest}\n className={classNames(className, chipIconWrapper, {\n [disabledChips]: disabled\n })}\n >\n {children}\n </ChipSet>\n </React.Fragment>\n );\n};\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AAEA;AAA0D;AAwBnD,IAAMA,KAA2B,GAAG,SAA9BA,KAA2B,CAAGC,KAAK,EAAI;EAChD,IAAQC,QAAQ,GAAmCD,KAAK,CAAhDC,QAAQ;IAAEC,SAAS,GAAwBF,KAAK,CAAtCE,SAAS;IAAEC,QAAQ,GAAcH,KAAK,CAA3BG,QAAQ;IAAKC,IAAI,0CAAKJ,KAAK;EAExD,oBACI,6BAAC,cAAK,CAAC,QAAQ,qBACX,6BAAC,aAAO,oBACAI,IAAI;IACR,SAAS,EAAE,IAAAC,mBAAU,EAACH,SAAS,EAAEI,uBAAe,oCAC3CC,qBAAa,EAAGJ,QAAQ;EAC1B,IAEFF,QAAQ,CACH,CACG;AAEzB,CAAC;AAAC"}
|
package/Chips/Chips.stories.js
CHANGED
|
@@ -1,25 +1,32 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _react = _interopRequireDefault(require("react"));
|
|
5
|
+
var _react2 = require("@storybook/react");
|
|
6
|
+
var _Story = require("@webiny/storybook-utils/Story");
|
|
7
|
+
var _README = _interopRequireDefault(require("./README.md"));
|
|
8
|
+
var _baselineDone24px = require("./icons/baseline-done-24px.svg");
|
|
9
|
+
var _baselineEmail24px = require("./icons/baseline-email-24px.svg");
|
|
10
|
+
var _index = require("./index");
|
|
11
|
+
var story = (0, _react2.storiesOf)("Components/Chips", module);
|
|
9
12
|
story.add("usage", function () {
|
|
10
|
-
return /*#__PURE__*/
|
|
13
|
+
return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, null, /*#__PURE__*/_react.default.createElement(_Story.StorySandboxExample, {
|
|
11
14
|
title: "Simple chips with a label and description"
|
|
12
|
-
}, /*#__PURE__*/
|
|
15
|
+
}, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_index.Chips, null, /*#__PURE__*/_react.default.createElement(_index.Chip, {
|
|
13
16
|
selected: true
|
|
14
|
-
}, "Cookies"), /*#__PURE__*/
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
17
|
+
}, "Cookies"), /*#__PURE__*/_react.default.createElement(_index.Chip, null, "Pizza"), /*#__PURE__*/_react.default.createElement(_index.Chip, null, "Icecream")), /*#__PURE__*/_react.default.createElement(_index.Chips, null, /*#__PURE__*/_react.default.createElement(_index.Chip, {
|
|
18
|
+
icon: /*#__PURE__*/_react.default.createElement(_baselineEmail24px.ReactComponent, null)
|
|
19
|
+
}, "Cookies"), /*#__PURE__*/_react.default.createElement(_index.Chip, {
|
|
20
|
+
trailingIcon: true,
|
|
21
|
+
icon: /*#__PURE__*/_react.default.createElement(_baselineDone24px.ReactComponent, null)
|
|
22
|
+
}, "Cookies"), /*#__PURE__*/_react.default.createElement(_index.Chip, {
|
|
23
|
+
icon: /*#__PURE__*/_react.default.createElement(_baselineEmail24px.ReactComponent, null)
|
|
24
|
+
}, "Cookies"), /*#__PURE__*/_react.default.createElement(_index.Chip, {
|
|
25
|
+
trailingIcon: true,
|
|
26
|
+
icon: /*#__PURE__*/_react.default.createElement(_baselineDone24px.ReactComponent, null)
|
|
27
|
+
}, "Cookies")))), /*#__PURE__*/_react.default.createElement(_Story.StorySandboxCode, null, "\n <div>\n <Chips>\n <Chip selected>\n Cookies\n </Chip>\n <Chip>\n Pizza\n </Chip>\n <Chip>\n Icecream\n </Chip>\n </Chips>\n <Chips>\n <Chip>\n <ChipIcon leading icon={<BaselineEmailIcon />} />\n Cookies\n <ChipIcon trailing icon={<BaselineDoneIcon />} />\n </Chip>\n </Chips>\n </div>\n ")));
|
|
21
28
|
}, {
|
|
22
29
|
info: {
|
|
23
|
-
propTables: [Chip,
|
|
30
|
+
propTables: [_index.Chip, _index.Chips]
|
|
24
31
|
}
|
|
25
32
|
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","add","readme","info","propTables","Chip","Chips"],"sources":["Chips.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./README.md\";\n\nimport { ReactComponent as BaselineDoneIcon } from \"./icons/baseline-done-24px.svg\";\nimport { ReactComponent as BaselineEmailIcon } from \"./icons/baseline-email-24px.svg\";\nimport { Chip, Chips } from \"./index\";\n\nconst story = storiesOf(\"Components/Chips\", module);\n\nstory.add(\n \"usage\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple chips with a label and description\"}>\n <div>\n <Chips>\n <Chip selected>Cookies</Chip>\n <Chip>Pizza</Chip>\n <Chip>Icecream</Chip>\n </Chips>\n\n <Chips>\n <Chip icon={<BaselineEmailIcon />}>Cookies</Chip>\n <Chip trailingIcon icon={<BaselineDoneIcon />}>\n Cookies\n </Chip>\n <Chip icon={<BaselineEmailIcon />}>Cookies</Chip>\n <Chip trailingIcon icon={<BaselineDoneIcon />}>\n Cookies\n </Chip>\n </Chips>\n </div>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <div>\n <Chips>\n <Chip selected>\n Cookies\n </Chip>\n <Chip>\n Pizza\n </Chip>\n <Chip>\n Icecream\n </Chip>\n </Chips>\n <Chips>\n <Chip>\n <ChipIcon leading icon={<BaselineEmailIcon />} />\n Cookies\n <ChipIcon trailing icon={<BaselineDoneIcon />} />\n </Chip>\n </Chips>\n </div>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Chip, Chips] } }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AAEA;AACA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,kBAAkB,EAAEC,MAAM,CAAC;AAEnDF,KAAK,CAACG,GAAG,CACL,OAAO,EACP,YAAM;EACF,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,eAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAA4C,gBACpE,uDACI,6BAAC,YAAK,qBACF,6BAAC,WAAI;IAAC,QAAQ;EAAA,GAAC,SAAO,CAAO,eAC7B,6BAAC,WAAI,QAAC,OAAK,CAAO,eAClB,6BAAC,WAAI,QAAC,UAAQ,CAAO,CACjB,eAER,6BAAC,YAAK,qBACF,6BAAC,WAAI;IAAC,IAAI,eAAE,6BAAC,iCAAiB;EAAI,GAAC,SAAO,CAAO,eACjD,6BAAC,WAAI;IAAC,YAAY;IAAC,IAAI,eAAE,6BAAC,gCAAgB;EAAI,GAAC,SAE/C,CAAO,eACP,6BAAC,WAAI;IAAC,IAAI,eAAE,6BAAC,iCAAiB;EAAI,GAAC,SAAO,CAAO,eACjD,6BAAC,WAAI;IAAC,YAAY;IAAC,IAAI,eAAE,6BAAC,gCAAgB;EAAI,GAAC,SAE/C,CAAO,CACH,CACN,CACY,eACtB,6BAAC,uBAAgB,q6BAuBE,CACR,CACX;AAEhB,CAAC,EACD;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,WAAI,EAAEC,YAAK;EAAE;AAAE,CAAC,CAC1C"}
|
package/Chips/index.d.ts
CHANGED
package/Chips/index.js
CHANGED
|
@@ -1,3 +1,27 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
var _Chips = require("./Chips");
|
|
7
|
+
Object.keys(_Chips).forEach(function (key) {
|
|
8
|
+
if (key === "default" || key === "__esModule") return;
|
|
9
|
+
if (key in exports && exports[key] === _Chips[key]) return;
|
|
10
|
+
Object.defineProperty(exports, key, {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function get() {
|
|
13
|
+
return _Chips[key];
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
});
|
|
17
|
+
var _Chip = require("./Chip");
|
|
18
|
+
Object.keys(_Chip).forEach(function (key) {
|
|
19
|
+
if (key === "default" || key === "__esModule") return;
|
|
20
|
+
if (key in exports && exports[key] === _Chip[key]) return;
|
|
21
|
+
Object.defineProperty(exports, key, {
|
|
22
|
+
enumerable: true,
|
|
23
|
+
get: function get() {
|
|
24
|
+
return _Chip[key];
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Chips\";\nexport * from \"./Chip\";\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
package/Chips/styles.js
CHANGED
|
@@ -1,17 +1,27 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.disabledChips = exports.chipIconWrapper = void 0;
|
|
7
|
+
var _emotion = require("emotion");
|
|
8
|
+
var chipIconWrapper = /*#__PURE__*/(0, _emotion.css)({
|
|
3
9
|
".mdc-chip__icon": {
|
|
10
|
+
"&.mdc-chip__icon--trailing": {
|
|
11
|
+
boxSizing: "border-box",
|
|
12
|
+
display: "flex",
|
|
13
|
+
marginLeft: "4px",
|
|
14
|
+
marginRight: "0px"
|
|
15
|
+
},
|
|
4
16
|
svg: {
|
|
5
17
|
width: 18,
|
|
6
|
-
height: 18
|
|
7
|
-
"&.mdc-chip__icon--trailing": {
|
|
8
|
-
boxSizing: "border-box",
|
|
9
|
-
display: "flex"
|
|
10
|
-
}
|
|
18
|
+
height: 18
|
|
11
19
|
}
|
|
12
20
|
}
|
|
13
21
|
}, "label:chipIconWrapper;");
|
|
14
|
-
|
|
22
|
+
exports.chipIconWrapper = chipIconWrapper;
|
|
23
|
+
var disabledChips = /*#__PURE__*/(0, _emotion.css)({
|
|
15
24
|
opacity: 0.75,
|
|
16
25
|
pointerEvents: "none"
|
|
17
|
-
}, "label:disabledChips;");
|
|
26
|
+
}, "label:disabledChips;");
|
|
27
|
+
exports.disabledChips = disabledChips;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["chipIconWrapper","css","boxSizing","display","marginLeft","marginRight","svg","width","height","disabledChips","opacity","pointerEvents"],"sources":["styles.ts"],"sourcesContent":["import { css } from \"emotion\";\n\nexport const chipIconWrapper = css({\n \".mdc-chip__icon\": {\n \"&.mdc-chip__icon--trailing\": {\n boxSizing: \"border-box\",\n display: \"flex\",\n marginLeft: \"4px\",\n marginRight: \"0px\"\n },\n svg: {\n width: 18,\n height: 18\n }\n }\n});\n\nexport const disabledChips = css({\n opacity: 0.75,\n pointerEvents: \"none\"\n});\n"],"mappings":";;;;;;AAAA;AAEO,IAAMA,eAAe,gBAAG,IAAAC,YAAG,EAAC;EAC/B,iBAAiB,EAAE;IACf,4BAA4B,EAAE;MAC1BC,SAAS,EAAE,YAAY;MACvBC,OAAO,EAAE,MAAM;MACfC,UAAU,EAAE,KAAK;MACjBC,WAAW,EAAE;IACjB,CAAC;IACDC,GAAG,EAAE;MACDC,KAAK,EAAE,EAAE;MACTC,MAAM,EAAE;IACZ;EACJ;AACJ,CAAC,2BAAC;AAAC;AAEI,IAAMC,aAAa,gBAAG,IAAAR,YAAG,EAAC;EAC7BS,OAAO,EAAE,IAAI;EACbC,aAAa,EAAE;AACnB,CAAC,yBAAC;AAAC"}
|