@artsy/palette 44.1.0 → 44.2.0

package/dist/elements/Checkbox/Checkbox.story.js

@@ -1,91 +1,93 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.Extended = exports.Demo = exports.Default = void 0;
-var _test = require("@storybook/test");
-var _react = _interopRequireWildcard(require("react"));
-var _storybookStates = require("storybook-states");
-var _Box = require("../Box");
-var _Flex = require("../Flex");
-var _Text = require("../Text");
+exports.default = exports.WithError = exports.WithCustomChildren = exports.Unchecked = exports.HoverAndSelected = exports.Hover = exports.FullWidth = exports.FocusAndSelected = exports.Focus = exports.DisabledAndChecked = exports.Disabled = exports.Checked = void 0;
+var _react = _interopRequireDefault(require("react"));
 var _Checkbox = require("./Checkbox");
-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; }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var _storybookBlocklist = require("../../utils/storybookBlocklist");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var _default = exports.default = {
-  title: "Components/Checkbox"
+  title: "Components/Checkbox",
+  component: _Checkbox.Checkbox,
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "Checkbox component provides a selectable input with label support. Includes states for selected, disabled, error, focus, and hover interactions."
+      },
+      controls: {
+        exclude: _storybookBlocklist.STORYBOOK_PROPS_BLOCKLIST
+      }
+    }
+  }
 };
-var Default = exports.Default = function Default() {
-  return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
-    states: [{}, {
-      selected: true
-    }, {
-      focus: true
-    }, {
-      focus: true,
-      selected: true
-    }, {
-      hover: true
-    }, {
-      hover: true,
-      selected: true
-    }, {
-      disabled: true
-    }, {
-      disabled: true,
-      selected: true
-    }, {
-      error: true
-    }, {
-      error: true,
-      selected: true
-    }, {
-      children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "A label ", /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "(", 2 + 2, ")"))
-    }, {
-      children: /*#__PURE__*/_react.default.createElement("div", null, "Unstyled label")
-    }]
-  }, /*#__PURE__*/_react.default.createElement(_Checkbox.Checkbox, null, "A label"));
+var Unchecked = exports.Unchecked = {
+  args: {
+    children: "Checkbox label"
+  }
 };
-Default.displayName = "Default";
-var Demo = exports.Demo = function Demo() {
-  var _useState = (0, _react.useState)(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isSelected = _useState2[0],
-    setSelected = _useState2[1];
-  return /*#__PURE__*/_react.default.createElement(_storybookStates.States, null, /*#__PURE__*/_react.default.createElement(_Checkbox.Checkbox, {
-    selected: isSelected,
-    onSelect: function onSelect(selected) {
-      setSelected(selected);
-      (0, _test.fn)()(selected);
-    }
-  }, "Example"));
+var Checked = exports.Checked = {
+  args: {
+    children: "Checked checkbox",
+    selected: true
+  }
+};
+var WithError = exports.WithError = {
+  args: {
+    children: "Checkbox with error",
+    error: true
+  }
+};
+var Disabled = exports.Disabled = {
+  args: {
+    children: "Disabled checkbox",
+    disabled: true
+  }
+};
+var DisabledAndChecked = exports.DisabledAndChecked = {
+  args: {
+    children: "Disabled and checked",
+    disabled: true,
+    selected: true
+  }
+};
+var Focus = exports.Focus = {
+  args: {
+    children: "Focused checkbox",
+    focus: true
+  }
+};
+var Hover = exports.Hover = {
+  args: {
+    children: "Hovered checkbox",
+    hover: true
+  }
+};
+var FocusAndSelected = exports.FocusAndSelected = {
+  args: {
+    children: "Focused and selected",
+    focus: true,
+    selected: true
+  }
+};
+var HoverAndSelected = exports.HoverAndSelected = {
+  args: {
+    children: "Hovered and selected",
+    hover: true,
+    selected: true
+  }
+};
+var WithCustomChildren = exports.WithCustomChildren = {
+  args: {
+    children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "A label ", /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "(", 2 + 2, ")"))
+  }
 };
