@d4gger/design-system 2.7.0

package/dist/_internal/helpers/extractProps.js

@@ -0,0 +1,140 @@
+import classNames from "classnames";
+import {
+  getResponsiveClassNames,
+  getResponsiveStyles,
+  isResponsiveObject
+} from "./getResponsiveStyles.js";
+import { mergeStyles } from "./mergeStyles.js";
+import { breakpointsArray } from "../props/propDef.js";
+function mergePropDefs(...args) {
+  return Object.assign({}, ...args);
+}
+function getEnumValues(propDef) {
+  return propDef.default === void 0 ? [...propDef.values] : [propDef.default, ...propDef.values];
+}
+function isResponsivePropDef(propDef) {
+  return "responsive" in propDef && propDef.responsive === true;
+}
+function normalizeResponsiveValue(value, propDef) {
+  const normalizedValue = { ...value };
+  if (propDef.default !== void 0 && normalizedValue.initial === void 0) {
+    normalizedValue.initial = propDef.default;
+  }
+  if (propDef.type === "enum") {
+    const values = getEnumValues(propDef);
+    if (normalizedValue.initial !== void 0 && (typeof normalizedValue.initial !== "string" || !values.includes(normalizedValue.initial))) {
+      normalizedValue.initial = propDef.default;
+    }
+  }
+  return normalizedValue;
+}
+function getResponsiveBooleanClassNames(className, value) {
+  if (value === void 0) {
+    return void 0;
+  }
+  if (typeof value === "boolean") {
+    return value ? className : void 0;
+  }
+  const classNamesToMerge = [];
+  for (const breakpoint of breakpointsArray) {
+    const nextValue = value[breakpoint];
+    if (!nextValue) {
+      continue;
+    }
+    classNamesToMerge.push(breakpoint === "initial" ? className : `${breakpoint}:${className}`);
+  }
+  return classNamesToMerge.length > 0 ? classNamesToMerge.join(" ") : void 0;
+}
+function extractProps(props, ...propDefs) {
+  let generatedClassName;
+  let generatedStyle;
+  const extractedProps = { ...props };
+  const extractedPropsRecord = extractedProps;
+  const allPropDefs = mergePropDefs(...propDefs);
+  for (const key in allPropDefs) {
+    const propDef = allPropDefs[key];
+    let value = extractedPropsRecord[key];
+    if (propDef.default !== void 0 && value === void 0) {
+      value = propDef.default;
+    }
+    const propDefSupportsArbitraryValues = "customProperties" in propDef && Boolean(propDef.customProperties?.length);
+    if (propDef.type === "enum" && !propDefSupportsArbitraryValues) {
+      const values = getEnumValues(propDef);
+      if (!isResponsiveObject(value) && (typeof value !== "string" || !values.includes(value))) {
+        value = propDef.default;
+      }
+    }
+    if (isResponsiveObject(value) && isResponsivePropDef(propDef)) {
+      value = normalizeResponsiveValue(value, propDef);
+    }
+    extractedPropsRecord[key] = value;
+    const hasCustomProperties = "customProperties" in propDef && Boolean(propDef.customProperties?.length);
+    if (!("className" in propDef) || !propDef.className && !hasCustomProperties) {
+      continue;
+    }
+    const propClassName = propDef.className ?? "";
+    delete extractedPropsRecord[key];
+    const propDefIsResponsive = isResponsivePropDef(propDef);
+    if (value === void 0 || isResponsiveObject(value) && !propDefIsResponsive) {
+      continue;
+    }
+    if (propDef.type === "boolean") {
+      generatedClassName = classNames(
+        generatedClassName,
+        getResponsiveBooleanClassNames(
+          propClassName,
+          value
+        )
+      );
+      continue;
+    }
+    const propValues = "values" in propDef ? propDef.values : [];
+    if ("customProperties" in propDef && propDef.customProperties) {
+      const [propClassNames, propCustomProperties] = getResponsiveStyles({
+        className: propClassName,
+        customProperties: propDef.customProperties,
+        propValues,
+        parseValue: propDef.parseValue,
+        value
+      });
+      generatedStyle = mergeStyles(generatedStyle, propCustomProperties);
+      generatedClassName = classNames(generatedClassName, propClassNames);
+      continue;
+    }
+    if (propDef.type === "enum") {
+      generatedClassName = classNames(
+        generatedClassName,
+        getResponsiveClassNames({
+          allowArbitraryValues: false,
+          className: propClassName,
+          propValues,
+          parseValue: propDef.parseValue,
+          value
+        })
+      );
+      continue;
+    }
+  }
+  for (const key in allPropDefs) {
+    if (!(key in props)) {
+      delete extractedPropsRecord[key];
+    }
+  }
+  const mergedClassName = classNames(generatedClassName, props.className) || void 0;
+  const mergedStyle = mergeStyles(generatedStyle, props.style ? { ...props.style } : void 0);
+  if (mergedClassName) {
+    extractedProps.className = mergedClassName;
+  } else {
+    delete extractedProps.className;
+  }
+  if (mergedStyle) {
+    extractedProps.style = mergedStyle;
+  } else {
+    delete extractedProps.style;
+  }
+  return extractedProps;
+}
+export {
+  extractProps
+};
+//# sourceMappingURL=extractProps.js.map

