@artsy/palette 45.13.1 → 45.14.0-canary.1497.33065.0

package/dist/esm/elements/Skip/Skip.story.js

@@ -0,0 +1,83 @@
+import React from "react";
+import { Text } from "../Text";
+import { Skip } from "./Skip";
+import { STORYBOOK_PROPS_BLOCKLIST } from "../../utils/storybookBlocklist";
+export default {
+  component: Skip,
+  title: "Components/Skip",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "A skip link component for accessibility, allowing keyboard users to skip to main content."
+      }
+    },
+    controls: {
+      exclude: STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
+};
+export var Default = {
+  args: {
+    children: "Skip to main content"
+  },
+  render: function render(args) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
+      variant: "sm"
+    }, "Press <tab> to focus"), /*#__PURE__*/React.createElement(Skip, args), /*#__PURE__*/React.createElement(Text, {
+      variant: "sm"
+    }, "It should not interfere with the normal flow of content"));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Basic skip button for accessibility navigation."
+      }
+    }
+  }
+};
+export var WithSpacing = {
+  args: {
+    children: "Skip to main content",
+    width: "100%",
+    my: 1
+  },
+  render: function render(args) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
+      variant: "sm"
+    }, "Press <tab> to focus"), /*#__PURE__*/React.createElement(Skip, args), /*#__PURE__*/React.createElement(Text, {
+      variant: "sm"
+    }, "It should not interfere with the normal flow of content"));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Skip button with custom spacing and width."
+      }
+    }
+  }
+};
+export var SkipLink = {
+  args: {
+    children: "Skip to main content",
+    width: "100%",
+    my: 1,
+    as: "a",
+    href: "#main"
+  },
+  render: function render(args) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
+      variant: "sm"
+    }, "Press <tab> to focus"), /*#__PURE__*/React.createElement(Skip, args), /*#__PURE__*/React.createElement(Text, {
+      variant: "sm"
+    }, "It should not interfere with the normal flow of content"));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Skip link rendered as an anchor element with href."
+      }
+    }
+  }
+};
+//# sourceMappingURL=Skip.story.js.map

package/dist/esm/elements/Skip/Skip.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skip.story.js","names":["React","Text","Skip","STORYBOOK_PROPS_BLOCKLIST","component","title","tags","parameters","docs","description","controls","exclude","Default","args","children","render","createElement","Fragment","variant","story","WithSpacing","width","my","SkipLink","as","href"],"sources":["../../../../src/elements/Skip/Skip.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { Text } from \"../Text\"\nimport { Skip } from \"./Skip\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  component: Skip,\n  title: \"Components/Skip\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A skip link component for accessibility, allowing keyboard users to skip to main content.\",\n      },\n    },\n    controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n  },\n}\n\nexport const Default = {\n  args: {\n    children: \"Skip to main content\",\n  },\n  render: (args) => (\n    <>\n      <Text variant=\"sm\">Press &lt;tab&gt; to focus</Text>\n      <Skip {...args} />\n      <Text variant=\"sm\">\n        It should not interfere with the normal flow of content\n      </Text>\n    </>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Basic skip button for accessibility navigation.\",\n      },\n    },\n  },\n}\n\nexport const WithSpacing = {\n  args: {\n    children: \"Skip to main content\",\n    width: \"100%\",\n    my: 1,\n  },\n  render: (args) => (\n    <>\n      <Text variant=\"sm\">Press &lt;tab&gt; to focus</Text>\n      <Skip {...args} />\n      <Text variant=\"sm\">\n        It should not interfere with the normal flow of content\n      </Text>\n    </>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Skip button with custom spacing and width.\",\n      },\n    },\n  },\n}\n\nexport const SkipLink = {\n  args: {\n    children: \"Skip to main content\",\n    width: \"100%\",\n    my: 1,\n    as: \"a\",\n    href: \"#main\",\n  },\n  render: (args) => (\n    <>\n      <Text variant=\"sm\">Press &lt;tab&gt; to focus</Text>\n      <Skip {...args} />\n      <Text variant=\"sm\">\n        It should not interfere with the normal flow of content\n      </Text>\n    </>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Skip link rendered as an anchor element with href.\",\n      },\n    },\n  },\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI;AACb,SAASC,IAAI;AACb,SAASC,yBAAyB;AAElC,eAAe;EACbC,SAAS,EAAEF,IAAI;EACfG,KAAK,EAAE,iBAAiB;EACxBC,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,EAAER;IACX;EACJ;AACF,CAAC;AAED,OAAO,IAAMS,OAAO,GAAG;EACrBC,IAAI,EAAE;IACJC,QAAQ,EAAE;EACZ,CAAC;EACDC,MAAM,EAAE,SAARA,MAAMA,CAAGF,IAAI;IAAA,oBACXb,KAAA,CAAAgB,aAAA,CAAAhB,KAAA,CAAAiB,QAAA,qBACEjB,KAAA,CAAAgB,aAAA,CAACf,IAAI;MAACiB,OAAO,EAAC;IAAI,GAAC,sBAA0B,CAAO,eACpDlB,KAAA,CAAAgB,aAAA,CAACd,IAAI,EAAKW,IAAI,CAAI,eAClBb,KAAA,CAAAgB,aAAA,CAACf,IAAI;MAACiB,OAAO,EAAC;IAAI,GAAC,yDAEnB,CAAO,CACN;EAAA,CACJ;EACDX,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXU,KAAK,EAAE;MACT;IACF;EACF;AACF,CAAC;AAED,OAAO,IAAMC,WAAW,GAAG;EACzBP,IAAI,EAAE;IACJC,QAAQ,EAAE,sBAAsB;IAChCO,KAAK,EAAE,MAAM;IACbC,EAAE,EAAE;EACN,CAAC;EACDP,MAAM,EAAE,SAARA,MAAMA,CAAGF,IAAI;IAAA,oBACXb,KAAA,CAAAgB,aAAA,CAAAhB,KAAA,CAAAiB,QAAA,qBACEjB,KAAA,CAAAgB,aAAA,CAACf,IAAI;MAACiB,OAAO,EAAC;IAAI,GAAC,sBAA0B,CAAO,eACpDlB,KAAA,CAAAgB,aAAA,CAACd,IAAI,EAAKW,IAAI,CAAI,eAClBb,KAAA,CAAAgB,aAAA,CAACf,IAAI;MAACiB,OAAO,EAAC;IAAI,GAAC,yDAEnB,CAAO,CACN;EAAA,CACJ;EACDX,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXU,KAAK,EAAE;MACT;IACF;EACF;AACF,CAAC;AAED,OAAO,IAAMI,QAAQ,GAAG;EACtBV,IAAI,EAAE;IACJC,QAAQ,EAAE,sBAAsB;IAChCO,KAAK,EAAE,MAAM;IACbC,EAAE,EAAE,CAAC;IACLE,EAAE,EAAE,GAAG;IACPC,IAAI,EAAE;EACR,CAAC;EACDV,MAAM,EAAE,SAARA,MAAMA,CAAGF,IAAI;IAAA,oBACXb,KAAA,CAAAgB,aAAA,CAAAhB,KAAA,CAAAiB,QAAA,qBACEjB,KAAA,CAAAgB,aAAA,CAACf,IAAI;MAACiB,OAAO,EAAC;IAAI,GAAC,sBAA0B,CAAO,eACpDlB,KAAA,CAAAgB,aAAA,CAACd,IAAI,EAAKW,IAAI,CAAI,eAClBb,KAAA,CAAAgB,aAAA,CAACf,IAAI;MAACiB,OAAO,EAAC;IAAI,GAAC,yDAEnB,CAAO,CACN;EAAA,CACJ;EACDX,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXU,KAAK,EAAE;MACT;IACF;EACF;AACF,CAAC"}

