@simplybusiness/mobius 9.2.0 → 9.3.0

package/dist/cjs/components/Box/types.js

@@ -0,0 +1,19 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Box/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);
+//# sourceMappingURL=types.js.map

package/dist/cjs/components/Box/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Box/types.ts"],
+  "sourcesContent": ["import type { ReactNode, RefAttributes } from \"react\";\nimport type { DOMProps, SpacingType } from \"../../types\";\n\nexport type BoxElementType = HTMLDivElement;\n\nexport type BoxDimensionsType = string | number;\n\nexport interface BoxProps extends DOMProps, RefAttributes<BoxElementType> {\n  children?: ReactNode;\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  /** HTML element for the Box */\n  elementType?: \"div\" | \"span\";\n  style?: React.CSSProperties;\n  padding?: SpacingType;\n  paddingX?: SpacingType;\n  paddingInline?: SpacingType;\n  paddingInlineStart?: SpacingType;\n  paddingInlineEnd?: SpacingType;\n  paddingY?: SpacingType;\n  paddingBlock?: SpacingType;\n  paddingBlockStart?: SpacingType;\n  paddingBlockEnd?: SpacingType;\n  paddingTop?: SpacingType;\n  paddingRight?: SpacingType;\n  paddingBottom?: SpacingType;\n  paddingLeft?: SpacingType;\n  minWidth?: BoxDimensionsType;\n  minHeight?: BoxDimensionsType;\n  maxWidth?: BoxDimensionsType;\n  maxHeight?: BoxDimensionsType;\n  width?: BoxDimensionsType;\n  height?: BoxDimensionsType;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;",
+  "names": []
+}

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem.js