package/dist/_internal/helpers/extractProps.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/_internal/helpers/extractProps.ts"],
+  "sourcesContent": ["import classNames from 'classnames'\n\nimport {\n  getResponsiveClassNames,\n  getResponsiveStyles,\n  isResponsiveObject,\n} from './getResponsiveStyles'\nimport { mergeStyles } from './mergeStyles'\n\nimport type * as React from 'react'\nimport { breakpointsArray, type Breakpoint, type PropDef } from '../props/propDef'\n\ntype PropDefsWithClassName<T> =\n  T extends Record<string, PropDef>\n    ? { [K in keyof T]: T[K] extends { className: string } ? K : never }[keyof T]\n    : never\n\nfunction mergePropDefs<T extends Record<string, PropDef>[]>(...args: T) {\n  return Object.assign({}, ...args) as Record<string, PropDef>\n}\n\nfunction getEnumValues(propDef: Extract<PropDef, { type: 'enum' }>) {\n  return propDef.default === undefined ? [...propDef.values] : [propDef.default, ...propDef.values]\n}\n\nfunction isResponsivePropDef(propDef: PropDef): propDef is PropDef & { responsive: true } {\n  return 'responsive' in propDef && propDef.responsive === true\n}\n\nfunction normalizeResponsiveValue(\n  value: Partial<Record<Breakpoint, unknown>>,\n  propDef: PropDef,\n) {\n  const normalizedValue = { ...value }\n\n  if (propDef.default !== undefined && normalizedValue.initial === undefined) {\n    normalizedValue.initial = propDef.default\n  }\n\n  if (propDef.type === 'enum') {\n    const values = getEnumValues(propDef)\n\n    if (\n      normalizedValue.initial !== undefined\n      && (typeof normalizedValue.initial !== 'string' || !values.includes(normalizedValue.initial))\n    ) {\n      normalizedValue.initial = propDef.default\n    }\n  }\n\n  return normalizedValue\n}\n\nfunction getResponsiveBooleanClassNames(\n  className: string,\n  value: boolean | Partial<Record<Breakpoint, boolean>> | undefined,\n) {\n  if (value === undefined) {\n    return undefined\n  }\n\n  if (typeof value === 'boolean') {\n    return value ? className : undefined\n  }\n\n  const classNamesToMerge: string[] = []\n\n  for (const breakpoint of breakpointsArray) {\n    const nextValue = value[breakpoint]\n\n    if (!nextValue) {\n      continue\n    }\n\n    classNamesToMerge.push(breakpoint === 'initial' ? className : `${breakpoint}:${className}`)\n  }\n\n  return classNamesToMerge.length > 0 ? classNamesToMerge.join(' ') : undefined\n}\n\nfunction extractProps<\n  P extends object & { className?: string; style?: React.CSSProperties },\n  T extends Record<string, PropDef>[],\n>(\n  props: P,\n  ...propDefs: T\n): Omit<P & { className?: string; style?: React.CSSProperties }, PropDefsWithClassName<T[number]>> {\n  let generatedClassName: string | undefined\n  let generatedStyle: ReturnType<typeof mergeStyles>\n  const extractedProps = { ...props }\n  const extractedPropsRecord = extractedProps as Record<string, unknown>\n  const allPropDefs = mergePropDefs(...propDefs)\n\n  for (const key in allPropDefs) {\n    const propDef = allPropDefs[key]\n    let value = extractedPropsRecord[key]\n\n    if (propDef.default !== undefined && value === undefined) {\n      value = propDef.default\n    }\n\n    const propDefSupportsArbitraryValues = 'customProperties' in propDef && Boolean(propDef.customProperties?.length)\n\n    if (propDef.type === 'enum' && !propDefSupportsArbitraryValues) {\n      const values = getEnumValues(propDef)\n\n      if (!isResponsiveObject(value) && (typeof value !== 'string' || !values.includes(value))) {\n        value = propDef.default\n      }\n    }\n\n    if (isResponsiveObject(value) && isResponsivePropDef(propDef)) {\n      value = normalizeResponsiveValue(value, propDef)\n    }\n\n    extractedPropsRecord[key] = value\n\n    const hasCustomProperties = 'customProperties' in propDef && Boolean(propDef.customProperties?.length)\n\n    if (!('className' in propDef) || (!propDef.className && !hasCustomProperties)) {\n      continue\n    }\n\n    const propClassName = propDef.className ?? ''\n\n    delete extractedPropsRecord[key]\n\n    const propDefIsResponsive = isResponsivePropDef(propDef)\n\n    if (value === undefined || (isResponsiveObject(value) && !propDefIsResponsive)) {\n      continue\n    }\n\n    if (propDef.type === 'boolean') {\n      generatedClassName = classNames(\n        generatedClassName,\n        getResponsiveBooleanClassNames(\n          propClassName,\n          value as boolean | Partial<Record<Breakpoint, boolean>> | undefined,\n        ),\n      )\n      continue\n    }\n\n    const propValues = 'values' in propDef ? propDef.values : []\n\n    if ('customProperties' in propDef && propDef.customProperties) {\n      const [propClassNames, propCustomProperties] = getResponsiveStyles({\n        className: propClassName,\n        customProperties: propDef.customProperties,\n        propValues,\n        parseValue: propDef.parseValue,\n        value: value as string | Partial<Record<Breakpoint, string>> | undefined,\n      })\n\n      generatedStyle = mergeStyles(generatedStyle, propCustomProperties)\n      generatedClassName = classNames(generatedClassName, propClassNames)\n      continue\n    }\n\n    if (propDef.type === 'enum') {\n      generatedClassName = classNames(\n        generatedClassName,\n        getResponsiveClassNames({\n          allowArbitraryValues: false,\n          className: propClassName,\n          propValues,\n          parseValue: propDef.parseValue,\n          value: value as string | Partial<Record<Breakpoint, string>> | undefined,\n        }),\n      )\n      continue\n    }\n\n  }\n\n  for (const key in allPropDefs) {\n    if (!(key in props)) {\n      delete extractedPropsRecord[key]\n    }\n  }\n\n  const mergedClassName = classNames(generatedClassName, props.className) || undefined\n  const mergedStyle = mergeStyles(generatedStyle, props.style ? { ...props.style } : undefined)\n\n  if (mergedClassName) {\n    extractedProps.className = mergedClassName\n  } else {\n    delete extractedProps.className\n  }\n\n  if (mergedStyle) {\n    extractedProps.style = mergedStyle\n  } else {\n    delete extractedProps.style\n  }\n\n  return extractedProps as Omit<\n    P & { className?: string; style?: React.CSSProperties },\n    PropDefsWithClassName<T[number]>\n  >\n}\n\nexport { extractProps }\n"],
+  "mappings": "AAAA,OAAO,gBAAgB;AAEvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,mBAAmB;AAG5B,SAAS,wBAAuD;AAOhE,SAAS,iBAAsD,MAAS;AACtE,SAAO,OAAO,OAAO,CAAC,GAAG,GAAG,IAAI;AAClC;AAEA,SAAS,cAAc,SAA6C;AAClE,SAAO,QAAQ,YAAY,SAAY,CAAC,GAAG,QAAQ,MAAM,IAAI,CAAC,QAAQ,SAAS,GAAG,QAAQ,MAAM;AAClG;AAEA,SAAS,oBAAoB,SAA6D;AACxF,SAAO,gBAAgB,WAAW,QAAQ,eAAe;AAC3D;AAEA,SAAS,yBACP,OACA,SACA;AACA,QAAM,kBAAkB,EAAE,GAAG,MAAM;AAEnC,MAAI,QAAQ,YAAY,UAAa,gBAAgB,YAAY,QAAW;AAC1E,oBAAgB,UAAU,QAAQ;AAAA,EACpC;AAEA,MAAI,QAAQ,SAAS,QAAQ;AAC3B,UAAM,SAAS,cAAc,OAAO;AAEpC,QACE,gBAAgB,YAAY,WACxB,OAAO,gBAAgB,YAAY,YAAY,CAAC,OAAO,SAAS,gBAAgB,OAAO,IAC3F;AACA,sBAAgB,UAAU,QAAQ;AAAA,IACpC;AAAA,EACF;AAEA,SAAO;AACT;AAEA,SAAS,+BACP,WACA,OACA;AACA,MAAI,UAAU,QAAW;AACvB,WAAO;AAAA,EACT;AAEA,MAAI,OAAO,UAAU,WAAW;AAC9B,WAAO,QAAQ,YAAY;AAAA,EAC7B;AAEA,QAAM,oBAA8B,CAAC;AAErC,aAAW,cAAc,kBAAkB;AACzC,UAAM,YAAY,MAAM,UAAU;AAElC,QAAI,CAAC,WAAW;AACd;AAAA,IACF;AAEA,sBAAkB,KAAK,eAAe,YAAY,YAAY,GAAG,UAAU,IAAI,SAAS,EAAE;AAAA,EAC5F;AAEA,SAAO,kBAAkB,SAAS,IAAI,kBAAkB,KAAK,GAAG,IAAI;AACtE;AAEA,SAAS,aAIP,UACG,UAC8F;AACjG,MAAI;AACJ,MAAI;AACJ,QAAM,iBAAiB,EAAE,GAAG,MAAM;AAClC,QAAM,uBAAuB;AAC7B,QAAM,cAAc,cAAc,GAAG,QAAQ;AAE7C,aAAW,OAAO,aAAa;AAC7B,UAAM,UAAU,YAAY,GAAG;AAC/B,QAAI,QAAQ,qBAAqB,GAAG;AAEpC,QAAI,QAAQ,YAAY,UAAa,UAAU,QAAW;AACxD,cAAQ,QAAQ;AAAA,IAClB;AAEA,UAAM,iCAAiC,sBAAsB,WAAW,QAAQ,QAAQ,kBAAkB,MAAM;AAEhH,QAAI,QAAQ,SAAS,UAAU,CAAC,gCAAgC;AAC9D,YAAM,SAAS,cAAc,OAAO;AAEpC,UAAI,CAAC,mBAAmB,KAAK,MAAM,OAAO,UAAU,YAAY,CAAC,OAAO,SAAS,KAAK,IAAI;AACxF,gBAAQ,QAAQ;AAAA,MAClB;AAAA,IACF;AAEA,QAAI,mBAAmB,KAAK,KAAK,oBAAoB,OAAO,GAAG;AAC7D,cAAQ,yBAAyB,OAAO,OAAO;AAAA,IACjD;AAEA,yBAAqB,GAAG,IAAI;AAE5B,UAAM,sBAAsB,sBAAsB,WAAW,QAAQ,QAAQ,kBAAkB,MAAM;AAErG,QAAI,EAAE,eAAe,YAAa,CAAC,QAAQ,aAAa,CAAC,qBAAsB;AAC7E;AAAA,IACF;AAEA,UAAM,gBAAgB,QAAQ,aAAa;AAE3C,WAAO,qBAAqB,GAAG;AAE/B,UAAM,sBAAsB,oBAAoB,OAAO;AAEvD,QAAI,UAAU,UAAc,mBAAmB,KAAK,KAAK,CAAC,qBAAsB;AAC9E;AAAA,IACF;AAEA,QAAI,QAAQ,SAAS,WAAW;AAC9B,2BAAqB;AAAA,QACnB;AAAA,QACA;AAAA,UACE;AAAA,UACA;AAAA,QACF;AAAA,MACF;AACA;AAAA,IACF;AAEA,UAAM,aAAa,YAAY,UAAU,QAAQ,SAAS,CAAC;AAE3D,QAAI,sBAAsB,WAAW,QAAQ,kBAAkB;AAC7D,YAAM,CAAC,gBAAgB,oBAAoB,IAAI,oBAAoB;AAAA,QACjE,WAAW;AAAA,QACX,kBAAkB,QAAQ;AAAA,QAC1B;AAAA,QACA,YAAY,QAAQ;AAAA,QACpB;AAAA,MACF,CAAC;AAED,uBAAiB,YAAY,gBAAgB,oBAAoB;AACjE,2BAAqB,WAAW,oBAAoB,cAAc;AAClE;AAAA,IACF;AAEA,QAAI,QAAQ,SAAS,QAAQ;AAC3B,2BAAqB;AAAA,QACnB;AAAA,QACA,wBAAwB;AAAA,UACtB,sBAAsB;AAAA,UACtB,WAAW;AAAA,UACX;AAAA,UACA,YAAY,QAAQ;AAAA,UACpB;AAAA,QACF,CAAC;AAAA,MACH;AACA;AAAA,IACF;AAAA,EAEF;AAEA,aAAW,OAAO,aAAa;AAC7B,QAAI,EAAE,OAAO,QAAQ;AACnB,aAAO,qBAAqB,GAAG;AAAA,IACjC;AAAA,EACF;AAEA,QAAM,kBAAkB,WAAW,oBAAoB,MAAM,SAAS,KAAK;AAC3E,QAAM,cAAc,YAAY,gBAAgB,MAAM,QAAQ,EAAE,GAAG,MAAM,MAAM,IAAI,MAAS;AAE5F,MAAI,iBAAiB;AACnB,mBAAe,YAAY;AAAA,EAC7B,OAAO;AACL,WAAO,eAAe;AAAA,EACxB;AAEA,MAAI,aAAa;AACf,mBAAe,QAAQ;AAAA,EACzB,OAAO;AACL,WAAO,eAAe;AAAA,EACxB;AAEA,SAAO;AAIT;",
+  "names": []
+}