package/dist/esm/elements/Skip/index.js

@@ -0,0 +1,2 @@
+export * from "./Skip";
+//# sourceMappingURL=index.js.map

package/dist/esm/elements/Skip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/Skip/index.ts"],"sourcesContent":["export * from \"./Skip\"\n"],"mappings":"AAAA"}

package/dist/esm/elements/Spacer/Spacer.js

@@ -0,0 +1,21 @@
+var _excluded = ["x", "y"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React from "react";
+import { Box } from "../../elements/Box";
+/**
+ * Used to inject space where it's needed.
+ */
+export var Spacer = function Spacer(_ref) {
+  var x = _ref.x,
+    y = _ref.y,
+    restProps = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(Box, _extends({}, restProps, {
+    ml: x,
+    mt: y
+  }));
+};
+Spacer.displayName = "Spacer";
+Spacer.displayName = "Spacer";
+//# sourceMappingURL=Spacer.js.map

package/dist/esm/elements/Spacer/Spacer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spacer.js","names":["React","Box","Spacer","_ref","x","y","restProps","_objectWithoutProperties","_excluded","createElement","_extends","ml","mt","displayName"],"sources":["../../../../src/elements/Spacer/Spacer.tsx"],"sourcesContent":["import React from \"react\"\nimport { Box, BoxProps } from \"../../elements/Box\"\n\nexport type SpacerProps = {\n  x?: BoxProps[\"ml\"]\n  y?: BoxProps[\"mt\"]\n} & React.HTMLAttributes<HTMLDivElement>\n\n/**\n * Used to inject space where it's needed.\n */\nexport const Spacer = ({ x, y, ...restProps }: SpacerProps) => {\n  return <Box {...restProps} ml={x} mt={y} />\n}\n\nSpacer.displayName = \"Spacer\"\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,GAAG;AAOZ;AACA;AACA;AACA,OAAO,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAAC,IAAA,EAA4C;EAAA,IAAtCC,CAAC,GAAAD,IAAA,CAADC,CAAC;IAAEC,CAAC,GAAAF,IAAA,CAADE,CAAC;IAAKC,SAAS,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EACzC,oBAAOR,KAAA,CAAAS,aAAA,CAACR,GAAG,EAAAS,QAAA,KAAKJ,SAAS;IAAEK,EAAE,EAAEP,CAAE;IAACQ,EAAE,EAAEP;EAAE,GAAG;AAC7C,CAAC;AAFYH,MAAM,CAAAW,WAAA;AAInBX,MAAM,CAACW,WAAW,GAAG,QAAQ"}

package/dist/esm/elements/Spacer/Spacer.story.js

