@digigov/ui 0.32.0 → 0.32.1

package/CHANGELOG.md

@@ -1,6 +1,14 @@
 # Change Log - @digigov/ui
 
-This log was last generated on Tue, 02 May 2023 09:16:06 GMT and should not be manually modified.
+This log was last generated on Thu, 11 May 2023 10:48:56 GMT and should not be manually modified.
+
+## 0.32.1
+Thu, 11 May 2023 10:48:56 GMT
+
+### Patches
+
+- Export components to display poperly on sdk docs
+- Reexport missing components from `core` path
 
 ## 0.32.0
 Tue, 02 May 2023 09:16:06 GMT

package/admin/AutoComplete/index.mdx

@@ -16,51 +16,29 @@ import AutoComplete from '@digigov/ui/admin/AutoComplete';
 
 ### AutoComplete
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/AutoComplete"
-  story="Default.tsx"
-/>
+<Story packageName="@digigov/ui" 
+component="admin/AutoComplete" 
+story="Default.tsx" />
 
 ### AutoComplete with auto select
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/AutoComplete"
-  story="WithAutoSelect.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/AutoComplete" story="WithAutoSelect.tsx" />
 
 ### AutoComplete with inline style
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/AutoComplete"
-  story="WithInLine.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/AutoComplete" story="WithInLine.tsx" />
 
 ### AutoComplete with default value
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/AutoComplete"
-  story="WithDefaultValue.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/AutoComplete" story="WithDefaultValue.tsx" />
 
 ### AutoComplete with placeholder
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/AutoComplete"
-  story="WithPlaceHolder.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/AutoComplete" story="WithPlaceHolder.tsx" />
 
 ### AutoComplete with all option's values
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/AutoComplete"
-  story="WithShowAllValues.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/AutoComplete" story="WithShowAllValues.tsx" />
 
 ### AutoComplete with min length
 

package/admin/CopyToClipboard/index.mdx

@@ -11,11 +11,7 @@ import CopyToClipboard from '@digigov/ui/admin/CopyToClipboard';
 
 ### Default
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/CopyToClipboard"
-  story="Default.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/CopyToClipboard" story="Default.tsx" />
 
 ### Banner
 

package/admin/Dropdown/Dropdown.stories.playwright.json

@@ -0,0 +1,53 @@
+{
+  "version": "4",
+  "stories": {
+    "digigov-ui-admin-dropdown--align-right": {
+      "actionSets": [
+        {
+          "actions": [
+            {
+              "name": "click",
+              "args": {
+                "selector": "html>body>div:nth-child(5)>div>details>summary"
+              }
+            }
+          ],
+          "id": "lWuaZaRFFDje",
+          "title": "Align right action"
+        }
+      ]
+    },
+    "digigov-ui-admin-dropdown--default": {
+      "actionSets": [
+        {
+          "actions": [
+            {
+              "name": "click",
+              "args": {
+                "selector": "html>body>div:nth-child(5)>details>summary"
+              }
+            }
+          ],
+          "id": "jCwDDNP3O4e8",
+          "title": "Open dropdown action"
+        }
+      ]
+    },
+    "digigov-ui-admin-dropdown--placement-top": {
+      "actionSets": [
+        {
+          "actions": [
+            {
+              "name": "click",
+              "args": {
+                "selector": "html>body>div:nth-child(5)>div>details>summary"
+              }
+            }
+          ],
+          "id": "w6MaGKfzgKOG",
+          "title": "Placement top action"
+        }
+      ]
+    }
+  }
+}

package/admin/Dropdown/__stories__/AlignRight.js