@@ -0,0 +1,148 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Breadcrumbs/BreadcrumbItem.tsx
+var BreadcrumbItem_exports = {};
+__export(BreadcrumbItem_exports, {
+  BreadcrumbItem: () => BreadcrumbItem
+});
+module.exports = __toCommonJS(BreadcrumbItem_exports);
+var import_react = require("react");
+var import_dedupe2 = __toESM(require("classnames/dedupe"));
+
+// src/components/Box/Box.tsx
+var import_dedupe = __toESM(require("classnames/dedupe"));
+
+// src/utils/filterUndefinedProps.ts
+var filterUndefinedProps = (props) => {
+  const filteredProps = {};
+  Object.keys(props).forEach((key) => {
+    if (props[key] !== void 0) {
+      filteredProps[key] = props[key];
+    }
+  });
+  return filteredProps;
+};
+
+// src/utils/getSpacingValue.ts
+var getSpacingValue = (padding) => {
+  if (typeof padding === "string") {
+    return `var(--size-${padding})`;
+  }
+  if (typeof padding === "number") {
+    return `${padding}px`;
+  }
+  return void 0;
+};
+
+// src/components/Box/Box.tsx
+var import_Box = require("@simplybusiness/mobius/src/components/Box/Box.css");
+var import_jsx_runtime = require("react/jsx-runtime");
+var Box = ({ ref, ...props }) => {
+  const {
+    elementType: Element = "div",
+    padding,
+    paddingX,
+    paddingInline,
+    paddingInlineStart,
+    paddingInlineEnd,
+    paddingY,
+    paddingBlock,
+    paddingBlockStart,
+    paddingBlockEnd,
+    paddingTop,
+    paddingRight,
+    paddingBottom,
+    paddingLeft,
+    minWidth,
+    minHeight,
+    maxWidth,
+    maxHeight,
+    width,
+    height,
+    style,
+    ...otherProps
+  } = props;
+  const classes = (0, import_dedupe.default)("mobius", "mobius-box", otherProps.className);
+  const styleProps = filterUndefinedProps({
+    padding: getSpacingValue(padding),
+    paddingInline: getSpacingValue(paddingInline || paddingX),
+    paddingBlock: getSpacingValue(paddingBlock || paddingY),
+    paddingTop: getSpacingValue(paddingTop || paddingBlockStart),
+    paddingRight: getSpacingValue(paddingRight || paddingInlineEnd),
+    paddingBottom: getSpacingValue(paddingBottom || paddingBlockEnd),
+    paddingLeft: getSpacingValue(paddingLeft || paddingInlineStart),
+    minWidth,
+    minHeight,
+    maxWidth,
+    maxHeight,
+    width,
+    height,
+    ...style
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Element, { ref, style: styleProps, ...otherProps, className: classes });
+};
+Box.displayName = "Box";
+
+// src/components/Breadcrumbs/BreadcrumbItem.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var BreadcrumbItem = ({ ref, ...props }) => {
+  const {
+    isDisabled = false,
+    isCurrent = false,
+    "aria-current": ariaCurrent = "page",
+    children,
+    separator = /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Box, { className: "mobius-breadcrumb__separator", "aria-hidden": "true", children: ">" }),
+    ...otherProps
+  } = props;
+  const { itemProps } = {
+    itemProps: {
+      "aria-current": isCurrent ? ariaCurrent : void 0,
+      "aria-disabled": isDisabled || isCurrent,
+      ...otherProps
+    }
+  };
+  const classes = (0, import_dedupe2.default)(
+    "mobius",
+    "mobius-breadcrumb__item",
+    props.className
+  );
+  const child = typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { ...itemProps, children }) : import_react.Children.only(children);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("li", { className: classes, children: [
+    (0, import_react.cloneElement)(child, {
+      ...child.props,
+      ...itemProps,
+      ref
+    }),
+    !props.isCurrent && separator
+  ] });
+};
+BreadcrumbItem.displayName = "BreadcrumbItem";
+//# sourceMappingURL=BreadcrumbItem.js.map

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Breadcrumbs/BreadcrumbItem.tsx", "../../../../src/components/Box/Box.tsx", "../../../../src/utils/filterUndefinedProps.ts", "../../../../src/utils/getSpacingValue.ts"],
+  "sourcesContent": ["\"use client\";\n\nimport type { ReactNode, ReactElement, RefAttributes } from \"react\";\nimport { cloneElement, Children } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport type { DOMProps } from \"../../types/dom\";\nimport { Box } from \"../Box\";\n\nexport type BreadcrumbItemElementType = HTMLLIElement;\n\nexport interface BreadcrumbItemProps\n  extends DOMProps, RefAttributes<BreadcrumbItemElementType> {\n  \"aria-current\"?:\n    | \"page\"\n    | \"step\"\n    | \"location\"\n    | \"date\"\n    | \"time\"\n    | boolean\n    | \"true\"\n    | \"false\";\n  isDisabled?: boolean;\n  isCurrent?: boolean;\n  separator?: ReactNode;\n  className?: string;\n  children: ReactNode;\n}\n\nconst BreadcrumbItem = ({ ref, ...props }: BreadcrumbItemProps) => {\n  const {\n    isDisabled = false,\n    isCurrent = false,\n    \"aria-current\": ariaCurrent = \"page\",\n    children,\n    separator = (\n      <Box className=\"mobius-breadcrumb__separator\" aria-hidden=\"true\">\n        {\">\"}\n      </Box>\n    ),\n    ...otherProps\n  } = props;\n  const { itemProps } = {\n    itemProps: {\n      \"aria-current\": isCurrent ? ariaCurrent : undefined,\n      \"aria-disabled\": isDisabled || isCurrent,\n      ...otherProps,\n    },\n  };\n\n  // Reshape class name and apply to outer element\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-breadcrumb__item\",\n    props.className,\n  );\n\n  const child: ReactElement =\n    typeof children === \"string\" ? (\n      <span {...itemProps}>{children}</span>\n    ) : (\n      (Children.only(children) as ReactElement)\n    );\n\n  return (\n    <li className={classes}>\n      {cloneElement(child, {\n        ...(child.props as Record<string, unknown>),\n        ...itemProps,\n        ref,\n      } as Record<string, unknown>)}\n      {!props.isCurrent && separator}\n    </li>\n  );\n};\n\nBreadcrumbItem.displayName = \"BreadcrumbItem\";\nexport { BreadcrumbItem };\n", "import classNames from \"classnames/dedupe\";\nimport type { BoxProps } from \"./types\";\nimport { getSpacingValue, filterUndefinedProps } from \"../../utils\";\nimport \"./Box.css\";\n\nconst Box = ({ ref, ...props }: BoxProps) => {\n  const {\n    elementType: Element = \"div\",\n    padding,\n    paddingX,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingY,\n    paddingBlock,\n    paddingBlockStart,\n    paddingBlockEnd,\n    paddingTop,\n    paddingRight,\n    paddingBottom,\n    paddingLeft,\n    minWidth,\n    minHeight,\n    maxWidth,\n    maxHeight,\n    width,\n    height,\n    style,\n    ...otherProps\n  } = props;\n\n  const classes = classNames(\"mobius\", \"mobius-box\", otherProps.className);\n\n  const styleProps = filterUndefinedProps({\n    padding: getSpacingValue(padding),\n    paddingInline: getSpacingValue(paddingInline || paddingX),\n    paddingBlock: getSpacingValue(paddingBlock || paddingY),\n    paddingTop: getSpacingValue(paddingTop || paddingBlockStart),\n    paddingRight: getSpacingValue(paddingRight || paddingInlineEnd),\n    paddingBottom: getSpacingValue(paddingBottom || paddingBlockEnd),\n    paddingLeft: getSpacingValue(paddingLeft || paddingInlineStart),\n    minWidth,\n    minHeight,\n    maxWidth,\n    maxHeight,\n    width,\n    height,\n    ...style,\n  });\n\n  return (\n    <Element ref={ref} style={styleProps} {...otherProps} className={classes} />\n  );\n};\n\nBox.displayName = \"Box\";\nexport { Box };\n", "export const filterUndefinedProps = (props: Record<string, unknown>) => {\n  const filteredProps: Record<string, unknown> = {};\n  Object.keys(props).forEach(key => {\n    if (props[key] !== undefined) {\n      filteredProps[key] = props[key];\n    }\n  });\n  return filteredProps;\n};\n", "import type { SpacingType } from \"../types\";\n\nexport const getSpacingValue = (\n  padding: SpacingType | undefined,\n): string | undefined => {\n  if (typeof padding === \"string\") {\n    return `var(--size-${padding})`;\n  }\n\n  if (typeof padding === \"number\") {\n    return `${padding}px`;\n  }\n\n  return undefined;\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAAuC;AACvC,IAAAA,iBAAuB;;;ACJvB,oBAAuB;;;ACAhB,IAAM,uBAAuB,CAAC,UAAmC;AACtE,QAAM,gBAAyC,CAAC;AAChD,SAAO,KAAK,KAAK,EAAE,QAAQ,SAAO;AAChC,QAAI,MAAM,GAAG,MAAM,QAAW;AAC5B,oBAAc,GAAG,IAAI,MAAM,GAAG;AAAA,IAChC;AAAA,EACF,CAAC;AACD,SAAO;AACT;;;ACNO,IAAM,kBAAkB,CAC7B,YACuB;AACvB,MAAI,OAAO,YAAY,UAAU;AAC/B,WAAO,cAAc,OAAO;AAAA,EAC9B;AAEA,MAAI,OAAO,YAAY,UAAU;AAC/B,WAAO,GAAG,OAAO;AAAA,EACnB;AAEA,SAAO;AACT;;;AFXA,iBAAO;AAgDH;AA9CJ,IAAM,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,MAAgB;AAC3C,QAAM;AAAA,IACJ,aAAa,UAAU;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,cAAU,cAAAC,SAAW,UAAU,cAAc,WAAW,SAAS;AAEvE,QAAM,aAAa,qBAAqB;AAAA,IACtC,SAAS,gBAAgB,OAAO;AAAA,IAChC,eAAe,gBAAgB,iBAAiB,QAAQ;AAAA,IACxD,cAAc,gBAAgB,gBAAgB,QAAQ;AAAA,IACtD,YAAY,gBAAgB,cAAc,iBAAiB;AAAA,IAC3D,cAAc,gBAAgB,gBAAgB,gBAAgB;AAAA,IAC9D,eAAe,gBAAgB,iBAAiB,eAAe;AAAA,IAC/D,aAAa,gBAAgB,eAAe,kBAAkB;AAAA,IAC9D;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,CAAC;AAED,SACE,4CAAC,WAAQ,KAAU,OAAO,YAAa,GAAG,YAAY,WAAW,SAAS;AAE9E;AAEA,IAAI,cAAc;;;ADpBZ,IAAAC,sBAAA;AAPN,IAAM,iBAAiB,CAAC,EAAE,KAAK,GAAG,MAAM,MAA2B;AACjE,QAAM;AAAA,IACJ,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,gBAAgB,cAAc;AAAA,IAC9B;AAAA,IACA,YACE,6CAAC,OAAI,WAAU,gCAA+B,eAAY,QACvD,eACH;AAAA,IAEF,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,EAAE,UAAU,IAAI;AAAA,IACpB,WAAW;AAAA,MACT,gBAAgB,YAAY,cAAc;AAAA,MAC1C,iBAAiB,cAAc;AAAA,MAC/B,GAAG;AAAA,IACL;AAAA,EACF;AAGA,QAAM,cAAU,eAAAC;AAAA,IACd;AAAA,IACA;AAAA,IACA,MAAM;AAAA,EACR;AAEA,QAAM,QACJ,OAAO,aAAa,WAClB,6CAAC,UAAM,GAAG,WAAY,UAAS,IAE9B,sBAAS,KAAK,QAAQ;AAG3B,SACE,8CAAC,QAAG,WAAW,SACZ;AAAA,mCAAa,OAAO;AAAA,MACnB,GAAI,MAAM;AAAA,MACV,GAAG;AAAA,MACH;AAAA,IACF,CAA4B;AAAA,IAC3B,CAAC,MAAM,aAAa;AAAA,KACvB;AAEJ;AAEA,eAAe,cAAc;",
+  "names": ["import_dedupe", "classNames", "import_jsx_runtime", "classNames"]
+}