@@ -0,0 +1,68 @@
+import React from "react";
+import { Box } from "../Box";
+import { Spacer } from "./Spacer";
+import { STORYBOOK_PROPS_BLOCKLIST } from "../../utils/storybookBlocklist";
+export default {
+  component: Spacer,
+  title: "Components/Spacer",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "A spacing component that creates horizontal (x) or vertical (y) space between elements."
+      }
+    },
+    controls: {
+      exclude: STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
+};
+export var VerticalSpacing = {
+  args: {
+    y: 2
+  },
+  render: function render(args) {
+    return /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Box, {
+      height: 2,
+      width: 100,
+      bg: "mono60"
+    }), /*#__PURE__*/React.createElement(Spacer, args), /*#__PURE__*/React.createElement(Box, {
+      height: 2,
+      width: 100,
+      bg: "mono60"
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Vertical spacing using the y prop."
+      }
+    }
+  }
+};
+export var HorizontalSpacing = {
+  args: {
+    x: 2
+  },
+  render: function render(args) {
+    return /*#__PURE__*/React.createElement(Box, {
+      display: "flex"
+    }, /*#__PURE__*/React.createElement(Box, {
+      height: 100,
+      width: 2,
+      bg: "mono60"
+    }), /*#__PURE__*/React.createElement(Spacer, args), /*#__PURE__*/React.createElement(Box, {
+      height: 100,
+      width: 2,
+      bg: "mono60"
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Horizontal spacing using the x prop."
+      }
+    }
+  }
+};
+//# sourceMappingURL=Spacer.story.js.map

package/dist/esm/elements/Spacer/Spacer.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spacer.story.js","names":["React","Box","Spacer","STORYBOOK_PROPS_BLOCKLIST","component","title","tags","parameters","docs","description","controls","exclude","VerticalSpacing","args","y","render","createElement","height","width","bg","story","HorizontalSpacing","x","display"],"sources":["../../../../src/elements/Spacer/Spacer.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { Box } from \"../Box\"\nimport { Spacer } from \"./Spacer\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  component: Spacer,\n  title: \"Components/Spacer\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A spacing component that creates horizontal (x) or vertical (y) space between elements.\",\n      },\n    },\n    controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n  },\n}\n\nexport const VerticalSpacing = {\n  args: {\n    y: 2,\n  },\n  render: (args) => (\n    <Box>\n      <Box height={2} width={100} bg=\"mono60\" />\n      <Spacer {...args} />\n      <Box height={2} width={100} bg=\"mono60\" />\n    </Box>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Vertical spacing using the y prop.\",\n      },\n    },\n  },\n}\n\nexport const HorizontalSpacing = {\n  args: {\n    x: 2,\n  },\n  render: (args) => (\n    <Box display=\"flex\">\n      <Box height={100} width={2} bg=\"mono60\" />\n      <Spacer {...args} />\n      <Box height={100} width={2} bg=\"mono60\" />\n    </Box>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Horizontal spacing using the x prop.\",\n      },\n    },\n  },\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,GAAG;AACZ,SAASC,MAAM;AACf,SAASC,yBAAyB;AAElC,eAAe;EACbC,SAAS,EAAEF,MAAM;EACjBG,KAAK,EAAE,mBAAmB;EAC1BC,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,EAAER;IACX;EACJ;AACF,CAAC;AAED,OAAO,IAAMS,eAAe,GAAG;EAC7BC,IAAI,EAAE;IACJC,CAAC,EAAE;EACL,CAAC;EACDC,MAAM,EAAE,SAARA,MAAMA,CAAGF,IAAI;IAAA,oBACXb,KAAA,CAAAgB,aAAA,CAACf,GAAG,qBACFD,KAAA,CAAAgB,aAAA,CAACf,GAAG;MAACgB,MAAM,EAAE,CAAE;MAACC,KAAK,EAAE,GAAI;MAACC,EAAE,EAAC;IAAQ,EAAG,eAC1CnB,KAAA,CAAAgB,aAAA,CAACd,MAAM,EAAKW,IAAI,CAAI,eACpBb,KAAA,CAAAgB,aAAA,CAACf,GAAG;MAACgB,MAAM,EAAE,CAAE;MAACC,KAAK,EAAE,GAAI;MAACC,EAAE,EAAC;IAAQ,EAAG,CACtC;EAAA,CACP;EACDZ,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXW,KAAK,EAAE;MACT;IACF;EACF;AACF,CAAC;AAED,OAAO,IAAMC,iBAAiB,GAAG;EAC/BR,IAAI,EAAE;IACJS,CAAC,EAAE;EACL,CAAC;EACDP,MAAM,EAAE,SAARA,MAAMA,CAAGF,IAAI;IAAA,oBACXb,KAAA,CAAAgB,aAAA,CAACf,GAAG;MAACsB,OAAO,EAAC;IAAM,gBACjBvB,KAAA,CAAAgB,aAAA,CAACf,GAAG;MAACgB,MAAM,EAAE,GAAI;MAACC,KAAK,EAAE,CAAE;MAACC,EAAE,EAAC;IAAQ,EAAG,eAC1CnB,KAAA,CAAAgB,aAAA,CAACd,MAAM,EAAKW,IAAI,CAAI,eACpBb,KAAA,CAAAgB,aAAA,CAACf,GAAG;MAACgB,MAAM,EAAE,GAAI;MAACC,KAAK,EAAE,CAAE;MAACC,EAAE,EAAC;IAAQ,EAAG,CACtC;EAAA,CACP;EACDZ,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXW,KAAK,EAAE;MACT;IACF;EACF;AACF,CAAC"}

package/dist/esm/elements/Spacer/index.js

@@ -0,0 +1,2 @@
+export * from "./Spacer";
+//# sourceMappingURL=index.js.map

package/dist/esm/elements/Spacer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/Spacer/index.tsx"],"sourcesContent":["export * from \"./Spacer\"\n"],"mappings":"AAAA"}

package/dist/esm/elements/Spinner/Spinner.js

