@dynatrace/strato-components 0.84.42 → 0.84.51

package/styles/getFlexStyles.js

@@ -0,0 +1,95 @@
+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 getFlexStyles_exports = {};
+__export(getFlexStyles_exports, {
+  getFlexStyles: () => getFlexStyles
+});
+module.exports = __toCommonJS(getFlexStyles_exports);
+var import_clsx = __toESM(require("clsx"));
+var import_extract_util = require("./extract-util.js");
+var import_getGapSprinkles = require("./getGapSprinkles.js");
+var import_getGridFlexPositionSprinkles = require("./getGridFlexPositionSprinkles.js");
+var import_getLayoutSizeStyles = require("./getLayoutSizeStyles.js");
+var import_getSpacingSprinkles = require("./getSpacingSprinkles.js");
+var import_safe_sprinkles = require("./safe-sprinkles.js");
+const flexItemPropKeys = ["flexItem"];
+const flexStylePropKeys = [
+  /* Flex item props */
+  "order",
+  "flexGrow",
+  "flexShrink",
+  "flexBasis",
+  "flex",
+  /* Grid container props */
+  "flexDirection",
+  "flexWrap",
+  "flexFlow",
+  /* Grid item props */
+  "gridColumnStart",
+  "gridColumnEnd",
+  "gridRowStart",
+  "gridRowEnd",
+  "gridColumn",
+  "gridRow",
+  "gridArea"
+];
+function extractFlexItem(props) {
+  const { extracted, rest } = (0, import_extract_util.extract)(props, flexItemPropKeys);
+  return { extracted, rest };
+}
+function getFlexStyles(props, defaults = {}) {
+  const { extracted: additionalFlexStyles, rest } = (0, import_extract_util.extract)(
+    props,
+    flexStylePropKeys
+  );
+  const [sizeStyles, afterSizeExtraction] = (0, import_getLayoutSizeStyles.getLayoutSizeStyles)(rest, defaults);
+  const [gridFlexClassNames, gridFlexRemainingProps] = (0, import_getGridFlexPositionSprinkles.getGridFlexPositionSprinkles)(afterSizeExtraction, defaults);
+  const [spacingClassNames, spacingRemainingProps] = (0, import_getSpacingSprinkles.getSpacingSprinkles)(
+    gridFlexRemainingProps,
+    defaults
+  );
+  const [gapClassNames, gapRemainingProps] = (0, import_getGapSprinkles.getGapSprinkles)(
+    spacingRemainingProps,
+    defaults
+  );
+  const { extracted: flexItemProps, rest: remainingProps } = extractFlexItem(gapRemainingProps);
+  const flexItemClassName = flexItemProps.flexItem ? void 0 : (0, import_safe_sprinkles.globalSprinkles)({ display: "flex" });
+  return [
+    (0, import_clsx.default)(
+      gridFlexClassNames,
+      spacingClassNames,
+      gapClassNames,
+      flexItemClassName
+    ),
+    {
+      ...sizeStyles,
+      ...additionalFlexStyles
+    },
+    remainingProps
+  ];
+}

package/styles/getGapSprinkles.d.ts

@@ -0,0 +1,19 @@
+import { type SpacingProperties } from './sprinkle-properties.js';
+/**
+ * Defines the box gap props.
+ * @public
+ */
+export interface GapProps {
+    /** Defines gap */
+    gap?: SpacingProperties;
+    /** Defines row gap */
+    rowGap?: SpacingProperties;
+    /** Defines column gap */
+    columnGap?: SpacingProperties;
+}
+/**
+ * Given a set of props will return the relevant class names for the gap sprinkles
+ * and the remaining props.
+ * @internal
+ */
+export declare function getGapSprinkles<T extends GapProps>(props: T, defaults?: Partial<GapProps>): [className: string, remainingProps: Omit<T, keyof GapProps>];

package/styles/getGapSprinkles.js