package/dist/_internal/helpers/getMarginStyles.cjs

@@ -0,0 +1,82 @@
+"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);
+var getMarginStyles_exports = {};
+__export(getMarginStyles_exports, {
+  getMarginStyles: () => getMarginStyles
+});
+module.exports = __toCommonJS(getMarginStyles_exports);
+var import_classnames = __toESM(require("classnames"), 1);
+var import_getResponsiveStyles = require("./getResponsiveStyles");
+var import_mergeStyles = require("./mergeStyles");
+var import_margin = require("../props/margin.prop");
+const marginValues = import_margin.marginPropDef.margin.values;
+const directionalDefs = [
+  { key: "m", className: "dsx-r-m", customProperty: "--dsx-r-m" },
+  { key: "mx", className: "dsx-r-mx", customProperty: "--dsx-r-mx" },
+  { key: "my", className: "dsx-r-my", customProperty: "--dsx-r-my" },
+  { key: "mt", className: "dsx-r-mt", customProperty: "--dsx-r-mt" },
+  { key: "mr", className: "dsx-r-mr", customProperty: "--dsx-r-mr" },
+  { key: "mb", className: "dsx-r-mb", customProperty: "--dsx-r-mb" },
+  { key: "ml", className: "dsx-r-ml", customProperty: "--dsx-r-ml" }
+];
+function getMarginStyles(props) {
+  const allClassNames = [];
+  let allCustomProperties = {};
+  for (const { key, className, customProperty } of directionalDefs) {
+    const value = props[key];
+    if (value === void 0) continue;
+    const [propClassNames, propCustomProperties] = (0, import_getResponsiveStyles.getResponsiveStyles)({
+      className,
+      customProperties: [customProperty],
+      propValues: marginValues,
+      value
+    });
+    if (propClassNames) allClassNames.push(propClassNames);
+    if (propCustomProperties) {
+      allCustomProperties = { ...allCustomProperties, ...propCustomProperties };
+    }
+  }
+  if (props.margin !== void 0) {
+    const [marginClassNames, marginCustomProperties] = (0, import_getResponsiveStyles.getResponsiveStyles)({
+      className: "rt-r-margin",
+      customProperties: ["--dsx-r-margin"],
+      propValues: marginValues,
+      value: props.margin
+    });
+    if (marginClassNames) allClassNames.push(marginClassNames);
+    if (marginCustomProperties) {
+      allCustomProperties = { ...allCustomProperties, ...marginCustomProperties };
+    }
+  }
+  return [
+    (0, import_classnames.default)(...allClassNames.filter(Boolean)),
+    (0, import_mergeStyles.mergeStyles)(Object.keys(allCustomProperties).length > 0 ? allCustomProperties : void 0)
+  ];
+}
+//# sourceMappingURL=getMarginStyles.cjs.map