@@ -26,8 +26,7 @@ var _NavVerticalItem = require("@digigov/ui/core/NavList/NavVerticalItem");
 var _Button = require("@digigov/ui/core/Button");
 
 var _ref = /*#__PURE__*/_react["default"].createElement(_Dropdown.Dropdown, {
-  align: "right",
-  open: true
+  align: "right"
 }, /*#__PURE__*/_react["default"].createElement(_Dropdown.DropdownButton, {
   role: "button",
   "aria-haspopup": "true",

package/admin/Dropdown/__stories__/Default.js

@@ -25,9 +25,7 @@ var _NavVerticalItem = require("@digigov/ui/core/NavList/NavVerticalItem");
 
 var _Button = require("@digigov/ui/core/Button");
 
-var _ref = /*#__PURE__*/_react["default"].createElement(_Dropdown.Dropdown, {
-  open: true
-}, /*#__PURE__*/_react["default"].createElement(_Dropdown.DropdownButton, {
+var _ref = /*#__PURE__*/_react["default"].createElement(_Dropdown.Dropdown, null, /*#__PURE__*/_react["default"].createElement(_Dropdown.DropdownButton, {
   role: "button",
   "aria-haspopup": "true",
   "aria-controls": "menu2",

package/admin/Dropdown/__stories__/PlacementTop.js

@@ -26,8 +26,7 @@ var _NavVerticalItem = require("@digigov/ui/core/NavList/NavVerticalItem");
 var _Button = require("@digigov/ui/core/Button");
 
 var _ref = /*#__PURE__*/_react["default"].createElement(_Dropdown.Dropdown, {
-  placement: "top",
-  open: true
+  placement: "top"
 }, /*#__PURE__*/_react["default"].createElement(_Dropdown.DropdownButton, {
   role: "button",
   "aria-haspopup": "true",

package/admin/Dropdown/index.mdx

@@ -11,31 +11,19 @@ import Dropdown from '@digigov/ui/admin/Dropdown';
 
 ## How to use
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/Dropdown"
-  story="Default.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/Dropdown" story="Default.tsx" />
 
 ### Dropdown with align right
 
 You can display the dropdown menu to the right side of the `Dropdown` button.
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/Dropdown"
-  story="AlignRight.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/Dropdown" story="AlignRight.tsx" />
 
 ### Dropdown with placement top
 
 You can display the dropdown menu to the top of the `Dropdown` button.
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/Dropdown"
-  story="PlacementTop.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/Dropdown" story="PlacementTop.tsx" />
 
 You can read more about the accessibility patterns used in our Dropdown
 implementation in the ARIA Authoring Practices Guide (APG) at 

package/admin/Modal/Modal.stories.playwright.json

@@ -0,0 +1,37 @@
+{
+  "version": "4",
+  "stories": {
+    "digigov-ui-admin-modal--alert-dialog": {
+      "actionSets": [
+        {
+          "actions": [
+            {
+              "name": "click",
+              "args": {
+                "selector": "html>body>div:nth-child(5)>div>button"
+              }
+            }
+          ],
+          "id": "Dk4oIFwRzm6e",
+          "title": "Alert dialog action"
+        }
+      ]
+    },
+    "digigov-ui-admin-modal--default": {
+      "actionSets": [
+        {
+          "actions": [
+            {
+              "name": "click",
+              "args": {
+                "selector": "html>body>div:nth-child(5)>div>button"
+              }
+            }
+          ],
+          "id": "YyIZkcmdBlRP",
+          "title": "Open modal action"
+        }
+      ]
+    }
+  }
+}

package/admin/Modal/__stories__/AlertDialog.js

@@ -2,12 +2,16 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.AlertDialog = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
 
 var _Modal = require("@digigov/ui/admin/Modal");
 
@@ -15,21 +19,41 @@ var _Button = require("@digigov/ui/core/Button");
 
 var _Paragraph = require("@digigov/ui/typography/Paragraph");
 
-var _ref = /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Modal.Modal, {
-  open: true,
-  role: "alertdialog",
-  "aria-labelledby": "modal-label",
-  "aria-describedby": "modal-content"
-}, /*#__PURE__*/_react["default"].createElement(_Modal.ModalHeading, {
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_Modal.ModalHeading, {
   id: "modal-label"
-}, "\u0395\u03C0\u03B9\u03B2\u03B5\u03B2\u03B1\u03AF\u03C9\u03C3\u03B7"), /*#__PURE__*/_react["default"].createElement(_Modal.ModalContent, {
+}, "\u0395\u03C0\u03B9\u03B2\u03B5\u03B2\u03B1\u03AF\u03C9\u03C3\u03B7");
+
+var _ref2 = /*#__PURE__*/_react["default"].createElement(_Modal.ModalContent, {
   id: "modal-content"
-}, /*#__PURE__*/_react["default"].createElement(_Paragraph.Paragraph, null, "\u0395\u03AF\u03C3\u03C4\u03B5 \u03C3\u03AF\u03B3\u03BF\u03C5\u03C1\u03BF\u03B9 \u03CC\u03C4\u03B9 \u03B8\u03AD\u03BB\u03B5\u03C4\u03B5 \u03BD\u03B1 \u03B4\u03B9\u03B1\u03B3\u03C1\u03AC\u03C8\u03B5\u03C4\u03B5 \u03C4\u03B7\u03BD \u03B5\u03B3\u03B3\u03C1\u03B1\u03C6\u03AE;")), /*#__PURE__*/_react["default"].createElement(_Modal.ModalAction, null, /*#__PURE__*/_react["default"].createElement(_Button.Button, null, "\u0394\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE"), /*#__PURE__*/_react["default"].createElement(_Button.Button, {
-  variant: "link"
-}, "\u0391\u03BA\u03CD\u03C1\u03C9\u03C3\u03B7"))));
+}, /*#__PURE__*/_react["default"].createElement(_Paragraph.Paragraph, null, "\u0395\u03AF\u03C3\u03C4\u03B5 \u03C3\u03AF\u03B3\u03BF\u03C5\u03C1\u03BF\u03B9 \u03CC\u03C4\u03B9 \u03B8\u03AD\u03BB\u03B5\u03C4\u03B5 \u03BD\u03B1 \u03B4\u03B9\u03B1\u03B3\u03C1\u03AC\u03C8\u03B5\u03C4\u03B5 \u03C4\u03B7\u03BD \u03B5\u03B3\u03B3\u03C1\u03B1\u03C6\u03AE;"));
+
+var _ref3 = /*#__PURE__*/_react["default"].createElement(_Button.Button, null, "\u0394\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE");
 
 var AlertDialog = function AlertDialog() {
-  return _ref;
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      open = _useState2[0],
+      setOpen = _useState2[1];
+
+  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Button.Button, {
+    onClick: function onClick() {
+      setOpen(!open);
+    }
+  }, "\u0386\u03BD\u03BF\u03B9\u03BE\u03B5 Modal"), /*#__PURE__*/_react["default"].createElement(_Modal.Modal, {
+    open: open,
+    role: "alertdialog",
+    "aria-labelledby": "modal-label",
+    "aria-describedby": "modal-content"
+  }, _ref, _ref2, /*#__PURE__*/_react["default"].createElement(_Modal.ModalAction, null, _ref3, /*#__PURE__*/_react["default"].createElement(_Button.Button, {
+    variant: "link",
+    onClick: function onClick() {
+      setOpen(!open);
+    }
+  }, "\u0391\u03BA\u03CD\u03C1\u03C9\u03C3\u03B7"))));
 };
 
 exports.AlertDialog = AlertDialog;

package/admin/Modal/__stories__/Default.js

@@ -2,12 +2,16 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.Default = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
 
 var _Modal = require("@digigov/ui/admin/Modal");
 
@@ -19,20 +23,40 @@ var _FieldContainer = require("@digigov/ui/core/FieldContainer");
 
 var _LabelContainer = require("@digigov/ui/core/LabelContainer");
 
-var _ref = /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Modal.Modal, {
-  open: true,
-  "aria-labelledby": "modal-label"
-}, /*#__PURE__*/_react["default"].createElement(_Modal.ModalHeading, {
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_Modal.ModalHeading, {
   id: "modal-label"
-}, "\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7 \u03C4\u03B7\u03BB\u03B5\u03C6\u03CE\u03BD\u03BF\u03C5"), /*#__PURE__*/_react["default"].createElement(_Modal.ModalContent, null, /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldContainer, null, /*#__PURE__*/_react["default"].createElement(_LabelContainer.LabelContainer, null, "\u03A3\u03C5\u03BC\u03C0\u03BB\u03B7\u03C1\u03CE\u03C3\u03C4\u03B5 \u03C4\u03BF \u03C4\u03B7\u03BB\u03AD\u03C6\u03C9\u03BD\u03BF \u03B5\u03C0\u03B9\u03BA\u03BF\u03B9\u03BD\u03C9\u03BD\u03AF\u03B1\u03C2", /*#__PURE__*/_react["default"].createElement(_TextInput.TextInput, {
+}, "\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7 \u03C4\u03B7\u03BB\u03B5\u03C6\u03CE\u03BD\u03BF\u03C5");
+
+var _ref2 = /*#__PURE__*/_react["default"].createElement(_Modal.ModalContent, null, /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldContainer, null, /*#__PURE__*/_react["default"].createElement(_LabelContainer.LabelContainer, null, "\u03A3\u03C5\u03BC\u03C0\u03BB\u03B7\u03C1\u03CE\u03C3\u03C4\u03B5 \u03C4\u03BF \u03C4\u03B7\u03BB\u03AD\u03C6\u03C9\u03BD\u03BF \u03B5\u03C0\u03B9\u03BA\u03BF\u03B9\u03BD\u03C9\u03BD\u03AF\u03B1\u03C2", /*#__PURE__*/_react["default"].createElement(_TextInput.TextInput, {
   name: "inputext",
   characterWidth: 10
-})))), /*#__PURE__*/_react["default"].createElement(_Modal.ModalAction, null, /*#__PURE__*/_react["default"].createElement(_Button.Button, null, "\u03A5\u03C0\u03BF\u03B2\u03BF\u03BB\u03AE"), /*#__PURE__*/_react["default"].createElement(_Button.Button, {
-  variant: "link"
-}, "\u0391\u03BA\u03CD\u03C1\u03C9\u03C3\u03B7"))));
+}))));
+
+var _ref3 = /*#__PURE__*/_react["default"].createElement(_Button.Button, null, "\u03A5\u03C0\u03BF\u03B2\u03BF\u03BB\u03AE");
 
 var Default = function Default() {
-  return _ref;
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      open = _useState2[0],
+      setOpen = _useState2[1];
+
+  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Button.Button, {
+    onClick: function onClick() {
+      setOpen(!open);
+    }
+  }, "\u0386\u03BD\u03BF\u03B9\u03BE\u03B5 Modal"), /*#__PURE__*/_react["default"].createElement(_Modal.Modal, {
+    open: open,
+    "aria-labelledby": "modal-label"
+  }, _ref, _ref2, /*#__PURE__*/_react["default"].createElement(_Modal.ModalAction, null, _ref3, /*#__PURE__*/_react["default"].createElement(_Button.Button, {
+    variant: "link",
+    onClick: function onClick() {
+      setOpen(!open);
+    }
+  }, "\u0391\u03BA\u03CD\u03C1\u03C9\u03C3\u03B7"))));
 };
 
 exports.Default = Default;