-Demo.displayName = "Demo";
-var Extended = exports.Extended = function Extended() {
-  return /*#__PURE__*/_react.default.createElement(_storybookStates.States, null, /*#__PURE__*/_react.default.createElement(_Box.Box, {
-    width: 300
-  }, /*#__PURE__*/_react.default.createElement(_Checkbox.Checkbox, {
-    width: "100%"
-  }, /*#__PURE__*/_react.default.createElement(_Flex.Flex, {
-    width: "35%",
-    justifyContent: "space-between",
-    alignItems: "center"
-  }, /*#__PURE__*/_react.default.createElement(_Text.Text, {
-    lineHeight: 1
-  }, "Green"), /*#__PURE__*/_react.default.createElement(_Box.Box, {
-    bg: "green",
-    width: 20,
-    height: 20,
-    borderRadius: "50%"
-  })))));
+var FullWidth = exports.FullWidth = {
+  args: {
+    width: "100%",
+    children: "Full width checkbox"
+  }
 };
-Extended.displayName = "Extended";
 //# sourceMappingURL=Checkbox.story.js.map

package/dist/elements/Checkbox/Checkbox.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.story.js","names":["_test","require","_react","_interopRequireWildcard","_storybookStates","_Box","_Flex","_Text","_Checkbox","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_default","exports","title","Default","createElement","States","states","selected","focus","hover","disabled","error","children","Fragment","Checkbox","displayName","Demo","_useState","useState","_useState2","isSelected","setSelected","onSelect","fn","Extended","Box","width","Flex","justifyContent","alignItems","Text","lineHeight","bg","height","borderRadius"],"sources":["../../../src/elements/Checkbox/Checkbox.story.tsx"],"sourcesContent":["import { fn } from \"@storybook/test\"\nimport React, { useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { Box } from \"../Box\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\nimport { Checkbox } from \"./Checkbox\"\n\nexport default {\n  title: \"Components/Checkbox\",\n}\n\nexport const Default = () => {\n  return (\n    <States\n      states={[\n        {},\n        { selected: true },\n        { focus: true },\n        { focus: true, selected: true },\n        { hover: true },\n        { hover: true, selected: true },\n        { disabled: true },\n        { disabled: true, selected: true },\n        { error: true },\n        { error: true, selected: true },\n        {\n          children: (\n            <>\n              A label <>({2 + 2})</>\n            </>\n          ),\n        },\n        {\n          children: <div>Unstyled label</div>,\n        },\n      ]}\n    >\n      <Checkbox>A label</Checkbox>\n    </States>\n  )\n}\n\nexport const Demo = () => {\n  const [isSelected, setSelected] = useState(false)\n  return (\n    <States>\n      <Checkbox\n        selected={isSelected}\n        onSelect={(selected) => {\n          setSelected(selected)\n          fn()(selected)\n        }}\n      >\n        Example\n      </Checkbox>\n    </States>\n  )\n}\n\nexport const Extended = () => {\n  return (\n    <States>\n      <Box width={300}>\n        <Checkbox width=\"100%\">\n          <Flex width=\"35%\" justifyContent=\"space-between\" alignItems=\"center\">\n            <Text lineHeight={1}>Green</Text>\n            <Box bg=\"green\" width={20} height={20} borderRadius=\"50%\" />\n          </Flex>\n        </Checkbox>\n      </Box>\n    </States>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Checkbox.story.js","names":["_react","_interopRequireDefault","require","_Checkbox","_storybookBlocklist","obj","__esModule","default","_default","exports","title","component","Checkbox","tags","parameters","docs","description","controls","exclude","STORYBOOK_PROPS_BLOCKLIST","Unchecked","args","children","Checked","selected","WithError","error","Disabled","disabled","DisabledAndChecked","Focus","focus","Hover","hover","FocusAndSelected","HoverAndSelected","WithCustomChildren","createElement","Fragment","FullWidth","width"],"sources":["../../../src/elements/Checkbox/Checkbox.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { Checkbox } from \"./Checkbox\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  title: \"Components/Checkbox\",\n  component: Checkbox,\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"Checkbox component provides a selectable input with label support. Includes states for selected, disabled, error, focus, and hover interactions.\",\n      },\n      controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n    },\n  },\n}\n\nexport const Unchecked = {\n  args: {\n    children: \"Checkbox label\",\n  },\n}\n\nexport const Checked = {\n  args: {\n    children: \"Checked checkbox\",\n    selected: true,\n  },\n}\n\nexport const WithError = {\n  args: {\n    children: \"Checkbox with error\",\n    error: true,\n  },\n}\n\nexport const Disabled = {\n  args: {\n    children: \"Disabled checkbox\",\n    disabled: true,\n  },\n}\n\nexport const DisabledAndChecked = {\n  args: {\n    children: \"Disabled and checked\",\n    disabled: true,\n    selected: true,\n  },\n}\n\nexport const Focus = {\n  args: {\n    children: \"Focused checkbox\",\n    focus: true,\n  },\n}\n\nexport const Hover = {\n  args: {\n    children: \"Hovered checkbox\",\n    hover: true,\n  },\n}\n\nexport const FocusAndSelected = {\n  args: {\n    children: \"Focused and selected\",\n    focus: true,\n    selected: true,\n  },\n}\n\nexport const HoverAndSelected = {\n  args: {\n    children: \"Hovered and selected\",\n    hover: true,\n    selected: true,\n  },\n}\n\nexport const WithCustomChildren = {\n  args: {\n    children: (\n      <>\n        A label <>({2 + 2})</>\n      </>\n    ),\n  },\n}\n\nexport const FullWidth = {\n  args: {\n    width: \"100%\",\n    children: \"Full width checkbox\",\n  },\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,mBAAA,GAAAF,OAAA;AAA0E,SAAAD,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,IAAAG,QAAA,GAAAC,OAAA,CAAAF,OAAA,GAE3D;EACbG,KAAK,EAAE,qBAAqB;EAC5BC,SAAS,EAAEC,kBAAQ;EACnBC,IAAI,EAAE,CAAC,UAAU,CAAC;EAClBC,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXL,SAAS,EACP;MACJ,CAAC;MACDM,QAAQ,EAAE;QACRC,OAAO,EAAEC;MACX;IACF;EACF;AACF,CAAC;AAEM,IAAMC,SAAS,GAAAX,OAAA,CAAAW,SAAA,GAAG;EACvBC,IAAI,EAAE;IACJC,QAAQ,EAAE;EACZ;AACF,CAAC;AAEM,IAAMC,OAAO,GAAAd,OAAA,CAAAc,OAAA,GAAG;EACrBF,IAAI,EAAE;IACJC,QAAQ,EAAE,kBAAkB;IAC5BE,QAAQ,EAAE;EACZ;AACF,CAAC;AAEM,IAAMC,SAAS,GAAAhB,OAAA,CAAAgB,SAAA,GAAG;EACvBJ,IAAI,EAAE;IACJC,QAAQ,EAAE,qBAAqB;IAC/BI,KAAK,EAAE;EACT;AACF,CAAC;AAEM,IAAMC,QAAQ,GAAAlB,OAAA,CAAAkB,QAAA,GAAG;EACtBN,IAAI,EAAE;IACJC,QAAQ,EAAE,mBAAmB;IAC7BM,QAAQ,EAAE;EACZ;AACF,CAAC;AAEM,IAAMC,kBAAkB,GAAApB,OAAA,CAAAoB,kBAAA,GAAG;EAChCR,IAAI,EAAE;IACJC,QAAQ,EAAE,sBAAsB;IAChCM,QAAQ,EAAE,IAAI;IACdJ,QAAQ,EAAE;EACZ;AACF,CAAC;AAEM,IAAMM,KAAK,GAAArB,OAAA,CAAAqB,KAAA,GAAG;EACnBT,IAAI,EAAE;IACJC,QAAQ,EAAE,kBAAkB;IAC5BS,KAAK,EAAE;EACT;AACF,CAAC;AAEM,IAAMC,KAAK,GAAAvB,OAAA,CAAAuB,KAAA,GAAG;EACnBX,IAAI,EAAE;IACJC,QAAQ,EAAE,kBAAkB;IAC5BW,KAAK,EAAE;EACT;AACF,CAAC;AAEM,IAAMC,gBAAgB,GAAAzB,OAAA,CAAAyB,gBAAA,GAAG;EAC9Bb,IAAI,EAAE;IACJC,QAAQ,EAAE,sBAAsB;IAChCS,KAAK,EAAE,IAAI;IACXP,QAAQ,EAAE;EACZ;AACF,CAAC;AAEM,IAAMW,gBAAgB,GAAA1B,OAAA,CAAA0B,gBAAA,GAAG;EAC9Bd,IAAI,EAAE;IACJC,QAAQ,EAAE,sBAAsB;IAChCW,KAAK,EAAE,IAAI;IACXT,QAAQ,EAAE;EACZ;AACF,CAAC;AAEM,IAAMY,kBAAkB,GAAA3B,OAAA,CAAA2B,kBAAA,GAAG;EAChCf,IAAI,EAAE;IACJC,QAAQ,eACNtB,MAAA,CAAAO,OAAA,CAAA8B,aAAA,CAAArC,MAAA,CAAAO,OAAA,CAAA+B,QAAA,QAAE,UACQ,eAAAtC,MAAA,CAAAO,OAAA,CAAA8B,aAAA,CAAArC,MAAA,CAAAO,OAAA,CAAA+B,QAAA,QAAE,GAAC,EAAC,CAAC,GAAG,CAAC,EAAC,GAAC,CAAG;EAG5B;AACF,CAAC;AAEM,IAAMC,SAAS,GAAA9B,OAAA,CAAA8B,SAAA,GAAG;EACvBlB,IAAI,EAAE;IACJmB,KAAK,EAAE,MAAM;IACblB,QAAQ,EAAE;EACZ;AACF,CAAC"}

package/dist/elements/Clickable/Clickable.story.d.ts

@@ -1,12 +1,57 @@
 import React from "react";
 declare const _default: {
     title: string;
+    component: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, import("./Clickable").ClickableProps>> & string;
+    tags: string[];
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+        controls: {
+            exclude: string[];
+        };
+    };
 };
 export default _default;