package/dist/_internal/helpers/getMarginStyles.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/_internal/helpers/getMarginStyles.ts"],
+  "sourcesContent": ["import classNames from 'classnames';\n\nimport { getResponsiveStyles } from './getResponsiveStyles';\nimport { mergeStyles } from './mergeStyles';\nimport { marginPropDef } from '../props/margin.prop';\n\nimport type { MarginProps } from '../props/margin.prop';\nimport type { Responsive } from '../props/propDef';\n\nconst marginValues = marginPropDef.margin.values;\n\ninterface DirectionalDef {\n  key: keyof MarginProps;\n  className: string;\n  customProperty: `--${string}`;\n}\n\nconst directionalDefs: DirectionalDef[] = [\n  { key: 'm', className: 'dsx-r-m', customProperty: '--dsx-r-m' },\n  { key: 'mx', className: 'dsx-r-mx', customProperty: '--dsx-r-mx' },\n  { key: 'my', className: 'dsx-r-my', customProperty: '--dsx-r-my' },\n  { key: 'mt', className: 'dsx-r-mt', customProperty: '--dsx-r-mt' },\n  { key: 'mr', className: 'dsx-r-mr', customProperty: '--dsx-r-mr' },\n  { key: 'mb', className: 'dsx-r-mb', customProperty: '--dsx-r-mb' },\n  { key: 'ml', className: 'dsx-r-ml', customProperty: '--dsx-r-ml' },\n];\n\nexport function getMarginStyles(props: MarginProps) {\n  const allClassNames: string[] = [];\n  let allCustomProperties: Record<string, string | number | undefined> = {};\n\n  for (const { key, className, customProperty } of directionalDefs) {\n    const value = props[key];\n    if (value === undefined) continue;\n\n    const [propClassNames, propCustomProperties] = getResponsiveStyles({\n      className,\n      customProperties: [customProperty],\n      propValues: marginValues,\n      value: value as Responsive<string>,\n    });\n\n    if (propClassNames) allClassNames.push(propClassNames);\n    if (propCustomProperties) {\n      allCustomProperties = { ...allCustomProperties, ...propCustomProperties };\n    }\n  }\n\n  if (props.margin !== undefined) {\n    const [marginClassNames, marginCustomProperties] = getResponsiveStyles({\n      className: 'rt-r-margin',\n      customProperties: ['--dsx-r-margin'],\n      propValues: marginValues,\n      value: props.margin as Responsive<string> | undefined,\n    });\n\n    if (marginClassNames) allClassNames.push(marginClassNames);\n    if (marginCustomProperties) {\n      allCustomProperties = { ...allCustomProperties, ...marginCustomProperties };\n    }\n  }\n\n  return [\n    classNames(...allClassNames.filter(Boolean)),\n    mergeStyles(Object.keys(allCustomProperties).length > 0 ? allCustomProperties : undefined),\n  ] as const;\n}\n\n\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAuB;AAEvB,iCAAoC;AACpC,yBAA4B;AAC5B,oBAA8B;AAK9B,MAAM,eAAe,4BAAc,OAAO;AAQ1C,MAAM,kBAAoC;AAAA,EACxC,EAAE,KAAK,KAAK,WAAW,WAAW,gBAAgB,YAAY;AAAA,EAC9D,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AACnE;AAEO,SAAS,gBAAgB,OAAoB;AAClD,QAAM,gBAA0B,CAAC;AACjC,MAAI,sBAAmE,CAAC;AAExE,aAAW,EAAE,KAAK,WAAW,eAAe,KAAK,iBAAiB;AAChE,UAAM,QAAQ,MAAM,GAAG;AACvB,QAAI,UAAU,OAAW;AAEzB,UAAM,CAAC,gBAAgB,oBAAoB,QAAI,gDAAoB;AAAA,MACjE;AAAA,MACA,kBAAkB,CAAC,cAAc;AAAA,MACjC,YAAY;AAAA,MACZ;AAAA,IACF,CAAC;AAED,QAAI,eAAgB,eAAc,KAAK,cAAc;AACrD,QAAI,sBAAsB;AACxB,4BAAsB,EAAE,GAAG,qBAAqB,GAAG,qBAAqB;AAAA,IAC1E;AAAA,EACF;AAEA,MAAI,MAAM,WAAW,QAAW;AAC9B,UAAM,CAAC,kBAAkB,sBAAsB,QAAI,gDAAoB;AAAA,MACrE,WAAW;AAAA,MACX,kBAAkB,CAAC,gBAAgB;AAAA,MACnC,YAAY;AAAA,MACZ,OAAO,MAAM;AAAA,IACf,CAAC;AAED,QAAI,iBAAkB,eAAc,KAAK,gBAAgB;AACzD,QAAI,wBAAwB;AAC1B,4BAAsB,EAAE,GAAG,qBAAqB,GAAG,uBAAuB;AAAA,IAC5E;AAAA,EACF;AAEA,SAAO;AAAA,QACL,kBAAAA,SAAW,GAAG,cAAc,OAAO,OAAO,CAAC;AAAA,QAC3C,gCAAY,OAAO,KAAK,mBAAmB,EAAE,SAAS,IAAI,sBAAsB,MAAS;AAAA,EAC3F;AACF;",
+  "names": ["classNames"]
+}