package/admin/Modal/index.mdx

@@ -15,11 +15,7 @@ import Modal, {ModalHeading, ModalContent, ModalAction} from "@digigov/ui/admin/
 
 ### As an Alert Dialog
 
-<Story
-  packageName="@digigov/ui"
-  component="admin/Modal"
-  story="AlertDialog.tsx"
-/>
+<Story packageName="@digigov/ui" component="admin/Modal" story="AlertDialog.tsx" />
 
 ## Accessibility
 

package/app/Footer/Footer.mdx

@@ -15,26 +15,15 @@ import Footer from '@digigov/ui/app/Footer';
 
 ### Footer with logos
 
-<Story
-  packageName="@digigov/ui"
-  component="app/Footer"
-  story="FooterWithLogo.tsx"
-/>
+<Story packageName="@digigov/ui" component="app/Footer" story="FooterWithLogo.tsx" />
 
 ### Footer with secondary navigation
 
-<Story
-  packageName="@digigov/ui"
-  component="app/Footer"
-  story="FooterWithSecondaryNavigation.tsx"
-/>
+<Story packageName="@digigov/ui" component="app/Footer" story="FooterWithSecondaryNavigation.tsx" />
 
 ### Footer with links to meta information
 
-<Story
-  packageName="@digigov/ui"
-  component="app/Footer"
-  story="FooterWithLink.tsx"
+<Story packageName="@digigov/ui" component="app/Footer" story="FooterWithLink.tsx"
 />
 
 ### All inclusive footer

