@webiny/ui 5.27.0-beta.0 → 5.28.0
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.js +27 -13
- package/Accordion/Accordion.js.map +1 -1
- package/Accordion/Accordion.stories.js +34 -23
- package/Accordion/Accordion.stories.js.map +1 -1
- package/Accordion/AccordionItem.js +60 -36
- package/Accordion/AccordionItem.js.map +1 -1
- package/Accordion/index.js +31 -2
- package/Accordion/index.js.map +1 -1
- package/Alert/Alert.js +21 -10
- package/Alert/Alert.js.map +1 -1
- package/Alert/Alert.stories.js +22 -13
- package/Alert/Alert.stories.js.map +1 -1
- package/Alert/index.js +18 -1
- package/Alert/index.js.map +1 -1
- package/AutoComplete/AutoComplete.js +100 -77
- package/AutoComplete/AutoComplete.js.map +1 -1
- package/AutoComplete/AutoComplete.stories.js +27 -17
- package/AutoComplete/AutoComplete.stories.js.map +1 -1
- package/AutoComplete/MultiAutoComplete.js +164 -139
- package/AutoComplete/MultiAutoComplete.js.map +1 -1
- package/AutoComplete/MultiAutoComplete.stories.js +39 -28
- package/AutoComplete/MultiAutoComplete.stories.js.map +1 -1
- package/AutoComplete/index.js +31 -2
- package/AutoComplete/index.js.map +1 -1
- package/AutoComplete/styles.js +14 -4
- package/AutoComplete/styles.js.map +1 -1
- package/AutoComplete/types.js +5 -1
- package/AutoComplete/types.js.map +1 -1
- package/AutoComplete/utils.js +19 -4
- package/AutoComplete/utils.js.map +1 -1
- package/Avatar/Avatar.js +30 -15
- package/Avatar/Avatar.js.map +1 -1
- package/Avatar/Avatar.stories.js +19 -10
- package/Avatar/Avatar.stories.js.map +1 -1
- package/Avatar/index.js +18 -1
- package/Avatar/index.js.map +1 -1
- package/Button/Button.js +52 -23
- package/Button/Button.js.map +1 -1
- package/Button/Button.stories.js +42 -29
- package/Button/Button.stories.js.map +1 -1
- package/Button/CopyButton/CopyButton.js +24 -11
- package/Button/CopyButton/CopyButton.js.map +1 -1
- package/Button/CopyButton/CopyButton.stories.js +20 -10
- package/Button/CopyButton/CopyButton.stories.js.map +1 -1
- package/Button/IconButton/IconButton.js +14 -4
- package/Button/IconButton/IconButton.js.map +1 -1
- package/Button/IconButton/IconButton.stories.js +31 -19
- package/Button/IconButton/IconButton.stories.js.map +1 -1
- package/Button/index.js +44 -3
- package/Button/index.js.map +1 -1
- package/Carousel/Carousel.js +34 -21
- package/Carousel/Carousel.js.map +1 -1
- package/Carousel/Carouser.stories.js +27 -17
- package/Carousel/Carouser.stories.js.map +1 -1
- package/Carousel/index.js +15 -1
- package/Carousel/index.js.map +1 -1
- package/Checkbox/Checkbox.js +37 -22
- package/Checkbox/Checkbox.js.map +1 -1
- package/Checkbox/Checkbox.stories.js +27 -16
- package/Checkbox/Checkbox.stories.js.map +1 -1
- package/Checkbox/Checkbox.styles.js +11 -4
- package/Checkbox/Checkbox.styles.js.map +1 -1
- package/Checkbox/CheckboxGroup.js +36 -21
- package/Checkbox/CheckboxGroup.js.map +1 -1
- package/Checkbox/CheckboxGroup.stories.js +29 -18
- package/Checkbox/CheckboxGroup.stories.js.map +1 -1
- package/Checkbox/index.js +23 -2
- package/Checkbox/index.js.map +1 -1
- package/Chips/Chip.js +21 -7
- package/Chips/Chip.js.map +1 -1
- package/Chips/ChipIcon.js +21 -7
- package/Chips/ChipIcon.js.map +1 -1
- package/Chips/Chips.js +29 -12
- package/Chips/Chips.js.map +1 -1
- package/Chips/Chips.stories.js +27 -16
- package/Chips/Chips.stories.js.map +1 -1
- package/Chips/index.js +44 -3
- package/Chips/index.js.map +1 -1
- package/Chips/styles.js +14 -4
- package/Chips/styles.js.map +1 -1
- package/CodeEditor/CodeEditor.js +48 -29
- package/CodeEditor/CodeEditor.js.map +1 -1
- package/CodeEditor/CodeEditor.stories.js +30 -17
- package/CodeEditor/CodeEditor.stories.js.map +1 -1
- package/CodeEditor/index.js +18 -1
- package/CodeEditor/index.js.map +1 -1
- package/ColorPicker/ColorPicker.js +58 -44
- package/ColorPicker/ColorPicker.js.map +1 -1
- package/ColorPicker/ColorPicker.stories.js +26 -15
- package/ColorPicker/ColorPicker.stories.js.map +1 -1
- package/ColorPicker/index.js +18 -1
- package/ColorPicker/index.js.map +1 -1
- package/ConfirmationDialog/ConfirmationDialog.js +51 -42
- package/ConfirmationDialog/ConfirmationDialog.js.map +1 -1
- package/ConfirmationDialog/ConfirmationDialog.stories.js +22 -12
- package/ConfirmationDialog/ConfirmationDialog.stories.js.map +1 -1
- package/ConfirmationDialog/index.js +31 -2
- package/ConfirmationDialog/index.js.map +1 -1
- package/ConfirmationDialog/withConfirmation.js +19 -6
- package/ConfirmationDialog/withConfirmation.js.map +1 -1
- package/Dialog/Dialog.js +68 -37
- package/Dialog/Dialog.js.map +1 -1
- package/Dialog/Dialog.stories.js +26 -16
- package/Dialog/Dialog.stories.js.map +1 -1
- package/Dialog/index.js +18 -1
- package/Dialog/index.js.map +1 -1
- package/Drawer/Drawer.js +20 -6
- package/Drawer/Drawer.js.map +1 -1
- package/Drawer/Drawer.stories.js +26 -15
- package/Drawer/Drawer.stories.js.map +1 -1
- package/Drawer/index.js +18 -1
- package/Drawer/index.js.map +1 -1
- package/DynamicFieldset/Fieldset.js +56 -47
- package/DynamicFieldset/Fieldset.js.map +1 -1
- package/DynamicFieldset/index.js +15 -1
- package/DynamicFieldset/index.js.map +1 -1
- package/Elevation/Elevation.js +17 -6
- package/Elevation/Elevation.js.map +1 -1
- package/Elevation/Elevation.stories.js +27 -16
- package/Elevation/Elevation.stories.js.map +1 -1
- package/Elevation/index.js +18 -1
- package/Elevation/index.js.map +1 -1
- package/FormElementMessage/FormElementMessage.js +15 -5
- package/FormElementMessage/FormElementMessage.js.map +1 -1
- package/FormElementMessage/index.js +13 -1
- package/FormElementMessage/index.js.map +1 -1
- package/FullName/FullName.js +8 -1
- package/FullName/FullName.js.map +1 -1
- package/FullName/index.js +18 -1
- package/FullName/index.js.map +1 -1
- package/Grid/Grid.js +26 -9
- package/Grid/Grid.js.map +1 -1
- package/Grid/Grid.stories.js +21 -12
- package/Grid/Grid.stories.js.map +1 -1
- package/Grid/index.js +18 -1
- package/Grid/index.js.map +1 -1
- package/Helpers/ClassNames.js +16 -7
- package/Helpers/ClassNames.js.map +1 -1
- package/Helpers/index.js +13 -2
- package/Helpers/index.js.map +1 -1
- package/Icon/Icon.js +19 -7
- package/Icon/Icon.js.map +1 -1
- package/Icon/Icon.stories.js +33 -20
- package/Icon/Icon.stories.js.map +1 -1
- package/Icon/index.js +18 -1
- package/Icon/index.js.map +1 -1
- package/Image/Image.js +15 -7
- package/Image/Image.js.map +1 -1
- package/Image/Image.stories.js +21 -11
- package/Image/Image.stories.js.map +1 -1
- package/Image/index.js +18 -1
- package/Image/index.js.map +1 -1
- package/ImageEditor/ImageEditor.js +75 -65
- package/ImageEditor/ImageEditor.js.map +1 -1
- package/ImageEditor/index.js +18 -1
- package/ImageEditor/index.js.map +1 -1
- package/ImageEditor/toolbar/crop.js +30 -13
- package/ImageEditor/toolbar/crop.js.map +1 -1
- package/ImageEditor/toolbar/filter.js +61 -44
- package/ImageEditor/toolbar/filter.js.map +1 -1
- package/ImageEditor/toolbar/flip.js +32 -15
- package/ImageEditor/toolbar/flip.js.map +1 -1
- package/ImageEditor/toolbar/icons/index.js +69 -8
- package/ImageEditor/toolbar/icons/index.js.map +1 -1
- package/ImageEditor/toolbar/index.js +39 -4
- package/ImageEditor/toolbar/index.js.map +1 -1
- package/ImageEditor/toolbar/rotate.js +58 -35
- package/ImageEditor/toolbar/rotate.js.map +1 -1
- package/ImageEditor/toolbar/types.js +5 -1
- package/ImageEditor/toolbar/types.js.map +1 -1
- package/ImageUpload/Image.js +57 -35
- package/ImageUpload/Image.js.map +1 -1
- package/ImageUpload/ImageEditorDialog.js +48 -30
- package/ImageUpload/ImageEditorDialog.js.map +1 -1
- package/ImageUpload/MultiImageUpload.js +88 -70
- package/ImageUpload/MultiImageUpload.js.map +1 -1
- package/ImageUpload/MultiImageUpload.stories.js +26 -15
- package/ImageUpload/MultiImageUpload.stories.js.map +1 -1
- package/ImageUpload/SingleImageUpload.js +68 -45
- package/ImageUpload/SingleImageUpload.js.map +1 -1
- package/ImageUpload/SingleImageUpload.stories.js +27 -16
- package/ImageUpload/SingleImageUpload.stories.js.map +1 -1
- package/ImageUpload/index.js +39 -4
- package/ImageUpload/index.js.map +1 -1
- package/ImageUpload/styled.d.ts +2 -2
- package/ImageUpload/styled.js +29 -15
- package/ImageUpload/styled.js.map +1 -1
- package/Input/Input.js +52 -35
- package/Input/Input.js.map +1 -1
- package/Input/Input.stories.js +62 -46
- package/Input/Input.stories.js.map +1 -1
- package/Input/__tests__/Input.test.js +37 -26
- package/Input/__tests__/Input.test.js.map +1 -1
- package/Input/index.js +18 -1
- package/Input/index.js.map +1 -1
- package/List/CollapsibleList/CollapsibleList.stories.js +27 -16
- package/List/CollapsibleList/CollapsibleList.stories.js.map +1 -1
- package/List/CollapsibleList/index.js +21 -6
- package/List/CollapsibleList/index.js.map +1 -1
- package/List/DataList/DataList.js +89 -60
- package/List/DataList/DataList.js.map +1 -1
- package/List/DataList/DataList.stories.js +37 -25
- package/List/DataList/DataList.stories.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.js +29 -10
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js +27 -9
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js +24 -8
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js.map +1 -1
- package/List/DataList/DataListModalOverlay/index.js +35 -3
- package/List/DataList/DataListModalOverlay/index.js.map +1 -1
- package/List/DataList/Loader.js +25 -13
- package/List/DataList/Loader.js.map +1 -1
- package/List/DataList/NoData.js +19 -6
- package/List/DataList/NoData.js.map +1 -1
- package/List/DataList/icons/index.js +83 -38
- package/List/DataList/icons/index.js.map +1 -1
- package/List/DataList/index.js +48 -3
- package/List/DataList/index.js.map +1 -1
- package/List/DataList/types.js +5 -1
- package/List/DataList/types.js.map +1 -1
- package/List/List.js +92 -49
- package/List/List.js.map +1 -1
- package/List/List.stories.js +52 -37
- package/List/List.stories.js.map +1 -1
- package/List/icons/index.js +23 -3
- package/List/icons/index.js.map +1 -1
- package/List/index.js +60 -3
- package/List/index.js.map +1 -1
- package/Menu/Menu.js +58 -46
- package/Menu/Menu.js.map +1 -1
- package/Menu/Menu.stories.js +24 -14
- package/Menu/Menu.stories.js.map +1 -1
- package/Menu/index.js +18 -1
- package/Menu/index.js.map +1 -1
- package/Mosaic/Mosaic.js +16 -7
- package/Mosaic/Mosaic.js.map +1 -1
- package/Mosaic/Mosaic.stories.js +37 -28
- package/Mosaic/Mosaic.stories.js.map +1 -1
- package/Mosaic/index.js +18 -1
- package/Mosaic/index.js.map +1 -1
- package/Progress/CircularProgress.js +25 -11
- package/Progress/CircularProgress.js.map +1 -1
- package/Progress/index.js +15 -1
- package/Progress/index.js.map +1 -1
- package/Radio/Radio.js +37 -22
- package/Radio/Radio.js.map +1 -1
- package/Radio/Radio.styles.js +11 -4
- package/Radio/Radio.styles.js.map +1 -1
- package/Radio/RadioGroup.js +33 -19
- package/Radio/RadioGroup.js.map +1 -1
- package/Radio/RadioGroup.stories.js +29 -18
- package/Radio/RadioGroup.stories.js.map +1 -1
- package/Radio/index.js +23 -2
- package/Radio/index.js.map +1 -1
- package/RichTextEditor/RichTextEditor.js +56 -32
- package/RichTextEditor/RichTextEditor.js.map +1 -1
- package/RichTextEditor/RichTextEditor.stories.js +21 -10
- package/RichTextEditor/RichTextEditor.stories.js.map +1 -1
- package/RichTextEditor/createPropsFromConfig.js +15 -4
- package/RichTextEditor/createPropsFromConfig.js.map +1 -1
- package/RichTextEditor/index.js +30 -2
- package/RichTextEditor/index.js.map +1 -1
- package/Ripple/Ripple.js +16 -5
- package/Ripple/Ripple.js.map +1 -1
- package/Ripple/Ripple.stories.js +57 -42
- package/Ripple/Ripple.stories.js.map +1 -1
- package/Ripple/index.js +18 -1
- package/Ripple/index.js.map +1 -1
- package/Scrollbar/Scrollbar.js +14 -4
- package/Scrollbar/Scrollbar.js.map +1 -1
- package/Scrollbar/Scrollbar.stories.js +18 -9
- package/Scrollbar/Scrollbar.stories.js.map +1 -1
- package/Scrollbar/index.js +18 -1
- package/Scrollbar/index.js.map +1 -1
- package/Section/Section.stories.js +22 -12
- package/Section/Section.stories.js.map +1 -1
- package/Section/index.js +30 -15
- package/Section/index.js.map +1 -1
- package/Select/Select.js +37 -18
- package/Select/Select.js.map +1 -1
- package/Select/Select.stories.js +36 -25
- package/Select/Select.stories.js.map +1 -1
- package/Select/index.js +18 -1
- package/Select/index.js.map +1 -1
- package/Slider/Slider.js +43 -27
- package/Slider/Slider.js.map +1 -1
- package/Slider/Slider.stories.js +27 -16
- package/Slider/Slider.stories.js.map +1 -1
- package/Slider/index.js +15 -1
- package/Slider/index.js.map +1 -1
- package/Snackbar/Snackbar.js +38 -20
- package/Snackbar/Snackbar.js.map +1 -1
- package/Snackbar/Snackbar.stories.js +44 -30
- package/Snackbar/Snackbar.stories.js.map +1 -1
- package/Snackbar/index.js +19 -1
- package/Snackbar/index.js.map +1 -1
- package/Switch/Switch.js +43 -27
- package/Switch/Switch.js.map +1 -1
- package/Switch/Switch.stories.js +27 -16
- package/Switch/Switch.stories.js.map +1 -1
- package/Switch/index.js +18 -1
- package/Switch/index.js.map +1 -1
- package/Tabs/Tab.js +21 -7
- package/Tabs/Tab.js.map +1 -1
- package/Tabs/Tabs.js +49 -28
- package/Tabs/Tabs.js.map +1 -1
- package/Tabs/Tabs.stories.js +34 -22
- package/Tabs/Tabs.stories.js.map +1 -1
- package/Tabs/index.js +31 -2
- package/Tabs/index.js.map +1 -1
- package/Tags/Tags.js +64 -40
- package/Tags/Tags.js.map +1 -1
- package/Tags/Tags.stories.js +27 -16
- package/Tags/Tags.stories.js.map +1 -1
- package/Tags/index.js +18 -1
- package/Tags/index.js.map +1 -1
- package/Tooltip/Tooltip.js +38 -24
- package/Tooltip/Tooltip.js.map +1 -1
- package/Tooltip/Tooltip.stories.js +20 -11
- package/Tooltip/Tooltip.stories.js.map +1 -1
- package/Tooltip/index.js +18 -1
- package/Tooltip/index.js.map +1 -1
- package/TopAppBar/TopAppBar.js +18 -7
- package/TopAppBar/TopAppBar.js.map +1 -1
- package/TopAppBar/TopAppBar.stories.js +39 -25
- package/TopAppBar/TopAppBar.stories.js.map +1 -1
- package/TopAppBar/TopAppBarActionItem.js +14 -4
- package/TopAppBar/TopAppBarActionItem.js.map +1 -1
- package/TopAppBar/TopAppBarNavigationIcon.js +14 -4
- package/TopAppBar/TopAppBarNavigationIcon.js.map +1 -1
- package/TopAppBar/TopAppBarPrimary.js +18 -7
- package/TopAppBar/TopAppBarPrimary.js.map +1 -1
- package/TopAppBar/TopAppBarSecondary.js +18 -7
- package/TopAppBar/TopAppBarSecondary.js.map +1 -1
- package/TopAppBar/TopAppBarSection.js +18 -7
- package/TopAppBar/TopAppBarSection.js.map +1 -1
- package/TopAppBar/TopAppBarTitle.js +18 -7
- package/TopAppBar/TopAppBarTitle.js.map +1 -1
- package/TopAppBar/index.js +96 -7
- package/TopAppBar/index.js.map +1 -1
- package/TopProgressBar/TopProgressBar.js +20 -7
- package/TopProgressBar/TopProgressBar.js.map +1 -1
- package/TopProgressBar/TopProgressBar.stories.js +22 -12
- package/TopProgressBar/TopProgressBar.stories.js.map +1 -1
- package/TopProgressBar/hoc/index.js +15 -1
- package/TopProgressBar/hoc/index.js.map +1 -1
- package/TopProgressBar/hoc/withTopProgressBar.js +16 -5
- package/TopProgressBar/hoc/withTopProgressBar.js.map +1 -1
- package/TopProgressBar/index.js +18 -1
- package/TopProgressBar/index.js.map +1 -1
- package/Typography/Typography.js +14 -4
- package/Typography/Typography.js.map +1 -1
- package/Typography/Typography.stories.js +43 -34
- package/Typography/Typography.stories.js.map +1 -1
- package/Typography/index.js +18 -1
- package/Typography/index.js.map +1 -1
- package/package.json +8 -8
- package/types.js +5 -1
- package/types.js.map +1 -1
package/Menu/Menu.stories.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","style","position","width","margin","add","readme","console","log","info","propTables","Menu","MenuItem","MenuDivider"],"sources":["Menu.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandbox,\n StorySandboxExample,\n StorySandboxCode\n} from \"@webiny/storybook-utils/Story\";\nimport { ButtonPrimary } from \"~/Button\";\nimport readme from \"./../Menu/README.md\";\nimport { Menu, MenuItem, MenuDivider } from \"./Menu\";\n\nconst story = storiesOf(\"Components/Menu\", module);\n\nconst style: React.CSSProperties = {\n position: \"relative\",\n width: 200,\n margin: \"0 auto\"\n};\n\nstory.add(\n \"usage\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"A simple menu, triggered with a button\"}>\n <div style={style}>\n <Menu handle={<ButtonPrimary>Open menu</ButtonPrimary>}>\n <MenuItem\n onClick={() => {\n console.log(\"Apple selected!\");\n }}\n >\n Apple\n </MenuItem>\n <MenuItem>Banana</MenuItem>\n <MenuItem>Watermelon</MenuItem>\n </Menu>\n </div>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <Menu handle={<ButtonPrimary>Open menu</ButtonPrimary>}>\n <MenuItem\n onClick={() => {\n console.log(\"Apple selected!\");\n }}\n >\n Apple\n </MenuItem>\n <MenuItem>Banana</MenuItem>\n <MenuItem>Watermelon</MenuItem>\n </Menu>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Menu, MenuItem, MenuDivider] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AAOA;;AACA;;AACA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,iBAAV,EAA6BC,MAA7B,CAAd;AAEA,IAAMC,KAA0B,GAAG;EAC/BC,QAAQ,EAAE,UADqB;EAE/BC,KAAK,EAAE,GAFwB;EAG/BC,MAAM,EAAE;AAHuB,CAAnC;AAMAN,KAAK,CAACO,GAAN,CACI,OADJ,EAEI,YAAM;EACF,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD,qBACI,6BAAC,0BAAD;IAAqB,KAAK,EAAE;EAA5B,gBACI;IAAK,KAAK,EAAEL;EAAZ,gBACI,6BAAC,UAAD;IAAM,MAAM,eAAE,6BAAC,qBAAD;EAAd,gBACI,6BAAC,cAAD;IACI,OAAO,EAAE,mBAAM;MACXM,OAAO,CAACC,GAAR,CAAY,iBAAZ;IACH;EAHL,WADJ,eAQI,6BAAC,cAAD,iBARJ,eASI,6BAAC,cAAD,qBATJ,CADJ,CADJ,CADJ,eAgBI,6BAAC,uBAAD,ghBAhBJ,CAFJ,CADJ;AAqCH,CAxCL,EAyCI;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,UAAD,EAAOC,cAAP,EAAiBC,iBAAjB;EAAd;AAAR,CAzCJ"}
|
package/Menu/index.js
CHANGED
|
@@ -1 +1,18 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
|
|
7
|
+
var _Menu = require("./Menu");
|
|
8
|
+
|
|
9
|
+
Object.keys(_Menu).forEach(function (key) {
|
|
10
|
+
if (key === "default" || key === "__esModule") return;
|
|
11
|
+
if (key in exports && exports[key] === _Menu[key]) return;
|
|
12
|
+
Object.defineProperty(exports, key, {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function get() {
|
|
15
|
+
return _Menu[key];
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
});
|
package/Menu/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Menu\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
package/Mosaic/Mosaic.js
CHANGED
|
@@ -1,21 +1,31 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.Mosaic = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
var _reactColumned = _interopRequireDefault(require("react-columned"));
|
|
13
|
+
|
|
2
14
|
/**
|
|
3
15
|
* Package react-columned does not have types.
|
|
4
16
|
*/
|
|
5
17
|
// @ts-ignore
|
|
6
|
-
|
|
7
|
-
import Columned from "react-columned";
|
|
8
|
-
|
|
9
18
|
var Mosaic = function Mosaic(_ref) {
|
|
10
19
|
var children = _ref.children,
|
|
11
20
|
columns = _ref.columns,
|
|
12
21
|
className = _ref.className;
|
|
13
|
-
return /*#__PURE__*/
|
|
22
|
+
return /*#__PURE__*/_react.default.createElement(_reactColumned.default, {
|
|
14
23
|
columns: columns,
|
|
15
24
|
className: className
|
|
16
25
|
}, children);
|
|
17
26
|
};
|
|
18
27
|
|
|
28
|
+
exports.Mosaic = Mosaic;
|
|
19
29
|
Mosaic.defaultProps = {
|
|
20
30
|
columns: {
|
|
21
31
|
320: 1,
|
|
@@ -23,5 +33,4 @@ Mosaic.defaultProps = {
|
|
|
23
33
|
800: 3,
|
|
24
34
|
1366: 4
|
|
25
35
|
}
|
|
26
|
-
};
|
|
27
|
-
export { Mosaic };
|
|
36
|
+
};
|
package/Mosaic/Mosaic.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["Mosaic","children","columns","className","defaultProps"],"sources":["Mosaic.tsx"],"sourcesContent":["import React from \"react\";\n/**\n * Package react-columned does not have types.\n */\n// @ts-ignore\nimport Columned from \"react-columned\";\n\nexport interface MosaicProps {\n // Number of columns, per max screen size, eg. { \"320\": 1, \"480\": 2, \"800\": 3, \"1366\": 4 }.\n columns?: {\n [key: string]: number;\n };\n\n // Custom class for the mosaic container.\n className?: string;\n}\n\nconst Mosaic: React.FC<MosaicProps> = ({ children, columns, className }) => {\n return (\n <Columned columns={columns} className={className}>\n {children}\n </Columned>\n );\n};\n\nMosaic.defaultProps = {\n columns: { 320: 1, 480: 2, 800: 3, 1366: 4 }\n};\n\nexport { Mosaic };\n"],"mappings":";;;;;;;;;AAAA;;AAKA;;AAJA;AACA;AACA;AACA;AAaA,IAAMA,MAA6B,GAAG,SAAhCA,MAAgC,OAAsC;EAAA,IAAnCC,QAAmC,QAAnCA,QAAmC;EAAA,IAAzBC,OAAyB,QAAzBA,OAAyB;EAAA,IAAhBC,SAAgB,QAAhBA,SAAgB;EACxE,oBACI,6BAAC,sBAAD;IAAU,OAAO,EAAED,OAAnB;IAA4B,SAAS,EAAEC;EAAvC,GACKF,QADL,CADJ;AAKH,CAND;;;AAQAD,MAAM,CAACI,YAAP,GAAsB;EAClBF,OAAO,EAAE;IAAE,KAAK,CAAP;IAAU,KAAK,CAAf;IAAkB,KAAK,CAAvB;IAA0B,MAAM;EAAhC;AADS,CAAtB"}
|
package/Mosaic/Mosaic.stories.js
CHANGED
|
@@ -1,75 +1,84 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
var _react = _interopRequireDefault(require("react"));
|
|
6
|
+
|
|
7
|
+
var _react2 = require("@storybook/react");
|
|
8
|
+
|
|
9
|
+
var _Story = require("@webiny/storybook-utils/Story");
|
|
10
|
+
|
|
11
|
+
var _README = _interopRequireDefault(require("./../Mosaic/README.md"));
|
|
12
|
+
|
|
13
|
+
var _Mosaic = require("./Mosaic");
|
|
14
|
+
|
|
15
|
+
var story = (0, _react2.storiesOf)("Components/Mosaic", module);
|
|
7
16
|
story.add("usage", function () {
|
|
8
|
-
return /*#__PURE__*/
|
|
17
|
+
return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, {
|
|
9
18
|
title: "A simple responsive mosaic."
|
|
10
|
-
}, /*#__PURE__*/
|
|
19
|
+
}, /*#__PURE__*/_react.default.createElement(_Story.StorySandboxExample, null, /*#__PURE__*/_react.default.createElement(_Mosaic.Mosaic, null, /*#__PURE__*/_react.default.createElement("img", {
|
|
11
20
|
alt: "Image 1",
|
|
12
21
|
src: "https://via.placeholder.com/800x600/001F3F/FFFFFF.png?text=1"
|
|
13
|
-
}), /*#__PURE__*/
|
|
22
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
14
23
|
alt: "Image 2",
|
|
15
24
|
src: "https://via.placeholder.com/400x300/0074D9/FFFFFF.png?text=2"
|
|
16
|
-
}), /*#__PURE__*/
|
|
25
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
17
26
|
alt: "Image 3",
|
|
18
27
|
src: "https://via.placeholder.com/1024x768/7FDBFF/FFFFFF.png?text=3"
|
|
19
|
-
}), /*#__PURE__*/
|
|
28
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
20
29
|
alt: "Image 4",
|
|
21
30
|
src: "https://via.placeholder.com/1280x1024/39CCCC/FFFFFF.png?text=4"
|
|
22
|
-
}), /*#__PURE__*/
|
|
31
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
23
32
|
alt: "Image 5",
|
|
24
33
|
src: "https://via.placeholder.com/640x480/3D9970/FFFFFF.png?text=5"
|
|
25
|
-
}), /*#__PURE__*/
|
|
34
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
26
35
|
alt: "Image 6",
|
|
27
36
|
src: "https://via.placeholder.com/1000x500/2ECC40/FFFFFF.png?text=6"
|
|
28
|
-
}), /*#__PURE__*/
|
|
37
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
29
38
|
alt: "Image 7",
|
|
30
39
|
src: "https://via.placeholder.com/700x1000/01FF70/FFFFFF.png?text=7"
|
|
31
|
-
}), /*#__PURE__*/
|
|
40
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
32
41
|
alt: "Image 8",
|
|
33
42
|
src: "https://via.placeholder.com/800x600/FFDC00/FFFFFF.png?text=8"
|
|
34
|
-
}), /*#__PURE__*/
|
|
43
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
35
44
|
alt: "Image 9",
|
|
36
45
|
src: "https://via.placeholder.com/200x100/FF851B/FFFFFF.png?text=9"
|
|
37
|
-
}), /*#__PURE__*/
|
|
46
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
38
47
|
alt: "Image 10",
|
|
39
48
|
src: "https://via.placeholder.com/200x100/FF4136/FFFFFF.png?text=10"
|
|
40
|
-
}))), /*#__PURE__*/
|
|
49
|
+
}))), /*#__PURE__*/_react.default.createElement(_Story.StorySandboxCode, null, /*#__PURE__*/_react.default.createElement(_Mosaic.Mosaic, null, /*#__PURE__*/_react.default.createElement("img", {
|
|
41
50
|
alt: "Image 1",
|
|
42
51
|
src: "https://..."
|
|
43
|
-
}), /*#__PURE__*/
|
|
52
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
44
53
|
alt: "Image 2",
|
|
45
54
|
src: "https://..."
|
|
46
|
-
}), /*#__PURE__*/
|
|
55
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
47
56
|
alt: "Image 3",
|
|
48
57
|
src: "https://..."
|
|
49
|
-
}), /*#__PURE__*/
|
|
58
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
50
59
|
alt: "Image 4",
|
|
51
60
|
src: "https://..."
|
|
52
|
-
}), /*#__PURE__*/
|
|
61
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
53
62
|
alt: "Image 5",
|
|
54
63
|
src: "https://..."
|
|
55
|
-
}), /*#__PURE__*/
|
|
64
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
56
65
|
alt: "Image 6",
|
|
57
66
|
src: "https://..."
|
|
58
|
-
}), /*#__PURE__*/
|
|
67
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
59
68
|
alt: "Image 7",
|
|
60
69
|
src: "https://..."
|
|
61
|
-
}), /*#__PURE__*/
|
|
70
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
62
71
|
alt: "Image 8",
|
|
63
72
|
src: "https://..."
|
|
64
|
-
}), /*#__PURE__*/
|
|
73
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
65
74
|
alt: "Image 9",
|
|
66
75
|
src: "https://..."
|
|
67
|
-
}), /*#__PURE__*/
|
|
76
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
68
77
|
alt: "Image 10",
|
|
69
78
|
src: "https://..."
|
|
70
79
|
})))));
|
|
71
80
|
}, {
|
|
72
81
|
info: {
|
|
73
|
-
propTables: [Mosaic]
|
|
82
|
+
propTables: [_Mosaic.Mosaic]
|
|
74
83
|
}
|
|
75
84
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","add","readme","info","propTables","Mosaic"],"sources":["Mosaic.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 \"./../Mosaic/README.md\";\n\nimport { Mosaic } from \"./Mosaic\";\n\nconst story = storiesOf(\"Components/Mosaic\", module);\n\nstory.add(\n \"usage\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox title={\"A simple responsive mosaic.\"}>\n <StorySandboxExample>\n <Mosaic>\n <img\n alt=\"Image 1\"\n src={\"https://via.placeholder.com/800x600/001F3F/FFFFFF.png?text=1\"}\n />\n <img\n alt=\"Image 2\"\n src={\"https://via.placeholder.com/400x300/0074D9/FFFFFF.png?text=2\"}\n />\n <img\n alt=\"Image 3\"\n src={\n \"https://via.placeholder.com/1024x768/7FDBFF/FFFFFF.png?text=3\"\n }\n />\n <img\n alt=\"Image 4\"\n src={\n \"https://via.placeholder.com/1280x1024/39CCCC/FFFFFF.png?text=4\"\n }\n />\n <img\n alt=\"Image 5\"\n src={\"https://via.placeholder.com/640x480/3D9970/FFFFFF.png?text=5\"}\n />\n <img\n alt=\"Image 6\"\n src={\n \"https://via.placeholder.com/1000x500/2ECC40/FFFFFF.png?text=6\"\n }\n />\n <img\n alt=\"Image 7\"\n src={\n \"https://via.placeholder.com/700x1000/01FF70/FFFFFF.png?text=7\"\n }\n />\n <img\n alt=\"Image 8\"\n src={\"https://via.placeholder.com/800x600/FFDC00/FFFFFF.png?text=8\"}\n />\n <img\n alt=\"Image 9\"\n src={\"https://via.placeholder.com/200x100/FF851B/FFFFFF.png?text=9\"}\n />\n <img\n alt=\"Image 10\"\n src={\n \"https://via.placeholder.com/200x100/FF4136/FFFFFF.png?text=10\"\n }\n />\n </Mosaic>\n </StorySandboxExample>\n <StorySandboxCode>\n <Mosaic>\n <img alt=\"Image 1\" src={\"https://...\"} />\n <img alt=\"Image 2\" src={\"https://...\"} />\n <img alt=\"Image 3\" src={\"https://...\"} />\n <img alt=\"Image 4\" src={\"https://...\"} />\n <img alt=\"Image 5\" src={\"https://...\"} />\n <img alt=\"Image 6\" src={\"https://...\"} />\n <img alt=\"Image 7\" src={\"https://...\"} />\n <img alt=\"Image 8\" src={\"https://...\"} />\n <img alt=\"Image 9\" src={\"https://...\"} />\n <img alt=\"Image 10\" src={\"https://...\"} />\n </Mosaic>\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Mosaic] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AAOA;;AAEA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,mBAAV,EAA+BC,MAA/B,CAAd;AAEAF,KAAK,CAACG,GAAN,CACI,OADJ,EAEI,YAAM;EACF,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD;IAAc,KAAK,EAAE;EAArB,gBACI,6BAAC,0BAAD,qBACI,6BAAC,cAAD,qBACI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EADJ,eAKI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EALJ,eASI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EACC;EAHR,EATJ,eAeI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EACC;EAHR,EAfJ,eAqBI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EArBJ,eAyBI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EACC;EAHR,EAzBJ,eA+BI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EACC;EAHR,EA/BJ,eAqCI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EArCJ,eAyCI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EAzCJ,eA6CI;IACI,GAAG,EAAC,UADR;IAEI,GAAG,EACC;EAHR,EA7CJ,CADJ,CADJ,eAuDI,6BAAC,uBAAD,qBACI,6BAAC,cAAD,qBACI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EADJ,eAEI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EAFJ,eAGI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EAHJ,eAII;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EAJJ,eAKI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EALJ,eAMI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EANJ,eAOI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EAPJ,eAQI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EARJ,eASI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EATJ,eAUI;IAAK,GAAG,EAAC,UAAT;IAAoB,GAAG,EAAE;EAAzB,EAVJ,CADJ,CAvDJ,CAFJ,CADJ;AA2EH,CA9EL,EA+EI;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,cAAD;EAAd;AAAR,CA/EJ"}
|
package/Mosaic/index.js
CHANGED
|
@@ -1 +1,18 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
|
|
7
|
+
var _Mosaic = require("./Mosaic");
|
|
8
|
+
|
|
9
|
+
Object.keys(_Mosaic).forEach(function (key) {
|
|
10
|
+
if (key === "default" || key === "__esModule") return;
|
|
11
|
+
if (key in exports && exports[key] === _Mosaic[key]) return;
|
|
12
|
+
Object.defineProperty(exports, key, {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function get() {
|
|
15
|
+
return _Mosaic[key];
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
});
|
package/Mosaic/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Mosaic\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
|
@@ -1,9 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
13
|
+
|
|
14
|
+
var _reactSpinnerMaterial = _interopRequireDefault(require("react-spinner-material"));
|
|
15
|
+
|
|
16
|
+
var _Typography = require("../Typography");
|
|
17
|
+
|
|
1
18
|
// This is just to center the spinner
|
|
2
|
-
|
|
3
|
-
import styled from "@emotion/styled";
|
|
4
|
-
import Spinner from "react-spinner-material";
|
|
5
|
-
import { Typography } from "../Typography";
|
|
6
|
-
var SpinnerWrapper = /*#__PURE__*/styled("div", {
|
|
19
|
+
var SpinnerWrapper = /*#__PURE__*/(0, _styled.default)("div", {
|
|
7
20
|
target: "e1s1fi5k0",
|
|
8
21
|
label: "SpinnerWrapper"
|
|
9
22
|
})({
|
|
@@ -26,7 +39,7 @@ var SpinnerWrapper = /*#__PURE__*/styled("div", {
|
|
|
26
39
|
alignItems: "center"
|
|
27
40
|
}
|
|
28
41
|
});
|
|
29
|
-
var Label = /*#__PURE__*/
|
|
42
|
+
var Label = /*#__PURE__*/(0, _styled.default)("div", {
|
|
30
43
|
target: "e1s1fi5k1",
|
|
31
44
|
label: "Label"
|
|
32
45
|
})({
|
|
@@ -44,16 +57,16 @@ var CircularProgress = function CircularProgress(props) {
|
|
|
44
57
|
* We can safely cast because we have default props
|
|
45
58
|
*/
|
|
46
59
|
|
|
47
|
-
return /*#__PURE__*/
|
|
60
|
+
return /*#__PURE__*/_react.default.createElement(SpinnerWrapper, {
|
|
48
61
|
style: style
|
|
49
|
-
}, /*#__PURE__*/
|
|
62
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
50
63
|
className: "spinner__inner-wrapper"
|
|
51
|
-
}, /*#__PURE__*/
|
|
64
|
+
}, /*#__PURE__*/_react.default.createElement(_reactSpinnerMaterial.default, {
|
|
52
65
|
size: size,
|
|
53
66
|
spinnerColor: spinnerColor,
|
|
54
67
|
spinnerWidth: spinnerWidth,
|
|
55
68
|
visible: visible
|
|
56
|
-
}), label && /*#__PURE__*/
|
|
69
|
+
}), label && /*#__PURE__*/_react.default.createElement(Label, null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
|
|
57
70
|
use: "overline"
|
|
58
71
|
}, label))));
|
|
59
72
|
};
|
|
@@ -64,4 +77,5 @@ CircularProgress.defaultProps = {
|
|
|
64
77
|
spinnerWidth: 4,
|
|
65
78
|
visible: true
|
|
66
79
|
};
|
|
67
|
-
|
|
80
|
+
var _default = CircularProgress;
|
|
81
|
+
exports.default = _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["SpinnerWrapper","styled","width","height","position","background","opacity","top","left","zIndex","transform","display","flexDirection","justifyContent","alignItems","Label","marginTop","CircularProgress","props","label","size","spinnerWidth","spinnerColor","visible","style","defaultProps"],"sources":["CircularProgress.tsx"],"sourcesContent":["// This is just to center the spinner\nimport React from \"react\";\nimport styled from \"@emotion/styled\";\nimport Spinner from \"react-spinner-material\";\nimport { Typography } from \"../Typography\";\n\ninterface CircularProgressProps {\n label?: React.ReactNode;\n size?: number;\n spinnerColor?: string;\n spinnerWidth?: number;\n visible?: boolean;\n style?: React.CSSProperties;\n}\n\nconst SpinnerWrapper = styled(\"div\")({\n width: \"100%\",\n height: \"100%\",\n position: \"absolute\",\n background: \"var(--mdc-theme-surface)\",\n opacity: 0.92,\n top: 0,\n left: 0,\n zIndex: 3,\n \"& .spinner__inner-wrapper\": {\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n display: \"flex\",\n flexDirection: \"column\",\n justifyContent: \"center\",\n alignItems: \"center\"\n }\n});\n\nconst Label = styled(\"div\")({\n marginTop: 15\n});\n\nconst CircularProgress: React.FC<CircularProgressProps> = props => {\n const { label, size, spinnerWidth, spinnerColor, visible, style } = props;\n /**\n * We can safely cast because we have default props\n */\n return (\n <SpinnerWrapper style={style}>\n <div className={\"spinner__inner-wrapper\"}>\n <Spinner\n size={size as number}\n spinnerColor={spinnerColor as string}\n spinnerWidth={spinnerWidth as number}\n visible={visible as boolean}\n />\n {label && (\n <Label>\n <Typography use={\"overline\"}>{label}</Typography>\n </Label>\n )}\n </div>\n </SpinnerWrapper>\n );\n};\n\nCircularProgress.defaultProps = {\n size: 45,\n spinnerColor: \"var(--mdc-theme-primary)\",\n spinnerWidth: 4,\n visible: true\n};\n\nexport default CircularProgress;\n"],"mappings":";;;;;;;;;AACA;;AACA;;AACA;;AACA;;AAJA;AAeA,IAAMA,cAAc,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACjCC,KAAK,EAAE,MAD0B;EAEjCC,MAAM,EAAE,MAFyB;EAGjCC,QAAQ,EAAE,UAHuB;EAIjCC,UAAU,EAAE,0BAJqB;EAKjCC,OAAO,EAAE,IALwB;EAMjCC,GAAG,EAAE,CAN4B;EAOjCC,IAAI,EAAE,CAP2B;EAQjCC,MAAM,EAAE,CARyB;EASjC,6BAA6B;IACzBL,QAAQ,EAAE,UADe;IAEzBG,GAAG,EAAE,KAFoB;IAGzBC,IAAI,EAAE,KAHmB;IAIzBE,SAAS,EAAE,uBAJc;IAKzBC,OAAO,EAAE,MALgB;IAMzBC,aAAa,EAAE,QANU;IAOzBC,cAAc,EAAE,QAPS;IAQzBC,UAAU,EAAE;EARa;AATI,CAAjB,CAApB;AAqBA,IAAMC,KAAK,oBAAGd,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACxBe,SAAS,EAAE;AADa,CAAjB,CAAX;;AAIA,IAAMC,gBAAiD,GAAG,SAApDA,gBAAoD,CAAAC,KAAK,EAAI;EAC/D,IAAQC,KAAR,GAAoED,KAApE,CAAQC,KAAR;EAAA,IAAeC,IAAf,GAAoEF,KAApE,CAAeE,IAAf;EAAA,IAAqBC,YAArB,GAAoEH,KAApE,CAAqBG,YAArB;EAAA,IAAmCC,YAAnC,GAAoEJ,KAApE,CAAmCI,YAAnC;EAAA,IAAiDC,OAAjD,GAAoEL,KAApE,CAAiDK,OAAjD;EAAA,IAA0DC,KAA1D,GAAoEN,KAApE,CAA0DM,KAA1D;EACA;AACJ;AACA;;EACI,oBACI,6BAAC,cAAD;IAAgB,KAAK,EAAEA;EAAvB,gBACI;IAAK,SAAS,EAAE;EAAhB,gBACI,6BAAC,6BAAD;IACI,IAAI,EAAEJ,IADV;IAEI,YAAY,EAAEE,YAFlB;IAGI,YAAY,EAAED,YAHlB;IAII,OAAO,EAAEE;EAJb,EADJ,EAOKJ,KAAK,iBACF,6BAAC,KAAD,qBACI,6BAAC,sBAAD;IAAY,GAAG,EAAE;EAAjB,GAA8BA,KAA9B,CADJ,CARR,CADJ,CADJ;AAiBH,CAtBD;;AAwBAF,gBAAgB,CAACQ,YAAjB,GAAgC;EAC5BL,IAAI,EAAE,EADsB;EAE5BE,YAAY,EAAE,0BAFc;EAG5BD,YAAY,EAAE,CAHc;EAI5BE,OAAO,EAAE;AAJmB,CAAhC;eAOeN,gB"}
|
package/Progress/index.js
CHANGED
|
@@ -1 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
Object.defineProperty(exports, "CircularProgress", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _CircularProgress.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
var _CircularProgress = _interopRequireDefault(require("./CircularProgress"));
|
package/Progress/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as CircularProgress } from \"./CircularProgress\";\n"],"mappings":";;;;;;;;;;;;;;AAAA"}
|
package/Radio/Radio.js
CHANGED
|
@@ -1,41 +1,56 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
|
|
10
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
+
|
|
12
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
+
|
|
14
|
+
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
15
|
+
|
|
16
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
17
|
+
|
|
18
|
+
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
19
|
+
|
|
20
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
21
|
+
|
|
22
|
+
var _react = _interopRequireDefault(require("react"));
|
|
23
|
+
|
|
24
|
+
var _radio = require("@rmwc/radio");
|
|
25
|
+
|
|
26
|
+
var _FormElementMessage = require("../FormElementMessage");
|
|
10
27
|
|
|
11
28
|
/**
|
|
12
29
|
* Wrap Radio components with RadioGroup to create a set of options.
|
|
13
30
|
* Each Radio component must receive value and onChange callback via props.
|
|
14
31
|
*/
|
|
15
32
|
var Radio = /*#__PURE__*/function (_React$Component) {
|
|
16
|
-
|
|
33
|
+
(0, _inherits2.default)(Radio, _React$Component);
|
|
17
34
|
|
|
18
|
-
var _super =
|
|
35
|
+
var _super = (0, _createSuper2.default)(Radio);
|
|
19
36
|
|
|
20
37
|
function Radio() {
|
|
21
38
|
var _this;
|
|
22
39
|
|
|
23
|
-
|
|
40
|
+
(0, _classCallCheck2.default)(this, Radio);
|
|
24
41
|
|
|
25
42
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
26
43
|
args[_key] = arguments[_key];
|
|
27
44
|
}
|
|
28
45
|
|
|
29
46
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
30
|
-
|
|
31
|
-
_defineProperty(_assertThisInitialized(_this), "onChange", function (e) {
|
|
47
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", function (e) {
|
|
32
48
|
_this.props.onChange && _this.props.onChange(e.target.checked);
|
|
33
49
|
});
|
|
34
|
-
|
|
35
50
|
return _this;
|
|
36
51
|
}
|
|
37
52
|
|
|
38
|
-
|
|
53
|
+
(0, _createClass2.default)(Radio, [{
|
|
39
54
|
key: "render",
|
|
40
55
|
value: function render() {
|
|
41
56
|
var _this$props = this.props,
|
|
@@ -49,19 +64,19 @@ var Radio = /*#__PURE__*/function (_React$Component) {
|
|
|
49
64
|
validationIsValid = _ref.isValid,
|
|
50
65
|
validationMessage = _ref.message;
|
|
51
66
|
|
|
52
|
-
return /*#__PURE__*/
|
|
67
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_radio.Radio, {
|
|
53
68
|
disabled: disabled,
|
|
54
69
|
checked: Boolean(value),
|
|
55
70
|
onChange: this.onChange // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.
|
|
56
71
|
,
|
|
57
72
|
label: label
|
|
58
|
-
}), validationIsValid === false && /*#__PURE__*/
|
|
73
|
+
}), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
|
|
59
74
|
error: true
|
|
60
|
-
}, validationMessage), validationIsValid !== false && description && /*#__PURE__*/
|
|
75
|
+
}, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
|
|
61
76
|
}
|
|
62
77
|
}]);
|
|
63
|
-
|
|
64
78
|
return Radio;
|
|
65
|
-
}(
|
|
79
|
+
}(_react.default.Component);
|
|
66
80
|
|
|
67
|
-
|
|
81
|
+
var _default = Radio;
|
|
82
|
+
exports.default = _default;
|
package/Radio/Radio.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["Radio","e","props","onChange","target","checked","value","label","disabled","description","validation","validationIsValid","isValid","validationMessage","message","Boolean","React","Component"],"sources":["Radio.tsx"],"sourcesContent":["import React from \"react\";\nimport { Radio as RmwcRadio } from \"@rmwc/radio\";\nimport { FormComponentProps } from \"~/types\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\n\ntype Props = FormComponentProps & {\n // Component label.\n label?: React.ReactNode;\n\n // Is radio disabled?\n disabled?: boolean;\n\n // Description beneath the radio.\n description?: string;\n};\n\n/**\n * Wrap Radio components with RadioGroup to create a set of options.\n * Each Radio component must receive value and onChange callback via props.\n */\nclass Radio extends React.Component<Props> {\n onChange = (e: React.SyntheticEvent<HTMLInputElement>) => {\n this.props.onChange && this.props.onChange((e.target as any).checked);\n };\n\n public override render() {\n const { value, label, disabled, description, validation } = this.props;\n\n const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n return (\n <React.Fragment>\n <RmwcRadio\n disabled={disabled}\n checked={Boolean(value)}\n onChange={this.onChange}\n // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.\n label={label}\n />\n {validationIsValid === false && (\n <FormElementMessage error>{validationMessage}</FormElementMessage>\n )}\n\n {validationIsValid !== false && description && (\n <FormElementMessage>{description}</FormElementMessage>\n )}\n </React.Fragment>\n );\n }\n}\n\nexport default Radio;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AAaA;AACA;AACA;AACA;IACMA,K;;;;;;;;;;;;;;;2FACS,UAACC,CAAD,EAA+C;MACtD,MAAKC,KAAL,CAAWC,QAAX,IAAuB,MAAKD,KAAL,CAAWC,QAAX,CAAqBF,CAAC,CAACG,MAAH,CAAkBC,OAAtC,CAAvB;IACH,C;;;;;;WAED,kBAAyB;MACrB,kBAA4D,KAAKH,KAAjE;MAAA,IAAQI,KAAR,eAAQA,KAAR;MAAA,IAAeC,KAAf,eAAeA,KAAf;MAAA,IAAsBC,QAAtB,eAAsBA,QAAtB;MAAA,IAAgCC,WAAhC,eAAgCA,WAAhC;MAAA,IAA6CC,UAA7C,eAA6CA,UAA7C;;MAEA,WAAmEA,UAAU,IAAI,EAAjF;MAAA,IAAiBC,iBAAjB,QAAQC,OAAR;MAAA,IAA6CC,iBAA7C,QAAoCC,OAApC;;MAEA,oBACI,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,YAAD;QACI,QAAQ,EAAEN,QADd;QAEI,OAAO,EAAEO,OAAO,CAACT,KAAD,CAFpB;QAGI,QAAQ,EAAE,KAAKH,QAHnB,CAII;QAJJ;QAKI,KAAK,EAAEI;MALX,EADJ,EAQKI,iBAAiB,KAAK,KAAtB,iBACG,6BAAC,sCAAD;QAAoB,KAAK;MAAzB,GAA2BE,iBAA3B,CATR,EAYKF,iBAAiB,KAAK,KAAtB,IAA+BF,WAA/B,iBACG,6BAAC,sCAAD,QAAqBA,WAArB,CAbR,CADJ;IAkBH;;;EA5BeO,cAAA,CAAMC,S;;eA+BXjB,K"}
|
package/Radio/Radio.styles.js
CHANGED
|
@@ -1,10 +1,17 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.webinyRadioTitle = void 0;
|
|
7
|
+
|
|
8
|
+
var _emotion = require("emotion");
|
|
9
|
+
|
|
2
10
|
/**
|
|
3
11
|
* Controls the helper text below the checkbox.
|
|
4
12
|
* @type {string}
|
|
5
13
|
*/
|
|
6
|
-
|
|
7
|
-
var webinyRadioTitle = /*#__PURE__*/css({}, {
|
|
14
|
+
var webinyRadioTitle = /*#__PURE__*/(0, _emotion.css)({}, {
|
|
8
15
|
"&.mdc-text-field-helper-text": {
|
|
9
16
|
paddingLeft: 10,
|
|
10
17
|
//textTransform: "uppercase",
|
|
@@ -12,4 +19,4 @@ var webinyRadioTitle = /*#__PURE__*/css({}, {
|
|
|
12
19
|
marginBottom: "5px"
|
|
13
20
|
}
|
|
14
21
|
}, "label:webinyRadioTitle;");
|
|
15
|
-
|
|
22
|
+
exports.webinyRadioTitle = webinyRadioTitle;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["webinyRadioTitle","css","paddingLeft","marginBottom"],"sources":["Radio.styles.ts"],"sourcesContent":["import { css } from \"emotion\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst webinyRadioTitle = 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 { webinyRadioTitle };\n"],"mappings":";;;;;;;AAAA;;AAEA;AACA;AACA;AACA;AACA,IAAMA,gBAAgB,gBAAG,IAAAC,YAAA,EACrB,EADqB,EAErB;EACI,gCAAgC;IAC5BC,WAAW,EAAE,EADe;IAE5B;IACA;IACAC,YAAY,EAAE;EAJc;AADpC,CAFqB,4BAAzB"}
|
package/Radio/RadioGroup.js
CHANGED
|
@@ -1,23 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
|
|
10
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
+
|
|
12
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
+
|
|
14
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
15
|
+
|
|
16
|
+
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
17
|
+
|
|
18
|
+
var _react = _interopRequireDefault(require("react"));
|
|
19
|
+
|
|
20
|
+
var _Radio = require("./Radio.styles");
|
|
21
|
+
|
|
22
|
+
var _FormElementMessage = require("../FormElementMessage");
|
|
8
23
|
|
|
9
24
|
var RadioGroup = /*#__PURE__*/function (_React$Component) {
|
|
10
|
-
|
|
25
|
+
(0, _inherits2.default)(RadioGroup, _React$Component);
|
|
11
26
|
|
|
12
|
-
var _super =
|
|
27
|
+
var _super = (0, _createSuper2.default)(RadioGroup);
|
|
13
28
|
|
|
14
29
|
function RadioGroup() {
|
|
15
|
-
|
|
16
|
-
|
|
30
|
+
(0, _classCallCheck2.default)(this, RadioGroup);
|
|
17
31
|
return _super.apply(this, arguments);
|
|
18
32
|
}
|
|
19
33
|
|
|
20
|
-
|
|
34
|
+
(0, _createClass2.default)(RadioGroup, [{
|
|
21
35
|
key: "render",
|
|
22
36
|
value: function render() {
|
|
23
37
|
var _this = this;
|
|
@@ -31,8 +45,8 @@ var RadioGroup = /*#__PURE__*/function (_React$Component) {
|
|
|
31
45
|
validationIsValid = _ref.isValid,
|
|
32
46
|
validationMessage = _ref.message;
|
|
33
47
|
|
|
34
|
-
return /*#__PURE__*/
|
|
35
|
-
className: "mdc-text-field-helper-text mdc-text-field-helper-text--persistent " + webinyRadioTitle
|
|
48
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, label && /*#__PURE__*/_react.default.createElement("div", {
|
|
49
|
+
className: "mdc-text-field-helper-text mdc-text-field-helper-text--persistent " + _Radio.webinyRadioTitle
|
|
36
50
|
}, label), this.props.children({
|
|
37
51
|
onChange: function onChange(value) {
|
|
38
52
|
return function () {
|
|
@@ -42,13 +56,13 @@ var RadioGroup = /*#__PURE__*/function (_React$Component) {
|
|
|
42
56
|
getValue: function getValue(id) {
|
|
43
57
|
return _this.props.value === id;
|
|
44
58
|
}
|
|
45
|
-
}), validationIsValid === false && /*#__PURE__*/
|
|
59
|
+
}), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
|
|
46
60
|
error: true
|
|
47
|
-
}, validationMessage), validationIsValid !== false && description && /*#__PURE__*/
|
|
61
|
+
}, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
|
|
48
62
|
}
|
|
49
63
|
}]);
|
|
50
|
-
|
|
51
64
|
return RadioGroup;
|
|
52
|
-
}(
|
|
65
|
+
}(_react.default.Component);
|
|
53
66
|
|
|
54
|
-
|
|
67
|
+
var _default = RadioGroup;
|
|
68
|
+
exports.default = _default;
|