package/dist/_internal/helpers/getMarginStyles.d.cts

@@ -0,0 +1,3 @@
+import type { MarginProps } from '../props/margin.prop.cjs';
+export declare function getMarginStyles(props: MarginProps): readonly [string, (import("react").CSSProperties & Record<`--${string}`, string | number | undefined>) | undefined];
+//# sourceMappingURL=getMarginStyles.d.cts.map

package/dist/_internal/helpers/getMarginStyles.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getMarginStyles.d.cts","sourceRoot":"","sources":["../../../src/_internal/helpers/getMarginStyles.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAqBxD,wBAAgB,eAAe,CAAC,KAAK,EAAE,WAAW,uHAuCjD"}

package/dist/_internal/helpers/getMarginStyles.d.mts

@@ -0,0 +1,3 @@
+import type { MarginProps } from '../props/margin.prop.js';
+export declare function getMarginStyles(props: MarginProps): readonly [string, (import("react").CSSProperties & Record<`--${string}`, string | number | undefined>) | undefined];
+//# sourceMappingURL=getMarginStyles.d.mts.map

package/dist/_internal/helpers/getMarginStyles.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getMarginStyles.d.mts","sourceRoot":"","sources":["../../../src/_internal/helpers/getMarginStyles.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAqBxD,wBAAgB,eAAe,CAAC,KAAK,EAAE,WAAW,uHAuCjD"}

package/dist/_internal/helpers/getMarginStyles.d.ts

@@ -0,0 +1,3 @@
+import type { MarginProps } from '../props/margin.prop.js';
+export declare function getMarginStyles(props: MarginProps): readonly [string, (import("react").CSSProperties & Record<`--${string}`, string | number | undefined>) | undefined];
+//# sourceMappingURL=getMarginStyles.d.ts.map

package/dist/_internal/helpers/getMarginStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getMarginStyles.d.ts","sourceRoot":"","sources":["../../../src/_internal/helpers/getMarginStyles.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAqBxD,wBAAgB,eAAe,CAAC,KAAK,EAAE,WAAW,uHAuCjD"}

package/dist/_internal/helpers/getMarginStyles.js

@@ -0,0 +1,52 @@
+import classNames from "classnames";
+import { getResponsiveStyles } from "./getResponsiveStyles.js";
+import { mergeStyles } from "./mergeStyles.js";
+import { marginPropDef } from "../props/margin.prop.js";
+const marginValues = marginPropDef.margin.values;
+const directionalDefs = [
+  { key: "m", className: "dsx-r-m", customProperty: "--dsx-r-m" },
+  { key: "mx", className: "dsx-r-mx", customProperty: "--dsx-r-mx" },
+  { key: "my", className: "dsx-r-my", customProperty: "--dsx-r-my" },
+  { key: "mt", className: "dsx-r-mt", customProperty: "--dsx-r-mt" },
+  { key: "mr", className: "dsx-r-mr", customProperty: "--dsx-r-mr" },
+  { key: "mb", className: "dsx-r-mb", customProperty: "--dsx-r-mb" },
+  { key: "ml", className: "dsx-r-ml", customProperty: "--dsx-r-ml" }
+];
+function getMarginStyles(props) {
+  const allClassNames = [];
+  let allCustomProperties = {};
+  for (const { key, className, customProperty } of directionalDefs) {
+    const value = props[key];
+    if (value === void 0) continue;
+    const [propClassNames, propCustomProperties] = getResponsiveStyles({
+      className,
+      customProperties: [customProperty],
+      propValues: marginValues,
+      value
+    });
+    if (propClassNames) allClassNames.push(propClassNames);
+    if (propCustomProperties) {
+      allCustomProperties = { ...allCustomProperties, ...propCustomProperties };
+    }
+  }
+  if (props.margin !== void 0) {
+    const [marginClassNames, marginCustomProperties] = getResponsiveStyles({
+      className: "rt-r-margin",
+      customProperties: ["--dsx-r-margin"],
+      propValues: marginValues,
+      value: props.margin
+    });
+    if (marginClassNames) allClassNames.push(marginClassNames);
+    if (marginCustomProperties) {
+      allCustomProperties = { ...allCustomProperties, ...marginCustomProperties };
+    }
+  }
+  return [
+    classNames(...allClassNames.filter(Boolean)),
+    mergeStyles(Object.keys(allCustomProperties).length > 0 ? allCustomProperties : void 0)
+  ];
+}
+export {
+  getMarginStyles
+};
+//# sourceMappingURL=getMarginStyles.js.map