package/app/Header/index.mdx

@@ -11,28 +11,15 @@ import Header from '@digigov/ui/app/Header';
 
 ### Default header
 
-<Story
-  title="### Default"
-  packageName="@digigov/ui"
-  component="app/Header"
-  story="Default.tsx"
-/>
+<Story title="### Default" packageName="@digigov/ui" component="app/Header" story="Default.tsx" />
 
 ### Header with service name
 
-<Story
-  packageName="@digigov/ui"
-  component="app/Header"
-  story="WithServiceName.tsx"
-/>
+<Story packageName="@digigov/ui" component="app/Header" story="WithServiceName.tsx" />
 
 ### Header with service logo and service name
 
-<Story
-  packageName="@digigov/ui"
-  component="app/Header"
-  story="WithServiceNameAndLogo.tsx"
-/>
+<Story packageName="@digigov/ui" component="app/Header" story="WithServiceNameAndLogo.tsx" />
 
 ### Default header with navigation
 

package/app/QrCodeViewer/index.mdx

@@ -11,11 +11,7 @@ import QrCodeViewer from '@digigov/ui/app/QrCodeViewer';
 
 ### Default QrCodeViewer
 
-<Story
-  packageName="@digigov/ui"
-  component="app/QrCodeViewer"
-  story="Default.tsx"
-/>
+<Story packageName="@digigov/ui" component="app/QrCodeViewer" story="Default.tsx" />
 
 ### Custom QrCodeViewer
 