@@ -0,0 +1,78 @@
+var _excluded = ["position", "delay", "size", "color"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useEffect, useState } from "react";
+import styled, { keyframes } from "styled-components";
+import { variant } from "styled-system";
+import { Box } from "../Box";
+var SPINNER_VARIANTS = {
+  small: {
+    width: 12.5,
+    height: 3,
+    // TODO: Remove `top` and `left`
+    top: "calc(50% - 1.5px)",
+    left: "calc(50% - 6.25px)"
+  },
+  medium: {
+    width: 20,
+    height: 4.8,
+    // TODO: Remove `top` and `left`
+    top: "calc(50% - 2.4px)",
+    left: "calc(50% - 10px)"
+  },
+  large: {
+    width: 25,
+    height: 6,
+    // TODO: Remove `top` and `left`
+    top: "calc(50% - 3px)",
+    left: "calc(50% - 12.5px)"
+  }
+};
+/** Generic Spinner component */
+export var Spinner = function Spinner(_ref) {
+  var _ref$position = _ref.position,
+    position = _ref$position === void 0 ? "absolute" : _ref$position,
+    _ref$delay = _ref.delay,
+    delay = _ref$delay === void 0 ? 0 : _ref$delay,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "large" : _ref$size,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? "mono100" : _ref$color,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useState = useState(delay === 0),
+    _useState2 = _slicedToArray(_useState, 2),
+    show = _useState2[0],
+    setShow = _useState2[1];
+  useEffect(function () {
+    var timeout = setTimeout(function () {
+      setShow(true);
+    }, delay);
+    return function () {
+      clearTimeout(timeout);
+    };
+  }, [delay]);
+  if (!show) return null;
+  return /*#__PURE__*/React.createElement(Bar, _extends({
+    bg: color !== null && color !== void 0 ? color : "currentColor",
+    size: size,
+    position: position
+  }, rest));
+};
+Spinner.displayName = "Spinner";
+var spin = keyframes(["100%{transform:rotate(360deg)}"]);
+var Bar = styled(Box).withConfig({
+  displayName: "Spinner__Bar",
+  componentId: "sc-1t000ax-0"
+})(["animation:", " 1s infinite linear;", ""], spin, variant({
+  variants: SPINNER_VARIANTS,
+  prop: "size"
+}));
+Spinner.displayName = "Spinner";
+//# sourceMappingURL=Spinner.js.map