package/dist/_internal/helpers/getMarginStyles.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/_internal/helpers/getMarginStyles.ts"],
+  "sourcesContent": ["import classNames from 'classnames';\n\nimport { getResponsiveStyles } from './getResponsiveStyles';\nimport { mergeStyles } from './mergeStyles';\nimport { marginPropDef } from '../props/margin.prop';\n\nimport type { MarginProps } from '../props/margin.prop';\nimport type { Responsive } from '../props/propDef';\n\nconst marginValues = marginPropDef.margin.values;\n\ninterface DirectionalDef {\n  key: keyof MarginProps;\n  className: string;\n  customProperty: `--${string}`;\n}\n\nconst directionalDefs: DirectionalDef[] = [\n  { key: 'm', className: 'dsx-r-m', customProperty: '--dsx-r-m' },\n  { key: 'mx', className: 'dsx-r-mx', customProperty: '--dsx-r-mx' },\n  { key: 'my', className: 'dsx-r-my', customProperty: '--dsx-r-my' },\n  { key: 'mt', className: 'dsx-r-mt', customProperty: '--dsx-r-mt' },\n  { key: 'mr', className: 'dsx-r-mr', customProperty: '--dsx-r-mr' },\n  { key: 'mb', className: 'dsx-r-mb', customProperty: '--dsx-r-mb' },\n  { key: 'ml', className: 'dsx-r-ml', customProperty: '--dsx-r-ml' },\n];\n\nexport function getMarginStyles(props: MarginProps) {\n  const allClassNames: string[] = [];\n  let allCustomProperties: Record<string, string | number | undefined> = {};\n\n  for (const { key, className, customProperty } of directionalDefs) {\n    const value = props[key];\n    if (value === undefined) continue;\n\n    const [propClassNames, propCustomProperties] = getResponsiveStyles({\n      className,\n      customProperties: [customProperty],\n      propValues: marginValues,\n      value: value as Responsive<string>,\n    });\n\n    if (propClassNames) allClassNames.push(propClassNames);\n    if (propCustomProperties) {\n      allCustomProperties = { ...allCustomProperties, ...propCustomProperties };\n    }\n  }\n\n  if (props.margin !== undefined) {\n    const [marginClassNames, marginCustomProperties] = getResponsiveStyles({\n      className: 'rt-r-margin',\n      customProperties: ['--dsx-r-margin'],\n      propValues: marginValues,\n      value: props.margin as Responsive<string> | undefined,\n    });\n\n    if (marginClassNames) allClassNames.push(marginClassNames);\n    if (marginCustomProperties) {\n      allCustomProperties = { ...allCustomProperties, ...marginCustomProperties };\n    }\n  }\n\n  return [\n    classNames(...allClassNames.filter(Boolean)),\n    mergeStyles(Object.keys(allCustomProperties).length > 0 ? allCustomProperties : undefined),\n  ] as const;\n}\n\n\n"],
+  "mappings": "AAAA,OAAO,gBAAgB;AAEvB,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAK9B,MAAM,eAAe,cAAc,OAAO;AAQ1C,MAAM,kBAAoC;AAAA,EACxC,EAAE,KAAK,KAAK,WAAW,WAAW,gBAAgB,YAAY;AAAA,EAC9D,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AAAA,EACjE,EAAE,KAAK,MAAM,WAAW,YAAY,gBAAgB,aAAa;AACnE;AAEO,SAAS,gBAAgB,OAAoB;AAClD,QAAM,gBAA0B,CAAC;AACjC,MAAI,sBAAmE,CAAC;AAExE,aAAW,EAAE,KAAK,WAAW,eAAe,KAAK,iBAAiB;AAChE,UAAM,QAAQ,MAAM,GAAG;AACvB,QAAI,UAAU,OAAW;AAEzB,UAAM,CAAC,gBAAgB,oBAAoB,IAAI,oBAAoB;AAAA,MACjE;AAAA,MACA,kBAAkB,CAAC,cAAc;AAAA,MACjC,YAAY;AAAA,MACZ;AAAA,IACF,CAAC;AAED,QAAI,eAAgB,eAAc,KAAK,cAAc;AACrD,QAAI,sBAAsB;AACxB,4BAAsB,EAAE,GAAG,qBAAqB,GAAG,qBAAqB;AAAA,IAC1E;AAAA,EACF;AAEA,MAAI,MAAM,WAAW,QAAW;AAC9B,UAAM,CAAC,kBAAkB,sBAAsB,IAAI,oBAAoB;AAAA,MACrE,WAAW;AAAA,MACX,kBAAkB,CAAC,gBAAgB;AAAA,MACnC,YAAY;AAAA,MACZ,OAAO,MAAM;AAAA,IACf,CAAC;AAED,QAAI,iBAAkB,eAAc,KAAK,gBAAgB;AACzD,QAAI,wBAAwB;AAC1B,4BAAsB,EAAE,GAAG,qBAAqB,GAAG,uBAAuB;AAAA,IAC5E;AAAA,EACF;AAEA,SAAO;AAAA,IACL,WAAW,GAAG,cAAc,OAAO,OAAO,CAAC;AAAA,IAC3C,YAAY,OAAO,KAAK,mBAAmB,EAAE,SAAS,IAAI,sBAAsB,MAAS;AAAA,EAC3F;AACF;",
+  "names": []
+}