-export declare const Default: () => React.JSX.Element;
-export declare const Submit: {
-    (): React.JSX.Element;
-    story: {
-        name: string;
+export declare const Default: {
+    args: {
+        children: string;
+        onClick: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export declare const WithUnderline: {
+    args: {
+        children: string;
+        textDecoration: string;
+        onClick: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export declare const DefaultCursor: {
+    args: {
+        children: string;
+        cursor: string;
+        onClick: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export declare const MultiLine: {
+    args: {
+        children: React.JSX.Element;
+        onClick: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export declare const ButtonType: {
+    args: {
+        children: string;
+        type: string;
+        onClick: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export declare const SubmitType: {
+    args: {
+        children: string;
+        type: string;
+        onClick: import("@vitest/spy").Mock<(...args: any[]) => any>;
     };
 };

package/dist/elements/Clickable/Clickable.story.js

@@ -1,73 +1,67 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.Submit = exports.Default = void 0;
+exports.default = exports.WithUnderline = exports.SubmitType = exports.MultiLine = exports.DefaultCursor = exports.Default = exports.ButtonType = void 0;
 var _test = require("@storybook/test");
-var _react = _interopRequireWildcard(require("react"));
-var _storybookStates = require("storybook-states");
-var _Box = require("../Box");
+var _react = _interopRequireDefault(require("react"));
 var _Clickable = require("./Clickable");
-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; }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var _storybookBlocklist = require("../../utils/storybookBlocklist");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var _default = exports.default = {
-  title: "Components/Clickable"
+  title: "Components/Clickable",
+  component: _Clickable.Clickable,
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "Clickable component provides an accessible clickable element that can be styled like a button but renders as a span by default. Includes proper focus and interaction states."
+      }
+    },
+    controls: {
+      exclude: _storybookBlocklist.STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
 };
-var Default = exports.Default = function Default() {
-  return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
-    states: [{}, {
-      textDecoration: "underline"
-    }, {
-      cursor: "default"
-    }, {
-      children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Inherits the page\u2019s", /*#__PURE__*/_react.default.createElement("br", null), "text alignment.")
-    }, {
-      bg: "red100",
-      color: "mono0",
-      m: 2,
-      p: 1
-    }]
-  }, /*#__PURE__*/_react.default.createElement(_Clickable.Clickable, {
+var Default = exports.Default = {
+  args: {
+    children: "Clickable",
     onClick: (0, _test.fn)()
-  }, "Clickable"));
+  }
 };
-Default.displayName = "Default";
-var Submit = exports.Submit = function Submit() {
-  var _useState = (0, _react.useState)(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isSubmitted = _useState2[0],
-    setSubmitted = _useState2[1];
-  return /*#__PURE__*/_react.default.createElement("form", {
-    onSubmit: function onSubmit(e) {
-      e.preventDefault();
-      setSubmitted(true);
-      setTimeout(function () {
-        setSubmitted(false);
-      }, 1000);
-    }
-  }, /*#__PURE__*/_react.default.createElement("pre", null, "submitted? ", isSubmitted ? "yes" : "no"), /*#__PURE__*/_react.default.createElement(_Box.Box, {
-    mt: 1
-  }, /*#__PURE__*/_react.default.createElement(_Clickable.Clickable, {
-    border: "1px solid",
-    p: 2,
+var WithUnderline = exports.WithUnderline = {
+  args: {
+    children: "Underlined Clickable",
+    textDecoration: "underline",
+    onClick: (0, _test.fn)()
+  }
+};
+var DefaultCursor = exports.DefaultCursor = {
+  args: {
+    children: "Default Cursor",
+    cursor: "default",
+    onClick: (0, _test.fn)()
+  }
+};
+var MultiLine = exports.MultiLine = {
+  args: {
+    children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Inherits the page's", /*#__PURE__*/_react.default.createElement("br", null), "text alignment."),
+    onClick: (0, _test.fn)()
+  }
+};
+var ButtonType = exports.ButtonType = {
+  args: {
+    children: "Button Type",
     type: "button",
-    mr: 1
-  }, "type=\"button\""), /*#__PURE__*/_react.default.createElement(_Clickable.Clickable, {
-    border: "1px solid",
-    p: 2,
-    type: "submit"
-  }, "type=\"submit\"")));
+    onClick: (0, _test.fn)()
+  }
 };
-Submit.displayName = "Submit";
-Submit.story = {
-  name: "Does not submit forms by default"
+var SubmitType = exports.SubmitType = {
+  args: {
+    children: "Submit Type",
+    type: "submit",
+    onClick: (0, _test.fn)()
+  }
 };
 //# sourceMappingURL=Clickable.story.js.map

package/dist/elements/Clickable/Clickable.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"Clickable.story.js","names":["_test","require","_react","_interopRequireWildcard","_storybookStates","_Box","_Clickable","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_default","exports","title","Default","createElement","States","states","textDecoration","cursor","children","Fragment","bg","color","m","p","Clickable","onClick","fn","displayName","Submit","_useState","useState","_useState2","isSubmitted","setSubmitted","onSubmit","e","preventDefault","setTimeout","Box","mt","border","type","mr","story"],"sources":["../../../src/elements/Clickable/Clickable.story.tsx"],"sourcesContent":["import { fn } from \"@storybook/test\"\nimport React, { useState } from \"react\"\nimport { States } from \"storybook-states\"\nimport { Box } from \"../Box\"\nimport { Clickable, ClickableProps } from \"./Clickable\"\n\nexport default {\n  title: \"Components/Clickable\",\n}\n\nexport const Default = () => {\n  return (\n    <States<ClickableProps>\n      states={[\n        {},\n        { textDecoration: \"underline\" },\n        { cursor: \"default\" },\n        {\n          children: (\n            <>\n              Inherits the page’s\n              <br />\n              text alignment.\n            </>\n          ),\n        },\n        {\n          bg: \"red100\",\n          color: \"mono0\",\n          m: 2,\n          p: 1,\n        },\n      ]}\n    >\n      <Clickable onClick={fn()}>Clickable</Clickable>\n    </States>\n  )\n}\n\nexport const Submit = () => {\n  const [isSubmitted, setSubmitted] = useState(false)\n\n  return (\n    <form\n      onSubmit={(e) => {\n        e.preventDefault()\n        setSubmitted(true)\n\n        setTimeout(() => {\n          setSubmitted(false)\n        }, 1000)\n      }}\n    >\n      <pre>submitted? {isSubmitted ? \"yes\" : \"no\"}</pre>\n\n      <Box mt={1}>\n        <Clickable border=\"1px solid\" p={2} type=\"button\" mr={1}>\n          type=\"button\"\n        </Clickable>\n\n        <Clickable border=\"1px solid\" p={2} type=\"submit\">\n          type=\"submit\"\n        </Clickable>\n      </Box>\n    </form>\n  )\n}\n\nSubmit.story = {\n  name: \"Does not submit forms by default\",\n}\n"],"mappings":";;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,gBAAA,GAAAH,OAAA;AACA,IAAAI,IAAA,GAAAJ,OAAA;AACA,IAAAK,UAAA,GAAAL,OAAA;AAAuD,SAAAM,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAL,wBAAAS,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,aAAAE,OAAA,CAAAF,GAAA,yBAAAA,GAAA,4BAAAG,OAAA,EAAAH,GAAA,UAAAI,KAAA,GAAAT,wBAAA,CAAAC,WAAA,OAAAQ,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAL,GAAA,YAAAI,KAAA,CAAAE,GAAA,CAAAN,GAAA,SAAAO,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAZ,GAAA,QAAAY,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAf,GAAA,EAAAY,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAX,GAAA,EAAAY,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAZ,GAAA,CAAAY,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAH,GAAA,MAAAI,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAjB,GAAA,EAAAO,MAAA,YAAAA,MAAA;AAAA,SAAAW,eAAAC,GAAA,EAAAC,CAAA,WAAAC,eAAA,CAAAF,GAAA,KAAAG,qBAAA,CAAAH,GAAA,EAAAC,CAAA,KAAAG,2BAAA,CAAAJ,GAAA,EAAAC,CAAA,KAAAI,gBAAA;AAAA,SAAAA,iBAAA,cAAAC,SAAA;AAAA,SAAAF,4BAAAG,CAAA,EAAAC,MAAA,SAAAD,CAAA,qBAAAA,CAAA,sBAAAE,iBAAA,CAAAF,CAAA,EAAAC,MAAA,OAAAE,CAAA,GAAApB,MAAA,CAAAI,SAAA,CAAAiB,QAAA,CAAAf,IAAA,CAAAW,CAAA,EAAAK,KAAA,aAAAF,CAAA,iBAAAH,CAAA,CAAAM,WAAA,EAAAH,CAAA,GAAAH,CAAA,CAAAM,WAAA,CAAAC,IAAA,MAAAJ,CAAA,cAAAA,CAAA,mBAAAK,KAAA,CAAAC,IAAA,CAAAT,CAAA,OAAAG,CAAA,+DAAAO,IAAA,CAAAP,CAAA,UAAAD,iBAAA,CAAAF,CAAA,EAAAC,MAAA;AAAA,SAAAC,kBAAAT,GAAA,EAAAkB,GAAA,QAAAA,GAAA,YAAAA,GAAA,GAAAlB,GAAA,CAAAmB,MAAA,EAAAD,GAAA,GAAAlB,GAAA,CAAAmB,MAAA,WAAAlB,CAAA,MAAAmB,IAAA,OAAAL,KAAA,CAAAG,GAAA,GAAAjB,CAAA,GAAAiB,GAAA,EAAAjB,CAAA,IAAAmB,IAAA,CAAAnB,CAAA,IAAAD,GAAA,CAAAC,CAAA,UAAAmB,IAAA;AAAA,SAAAjB,sBAAAH,GAAA,EAAAC,CAAA,QAAAoB,EAAA,WAAArB,GAAA,gCAAAsB,MAAA,IAAAtB,GAAA,CAAAsB,MAAA,CAAAC,QAAA,KAAAvB,GAAA,4BAAAqB,EAAA,QAAAG,EAAA,EAAAC,EAAA,EAAAC,EAAA,EAAAC,EAAA,EAAAC,IAAA,OAAAC,EAAA,OAAAC,EAAA,iBAAAJ,EAAA,IAAAL,EAAA,GAAAA,EAAA,CAAAzB,IAAA,CAAAI,GAAA,GAAA+B,IAAA,QAAA9B,CAAA,QAAAX,MAAA,CAAA+B,EAAA,MAAAA,EAAA,UAAAQ,EAAA,uBAAAA,EAAA,IAAAL,EAAA,GAAAE,EAAA,CAAA9B,IAAA,CAAAyB,EAAA,GAAAW,IAAA,MAAAJ,IAAA,CAAAK,IAAA,CAAAT,EAAA,CAAAU,KAAA,GAAAN,IAAA,CAAAT,MAAA,KAAAlB,CAAA,GAAA4B,EAAA,iBAAAM,GAAA,IAAAL,EAAA,OAAAL,EAAA,GAAAU,GAAA,yBAAAN,EAAA,YAAAR,EAAA,CAAAe,MAAA,KAAAT,EAAA,GAAAN,EAAA,CAAAe,MAAA,IAAA9C,MAAA,CAAAqC,EAAA,MAAAA,EAAA,2BAAAG,EAAA,QAAAL,EAAA,aAAAG,IAAA;AAAA,SAAA1B,gBAAAF,GAAA,QAAAe,KAAA,CAAAsB,OAAA,CAAArC,GAAA,UAAAA,GAAA;AAAA,IAAAsC,QAAA,GAAAC,OAAA,CAAAvD,OAAA,GAExC;EACbwD,KAAK,EAAE;AACT,CAAC;AAEM,IAAMC,OAAO,GAAAF,OAAA,CAAAE,OAAA,GAAG,SAAVA,OAAOA,CAAA,EAAS;EAC3B,oBACEtE,MAAA,CAAAa,OAAA,CAAA0D,aAAA,CAACrE,gBAAA,CAAAsE,MAAM;IACLC,MAAM,EAAE,CACN,CAAC,CAAC,EACF;MAAEC,cAAc,EAAE;IAAY,CAAC,EAC/B;MAAEC,MAAM,EAAE;IAAU,CAAC,EACrB;MACEC,QAAQ,eACN5E,MAAA,CAAAa,OAAA,CAAA0D,aAAA,CAAAvE,MAAA,CAAAa,OAAA,CAAAgE,QAAA,QAAE,0BAEA,eAAA7E,MAAA,CAAAa,OAAA,CAAA0D,aAAA,YAAM,mBAER;IAEJ,CAAC,EACD;MACEO,EAAE,EAAE,QAAQ;MACZC,KAAK,EAAE,OAAO;MACdC,CAAC,EAAE,CAAC;MACJC,CAAC,EAAE;IACL,CAAC;EACD,gBAEFjF,MAAA,CAAAa,OAAA,CAAA0D,aAAA,CAACnE,UAAA,CAAA8E,SAAS;IAACC,OAAO,EAAE,IAAAC,QAAE;EAAG,GAAC,WAAS,CAAY,CACxC;AAEb,CAAC;AA3BYd,OAAO,CAAAe,WAAA;AA6Bb,IAAMC,MAAM,GAAAlB,OAAA,CAAAkB,MAAA,GAAG,SAATA,MAAMA,CAAA,EAAS;EAC1B,IAAAC,SAAA,GAAoC,IAAAC,eAAQ,EAAC,KAAK,CAAC;IAAAC,UAAA,GAAA7D,cAAA,CAAA2D,SAAA;IAA5CG,WAAW,GAAAD,UAAA;IAAEE,YAAY,GAAAF,UAAA;EAEhC,oBACEzF,MAAA,CAAAa,OAAA,CAAA0D,aAAA;IACEqB,QAAQ,EAAE,SAAVA,QAAQA,CAAGC,CAAC,EAAK;MACfA,CAAC,CAACC,cAAc,EAAE;MAClBH,YAAY,CAAC,IAAI,CAAC;MAElBI,UAAU,CAAC,YAAM;QACfJ,YAAY,CAAC,KAAK,CAAC;MACrB,CAAC,EAAE,IAAI,CAAC;IACV;EAAE,gBAEF3F,MAAA,CAAAa,OAAA,CAAA0D,aAAA,cAAK,aAAW,EAACmB,WAAW,GAAG,KAAK,GAAG,IAAI,CAAO,eAElD1F,MAAA,CAAAa,OAAA,CAAA0D,aAAA,CAACpE,IAAA,CAAA6F,GAAG;IAACC,EAAE,EAAE;EAAE,gBACTjG,MAAA,CAAAa,OAAA,CAAA0D,aAAA,CAACnE,UAAA,CAAA8E,SAAS;IAACgB,MAAM,EAAC,WAAW;IAACjB,CAAC,EAAE,CAAE;IAACkB,IAAI,EAAC,QAAQ;IAACC,EAAE,EAAE;EAAE,GAAC,iBAEzD,CAAY,eAEZpG,MAAA,CAAAa,OAAA,CAAA0D,aAAA,CAACnE,UAAA,CAAA8E,SAAS;IAACgB,MAAM,EAAC,WAAW;IAACjB,CAAC,EAAE,CAAE;IAACkB,IAAI,EAAC;EAAQ,GAAC,iBAElD,CAAY,CACR,CACD;AAEX,CAAC;AA3BYb,MAAM,CAAAD,WAAA;AA6BnBC,MAAM,CAACe,KAAK,GAAG;EACb1D,IAAI,EAAE;AACR,CAAC"}
+{"version":3,"file":"Clickable.story.js","names":["_test","require","_react","_interopRequireDefault","_Clickable","_storybookBlocklist","obj","__esModule","default","_default","exports","title","component","Clickable","tags","parameters","docs","description","controls","exclude","STORYBOOK_PROPS_BLOCKLIST","Default","args","children","onClick","fn","WithUnderline","textDecoration","DefaultCursor","cursor","MultiLine","createElement","Fragment","ButtonType","type","SubmitType"],"sources":["../../../src/elements/Clickable/Clickable.story.tsx"],"sourcesContent":["import { fn } from \"@storybook/test\"\nimport React from \"react\"\nimport { Clickable } from \"./Clickable\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  title: \"Components/Clickable\",\n  component: Clickable,\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"Clickable component provides an accessible clickable element that can be styled like a button but renders as a span by default. Includes proper focus and interaction states.\",\n      },\n    },\n    controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n  },\n}\n\nexport const Default = {\n  args: {\n    children: \"Clickable\",\n    onClick: fn(),\n  },\n}\n\nexport const WithUnderline = {\n  args: {\n    children: \"Underlined Clickable\",\n    textDecoration: \"underline\",\n    onClick: fn(),\n  },\n}\n\nexport const DefaultCursor = {\n  args: {\n    children: \"Default Cursor\",\n    cursor: \"default\",\n    onClick: fn(),\n  },\n}\n\nexport const MultiLine = {\n  args: {\n    children: (\n      <>\n        Inherits the page's\n        <br />\n        text alignment.\n      </>\n    ),\n    onClick: fn(),\n  },\n}\n\nexport const ButtonType = {\n  args: {\n    children: \"Button Type\",\n    type: \"button\",\n    onClick: fn(),\n  },\n}\n\nexport const SubmitType = {\n  args: {\n    children: \"Submit Type\",\n    type: \"submit\",\n    onClick: fn(),\n  },\n}\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;AACA,IAAAI,mBAAA,GAAAJ,OAAA;AAA0E,SAAAE,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,IAAAG,QAAA,GAAAC,OAAA,CAAAF,OAAA,GAE3D;EACbG,KAAK,EAAE,sBAAsB;EAC7BC,SAAS,EAAEC,oBAAS;EACpBC,IAAI,EAAE,CAAC,UAAU,CAAC;EAClBC,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXL,SAAS,EACP;MACJ;IACF,CAAC;IACDM,QAAQ,EAAE;MACNC,OAAO,EAAEC;IACX;EACJ;AACF,CAAC;AAEM,IAAMC,OAAO,GAAAX,OAAA,CAAAW,OAAA,GAAG;EACrBC,IAAI,EAAE;IACJC,QAAQ,EAAE,WAAW;IACrBC,OAAO,EAAE,IAAAC,QAAE;EACb;AACF,CAAC;AAEM,IAAMC,aAAa,GAAAhB,OAAA,CAAAgB,aAAA,GAAG;EAC3BJ,IAAI,EAAE;IACJC,QAAQ,EAAE,sBAAsB;IAChCI,cAAc,EAAE,WAAW;IAC3BH,OAAO,EAAE,IAAAC,QAAE;EACb;AACF,CAAC;AAEM,IAAMG,aAAa,GAAAlB,OAAA,CAAAkB,aAAA,GAAG;EAC3BN,IAAI,EAAE;IACJC,QAAQ,EAAE,gBAAgB;IAC1BM,MAAM,EAAE,SAAS;IACjBL,OAAO,EAAE,IAAAC,QAAE;EACb;AACF,CAAC;AAEM,IAAMK,SAAS,GAAApB,OAAA,CAAAoB,SAAA,GAAG;EACvBR,IAAI,EAAE;IACJC,QAAQ,eACNrB,MAAA,CAAAM,OAAA,CAAAuB,aAAA,CAAA7B,MAAA,CAAAM,OAAA,CAAAwB,QAAA,QAAE,qBAEA,eAAA9B,MAAA,CAAAM,OAAA,CAAAuB,aAAA,YAAM,mBAER,CACD;IACDP,OAAO,EAAE,IAAAC,QAAE;EACb;AACF,CAAC;AAEM,IAAMQ,UAAU,GAAAvB,OAAA,CAAAuB,UAAA,GAAG;EACxBX,IAAI,EAAE;IACJC,QAAQ,EAAE,aAAa;IACvBW,IAAI,EAAE,QAAQ;IACdV,OAAO,EAAE,IAAAC,QAAE;EACb;AACF,CAAC;AAEM,IAAMU,UAAU,GAAAzB,OAAA,CAAAyB,UAAA,GAAG;EACxBb,IAAI,EAAE;IACJC,QAAQ,EAAE,aAAa;IACvBW,IAAI,EAAE,QAAQ;IACdV,OAAO,EAAE,IAAAC,QAAE;EACb;AACF,CAAC"}

package/dist/elements/Drawer/Drawer.story.d.ts

@@ -1,10 +1,44 @@
 import React from "react";
 declare const _default: {
+    component: React.FC<React.PropsWithChildren<import("./Drawer").DrawerProps>>;
     title: string;
+    tags: string[];
     parameters: {
         layout: string;
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+        controls: {
+            exclude: string[];
+        };
     };
 };
 export default _default;
-export declare const Default: () => React.JSX.Element;
-export declare const Left: () => React.JSX.Element;
+export declare const Default: {
+    args: {
+        anchor: string;
+    };
+    render: () => React.JSX.Element;
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const Left: {
+    args: {
+        anchor: string;
+    };
+    render: () => React.JSX.Element;
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};

package/dist/elements/Drawer/Drawer.story.js

@@ -9,6 +9,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _Drawer = require("./Drawer");
 var _Flex = require("../Flex");
 var _Button = require("../Button");
+var _storybookBlocklist = require("../../utils/storybookBlocklist");
 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; }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -18,9 +19,19 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var _default = exports.default = {
+  component: _Drawer.Drawer,
   title: "Components/Drawer",
+  tags: ["autodocs"],
   parameters: {
-    layout: "fullscreen"
+    layout: "fullscreen",
+    docs: {
+      description: {
+        component: "A sliding drawer component that can be anchored to the left or right side of the screen."
+      }
+    },
+    controls: {
+      exclude: _storybookBlocklist.STORYBOOK_PROPS_BLOCKLIST
+    }
   }
 };
 var Layout = function Layout(_ref) {
@@ -63,16 +74,38 @@ var Layout = function Layout(_ref) {
     flex: 1
   })));
 };
-var Default = exports.Default = function Default() {
-  return /*#__PURE__*/_react.default.createElement(Layout, {
+var Default = exports.Default = {
+  args: {
     anchor: "right"
-  });
+  },
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(Layout, {
+      anchor: "right"
+    });
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Default drawer that slides in from the right side."
+      }
+    }
+  }
 };
-Default.displayName = "Default";
-var Left = exports.Left = function Left() {
-  return /*#__PURE__*/_react.default.createElement(Layout, {
+var Left = exports.Left = {
+  args: {
     anchor: "left"
-  });
+  },
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(Layout, {
+      anchor: "left"
+    });
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Drawer that slides in from the left side."
+      }
+    }
+  }
 };
-Left.displayName = "Left";
 //# sourceMappingURL=Drawer.story.js.map