package/dist/cjs/components/Breadcrumbs/Breadcrumbs.js

@@ -0,0 +1,62 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Breadcrumbs/Breadcrumbs.tsx
+var Breadcrumbs_exports = {};
+__export(Breadcrumbs_exports, {
+  Breadcrumbs: () => Breadcrumbs
+});
+module.exports = __toCommonJS(Breadcrumbs_exports);
+var import_react = require("react");
+var import_dedupe = __toESM(require("classnames/dedupe"));
+var import_Breadcrumbs = require("@simplybusiness/mobius/src/components/Breadcrumbs/Breadcrumbs.css");
+var import_jsx_runtime = require("react/jsx-runtime");
+var Breadcrumbs = ({ ref, ...props }) => {
+  const { "aria-label": ariaLabel = "Breadcrumbs" } = props;
+  const { navProps } = { navProps: { "aria-label": ariaLabel } };
+  const { children, ...otherProps } = props;
+  const childArray = import_react.Children.toArray(children);
+  const classes = (0, import_dedupe.default)(
+    "mobius",
+    "mobius-breadcrumb",
+    otherProps.className
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("nav", { ref, ...otherProps, ...navProps, className: classes, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { children: childArray.map(
+    (child, i) => (0, import_react.cloneElement)(
+      child,
+      {
+        key: i,
+        isCurrent: i === childArray.length - 1
+      }
+    )
+  ) }) });
+};
+Breadcrumbs.displayName = "Breadcrumbs";
+//# sourceMappingURL=Breadcrumbs.js.map