@@ -0,0 +1,36 @@
+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 getGapSprinkles_exports = {};
+__export(getGapSprinkles_exports, {
+  getGapSprinkles: () => getGapSprinkles
+});
+module.exports = __toCommonJS(getGapSprinkles_exports);
+var import_extract_util = require("./extract-util.js");
+var import_safe_sprinkles = require("./safe-sprinkles.js");
+const gapPropKeys = ["gap", "rowGap", "columnGap"];
+function getGapSprinkles(props, defaults = {}) {
+  const { extracted, rest } = (0, import_extract_util.extract)(props, gapPropKeys);
+  const { extracted: extractedDefaults } = (0, import_extract_util.extract)(defaults, gapPropKeys);
+  return [
+    (0, import_safe_sprinkles.globalSprinkles)({
+      ...extractedDefaults,
+      ...extracted
+    }),
+    rest
+  ];
+}

package/styles/getGridFlexPositionSprinkles.d.ts

@@ -0,0 +1,35 @@
+import { AlignContentPositionProps, AlignItemsPositionProps, AlignSelfPositionProps, JustifyContentPositionProps, JustifyItemsPositionProps, JustifySelfPositionProps, PlaceContentPositionProps, PlaceItemsPositionProps, PlaceSelfPositionProps } from './sprinkle-properties.js';
+/**
+ * Defines the grid flex positions props.
+ * @public
+ */
+export interface GridFlexPositionProps {
+    /** justify self positions */
+    justifySelf?: JustifySelfPositionProps;
+    /** align self positions */
+    alignSelf?: AlignSelfPositionProps;
+    /** place self positions */
+    placeSelf?: PlaceSelfPositionProps;
+    /** justify items positions */
+    justifyItems?: JustifyItemsPositionProps;
+    /** align items positions */
+    alignItems?: AlignItemsPositionProps;
+    /** place items positions */
+    placeItems?: PlaceItemsPositionProps;
+    /** justify content positions */
+    justifyContent?: JustifyContentPositionProps;
+    /** align content positions */
+    alignContent?: AlignContentPositionProps;
+    /** place content positions */
+    placeContent?: PlaceContentPositionProps;
+}
+/**
+ * Given a set of props, this function will extract the sprinkles props for
+ * Grid/Flex Position spinkles and return the appropriate
+ * classnames as well as the remaining props.
+ * @internal
+ * */
+export declare function getGridFlexPositionSprinkles<T extends GridFlexPositionProps>(props: T, defaults?: Partial<GridFlexPositionProps>): [
+    sprinklesClassNames: string,
+    remainingProps: Omit<T, keyof GridFlexPositionProps>
+];

package/styles/getGridFlexPositionSprinkles.js

@@ -0,0 +1,43 @@
+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 getGridFlexPositionSprinkles_exports = {};
+__export(getGridFlexPositionSprinkles_exports, {
+  getGridFlexPositionSprinkles: () => getGridFlexPositionSprinkles
+});
+module.exports = __toCommonJS(getGridFlexPositionSprinkles_exports);
+var import_extract_util = require("./extract-util.js");
+var import_safe_sprinkles = require("./safe-sprinkles.js");
+const gridFlexPositionPropKeys = [
+  "justifySelf",
+  "alignSelf",
+  "placeSelf",
+  "justifyItems",
+  "alignItems",
+  "placeItems",
+  "justifyContent",
+  "alignContent",
+  "placeContent"
+];
+function getGridFlexPositionSprinkles(props, defaults = {}) {
+  const { extracted, rest } = (0, import_extract_util.extract)(props, gridFlexPositionPropKeys);
+  const { extracted: extractedDefaults } = (0, import_extract_util.extract)(
+    defaults,
+    gridFlexPositionPropKeys
+  );
+  return [(0, import_safe_sprinkles.globalSprinkles)({ ...extractedDefaults, ...extracted }), rest];
+}

package/styles/getGridStyles.d.ts