package/dist/esm/elements/Spinner/Spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","names":["React","useEffect","useState","styled","keyframes","variant","Box","SPINNER_VARIANTS","small","width","height","top","left","medium","large","Spinner","_ref","_ref$position","position","_ref$delay","delay","_ref$size","size","_ref$color","color","rest","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","show","setShow","timeout","setTimeout","clearTimeout","createElement","Bar","_extends","bg","displayName","spin","withConfig","componentId","variants","prop"],"sources":["../../../../src/elements/Spinner/Spinner.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\"\nimport styled, { keyframes } from \"styled-components\"\nimport { ResponsiveValue, variant } from \"styled-system\"\nimport { Box, BoxProps } from \"../Box\"\n\nconst SPINNER_VARIANTS = {\n  small: {\n    width: 12.5,\n    height: 3,\n    // TODO: Remove `top` and `left`\n    top: \"calc(50% - 1.5px)\",\n    left: \"calc(50% - 6.25px)\",\n  },\n\n  medium: {\n    width: 20,\n    height: 4.8,\n    // TODO: Remove `top` and `left`\n    top: \"calc(50% - 2.4px)\",\n    left: \"calc(50% - 10px)\",\n  },\n\n  large: {\n    width: 25,\n    height: 6,\n    // TODO: Remove `top` and `left`\n    top: \"calc(50% - 3px)\",\n    left: \"calc(50% - 12.5px)\",\n  },\n} as const\n\nexport type SpinnerSize = keyof typeof SPINNER_VARIANTS\n\nexport interface SpinnerProps\n  extends Omit<BoxProps, \"size\" | \"width\" | \"height\"> {\n  /** Delay before spinner appears */\n  delay?: number\n  /** Size of the spinner */\n  size?: ResponsiveValue<SpinnerSize>\n  /** Color of the spinner */\n  color?: ResponsiveValue<string>\n}\n\n/** Generic Spinner component */\nexport const Spinner: React.FC<React.PropsWithChildren<SpinnerProps>> = ({\n  position = \"absolute\",\n  delay = 0,\n  size = \"large\",\n  color = \"mono100\",\n  ...rest\n}) => {\n  const [show, setShow] = useState(delay === 0)\n\n  useEffect(() => {\n    const timeout = setTimeout(() => {\n      setShow(true)\n    }, delay)\n\n    return () => {\n      clearTimeout(timeout)\n    }\n  }, [delay])\n\n  if (!show) return null\n\n  return (\n    <Bar\n      bg={color ?? \"currentColor\"}\n      size={size}\n      position={position}\n      {...rest}\n    />\n  )\n}\n\nconst spin = keyframes`\n  100% {\n    transform: rotate(360deg)\n  }\n`\n\nconst Bar = styled(Box)`\n  animation: ${spin} 1s infinite linear;\n  ${variant({ variants: SPINNER_VARIANTS, prop: \"size\" })}\n`\n\nSpinner.displayName = \"Spinner\"\n"],"mappings":";;;;;;;;;;AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAClD,OAAOC,MAAM,IAAIC,SAAS,QAAQ,mBAAmB;AACrD,SAA0BC,OAAO,QAAQ,eAAe;AACxD,SAASC,GAAG;AAEZ,IAAMC,gBAAgB,GAAG;EACvBC,KAAK,EAAE;IACLC,KAAK,EAAE,IAAI;IACXC,MAAM,EAAE,CAAC;IACT;IACAC,GAAG,EAAE,mBAAmB;IACxBC,IAAI,EAAE;EACR,CAAC;EAEDC,MAAM,EAAE;IACNJ,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,GAAG;IACX;IACAC,GAAG,EAAE,mBAAmB;IACxBC,IAAI,EAAE;EACR,CAAC;EAEDE,KAAK,EAAE;IACLL,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC;IACT;IACAC,GAAG,EAAE,iBAAiB;IACtBC,IAAI,EAAE;EACR;AACF,CAAU;AAcV;AACA,OAAO,IAAMG,OAAwD,GAAG,SAA3DA,OAAwDA,CAAAC,IAAA,EAM/D;EAAA,IAAAC,aAAA,GAAAD,IAAA,CALJE,QAAQ;IAARA,QAAQ,GAAAD,aAAA,cAAG,UAAU,GAAAA,aAAA;IAAAE,UAAA,GAAAH,IAAA,CACrBI,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAG,CAAC,GAAAA,UAAA;IAAAE,SAAA,GAAAL,IAAA,CACTM,IAAI;IAAJA,IAAI,GAAAD,SAAA,cAAG,OAAO,GAAAA,SAAA;IAAAE,UAAA,GAAAP,IAAA,CACdQ,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAG,SAAS,GAAAA,UAAA;IACdE,IAAI,GAAAC,wBAAA,CAAAV,IAAA,EAAAW,SAAA;EAEP,IAAAC,SAAA,GAAwB1B,QAAQ,CAACkB,KAAK,KAAK,CAAC,CAAC;IAAAS,UAAA,GAAAC,cAAA,CAAAF,SAAA;IAAtCG,IAAI,GAAAF,UAAA;IAAEG,OAAO,GAAAH,UAAA;EAEpB5B,SAAS,CAAC,YAAM;IACd,IAAMgC,OAAO,GAAGC,UAAU,CAAC,YAAM;MAC/BF,OAAO,CAAC,IAAI,CAAC;IACf,CAAC,EAAEZ,KAAK,CAAC;IAET,OAAO,YAAM;MACXe,YAAY,CAACF,OAAO,CAAC;IACvB,CAAC;EACH,CAAC,EAAE,CAACb,KAAK,CAAC,CAAC;EAEX,IAAI,CAACW,IAAI,EAAE,OAAO,IAAI;EAEtB,oBACE/B,KAAA,CAAAoC,aAAA,CAACC,GAAG,EAAAC,QAAA;IACFC,EAAE,EAAEf,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,cAAe;IAC5BF,IAAI,EAAEA,IAAK;IACXJ,QAAQ,EAAEA;EAAS,GACfO,IAAI,EACR;AAEN,CAAC;AA7BYV,OAAwD,CAAAyB,WAAA;AA+BrE,IAAMC,IAAI,GAAGrC,SAAS,oCAIrB;AAED,IAAMiC,GAAG,GAAGlC,MAAM,CAACG,GAAG,CAAC,CAAAoC,UAAA;EAAAF,WAAA;EAAAG,WAAA;AAAA,+CACRF,IAAI,EACfpC,OAAO,CAAC;EAAEuC,QAAQ,EAAErC,gBAAgB;EAAEsC,IAAI,EAAE;AAAO,CAAC,CAAC,CACxD;AAED9B,OAAO,CAACyB,WAAW,GAAG,SAAS"}

package/dist/esm/elements/Spinner/Spinner.story.js

@@ -0,0 +1,60 @@
+import { Spinner } from "./Spinner";
+import { STORYBOOK_PROPS_BLOCKLIST } from "../../utils/storybookBlocklist";
+export default {
+  component: Spinner,
+  title: "Components/Spinner",
+  tags: ["autodocs"],
+  parameters: {
+    chromatic: {
+      disable: true
+    },
+    docs: {
+      description: {
+        component: "A loading spinner component with different sizes and colors, optionally with a delay before showing."
+      }
+    },
+    controls: {
+      exclude: STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
+};
+export var Default = {
+  args: {
+    position: "static"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Basic spinner with default styling."
+      }
+    }
+  }
+};
+export var Small = {
+  args: {
+    size: "small",
+    color: "brand",
+    position: "static"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Small spinner with brand color."
+      }
+    }
+  }
+};
+export var WithDelay = {
+  args: {
+    delay: 1000,
+    position: "static"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Spinner that shows after a 1 second delay."
+      }
+    }
+  }
+};
+//# sourceMappingURL=Spinner.story.js.map