package/dist/cjs/components/Breadcrumbs/Breadcrumbs.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],
+  "sourcesContent": ["\"use client\";\n\nimport type { ReactElement, RefAttributes, ReactNode } from \"react\";\nimport { Children, cloneElement } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport \"./Breadcrumbs.css\";\n\nexport type BreadcrumbsElementType = HTMLUListElement;\n\nexport interface BreadcrumbsProps extends RefAttributes<BreadcrumbsElementType> {\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  children?: ReactNode;\n  \"aria-label\"?: string;\n}\n\nconst Breadcrumbs = ({ ref, ...props }: BreadcrumbsProps) => {\n  const { \"aria-label\": ariaLabel = \"Breadcrumbs\" } = props;\n  const { navProps } = { navProps: { \"aria-label\": ariaLabel } };\n  const { children, ...otherProps } = props;\n  const childArray = Children.toArray(children);\n\n  // Reshape class name and apply to outer element\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-breadcrumb\",\n    otherProps.className,\n  );\n\n  return (\n    <nav ref={ref} {...otherProps} {...navProps} className={classes}>\n      <ul>\n        {childArray.map((child, i) =>\n          cloneElement(\n            child as ReactElement,\n            {\n              key: i,\n              isCurrent: i === childArray.length - 1,\n            } as { key: number; isCurrent: boolean },\n          ),\n        )}\n      </ul>\n    </nav>\n  );\n};\n\nBreadcrumbs.displayName = \"Breadcrumbs\";\nexport { Breadcrumbs };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAAuC;AACvC,oBAAuB;AACvB,yBAAO;AA0BD;AAfN,IAAM,cAAc,CAAC,EAAE,KAAK,GAAG,MAAM,MAAwB;AAC3D,QAAM,EAAE,cAAc,YAAY,cAAc,IAAI;AACpD,QAAM,EAAE,SAAS,IAAI,EAAE,UAAU,EAAE,cAAc,UAAU,EAAE;AAC7D,QAAM,EAAE,UAAU,GAAG,WAAW,IAAI;AACpC,QAAM,aAAa,sBAAS,QAAQ,QAAQ;AAG5C,QAAM,cAAU,cAAAA;AAAA,IACd;AAAA,IACA;AAAA,IACA,WAAW;AAAA,EACb;AAEA,SACE,4CAAC,SAAI,KAAW,GAAG,YAAa,GAAG,UAAU,WAAW,SACtD,sDAAC,QACE,qBAAW;AAAA,IAAI,CAAC,OAAO,UACtB;AAAA,MACE;AAAA,MACA;AAAA,QACE,KAAK;AAAA,QACL,WAAW,MAAM,WAAW,SAAS;AAAA,MACvC;AAAA,IACF;AAAA,EACF,GACF,GACF;AAEJ;AAEA,YAAY,cAAc;",
+  "names": ["classNames"]
+}