package/core/Accordion/index.mdx

@@ -15,21 +15,13 @@ import Accordion from '@digigov/ui/core/Accordion';
 
 ## How to use
 
-<Story
-  packageName="@digigov/ui"
-  component="core/Accordion"
-  story="Default.tsx"
-/>
+<Story packageName="@digigov/ui" component="core/Accordion" story="Default.tsx" />
 
 ### Accordion with Hints
 
 Accordions hide content, so the labels need to be clear. If necessary, you can add a summary line to help users understand what is in the section.
 
-<Story
-  packageName="@digigov/ui"
-  component="core/Accordion"
-  story="WithHints.tsx"
-/>
+<Story packageName="@digigov/ui" component="core/Accordion" story="WithHints.tsx" />
 
 ## Accessibility
 

package/core/Button/__stories__/GroupingButtons.d.ts

@@ -2,3 +2,4 @@
  * My deescrition is the best description that was described
  */
 export declare const GroupingButtons: () => JSX.Element;
+export default GroupingButtons;

package/core/Button/__stories__/GroupingButtons.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.GroupingButtons = void 0;
+exports["default"] = exports.GroupingButtons = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -22,4 +22,6 @@ var GroupingButtons = function GroupingButtons() {
   return _ref;
 };
 
-exports.GroupingButtons = GroupingButtons;
+exports.GroupingButtons = GroupingButtons;
+var _default = GroupingButtons;
+exports["default"] = _default;

package/core/Button/__stories__/GroupingButtonsAndLinks.d.ts

@@ -2,3 +2,4 @@
  * My deescrition is the best description that was described
  */
 export declare const GroupingButtonsAndLinks: () => JSX.Element;
+export default GroupingButtonsAndLinks;

package/core/Button/__stories__/GroupingButtonsAndLinks.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.GroupingButtonsAndLinks = void 0;
+exports["default"] = exports.GroupingButtonsAndLinks = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -24,4 +24,6 @@ var GroupingButtonsAndLinks = function GroupingButtonsAndLinks() {
   return _ref;
 };
 
-exports.GroupingButtonsAndLinks = GroupingButtonsAndLinks;
+exports.GroupingButtonsAndLinks = GroupingButtonsAndLinks;
+var _default = GroupingButtonsAndLinks;
+exports["default"] = _default;

package/core/Button/__stories__/Warning.d.ts

@@ -1 +1,2 @@
 export declare const Warning: () => JSX.Element;
+export default Warning;

package/core/Button/__stories__/Warning.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Warning = void 0;
+exports["default"] = exports.Warning = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -20,4 +20,6 @@ var Warning = function Warning() {
   return _ref;
 };
 
-exports.Warning = Warning;
+exports.Warning = Warning;
+var _default = Warning;
+exports["default"] = _default;

package/core/Button/index.mdx

@@ -24,21 +24,13 @@ Use a default button for the main call to action on a page.
 
 Use a start button for the main call to action on your service’s start page. Start buttons do not submit form data, so they use a link tag rather than a button tag.
 
-<Story
-  packageName="@digigov/ui"
-  component="core/Button"
-  story="CallToActionButton.tsx"
-/>
+<Story packageName="@digigov/ui" component="core/Button" story="CallToActionButton.tsx" />
 
 ### Secondary buttons
 
 Use secondary buttons for secondary calls to action on a page.
 
-<Story
-  packageName="@digigov/ui"
-  component="core/Button"
-  story="Secondary.tsx"
-/>
+<Story packageName="@digigov/ui" component="core/Button" story="Secondary.tsx" />
 
 ### Warning buttons
 
@@ -56,19 +48,11 @@ Disabled buttons have poor contrast and can confuse some users, so avoid them if
 
 Use a button group when two or more buttons are placed together.
 
-<Story
-  packageName="@digigov/ui"
-  component="core/Button"
-  story="GroupingButtons.tsx"
-/>
+<Story packageName="@digigov/ui"component="core/Button" story="GroupingButtons.tsx" />
 
 Any links within a button group will automatically align with the buttons.
 
-<Story
-  packageName="@digigov/ui"
-  component="core/Button"
-  story="GroupingButtonsAndLinks.tsx"
-/>
+<Story packageName="@digigov/ui" component="core/Button" story="GroupingButtonsAndLinks.tsx" />
 
 Write button text in sentence case, describing the action it performs. For
 example:'