@@ -0,0 +1,74 @@
+import React from 'react';
+import { type GapProps } from './getGapSprinkles.js';
+import { type GridFlexPositionProps } from './getGridFlexPositionSprinkles.js';
+import { type LayoutSizeProps } from './getLayoutSizeStyles.js';
+import { type SpacingProps } from './getSpacingSprinkles.js';
+/**
+ * Defines the grid item props.
+ * @public
+ */
+export interface GridItemStyleProps {
+    /**
+     * Determines whether this is a grid item.
+     * If true, display: 'grid' style will not be added.
+     */
+    gridItem?: boolean;
+}
+/**
+ * Defines the grid style props.
+ * @public
+ */
+export interface GridStyleProps extends GridFlexPositionProps, GapProps, LayoutSizeProps, SpacingProps, GridItemStyleProps {
+    /** Defines order */
+    order?: React.CSSProperties['order'];
+    /** Defines flex grow */
+    flexGrow?: React.CSSProperties['flexGrow'];
+    /** Defines flex shrink */
+    flexShrink?: React.CSSProperties['flexShrink'];
+    /** Defines flex basis */
+    flexBasis?: React.CSSProperties['flexBasis'];
+    /** Defines flex */
+    flex?: React.CSSProperties['flex'];
+    /** Defines grid template columns */
+    gridTemplateColumns?: React.CSSProperties['gridTemplateColumns'];
+    /** Defines grid template rows */
+    gridTemplateRows?: React.CSSProperties['gridTemplateRows'];
+    /** Defines grid template areas */
+    gridTemplateAreas?: React.CSSProperties['gridTemplateAreas'];
+    /** Defines grid template */
+    gridTemplate?: React.CSSProperties['gridTemplate'];
+    /** Defines grid auto columns */
+    gridAutoColumns?: React.CSSProperties['gridAutoColumns'];
+    /** Defines grid auto rows */
+    gridAutoRows?: React.CSSProperties['gridAutoRows'];
+    /** Defines grid auto flow */
+    gridAutoFlow?: React.CSSProperties['gridAutoFlow'];
+    /** Defines grid */
+    grid?: React.CSSProperties['grid'];
+    /** Defines grid column start */
+    gridColumnStart?: React.CSSProperties['gridColumnStart'];
+    /** Defines grid column end */
+    gridColumnEnd?: React.CSSProperties['gridColumnEnd'];
+    /** Defines grid row start */
+    gridRowStart?: React.CSSProperties['gridRowStart'];
+    /** Defines grid row end */
+    gridRowEnd?: React.CSSProperties['gridRowEnd'];
+    /** Defines grid column */
+    gridColumn?: React.CSSProperties['gridColumn'];
+    /** Defines grid row */
+    gridRow?: React.CSSProperties['gridRow'];
+    /** Defines grid area */
+    gridArea?: React.CSSProperties['gridArea'];
+}
+/**
+ * Helper function that will extract all styling relevant props for the Grid styling
+ * and will return them as classnames and style attributes.
+ * The remaining props returned are the ones that no longer contain any Grid styling
+ * related entries.
+ * @internal
+ */
+export declare function getGridStyles<T extends GridStyleProps>(props: T, defaults?: Partial<GridStyleProps>): [
+    className: string,
+    style: React.CSSProperties,
+    remainingProps: Omit<T, keyof GridStyleProps>
+];

package/styles/getGridStyles.js