package/dist/cjs/components/Breadcrumbs/index.js

@@ -0,0 +1,177 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Breadcrumbs/index.tsx
+var Breadcrumbs_exports = {};
+__export(Breadcrumbs_exports, {
+  BreadcrumbItem: () => BreadcrumbItem,
+  Breadcrumbs: () => Breadcrumbs
+});
+module.exports = __toCommonJS(Breadcrumbs_exports);
+
+// src/components/Breadcrumbs/Breadcrumbs.tsx
+var import_react = require("react");
+var import_dedupe = __toESM(require("classnames/dedupe"));
+var import_Breadcrumbs = require("@simplybusiness/mobius/src/components/Breadcrumbs/Breadcrumbs.css");
+var import_jsx_runtime = require("react/jsx-runtime");
+var Breadcrumbs = ({ ref, ...props }) => {
+  const { "aria-label": ariaLabel = "Breadcrumbs" } = props;
+  const { navProps } = { navProps: { "aria-label": ariaLabel } };
+  const { children, ...otherProps } = props;
+  const childArray = import_react.Children.toArray(children);
+  const classes = (0, import_dedupe.default)(
+    "mobius",
+    "mobius-breadcrumb",
+    otherProps.className
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("nav", { ref, ...otherProps, ...navProps, className: classes, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { children: childArray.map(
+    (child, i) => (0, import_react.cloneElement)(
+      child,
+      {
+        key: i,
+        isCurrent: i === childArray.length - 1
+      }
+    )
+  ) }) });
+};
+Breadcrumbs.displayName = "Breadcrumbs";
+
+// src/components/Breadcrumbs/BreadcrumbItem.tsx
+var import_react2 = require("react");
+var import_dedupe3 = __toESM(require("classnames/dedupe"));
+
+// src/components/Box/Box.tsx
+var import_dedupe2 = __toESM(require("classnames/dedupe"));
+
+// src/utils/filterUndefinedProps.ts
+var filterUndefinedProps = (props) => {
+  const filteredProps = {};
+  Object.keys(props).forEach((key) => {
+    if (props[key] !== void 0) {
+      filteredProps[key] = props[key];
+    }
+  });
+  return filteredProps;
+};
+
+// src/utils/getSpacingValue.ts
+var getSpacingValue = (padding) => {
+  if (typeof padding === "string") {
+    return `var(--size-${padding})`;
+  }
+  if (typeof padding === "number") {
+    return `${padding}px`;
+  }
+  return void 0;
+};
+
+// src/components/Box/Box.tsx
+var import_Box = require("@simplybusiness/mobius/src/components/Box/Box.css");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Box = ({ ref, ...props }) => {
+  const {
+    elementType: Element = "div",
+    padding,
+    paddingX,
+    paddingInline,
+    paddingInlineStart,
+    paddingInlineEnd,
+    paddingY,
+    paddingBlock,
+    paddingBlockStart,
+    paddingBlockEnd,
+    paddingTop,
+    paddingRight,
+    paddingBottom,
+    paddingLeft,
+    minWidth,
+    minHeight,
+    maxWidth,
+    maxHeight,
+    width,
+    height,
+    style,
+    ...otherProps
+  } = props;
+  const classes = (0, import_dedupe2.default)("mobius", "mobius-box", otherProps.className);
+  const styleProps = filterUndefinedProps({
+    padding: getSpacingValue(padding),
+    paddingInline: getSpacingValue(paddingInline || paddingX),
+    paddingBlock: getSpacingValue(paddingBlock || paddingY),
+    paddingTop: getSpacingValue(paddingTop || paddingBlockStart),
+    paddingRight: getSpacingValue(paddingRight || paddingInlineEnd),
+    paddingBottom: getSpacingValue(paddingBottom || paddingBlockEnd),
+    paddingLeft: getSpacingValue(paddingLeft || paddingInlineStart),
+    minWidth,
+    minHeight,
+    maxWidth,
+    maxHeight,
+    width,
+    height,
+    ...style
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Element, { ref, style: styleProps, ...otherProps, className: classes });
+};
+Box.displayName = "Box";
+
+// src/components/Breadcrumbs/BreadcrumbItem.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var BreadcrumbItem = ({ ref, ...props }) => {
+  const {
+    isDisabled = false,
+    isCurrent = false,
+    "aria-current": ariaCurrent = "page",
+    children,
+    separator = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box, { className: "mobius-breadcrumb__separator", "aria-hidden": "true", children: ">" }),
+    ...otherProps
+  } = props;
+  const { itemProps } = {
+    itemProps: {
+      "aria-current": isCurrent ? ariaCurrent : void 0,
+      "aria-disabled": isDisabled || isCurrent,
+      ...otherProps
+    }
+  };
+  const classes = (0, import_dedupe3.default)(
+    "mobius",
+    "mobius-breadcrumb__item",
+    props.className
+  );
+  const child = typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { ...itemProps, children }) : import_react2.Children.only(children);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("li", { className: classes, children: [
+    (0, import_react2.cloneElement)(child, {
+      ...child.props,
+      ...itemProps,
+      ref
+    }),
+    !props.isCurrent && separator
+  ] });
+};
+BreadcrumbItem.displayName = "BreadcrumbItem";
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Breadcrumbs/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Breadcrumbs/index.tsx", "../../../../src/components/Breadcrumbs/Breadcrumbs.tsx", "../../../../src/components/Breadcrumbs/BreadcrumbItem.tsx", "../../../../src/components/Box/Box.tsx", "../../../../src/utils/filterUndefinedProps.ts", "../../../../src/utils/getSpacingValue.ts"],
+  "sourcesContent": ["export * from \"./Breadcrumbs\";\nexport * from \"./BreadcrumbItem\";\n", "\"use client\";\n\nimport type { ReactElement, RefAttributes, ReactNode } from \"react\";\nimport { Children, cloneElement } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport \"./Breadcrumbs.css\";\n\nexport type BreadcrumbsElementType = HTMLUListElement;\n\nexport interface BreadcrumbsProps extends RefAttributes<BreadcrumbsElementType> {\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  children?: ReactNode;\n  \"aria-label\"?: string;\n}\n\nconst Breadcrumbs = ({ ref, ...props }: BreadcrumbsProps) => {\n  const { \"aria-label\": ariaLabel = \"Breadcrumbs\" } = props;\n  const { navProps } = { navProps: { \"aria-label\": ariaLabel } };\n  const { children, ...otherProps } = props;\n  const childArray = Children.toArray(children);\n\n  // Reshape class name and apply to outer element\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-breadcrumb\",\n    otherProps.className,\n  );\n\n  return (\n    <nav ref={ref} {...otherProps} {...navProps} className={classes}>\n      <ul>\n        {childArray.map((child, i) =>\n          cloneElement(\n            child as ReactElement,\n            {\n              key: i,\n              isCurrent: i === childArray.length - 1,\n            } as { key: number; isCurrent: boolean },\n          ),\n        )}\n      </ul>\n    </nav>\n  );\n};\n\nBreadcrumbs.displayName = \"Breadcrumbs\";\nexport { Breadcrumbs };\n", "\"use client\";\n\nimport type { ReactNode, ReactElement, RefAttributes } from \"react\";\nimport { cloneElement, Children } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport type { DOMProps } from \"../../types/dom\";\nimport { Box } from \"../Box\";\n\nexport type BreadcrumbItemElementType = HTMLLIElement;\n\nexport interface BreadcrumbItemProps\n  extends DOMProps, RefAttributes<BreadcrumbItemElementType> {\n  \"aria-current\"?:\n    | \"page\"\n    | \"step\"\n    | \"location\"\n    | \"date\"\n    | \"time\"\n    | boolean\n    | \"true\"\n    | \"false\";\n  isDisabled?: boolean;\n  isCurrent?: boolean;\n  separator?: ReactNode;\n  className?: string;\n  children: ReactNode;\n}\n\nconst BreadcrumbItem = ({ ref, ...props }: BreadcrumbItemProps) => {\n  const {\n    isDisabled = false,\n    isCurrent = false,\n    \"aria-current\": ariaCurrent = \"page\",\n    children,\n    separator = (\n      <Box className=\"mobius-breadcrumb__separator\" aria-hidden=\"true\">\n        {\">\"}\n      </Box>\n    ),\n    ...otherProps\n  } = props;\n  const { itemProps } = {\n    itemProps: {\n      \"aria-current\": isCurrent ? ariaCurrent : undefined,\n      \"aria-disabled\": isDisabled || isCurrent,\n      ...otherProps,\n    },\n  };\n\n  // Reshape class name and apply to outer element\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-breadcrumb__item\",\n    props.className,\n  );\n\n  const child: ReactElement =\n    typeof children === \"string\" ? (\n      <span {...itemProps}>{children}</span>\n    ) : (\n      (Children.only(children) as ReactElement)\n    );\n\n  return (\n    <li className={classes}>\n      {cloneElement(child, {\n        ...(child.props as Record<string, unknown>),\n        ...itemProps,\n        ref,\n      } as Record<string, unknown>)}\n      {!props.isCurrent && separator}\n    </li>\n  );\n};\n\nBreadcrumbItem.displayName = \"BreadcrumbItem\";\nexport { BreadcrumbItem };\n", "import classNames from \"classnames/dedupe\";\nimport type { BoxProps } from \"./types\";\nimport { getSpacingValue, filterUndefinedProps } from \"../../utils\";\nimport \"./Box.css\";\n\nconst Box = ({ ref, ...props }: BoxProps) => {\n  const {\n    elementType: Element = \"div\",\n    padding,\n    paddingX,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingY,\n    paddingBlock,\n    paddingBlockStart,\n    paddingBlockEnd,\n    paddingTop,\n    paddingRight,\n    paddingBottom,\n    paddingLeft,\n    minWidth,\n    minHeight,\n    maxWidth,\n    maxHeight,\n    width,\n    height,\n    style,\n    ...otherProps\n  } = props;\n\n  const classes = classNames(\"mobius\", \"mobius-box\", otherProps.className);\n\n  const styleProps = filterUndefinedProps({\n    padding: getSpacingValue(padding),\n    paddingInline: getSpacingValue(paddingInline || paddingX),\n    paddingBlock: getSpacingValue(paddingBlock || paddingY),\n    paddingTop: getSpacingValue(paddingTop || paddingBlockStart),\n    paddingRight: getSpacingValue(paddingRight || paddingInlineEnd),\n    paddingBottom: getSpacingValue(paddingBottom || paddingBlockEnd),\n    paddingLeft: getSpacingValue(paddingLeft || paddingInlineStart),\n    minWidth,\n    minHeight,\n    maxWidth,\n    maxHeight,\n    width,\n    height,\n    ...style,\n  });\n\n  return (\n    <Element ref={ref} style={styleProps} {...otherProps} className={classes} />\n  );\n};\n\nBox.displayName = \"Box\";\nexport { Box };\n", "export const filterUndefinedProps = (props: Record<string, unknown>) => {\n  const filteredProps: Record<string, unknown> = {};\n  Object.keys(props).forEach(key => {\n    if (props[key] !== undefined) {\n      filteredProps[key] = props[key];\n    }\n  });\n  return filteredProps;\n};\n", "import type { SpacingType } from \"../types\";\n\nexport const getSpacingValue = (\n  padding: SpacingType | undefined,\n): string | undefined => {\n  if (typeof padding === \"string\") {\n    return `var(--size-${padding})`;\n  }\n\n  if (typeof padding === \"number\") {\n    return `${padding}px`;\n  }\n\n  return undefined;\n};\n"],
+  "mappings": "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",
+  "names": ["classNames", "import_react", "import_dedupe", "import_dedupe", "import_jsx_runtime", "classNames", "import_jsx_runtime", "classNames"]
+}