package/dist/_internal/helpers/getMatchingGrayColor.cjs

@@ -0,0 +1,62 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var getMatchingGrayColor_exports = {};
+__export(getMatchingGrayColor_exports, {
+  getMatchingGrayColor: () => getMatchingGrayColor
+});
+module.exports = __toCommonJS(getMatchingGrayColor_exports);
+function getMatchingGrayColor(accentColor) {
+  switch (accentColor) {
+    case "tomato":
+    case "red":
+    case "ruby":
+    case "crimson":
+    case "pink":
+    case "plum":
+    case "purple":
+    case "violet":
+      return "mauve";
+    case "iris":
+    case "indigo":
+    case "blue":
+    case "sky":
+    case "cyan":
+      return "slate";
+    case "teal":
+    case "jade":
+    case "mint":
+    case "green":
+      return "sage";
+    case "grass":
+    case "lime":
+      return "olive";
+    case "yellow":
+    case "rift":
+    case "orange":
+    case "brown":
+    case "gold":
+    case "ray":
+      return "sand";
+    case "gray":
+      return "gray";
+    default:
+      return "gray";
+  }
+}
+//# sourceMappingURL=getMatchingGrayColor.cjs.map

package/dist/_internal/helpers/getMatchingGrayColor.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/_internal/helpers/getMatchingGrayColor.ts"],
+  "sourcesContent": ["type ThemeAccentColor = string;\n\nexport function getMatchingGrayColor(accentColor: ThemeAccentColor) {\n  switch (accentColor) {\n    case 'tomato':\n    case 'red':\n    case 'ruby':\n    case 'crimson':\n    case 'pink':\n    case 'plum':\n    case 'purple':\n    case 'violet':\n      return 'mauve';\n    case 'iris':\n    case 'indigo':\n    case 'blue':\n    case 'sky':\n    case 'cyan':\n      return 'slate';\n    case 'teal':\n    case 'jade':\n    case 'mint':\n    case 'green':\n      return 'sage';\n    case 'grass':\n    case 'lime':\n      return 'olive';\n    case 'yellow':\n    case 'rift':\n    case 'orange':\n    case 'brown':\n    case 'gold':\n    case 'ray':\n      return 'sand';\n    case 'gray':\n      return 'gray';\n    default:\n      return 'gray';\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEO,SAAS,qBAAqB,aAA+B;AAClE,UAAQ,aAAa;AAAA,IACnB,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;",
+  "names": []
+}

package/dist/_internal/helpers/getMatchingGrayColor.d.cts

@@ -0,0 +1,4 @@
+type ThemeAccentColor = string;
+export declare function getMatchingGrayColor(accentColor: ThemeAccentColor): "gray" | "olive" | "mauve" | "slate" | "sage" | "sand";
+export {};
+//# sourceMappingURL=getMatchingGrayColor.d.cts.map

package/dist/_internal/helpers/getMatchingGrayColor.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getMatchingGrayColor.d.cts","sourceRoot":"","sources":["../../../src/_internal/helpers/getMatchingGrayColor.ts"],"names":[],"mappings":"AAAA,KAAK,gBAAgB,GAAG,MAAM,CAAC;AAE/B,wBAAgB,oBAAoB,CAAC,WAAW,EAAE,gBAAgB,0DAqCjE"}

package/dist/_internal/helpers/getMatchingGrayColor.d.mts

@@ -0,0 +1,4 @@
+type ThemeAccentColor = string;
+export declare function getMatchingGrayColor(accentColor: ThemeAccentColor): "gray" | "olive" | "mauve" | "slate" | "sage" | "sand";
+export {};
+//# sourceMappingURL=getMatchingGrayColor.d.mts.map

package/dist/_internal/helpers/getMatchingGrayColor.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getMatchingGrayColor.d.mts","sourceRoot":"","sources":["../../../src/_internal/helpers/getMatchingGrayColor.ts"],"names":[],"mappings":"AAAA,KAAK,gBAAgB,GAAG,MAAM,CAAC;AAE/B,wBAAgB,oBAAoB,CAAC,WAAW,EAAE,gBAAgB,0DAqCjE"}

package/dist/_internal/helpers/getMatchingGrayColor.d.ts

@@ -0,0 +1,4 @@
+type ThemeAccentColor = string;
+export declare function getMatchingGrayColor(accentColor: ThemeAccentColor): "gray" | "olive" | "mauve" | "slate" | "sage" | "sand";
+export {};
+//# sourceMappingURL=getMatchingGrayColor.d.ts.map

package/dist/_internal/helpers/getMatchingGrayColor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getMatchingGrayColor.d.ts","sourceRoot":"","sources":["../../../src/_internal/helpers/getMatchingGrayColor.ts"],"names":[],"mappings":"AAAA,KAAK,gBAAgB,GAAG,MAAM,CAAC;AAE/B,wBAAgB,oBAAoB,CAAC,WAAW,EAAE,gBAAgB,0DAqCjE"}

package/dist/_internal/helpers/getMatchingGrayColor.js

@@ -0,0 +1,42 @@
+function getMatchingGrayColor(accentColor) {
+  switch (accentColor) {
+    case "tomato":
+    case "red":
+    case "ruby":
+    case "crimson":
+    case "pink":
+    case "plum":
+    case "purple":
+    case "violet":
+      return "mauve";
+    case "iris":
+    case "indigo":
+    case "blue":
+    case "sky":
+    case "cyan":
+      return "slate";
+    case "teal":
+    case "jade":
+    case "mint":
+    case "green":
+      return "sage";
+    case "grass":
+    case "lime":
+      return "olive";
+    case "yellow":
+    case "rift":
+    case "orange":
+    case "brown":
+    case "gold":
+    case "ray":
+      return "sand";
+    case "gray":
+      return "gray";
+    default:
+      return "gray";
+  }
+}
+export {
+  getMatchingGrayColor
+};
+//# sourceMappingURL=getMatchingGrayColor.js.map