@@ -0,0 +1,100 @@
+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 getGridStyles_exports = {};
+__export(getGridStyles_exports, {
+  getGridStyles: () => getGridStyles
+});
+module.exports = __toCommonJS(getGridStyles_exports);
+var import_clsx = __toESM(require("clsx"));
+var import_extract_util = require("./extract-util.js");
+var import_getGapSprinkles = require("./getGapSprinkles.js");
+var import_getGridFlexPositionSprinkles = require("./getGridFlexPositionSprinkles.js");
+var import_getLayoutSizeStyles = require("./getLayoutSizeStyles.js");
+var import_getSpacingSprinkles = require("./getSpacingSprinkles.js");
+var import_safe_sprinkles = require("./safe-sprinkles.js");
+const gridItemPropKeys = ["gridItem"];
+const gridStylePropKeys = [
+  /* Flex item props */
+  "order",
+  "flexGrow",
+  "flexShrink",
+  "flexBasis",
+  "flex",
+  /* Grid container props */
+  "gridTemplateColumns",
+  "gridTemplateRows",
+  "gridTemplateAreas",
+  "gridTemplate",
+  "gridAutoColumns",
+  "gridAutoRows",
+  "gridAutoFlow",
+  "grid",
+  /* Grid item props */
+  "gridColumnStart",
+  "gridColumnEnd",
+  "gridRowStart",
+  "gridRowEnd",
+  "gridColumn",
+  "gridRow",
+  "gridArea"
+];
+function extractGridItem(props) {
+  const { extracted, rest } = (0, import_extract_util.extract)(props, gridItemPropKeys);
+  return { extracted, rest };
+}
+function getGridStyles(props, defaults = {}) {
+  const { extracted: additionalGridStyles, rest } = (0, import_extract_util.extract)(
+    props,
+    gridStylePropKeys
+  );
+  const [sizeStyles, afterSizeExtraction] = (0, import_getLayoutSizeStyles.getLayoutSizeStyles)(rest, defaults);
+  const [gridFlexClassNames, gridFlexRemainingProps] = (0, import_getGridFlexPositionSprinkles.getGridFlexPositionSprinkles)(afterSizeExtraction, defaults);
+  const [spacingClassNames, spacingRemainingProps] = (0, import_getSpacingSprinkles.getSpacingSprinkles)(
+    gridFlexRemainingProps,
+    defaults
+  );
+  const [gapClassNames, gapRemainingProps] = (0, import_getGapSprinkles.getGapSprinkles)(
+    spacingRemainingProps,
+    defaults
+  );
+  const { extracted: gridItemProps, rest: remainingProps } = extractGridItem(gapRemainingProps);
+  const gridItemClassName = gridItemProps.gridItem ? void 0 : (0, import_safe_sprinkles.globalSprinkles)({ display: "grid" });
+  return [
+    (0, import_clsx.default)(
+      gridFlexClassNames,
+      spacingClassNames,
+      gapClassNames,
+      gridItemClassName
+    ),
+    {
+      ...sizeStyles,
+      ...additionalGridStyles
+    },
+    remainingProps
+  ];
+}

package/styles/getLayoutSizeStyles.d.ts

@@ -0,0 +1,29 @@
+import type { CSSProperties } from 'react';
+/**
+ * Defines the layout size props.
+ * @public
+ */
+export interface LayoutSizeProps {
+    /** CSS width property */
+    width?: CSSProperties['width'];
+    /** CSS min width property */
+    minWidth?: CSSProperties['minWidth'];
+    /** CSS max width property */
+    maxWidth?: CSSProperties['maxWidth'];
+    /** CSS height property */
+    height?: CSSProperties['height'];
+    /** CSS min height property */
+    minHeight?: CSSProperties['minHeight'];
+    /** CSS max height property */
+    maxHeight?: CSSProperties['maxHeight'];
+}
+/**
+ * Will extract layout sizing relevant styles from the passed props and
+ * will return a defaulted styles object as well as the remaining props excluding
+ * the sizing relevant props.
+ * @internal
+ */
+export declare function getLayoutSizeStyles<T extends LayoutSizeProps>(props: T, defaults?: Partial<LayoutSizeProps>): [
+    sizeStyles: Partial<LayoutSizeProps>,
+    remainingProps: Omit<T, keyof LayoutSizeProps>
+];

package/styles/getLayoutSizeStyles.js

@@ -0,0 +1,39 @@
+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 getLayoutSizeStyles_exports = {};
+__export(getLayoutSizeStyles_exports, {
+  getLayoutSizeStyles: () => getLayoutSizeStyles
+});
+module.exports = __toCommonJS(getLayoutSizeStyles_exports);
+var import_extract_util = require("./extract-util.js");
+const layoutSizePropKeys = [
+  "width",
+  "minWidth",
+  "maxWidth",
+  "height",
+  "minHeight",
+  "maxHeight"
+];
+function getLayoutSizeStyles(props, defaults = {}) {
+  const { extracted, rest } = (0, import_extract_util.extract)(props, layoutSizePropKeys);
+  const { extracted: extractedDefaults } = (0, import_extract_util.extract)(
+    defaults,
+    layoutSizePropKeys
+  );
+  return [{ ...extractedDefaults, ...extracted }, rest];
+}

package/styles/getSpacingSprinkles.d.ts