package/dist/esm/elements/Spinner/Spinner.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.story.js","names":["Spinner","STORYBOOK_PROPS_BLOCKLIST","component","title","tags","parameters","chromatic","disable","docs","description","controls","exclude","Default","args","position","story","Small","size","color","WithDelay","delay"],"sources":["../../../../src/elements/Spinner/Spinner.story.tsx"],"sourcesContent":["import { Spinner } from \"./Spinner\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  component: Spinner,\n  title: \"Components/Spinner\",\n  tags: [\"autodocs\"],\n  parameters: {\n    chromatic: { disable: true },\n    docs: {\n      description: {\n        component:\n          \"A loading spinner component with different sizes and colors, optionally with a delay before showing.\",\n      },\n    },\n    controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n  },\n}\n\nexport const Default = {\n  args: {\n    position: \"static\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Basic spinner with default styling.\",\n      },\n    },\n  },\n}\n\nexport const Small = {\n  args: {\n    size: \"small\",\n    color: \"brand\",\n    position: \"static\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Small spinner with brand color.\",\n      },\n    },\n  },\n}\n\nexport const WithDelay = {\n  args: {\n    delay: 1000,\n    position: \"static\",\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Spinner that shows after a 1 second delay.\",\n      },\n    },\n  },\n}\n"],"mappings":"AAAA,SAASA,OAAO;AAChB,SAASC,yBAAyB;AAElC,eAAe;EACbC,SAAS,EAAEF,OAAO;EAClBG,KAAK,EAAE,oBAAoB;EAC3BC,IAAI,EAAE,CAAC,UAAU,CAAC;EAClBC,UAAU,EAAE;IACVC,SAAS,EAAE;MAAEC,OAAO,EAAE;IAAK,CAAC;IAC5BC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXP,SAAS,EACP;MACJ;IACF,CAAC;IACDQ,QAAQ,EAAE;MACNC,OAAO,EAAEV;IACX;EACJ;AACF,CAAC;AAED,OAAO,IAAMW,OAAO,GAAG;EACrBC,IAAI,EAAE;IACJC,QAAQ,EAAE;EACZ,CAAC;EACDT,UAAU,EAAE;IACVG,IAAI,EAAE;MACJC,WAAW,EAAE;QACXM,KAAK,EAAE;MACT;IACF;EACF;AACF,CAAC;AAED,OAAO,IAAMC,KAAK,GAAG;EACnBH,IAAI,EAAE;IACJI,IAAI,EAAE,OAAO;IACbC,KAAK,EAAE,OAAO;IACdJ,QAAQ,EAAE;EACZ,CAAC;EACDT,UAAU,EAAE;IACVG,IAAI,EAAE;MACJC,WAAW,EAAE;QACXM,KAAK,EAAE;MACT;IACF;EACF;AACF,CAAC;AAED,OAAO,IAAMI,SAAS,GAAG;EACvBN,IAAI,EAAE;IACJO,KAAK,EAAE,IAAI;IACXN,QAAQ,EAAE;EACZ,CAAC;EACDT,UAAU,EAAE;IACVG,IAAI,EAAE;MACJC,WAAW,EAAE;QACXM,KAAK,EAAE;MACT;IACF;EACF;AACF,CAAC"}

package/dist/esm/elements/Spinner/index.js

@@ -0,0 +1,2 @@
+export * from "./Spinner";
+//# sourceMappingURL=index.js.map

package/dist/esm/elements/Spinner/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/Spinner/index.tsx"],"sourcesContent":["export * from \"./Spinner\"\n"],"mappings":"AAAA"}

package/dist/esm/elements/Stack/Stack.js

@@ -0,0 +1,16 @@
+import styled from "styled-components";
+import { Box } from "../Box";
+/**
+ * `Stack` is `Box` with` display: flex` and `flex-direction: column`.
+ * `gap` is required
+ */
+export var Stack = styled(Box).withConfig({
+  displayName: "Stack",
+  componentId: "sc-81d5w9-0"
+})([""]);
+Stack.defaultProps = {
+  display: "flex",
+  flexDirection: "column"
+};
+Stack.displayName = "Stack";
+//# sourceMappingURL=Stack.js.map

package/dist/esm/elements/Stack/Stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stack.js","names":["styled","Box","Stack","withConfig","displayName","componentId","defaultProps","display","flexDirection"],"sources":["../../../../src/elements/Stack/Stack.tsx"],"sourcesContent":["import styled from \"styled-components\"\nimport { Box, BoxProps } from \"../Box\"\nimport { ResponsiveValue } from \"styled-system\"\n\nexport type StackProps = BoxProps & {\n  gap: ResponsiveValue<string | number>\n}\n\n/**\n * `Stack` is `Box` with` display: flex` and `flex-direction: column`.\n * `gap` is required\n */\nexport const Stack = styled(Box)<StackProps>``\n\nStack.defaultProps = {\n  display: \"flex\",\n  flexDirection: \"column\",\n}\n\nStack.displayName = \"Stack\"\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,GAAG;AAOZ;AACA;AACA;AACA;AACA,OAAO,IAAMC,KAAK,GAAGF,MAAM,CAACC,GAAG,CAAC,CAAAE,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,QAAc;AAE9CH,KAAK,CAACI,YAAY,GAAG;EACnBC,OAAO,EAAE,MAAM;EACfC,aAAa,EAAE;AACjB,CAAC;AAEDN,KAAK,CAACE,WAAW,GAAG,OAAO"}

package/dist/esm/elements/Stack/Stack.story.js