package/dist/_internal/helpers/getMatchingGrayColor.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/_internal/helpers/getMatchingGrayColor.ts"],
+  "sourcesContent": ["type ThemeAccentColor = string;\n\nexport function getMatchingGrayColor(accentColor: ThemeAccentColor) {\n  switch (accentColor) {\n    case 'tomato':\n    case 'red':\n    case 'ruby':\n    case 'crimson':\n    case 'pink':\n    case 'plum':\n    case 'purple':\n    case 'violet':\n      return 'mauve';\n    case 'iris':\n    case 'indigo':\n    case 'blue':\n    case 'sky':\n    case 'cyan':\n      return 'slate';\n    case 'teal':\n    case 'jade':\n    case 'mint':\n    case 'green':\n      return 'sage';\n    case 'grass':\n    case 'lime':\n      return 'olive';\n    case 'yellow':\n    case 'rift':\n    case 'orange':\n    case 'brown':\n    case 'gold':\n    case 'ray':\n      return 'sand';\n    case 'gray':\n      return 'gray';\n    default:\n      return 'gray';\n  }\n}\n"],
+  "mappings": "AAEO,SAAS,qBAAqB,aAA+B;AAClE,UAAQ,aAAa;AAAA,IACnB,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;",
+  "names": []
+}

package/dist/_internal/helpers/getResponsiveStyles.cjs

@@ -0,0 +1,139 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var getResponsiveStyles_exports = {};
+__export(getResponsiveStyles_exports, {
+  getResponsiveClassNames: () => getResponsiveClassNames,
+  getResponsiveCustomProperties: () => getResponsiveCustomProperties,
+  getResponsiveStyles: () => getResponsiveStyles,
+  isResponsiveObject: () => isResponsiveObject
+});
+module.exports = __toCommonJS(getResponsiveStyles_exports);
+var import_propDef = require("../props/propDef");
+function hasOwnProperty(object, key) {
+  return Object.prototype.hasOwnProperty.call(object, key);
+}
+function isResponsiveObject(value) {
+  return Boolean(value) && typeof value === "object" && !Array.isArray(value);
+}
+function getResponsiveStyles({ className, customProperties, ...args }) {
+  const responsiveClassNames = getResponsiveClassNames({
+    allowArbitraryValues: true,
+    className,
+    ...args
+  });
+  const responsiveCustomProperties = getResponsiveCustomProperties({
+    customProperties,
+    ...args
+  });
+  return [responsiveClassNames, responsiveCustomProperties];
+}
+function getResponsiveClassNames({
+  allowArbitraryValues,
+  value,
+  className,
+  propValues
+}) {
+  if (!className) {
+    return void 0;
+  }
+  const classNames = [];
+  if (value === void 0) {
+    return void 0;
+  }
+  if (typeof value === "string" && propValues.includes(value)) {
+    return getBaseClassName(className, value);
+  }
+  if (isResponsiveObject(value)) {
+    for (const breakpoint of import_propDef.breakpointsArray) {
+      if (!hasOwnProperty(value, breakpoint) || !import_propDef.breakpoints.has(breakpoint)) {
+        continue;
+      }
+      const nextValue = value[breakpoint];
+      if (nextValue === void 0) {
+        continue;
+      }
+      if (propValues.includes(nextValue)) {
+        const baseClassName = getBaseClassName(className, nextValue);
+        classNames.push(breakpoint === "initial" ? baseClassName : `${breakpoint}:${baseClassName}`);
+        continue;
+      }
+      if (allowArbitraryValues) {
+        classNames.push(breakpoint === "initial" ? className : `${breakpoint}:${className}`);
+      }
+    }
+    return classNames.length > 0 ? classNames.join(" ") : void 0;
+  }
+  if (allowArbitraryValues && typeof value === "string") {
+    return className;
+  }
+  return void 0;
+}
+function getUtilityClassValue(value) {
+  if (value === "none") {
+    return "0";
+  }
+  return value.split("_").join("-");
+}
+function getBaseClassName(className, value) {
+  const delimiter = className ? "-" : "";
+  const normalizedValue = getUtilityClassValue(value);
+  const isNegative = normalizedValue.startsWith("-");
+  const minus = isNegative ? "-" : "";
+  const absoluteValue = isNegative ? normalizedValue.slice(1) : normalizedValue;
+  return `${minus}${className}${delimiter}${absoluteValue}`;
+}
+function getResponsiveCustomProperties({
+  customProperties,
+  value,
+  propValues,
+  parseValue = (nextValue) => nextValue
+}) {
+  let styles = {};
+  if (value === void 0) {
+    return void 0;
+  }
+  const assignResponsiveValue = (breakpoint, nextValue) => {
+    const resolvedValue = parseValue(nextValue) ?? nextValue;
+    for (const customProperty of customProperties) {
+      const propertyName = breakpoint === "initial" ? customProperty : `${customProperty}-${breakpoint}`;
+      styles = {
+        ...styles,
+        [propertyName]: resolvedValue
+      };
+    }
+  };
+  if (typeof value === "string") {
+    if (!propValues.includes(value)) {
+      assignResponsiveValue("initial", value);
+    }
+  }
+  if (isResponsiveObject(value)) {
+    for (const breakpoint of import_propDef.breakpointsArray) {
+      if (!hasOwnProperty(value, breakpoint) || !import_propDef.breakpoints.has(breakpoint)) {
+        continue;
+      }
+      const nextValue = value[breakpoint];
+      if (nextValue !== void 0 && !propValues.includes(nextValue)) {
+        assignResponsiveValue(breakpoint, nextValue);
+      }
+    }
+  }
+  return Object.keys(styles).length > 0 ? styles : void 0;
+}
+//# sourceMappingURL=getResponsiveStyles.cjs.map