@@ -0,0 +1,74 @@
+import type { MarginProperties, SpacingProperties } from './sprinkle-properties.js';
+/**
+ * Defines the box spacing props.
+ * @public
+ */
+export interface SpacingProps {
+    /** Defines CSS padding property */
+    padding?: SpacingProperties;
+    /** Defines CSS padding property */
+    p?: SpacingProperties;
+    /** Defines CSS x padding property */
+    paddingX?: SpacingProperties;
+    /** Defines CSS x padding property */
+    px?: SpacingProperties;
+    /** Defines CSS y padding property */
+    paddingY?: SpacingProperties;
+    /** Defines CSS y padding property */
+    py?: SpacingProperties;
+    /** Defines CSS top padding property */
+    paddingTop?: SpacingProperties;
+    /** Defines CSS top padding property */
+    pt?: SpacingProperties;
+    /** Defines CSS right padding property */
+    paddingRight?: SpacingProperties;
+    /** Defines CSS right padding property */
+    pr?: SpacingProperties;
+    /** Defines CSS bottom padding property */
+    paddingBottom?: SpacingProperties;
+    /** Defines CSS bottom padding property */
+    pb?: SpacingProperties;
+    /** Defines CSS left padding property */
+    paddingLeft?: SpacingProperties;
+    /** Defines CSS left padding property */
+    pl?: SpacingProperties;
+    /** Defines CSS margin property */
+    margin?: MarginProperties;
+    /** Defines CSS margin property */
+    m?: MarginProperties;
+    /** Defines CSS x margin property */
+    marginX?: MarginProperties;
+    /** Defines CSS x margin property */
+    mx?: MarginProperties;
+    /** Defines CSS y margin property */
+    marginY?: MarginProperties;
+    /** Definesy CSS margin property */
+    my?: MarginProperties;
+    /** Defines CSS top margin property */
+    marginTop?: MarginProperties;
+    /** Defines CSS top margin property */
+    mt?: MarginProperties;
+    /** Defines CSS right margin property */
+    marginRight?: MarginProperties;
+    /** Defines CSS right margin property */
+    mr?: MarginProperties;
+    /** Defines CSS bottom margin property */
+    marginBottom?: MarginProperties;
+    /** Defines bottom margin property */
+    mb?: MarginProperties;
+    /** Defines CSS left margin property */
+    marginLeft?: MarginProperties;
+    /** Defines CSS left margin property */
+    ml?: MarginProperties;
+}
+/**
+ * Defines the defaults for spacings
+ * @internal
+ */
+export type DefaultSpacingProps = Pick<SpacingProps, 'padding' | 'paddingX' | 'paddingY' | 'paddingTop' | 'paddingRight' | 'paddingBottom' | 'paddingLeft' | 'margin' | 'marginX' | 'marginY' | 'marginTop' | 'marginRight' | 'marginBottom' | 'marginLeft'>;
+/**
+ * Given a set of props will return the relevant class names for the spacing sprinkles
+ * and the remaining props.
+ * @internal
+ */
+export declare function getSpacingSprinkles<T extends SpacingProps>(props: T, defaults?: DefaultSpacingProps): [sprinklesClassNames: string, remainingProps: Omit<T, keyof SpacingProps>];

package/styles/getSpacingSprinkles.js