@@ -0,0 +1,87 @@
+import React from "react";
+import { Stack } from "../Stack";
+import { Box } from "../Box";
+import { STORYBOOK_PROPS_BLOCKLIST } from "../../utils/storybookBlocklist";
+export default {
+  title: "Components/Stack",
+  component: Stack,
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "Stack component provides a flex-based layout for arranging children with consistent spacing. Supports both vertical and horizontal arrangements with customizable gaps."
+      },
+      controls: {
+        exclude: STORYBOOK_PROPS_BLOCKLIST
+      }
+    }
+  }
+};
+export var Default = {
+  args: {
+    gap: 2,
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "1"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "2"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "3"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "4"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "5"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "6"))
+  }
+};
+export var NoGap = {
+  args: {
+    gap: 0,
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "1"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "2"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "3"))
+  }
+};
+export var SmallGap = {
+  args: {
+    gap: 1,
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "1"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "2"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "3"))
+  }
+};
+export var HorizontalDirection = {
+  args: {
+    gap: 2,
+    flexDirection: "row",
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "1"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "2"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "3"))
+  }
+};
+export var ResponsiveGap = {
+  args: {
+    gap: [2, 4],
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "1"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "2"), /*#__PURE__*/React.createElement(Box, {
+      bg: "yellow100"
+    }, "3"))
+  }
+};
+//# sourceMappingURL=Stack.story.js.map

package/dist/esm/elements/Stack/Stack.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stack.story.js","names":["React","Stack","Box","STORYBOOK_PROPS_BLOCKLIST","title","component","tags","parameters","docs","description","controls","exclude","Default","args","gap","children","createElement","Fragment","bg","NoGap","SmallGap","HorizontalDirection","flexDirection","ResponsiveGap"],"sources":["../../../../src/elements/Stack/Stack.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { Stack } from \"../Stack\"\nimport { Box } from \"../Box\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  title: \"Components/Stack\",\n  component: Stack,\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"Stack component provides a flex-based layout for arranging children with consistent spacing. Supports both vertical and horizontal arrangements with customizable gaps.\",\n      },\n      controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n    },\n  },\n}\n\nexport const Default = {\n  args: {\n    gap: 2,\n    children: (\n      <>\n        <Box bg=\"yellow100\">1</Box>\n        <Box bg=\"yellow100\">2</Box>\n        <Box bg=\"yellow100\">3</Box>\n        <Box bg=\"yellow100\">4</Box>\n        <Box bg=\"yellow100\">5</Box>\n        <Box bg=\"yellow100\">6</Box>\n      </>\n    ),\n  },\n}\n\nexport const NoGap = {\n  args: {\n    gap: 0,\n    children: (\n      <>\n        <Box bg=\"yellow100\">1</Box>\n        <Box bg=\"yellow100\">2</Box>\n        <Box bg=\"yellow100\">3</Box>\n      </>\n    ),\n  },\n}\n\nexport const SmallGap = {\n  args: {\n    gap: 1,\n    children: (\n      <>\n        <Box bg=\"yellow100\">1</Box>\n        <Box bg=\"yellow100\">2</Box>\n        <Box bg=\"yellow100\">3</Box>\n      </>\n    ),\n  },\n}\n\nexport const HorizontalDirection = {\n  args: {\n    gap: 2,\n    flexDirection: \"row\",\n    children: (\n      <>\n        <Box bg=\"yellow100\">1</Box>\n        <Box bg=\"yellow100\">2</Box>\n        <Box bg=\"yellow100\">3</Box>\n      </>\n    ),\n  },\n}\n\nexport const ResponsiveGap = {\n  args: {\n    gap: [2, 4],\n    children: (\n      <>\n        <Box bg=\"yellow100\">1</Box>\n        <Box bg=\"yellow100\">2</Box>\n        <Box bg=\"yellow100\">3</Box>\n      </>\n    ),\n  },\n}\n"],"mappings":"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"}

package/dist/esm/elements/Stack/index.js

@@ -0,0 +1,2 @@
+export * from "./Stack";
+//# sourceMappingURL=index.js.map

package/dist/esm/elements/Stack/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/Stack/index.ts"],"sourcesContent":["export * from \"./Stack\"\n"],"mappings":"AAAA"}

package/dist/esm/elements/StackableBorderBox/StackableBorderBox.js

@@ -0,0 +1,18 @@
+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); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import styled from "styled-components";
+import { BorderBox } from "../BorderBox";
+/**
+ * A stackable border box is a BorderBox that shares borders with its siblings.
+ */
+export var StackableBorderBox = styled(BorderBox).withConfig({
+  displayName: "StackableBorderBox",
+  componentId: "sc-1odyc7i-0"
+})(["&:not(:first-child){border-top-left-radius:0;border-top-right-radius:0;}&:not(:last-child){border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0;}"]);
+StackableBorderBox.displayName = "StackableBorderBox";
+StackableBorderBox.defaultProps = _objectSpread({}, BorderBox.defaultProps);
+//# sourceMappingURL=StackableBorderBox.js.map

package/dist/esm/elements/StackableBorderBox/StackableBorderBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackableBorderBox.js","names":["styled","BorderBox","StackableBorderBox","withConfig","displayName","componentId","defaultProps","_objectSpread"],"sources":["../../../../src/elements/StackableBorderBox/StackableBorderBox.tsx"],"sourcesContent":["import styled from \"styled-components\"\nimport { BorderBox, BorderBoxProps } from \"../BorderBox\"\n\nexport type StackableBorderBoxProps = BorderBoxProps\n\n/**\n * A stackable border box is a BorderBox that shares borders with its siblings.\n */\nexport const StackableBorderBox = styled(BorderBox)<BorderBoxProps>`\n  &:not(:first-child) {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n  &:not(:last-child) {\n    border-bottom: 0;\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n`\n\nStackableBorderBox.displayName = \"StackableBorderBox\"\n\nStackableBorderBox.defaultProps = {\n  ...BorderBox.defaultProps,\n}\n"],"mappings":";;;;;;AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,SAAS;AAIlB;AACA;AACA;AACA,OAAO,IAAMC,kBAAkB,GAAGF,MAAM,CAACC,SAAS,CAAC,CAAAE,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6KAUlD;AAEDH,kBAAkB,CAACE,WAAW,GAAG,oBAAoB;AAErDF,kBAAkB,CAACI,YAAY,GAAAC,aAAA,KAC1BN,SAAS,CAACK,YAAY,CAC1B"}

package/dist/esm/elements/StackableBorderBox/StackableBorderBox.story.js

@@ -0,0 +1,37 @@
+import React from "react";
+import { StackableBorderBox } from "./StackableBorderBox";
+import { Avatar } from "../Avatar/Avatar";
+import { Flex } from "../Flex";
+import { Button } from "../Button";
+import { STORYBOOK_PROPS_BLOCKLIST } from "../../utils/storybookBlocklist";
+export default {
+  component: StackableBorderBox,
+  title: "Components/StackableBorderBox",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "A bordered container component designed to be stacked with other border boxes."
+      }
+    },
+    controls: {
+      exclude: STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
+};
+export var Default = {
+  render: function render() {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StackableBorderBox, null, /*#__PURE__*/React.createElement(Flex, null, /*#__PURE__*/React.createElement(Avatar, {
+      size: "xs",
+      src: "https://picsum.photos/seed/example/110/110"
+    }), /*#__PURE__*/React.createElement(Button, null, "Click me"))), /*#__PURE__*/React.createElement(StackableBorderBox, null, "Second Box"), /*#__PURE__*/React.createElement(StackableBorderBox, null, "Third Box"), /*#__PURE__*/React.createElement(StackableBorderBox, null, "Fourth Box"));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Multiple stackable border boxes demonstrating visual connection."
+      }
+    }
+  }
+};
+//# sourceMappingURL=StackableBorderBox.story.js.map

package/dist/esm/elements/StackableBorderBox/StackableBorderBox.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackableBorderBox.story.js","names":["React","StackableBorderBox","Avatar","Flex","Button","STORYBOOK_PROPS_BLOCKLIST","component","title","tags","parameters","docs","description","controls","exclude","Default","render","createElement","Fragment","size","src","story"],"sources":["../../../../src/elements/StackableBorderBox/StackableBorderBox.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { StackableBorderBox } from \"./StackableBorderBox\"\nimport { Avatar } from \"../Avatar/Avatar\"\nimport { Flex } from \"../Flex\"\nimport { Button } from \"../Button\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  component: StackableBorderBox,\n  title: \"Components/StackableBorderBox\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A bordered container component designed to be stacked with other border boxes.\",\n      },\n    },\n    controls: {\n        exclude: STORYBOOK_PROPS_BLOCKLIST,\n      },\n  },\n}\n\nexport const Default = {\n  render: () => (\n    <>\n      <StackableBorderBox>\n        <Flex>\n          <Avatar size=\"xs\" src=\"https://picsum.photos/seed/example/110/110\" />\n          <Button>Click me</Button>\n        </Flex>\n      </StackableBorderBox>\n      <StackableBorderBox>Second Box</StackableBorderBox>\n      <StackableBorderBox>Third Box</StackableBorderBox>\n      <StackableBorderBox>Fourth Box</StackableBorderBox>\n    </>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story:\n          \"Multiple stackable border boxes demonstrating visual connection.\",\n      },\n    },\n  },\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,kBAAkB;AAC3B,SAASC,MAAM;AACf,SAASC,IAAI;AACb,SAASC,MAAM;AACf,SAASC,yBAAyB;AAElC,eAAe;EACbC,SAAS,EAAEL,kBAAkB;EAC7BM,KAAK,EAAE,+BAA+B;EACtCC,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,EAAER;IACX;EACJ;AACF,CAAC;AAED,OAAO,IAAMS,OAAO,GAAG;EACrBC,MAAM,EAAE,SAARA,MAAMA,CAAA;IAAA,oBACJf,KAAA,CAAAgB,aAAA,CAAAhB,KAAA,CAAAiB,QAAA,qBACEjB,KAAA,CAAAgB,aAAA,CAACf,kBAAkB,qBACjBD,KAAA,CAAAgB,aAAA,CAACb,IAAI,qBACHH,KAAA,CAAAgB,aAAA,CAACd,MAAM;MAACgB,IAAI,EAAC,IAAI;MAACC,GAAG,EAAC;IAA4C,EAAG,eACrEnB,KAAA,CAAAgB,aAAA,CAACZ,MAAM,QAAC,UAAQ,CAAS,CACpB,CACY,eACrBJ,KAAA,CAAAgB,aAAA,CAACf,kBAAkB,QAAC,YAAU,CAAqB,eACnDD,KAAA,CAAAgB,aAAA,CAACf,kBAAkB,QAAC,WAAS,CAAqB,eAClDD,KAAA,CAAAgB,aAAA,CAACf,kBAAkB,QAAC,YAAU,CAAqB,CAClD;EAAA,CACJ;EACDQ,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXS,KAAK,EACH;MACJ;IACF;EACF;AACF,CAAC"}

package/dist/esm/elements/StackableBorderBox/index.js

@@ -0,0 +1,2 @@
+export * from "./StackableBorderBox";
+//# sourceMappingURL=index.js.map

package/dist/esm/elements/StackableBorderBox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/elements/StackableBorderBox/index.tsx"],"sourcesContent":["export * from \"./StackableBorderBox\"\n"],"mappings":"AAAA"}