@@ -0,0 +1,68 @@
+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 getSpacingSprinkles_exports = {};
+__export(getSpacingSprinkles_exports, {
+  getSpacingSprinkles: () => getSpacingSprinkles
+});
+module.exports = __toCommonJS(getSpacingSprinkles_exports);
+var import_extract_util = require("./extract-util.js");
+var import_safe_sprinkles = require("./safe-sprinkles.js");
+const spacingPropKeys = [
+  "padding",
+  "p",
+  "paddingX",
+  "px",
+  "paddingY",
+  "py",
+  "paddingTop",
+  "pt",
+  "paddingRight",
+  "pr",
+  "paddingBottom",
+  "pb",
+  "paddingLeft",
+  "pl",
+  "margin",
+  "m",
+  "marginX",
+  "mx",
+  "marginY",
+  "my",
+  "marginTop",
+  "mt",
+  "marginRight",
+  "mr",
+  "marginBottom",
+  "mb",
+  "marginLeft",
+  "ml"
+];
+function getSpacingSprinkles(props, defaults = {}) {
+  const { extracted, rest } = (0, import_extract_util.extract)(props, spacingPropKeys);
+  const spacingSprinkleConfig = {
+    paddingTop: extracted.pt ?? extracted.paddingTop ?? defaults.paddingTop ?? extracted.py ?? extracted.paddingY ?? defaults.paddingY ?? extracted.p ?? extracted.padding ?? defaults.padding,
+    paddingRight: extracted.pr ?? extracted.paddingRight ?? defaults.paddingRight ?? extracted.px ?? extracted.paddingX ?? defaults.paddingX ?? extracted.p ?? extracted.padding ?? defaults.padding,
+    paddingBottom: extracted.pb ?? extracted.paddingBottom ?? defaults.paddingBottom ?? extracted.py ?? extracted.paddingY ?? defaults.paddingY ?? extracted.p ?? extracted.padding ?? defaults.padding,
+    paddingLeft: extracted.pl ?? extracted.paddingLeft ?? defaults.paddingLeft ?? extracted.px ?? extracted.paddingX ?? defaults.paddingX ?? extracted.p ?? extracted.padding ?? defaults.padding,
+    marginTop: extracted.mt ?? extracted.marginTop ?? defaults.marginTop ?? extracted.my ?? extracted.marginY ?? defaults.marginY ?? extracted.m ?? extracted.margin ?? defaults.margin,
+    marginRight: extracted.mr ?? extracted.marginRight ?? defaults.marginRight ?? extracted.mx ?? extracted.marginX ?? defaults.marginX ?? extracted.m ?? extracted.margin ?? defaults.margin,
+    marginBottom: extracted.mb ?? extracted.marginBottom ?? defaults.marginBottom ?? extracted.my ?? extracted.marginY ?? defaults.marginY ?? extracted.m ?? extracted.margin ?? defaults.margin,
+    marginLeft: extracted.ml ?? extracted.marginLeft ?? defaults.marginLeft ?? extracted.mx ?? extracted.marginX ?? defaults.marginX ?? extracted.m ?? extracted.margin ?? defaults.margin
+  };
+  return [(0, import_safe_sprinkles.globalSprinkles)(spacingSprinkleConfig), rest];
+}

package/styles/index.d.ts

@@ -0,0 +1,11 @@
+export type { FlexItemStyleProps, FlexStyleProps } from './getFlexStyles.js';
+export type { GridItemStyleProps, GridStyleProps } from './getGridStyles.js';
+export { type GridFlexPositionProps, getGridFlexPositionSprinkles as _getGridFlexPositionSprinkles, } from './getGridFlexPositionSprinkles.js';
+export { type GapProps, getGapSprinkles as _getGapSprinkles, } from './getGapSprinkles.js';
+export { type SpacingProps, type DefaultSpacingProps as _DefaultSpacingProps, getSpacingSprinkles as _getSpacingSprinkles, } from './getSpacingSprinkles.js';
+export { type LayoutSizeProps, getLayoutSizeStyles as _getLayoutSizeStyles, } from './getLayoutSizeStyles.js';
+export { alignContentPositionProps, alignItemsPositionProps, alignSelfPositionProps, justifyContentPositionProps, justifyItemsPositionProps, justifySelfPositionProps, marginProperties, placeContentPositionProps, placeItemsPositionProps, placeSelfPositionProps, spacingProperties, } from './sprinkle-properties.js';
+export type { AlignContentPositionProps, AlignItemsPositionProps, AlignSelfPositionProps, JustifyContentPositionProps, JustifyItemsPositionProps, JustifySelfPositionProps, MarginProperties, PlaceContentPositionProps, PlaceItemsPositionProps, PlaceSelfPositionProps, SpacingProperties, } from './sprinkle-properties.js';
+export { extract as _extract } from './extract-util.js';
+export { globalSprinkles as _globalSprinkles } from './safe-sprinkles.js';
+export { textStyleCSS as _textStyleCSS } from './textStyle.css.js';