@dynatrace/strato-components 0.84.31 → 0.84.51

package/esm/core/index.js

@@ -16,6 +16,12 @@ import { isBrowser } from "./utils/isBrowser.js";
 import {
   mergeProps
 } from "./utils/merge-props.js";
+import { useAriaLabelingProps } from "./hooks/useAriaLabelingProps.js";
+import { useId } from "./hooks/useId.js";
+import { useSafeForwardProps } from "./hooks/useSafeForwardProps.js";
+import { roleVariants } from "./types/role-variant.js";
+import { uuidv4 } from "./utils/uuidv4.js";
+import { isStringChildren } from "./utils/_is-string-children.js";
 export {
   AppRoot,
   FocusProvider as _FocusProvider,
@@ -26,8 +32,14 @@ export {
   getLastFocusableChild as _getLastFocusableChild,
   isBrowser as _isBrowser,
   isFocusable as _isFocusable,
+  isStringChildren as _isStringChildren,
   mergeProps as _mergeProps,
+  useAriaLabelingProps as _useAriaLabelingProps,
   useFocusContext as _useFocusContext,
+  useId as _useId,
+  useSafeForwardProps as _useSafeForwardProps,
+  uuidv4 as _uuidv4,
+  roleVariants,
   useCurrentTheme
 };
 //# sourceMappingURL=index.js.map

package/esm/core/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/core/index.ts"],
-  "sourcesContent": ["export { AppRoot, type AppRootProps } from './components/app-root/AppRoot.js';\nexport {\n  FocusScope as _FocusScope,\n  type FocusScopeProps as _FocusScopeProps,\n} from './components/focus-scope/FocusScope.js';\n\nexport { type FocusContextProps as _FocusContextProps } from './contexts/FocusContext.js';\n\nexport { useCurrentTheme } from './hooks/useCurrentTheme.js';\nexport { useFocusContext as _useFocusContext } from './hooks/useFocusContext.js';\nexport {\n  FocusProvider as _FocusProvider,\n  type Modality as _Modality,\n} from './providers/FocusProvider.js';\nexport type { MaskingProps } from './types/masking-props.js';\nexport type { DataTestId } from './types/data-props.js';\nexport type { StylingProps } from './types/styling-props.js';\nexport type { WithChildren } from './types/with-children.js';\n\nexport { attemptFocus as _attemptFocus } from './utils/focus-management/attempt-focus.js';\nexport { focusFirstDescendant as _focusFirstDescendant } from './utils/focus-management/focus-first-descendant.js';\nexport { getFirstFocusableChild as _getFirstFocusableChild } from './utils/focus-management/get-first-focusable-child.js';\nexport { getLastFocusableChild as _getLastFocusableChild } from './utils/focus-management/get-last-focusable-child.js';\nexport { isFocusable as _isFocusable } from './utils/focus-management/is-focusable.js';\nexport { isBrowser as _isBrowser } from './utils/isBrowser.js';\nexport {\n  mergeProps as _mergeProps,\n  type NullToObject as _NullToObject,\n  type TupleTypes as _TupleTypes,\n  type UnionToIntersection as _UnionToIntersection,\n} from './utils/merge-props.js';\n"],
-  "mappings": "AAAA,SAAS,eAAkC;AAC3C;AAAA,EACgB;AAAA,OAET;AAIP,SAAS,uBAAuB;AAChC,SAA4B,uBAAwB;AACpD;AAAA,EACmB;AAAA,OAEZ;AAMP,SAAyB,oBAAqB;AAC9C,SAAiC,4BAA6B;AAC9D,SAAmC,8BAA+B;AAClE,SAAkC,6BAA8B;AAChE,SAAwB,mBAAoB;AAC5C,SAAsB,iBAAkB;AACxC;AAAA,EACgB;AAAA,OAIT;",
+  "sourcesContent": ["export { AppRoot, type AppRootProps } from './components/app-root/AppRoot.js';\nexport {\n  FocusScope as _FocusScope,\n  type FocusScopeProps as _FocusScopeProps,\n} from './components/focus-scope/FocusScope.js';\n\nexport { type FocusContextProps as _FocusContextProps } from './contexts/FocusContext.js';\n\nexport { useCurrentTheme } from './hooks/useCurrentTheme.js';\nexport { useFocusContext as _useFocusContext } from './hooks/useFocusContext.js';\nexport {\n  FocusProvider as _FocusProvider,\n  type Modality as _Modality,\n} from './providers/FocusProvider.js';\nexport type { MaskingProps } from './types/masking-props.js';\nexport type { DataTestId } from './types/data-props.js';\nexport type { StylingProps } from './types/styling-props.js';\nexport type { WithChildren } from './types/with-children.js';\nexport type {\n  PolymorphOwnProps,\n  PolymorphProps,\n  PolymorphicComponentProps,\n} from './types/polymorph.js';\n\nexport { attemptFocus as _attemptFocus } from './utils/focus-management/attempt-focus.js';\nexport { focusFirstDescendant as _focusFirstDescendant } from './utils/focus-management/focus-first-descendant.js';\nexport { getFirstFocusableChild as _getFirstFocusableChild } from './utils/focus-management/get-first-focusable-child.js';\nexport { getLastFocusableChild as _getLastFocusableChild } from './utils/focus-management/get-last-focusable-child.js';\nexport { isFocusable as _isFocusable } from './utils/focus-management/is-focusable.js';\nexport { isBrowser as _isBrowser } from './utils/isBrowser.js';\nexport {\n  mergeProps as _mergeProps,\n  type NullToObject as _NullToObject,\n  type TupleTypes as _TupleTypes,\n  type UnionToIntersection as _UnionToIntersection,\n} from './utils/merge-props.js';\nexport { type _HeadingLevel, type _HeadingTag } from './types/heading.js';\nexport { useAriaLabelingProps as _useAriaLabelingProps } from './hooks/useAriaLabelingProps.js';\nexport { useId as _useId } from './hooks/useId.js';\nexport { useSafeForwardProps as _useSafeForwardProps } from './hooks/useSafeForwardProps.js';\nexport type { UseSafeForwardReturnProps as _UseSafeForwardReturnProps } from './hooks/useSafeForwardProps.js';\nexport type {\n  AriaDisabledProps,\n  AriaLabelingProps,\n} from './types/a11y-props.js';\nexport type { DOMProps } from './types/dom.js';\nexport { roleVariants } from './types/role-variant.js';\nexport type { RoleVariantType } from './types/role-variant.js';\nexport { uuidv4 as _uuidv4 } from './utils/uuidv4.js';\nexport { isStringChildren as _isStringChildren } from './utils/_is-string-children.js';\n"],
+  "mappings": "AAAA,SAAS,eAAkC;AAC3C;AAAA,EACgB;AAAA,OAET;AAIP,SAAS,uBAAuB;AAChC,SAA4B,uBAAwB;AACpD;AAAA,EACmB;AAAA,OAEZ;AAWP,SAAyB,oBAAqB;AAC9C,SAAiC,4BAA6B;AAC9D,SAAmC,8BAA+B;AAClE,SAAkC,6BAA8B;AAChE,SAAwB,mBAAoB;AAC5C,SAAsB,iBAAkB;AACxC;AAAA,EACgB;AAAA,OAIT;AAEP,SAAiC,4BAA6B;AAC9D,SAAkB,aAAc;AAChC,SAAgC,2BAA4B;AAO5D,SAAS,oBAAoB;AAE7B,SAAmB,cAAe;AAClC,SAA6B,wBAAyB;",
   "names": []
 }

package/esm/core/styles/focusRing.css

@@ -0,0 +1,88 @@
+.focusRing_focusRingCSS__z2r50s3 {
+  outline: none;
+}
+.focusRing_focusRingCSS__z2r50s3:focus-visible {
+  outline: none;
+}
+.focusRing_focusRingCSS_minimal_true__z2r50s4 {
+  border-radius: calc(var(--dt-borders-radius-field-subdued, 4px) / 2);
+  box-shadow: inset 0 0 0 var(--dt-borders-width-default, 1px) var(--outerShadow__z2r50s0);
+  background-color: var(--backgroundColor__z2r50s2);
+}
+.focusRing_focusRingCSS_minimal_false__z2r50s5.focusRing_focusRingCSS_minimal_false__z2r50s5 {
+  box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--outerShadow__z2r50s0), inset 0 0 0 calc(var(--dt-borders-width-emphasized, 2px) + 1px) var(--innerShadow__z2r50s1);
+}
+.focusRing_focusRingCSS_variant_neutral__z2r50s6 {
+  --outerShadow__z2r50s0: var(--dt-colors-border-neutral-accent, #545587);
+  --innerShadow__z2r50s1: var(--dt-colors-border-neutral-default, #d2d3e1);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-neutral-emphasized, #dadbe7);
+}
+.focusRing_focusRingCSS_variant_primary__z2r50s7 {
+  --outerShadow__z2r50s0: var(--dt-colors-border-primary-accent, #454cc9);
+  --innerShadow__z2r50s1: var(--dt-colors-border-primary-default, #ccd3f3);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-primary-emphasized, #d6dbf4);
+}
+.focusRing_focusRingCSS_variant_success__z2r50s8 {
+  --outerShadow__z2r50s0: var(--dt-colors-border-success-accent, #2c6360);
+  --innerShadow__z2r50s1: var(--dt-colors-border-success-default, #cad6d7);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-success-emphasized, #d4dddf);
+}
+.focusRing_focusRingCSS_variant_warning__z2r50s9 {
+  --outerShadow__z2r50s0: var(--dt-colors-border-warning-accent, #805100);
+  --innerShadow__z2r50s1: var(--dt-colors-border-warning-default, #f4e5d5);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-warning-emphasized, #f4e8de);
+}
+.focusRing_focusRingCSS_variant_critical__z2r50sa {
+  --outerShadow__z2r50s0: var(--dt-colors-border-critical-accent, #b80031);
+  --innerShadow__z2r50s1: var(--dt-colors-border-critical-default, #f1cdcf);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-critical-emphasized, #f2d7d9);
+}
+.focusRing_focusRingCSS_variant_onAccent__z2r50sb {
+  --outerShadow__z2r50s0: var(--dt-colors-border-on-accent-default, #f3f3f7);
+  --innerShadow__z2r50s1: var(--dt-colors-border-on-accent-default, #f3f3f7);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-on-accent-emphasized, #f3f3f733);
+}
+.focusRing_focusRingFocusWithinCSS__z2r50sc:focus-within {
+  outline: none;
+  :focus-visible {
+    outline: none;
+  }
+}
+.focusRing_focusRingFocusWithinCSS_minimal_true__z2r50sd:focus-within {
+  border-radius: calc(var(--dt-borders-radius-field-subdued, 4px) / 2);
+  box-shadow: inset 0 0 0 var(--dt-borders-width-default, 1px) var(--outerShadow__z2r50s0);
+  background-color: var(--backgroundColor__z2r50s2);
+}
+.focusRing_focusRingFocusWithinCSS_minimal_false__z2r50se:focus-within {
+  box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--outerShadow__z2r50s0), inset 0 0 0 calc(var(--dt-borders-width-emphasized, 2px) + 1px) var(--innerShadow__z2r50s1);
+}
+.focusRing_focusRingFocusWithinCSS_variant_neutral__z2r50sf {
+  --outerShadow__z2r50s0: var(--dt-colors-border-neutral-accent, #545587);
+  --innerShadow__z2r50s1: var(--dt-colors-border-neutral-default, #d2d3e1);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-neutral-emphasized, #dadbe7);
+}
+.focusRing_focusRingFocusWithinCSS_variant_primary__z2r50sg {
+  --outerShadow__z2r50s0: var(--dt-colors-border-primary-accent, #454cc9);
+  --innerShadow__z2r50s1: var(--dt-colors-border-primary-default, #ccd3f3);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-primary-emphasized, #d6dbf4);
+}
+.focusRing_focusRingFocusWithinCSS_variant_success__z2r50sh {
+  --outerShadow__z2r50s0: var(--dt-colors-border-success-accent, #2c6360);
+  --innerShadow__z2r50s1: var(--dt-colors-border-success-default, #cad6d7);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-success-emphasized, #d4dddf);
+}
+.focusRing_focusRingFocusWithinCSS_variant_warning__z2r50si {
+  --outerShadow__z2r50s0: var(--dt-colors-border-warning-accent, #805100);
+  --innerShadow__z2r50s1: var(--dt-colors-border-warning-default, #f4e5d5);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-warning-emphasized, #f4e8de);
+}
+.focusRing_focusRingFocusWithinCSS_variant_critical__z2r50sj {
+  --outerShadow__z2r50s0: var(--dt-colors-border-critical-accent, #b80031);
+  --innerShadow__z2r50s1: var(--dt-colors-border-critical-default, #f1cdcf);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-critical-emphasized, #f2d7d9);
+}
+.focusRing_focusRingFocusWithinCSS_variant_onAccent__z2r50sk {
+  --outerShadow__z2r50s0: var(--dt-colors-border-on-accent-default, #f3f3f7);
+  --innerShadow__z2r50s1: var(--dt-colors-border-on-accent-default, #f3f3f7);
+  --backgroundColor__z2r50s2: var(--dt-colors-background-field-on-accent-emphasized, #f3f3f733);
+}

package/esm/core/styles/focusRing.sty.js

@@ -0,0 +1,9 @@
+import "./focusRing.css";
+import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
+var focusRingCSS = _7a468({ defaultClassName: "focusRing_focusRingCSS__z2r50s3", variantClassNames: { minimal: { true: "focusRing_focusRingCSS_minimal_true__z2r50s4", false: "focusRing_focusRingCSS_minimal_false__z2r50s5" }, variant: { neutral: "focusRing_focusRingCSS_variant_neutral__z2r50s6", primary: "focusRing_focusRingCSS_variant_primary__z2r50s7", success: "focusRing_focusRingCSS_variant_success__z2r50s8", warning: "focusRing_focusRingCSS_variant_warning__z2r50s9", critical: "focusRing_focusRingCSS_variant_critical__z2r50sa", onAccent: "focusRing_focusRingCSS_variant_onAccent__z2r50sb" } }, defaultVariants: {}, compoundVariants: [] });
+var focusRingFocusWithinCSS = _7a468({ defaultClassName: "focusRing_focusRingFocusWithinCSS__z2r50sc", variantClassNames: { minimal: { true: "focusRing_focusRingFocusWithinCSS_minimal_true__z2r50sd", false: "focusRing_focusRingFocusWithinCSS_minimal_false__z2r50se" }, variant: { neutral: "focusRing_focusRingFocusWithinCSS_variant_neutral__z2r50sf", primary: "focusRing_focusRingFocusWithinCSS_variant_primary__z2r50sg", success: "focusRing_focusRingFocusWithinCSS_variant_success__z2r50sh", warning: "focusRing_focusRingFocusWithinCSS_variant_warning__z2r50si", critical: "focusRing_focusRingFocusWithinCSS_variant_critical__z2r50sj", onAccent: "focusRing_focusRingFocusWithinCSS_variant_onAccent__z2r50sk" } }, defaultVariants: {}, compoundVariants: [] });
+export {
+  focusRingCSS,
+  focusRingFocusWithinCSS
+};
+//# sourceMappingURL=focusRing.sty.js.map

package/esm/core/styles/focusRing.sty.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/styles/focusRing.css.ts"],
+  "sourcesContent": ["import './focusRing.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var focusRingCSS = _7a468({defaultClassName:'focusRing_focusRingCSS__z2r50s3',variantClassNames:{minimal:{true:'focusRing_focusRingCSS_minimal_true__z2r50s4',false:'focusRing_focusRingCSS_minimal_false__z2r50s5'},variant:{neutral:'focusRing_focusRingCSS_variant_neutral__z2r50s6',primary:'focusRing_focusRingCSS_variant_primary__z2r50s7',success:'focusRing_focusRingCSS_variant_success__z2r50s8',warning:'focusRing_focusRingCSS_variant_warning__z2r50s9',critical:'focusRing_focusRingCSS_variant_critical__z2r50sa',onAccent:'focusRing_focusRingCSS_variant_onAccent__z2r50sb'}},defaultVariants:{},compoundVariants:[]});\nexport var focusRingFocusWithinCSS = _7a468({defaultClassName:'focusRing_focusRingFocusWithinCSS__z2r50sc',variantClassNames:{minimal:{true:'focusRing_focusRingFocusWithinCSS_minimal_true__z2r50sd',false:'focusRing_focusRingFocusWithinCSS_minimal_false__z2r50se'},variant:{neutral:'focusRing_focusRingFocusWithinCSS_variant_neutral__z2r50sf',primary:'focusRing_focusRingFocusWithinCSS_variant_primary__z2r50sg',success:'focusRing_focusRingFocusWithinCSS_variant_success__z2r50sh',warning:'focusRing_focusRingFocusWithinCSS_variant_warning__z2r50si',critical:'focusRing_focusRingFocusWithinCSS_variant_critical__z2r50sj',onAccent:'focusRing_focusRingFocusWithinCSS_variant_onAccent__z2r50sk'}},defaultVariants:{},compoundVariants:[]});"],
+  "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,eAAe,OAAO,EAAC,kBAAiB,mCAAkC,mBAAkB,EAAC,SAAQ,EAAC,MAAK,gDAA+C,OAAM,gDAA+C,GAAE,SAAQ,EAAC,SAAQ,mDAAkD,SAAQ,mDAAkD,SAAQ,mDAAkD,SAAQ,mDAAkD,UAAS,oDAAmD,UAAS,mDAAkD,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACvmB,IAAI,0BAA0B,OAAO,EAAC,kBAAiB,8CAA6C,mBAAkB,EAAC,SAAQ,EAAC,MAAK,2DAA0D,OAAM,2DAA0D,GAAE,SAAQ,EAAC,SAAQ,8DAA6D,SAAQ,8DAA6D,SAAQ,8DAA6D,SAAQ,8DAA6D,UAAS,+DAA8D,UAAS,8DAA6D,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;",
+  "names": []
+}

package/esm/core/styles/useFocusRing.js

@@ -0,0 +1,69 @@
+import {
+  useCallback,
+  useEffect,
+  useState
+} from "react";
+import { focusRingCSS, focusRingFocusWithinCSS } from "./focusRing.sty.js";
+import { _useFocusContext } from "../index.js";
+const variants = [
+  "neutral",
+  "primary",
+  "success",
+  "warning",
+  "critical",
+  "onAccent"
+];
+function useFocusRing(props = {}) {
+  const {
+    variant = "neutral",
+    ignoreModality = false,
+    isMinimal = false,
+    focusWithin = false,
+    disabled = false
+  } = props;
+  const [isFocused, setIsFocused] = useState(false);
+  const { modality } = _useFocusContext();
+  useEffect(() => {
+    if (disabled) {
+      setIsFocused(false);
+    }
+  }, [disabled]);
+  const onBlur = useCallback((e) => {
+    if (e.currentTarget === e.target) {
+      setIsFocused(false);
+    }
+  }, []);
+  const onFocus = useCallback((e) => {
+    if (e.currentTarget === e.target) {
+      setIsFocused(true);
+    }
+  }, []);
+  const focusProps = {
+    onFocus,
+    onBlur
+  };
+  if ((ignoreModality || modality === "keyboard") && isFocused || focusWithin) {
+    if (isMinimal) {
+      return {
+        focusClassName: focusWithin ? focusRingFocusWithinCSS({ minimal: true, variant }) : focusRingCSS({ minimal: true, variant }),
+        isFocusVisible: !focusWithin,
+        focusProps
+      };
+    }
+    return {
+      focusClassName: focusWithin ? focusRingFocusWithinCSS({ minimal: false, variant }) : focusRingCSS({ minimal: false, variant }),
+      isFocusVisible: !focusWithin,
+      focusProps
+    };
+  }
+  return {
+    focusClassName: focusWithin ? focusRingFocusWithinCSS() : focusRingCSS(),
+    isFocusVisible: false,
+    focusProps
+  };
+}
+export {
+  useFocusRing,
+  variants
+};
+//# sourceMappingURL=useFocusRing.js.map

package/esm/core/styles/useFocusRing.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/styles/useFocusRing.ts"],
+  "sourcesContent": ["import {\n  FocusEvent,\n  FocusEventHandler,\n  useCallback,\n  useEffect,\n  useState,\n} from 'react';\n\nimport { focusRingCSS, focusRingFocusWithinCSS } from './focusRing.sty.js';\nimport { _useFocusContext } from '../index.js';\n\nexport type Modality = 'keyboard' | 'pointer' | 'touch' | 'unknown';\n\n/** @internal */\nexport const variants = [\n  'neutral',\n  'primary',\n  'success',\n  'warning',\n  'critical',\n  'onAccent',\n] as const;\n/** @internal */\nexport type VariantType = (typeof variants)[number];\n/** @internal */\nexport type UseFocusRingProps = {\n  /**\n   * A minimal focus outline is available for smaller content elements like links. This variant is applied when set to true.\n   * @defaultValue false\n   */\n  isMinimal?: boolean;\n\n  /**\n   * Whether or not the modality should be ignored, so that the focus ring is also present if users clicks the element (not just by tabbing to it).\n   * @defaultValue false\n   */\n  ignoreModality?: boolean;\n\n  /**\n   * The styling variant of the element.\n   * @defaultValue neutral\n   */\n  variant?: VariantType;\n\n  /**\n   * Apply the focus ring styling if an embedded element gains the focus\n   */\n  focusWithin?: boolean;\n\n  /**\n   * Whether the element is disabled. If disabled changes to true, the focus will be removed.\n   */\n  disabled?: boolean;\n};\n\nexport type FocusRingProps = {\n  /** The focus styles that depend on modality. */\n  focusClassName: string;\n  /** Focus handlers used to manage the focus state. Must be applied to the element that receives the focus.*/\n  focusProps: {\n    onFocus: (e: FocusEvent) => void;\n    onBlur: (e: FocusEvent) => void;\n  };\n  /** Whether or not the element got focus via keyboard. */\n  isFocusVisible: boolean;\n};\n\n/**\n * Custom hook used to determine focus styling depending on modality.\n * Returns the css classes (vanilla) that can be applied to the component in order to show the correct focus outline.\n * @internal\n */\nexport function useFocusRing(props: UseFocusRingProps = {}): FocusRingProps {\n  const {\n    variant = 'neutral',\n    ignoreModality = false,\n    isMinimal = false,\n    focusWithin = false,\n    disabled = false,\n  } = props;\n  const [isFocused, setIsFocused] = useState(false);\n  const { modality } = _useFocusContext();\n\n  useEffect(() => {\n    if (disabled) {\n      setIsFocused(false);\n    }\n  }, [disabled]);\n\n  const onBlur = useCallback<FocusEventHandler>((e) => {\n    // trigger only when the self element is unfocused (stopPropagation)\n    if (e.currentTarget === e.target) {\n      setIsFocused(false);\n    }\n  }, []);\n\n  const onFocus = useCallback<FocusEventHandler>((e) => {\n    // trigger only when the self element is focused (stopPropagation)\n    if (e.currentTarget === e.target) {\n      setIsFocused(true);\n    }\n  }, []);\n\n  const focusProps = {\n    onFocus,\n    onBlur,\n  };\n\n  if (\n    ((ignoreModality || modality === 'keyboard') && isFocused) ||\n    focusWithin\n  ) {\n    if (isMinimal) {\n      return {\n        focusClassName: focusWithin\n          ? focusRingFocusWithinCSS({ minimal: true, variant })\n          : focusRingCSS({ minimal: true, variant }),\n        isFocusVisible: !focusWithin,\n        focusProps,\n      };\n    }\n\n    return {\n      focusClassName: focusWithin\n        ? focusRingFocusWithinCSS({ minimal: false, variant })\n        : focusRingCSS({ minimal: false, variant }),\n      isFocusVisible: !focusWithin,\n      focusProps,\n    };\n  }\n\n  return {\n    focusClassName: focusWithin ? focusRingFocusWithinCSS() : focusRingCSS(),\n    isFocusVisible: false,\n    focusProps,\n  };\n}\n"],
+  "mappings": "AAAA;AAAA,EAGE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,cAAc,+BAA+B;AACtD,SAAS,wBAAwB;AAK1B,MAAM,WAAW;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAmDO,SAAS,aAAa,QAA2B,CAAC,GAAmB;AAC1E,QAAM;AAAA,IACJ,UAAU;AAAA,IACV,iBAAiB;AAAA,IACjB,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,WAAW;AAAA,EACb,IAAI;AACJ,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,EAAE,SAAS,IAAI,iBAAiB;AAEtC,YAAU,MAAM;AACd,QAAI,UAAU;AACZ,mBAAa,KAAK;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,SAAS,YAA+B,CAAC,MAAM;AAEnD,QAAI,EAAE,kBAAkB,EAAE,QAAQ;AAChC,mBAAa,KAAK;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,YAA+B,CAAC,MAAM;AAEpD,QAAI,EAAE,kBAAkB,EAAE,QAAQ;AAChC,mBAAa,IAAI;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,aAAa;AAAA,IACjB;AAAA,IACA;AAAA,EACF;AAEA,OACI,kBAAkB,aAAa,eAAe,aAChD,aACA;AACA,QAAI,WAAW;AACb,aAAO;AAAA,QACL,gBAAgB,cACZ,wBAAwB,EAAE,SAAS,MAAM,QAAQ,CAAC,IAClD,aAAa,EAAE,SAAS,MAAM,QAAQ,CAAC;AAAA,QAC3C,gBAAgB,CAAC;AAAA,QACjB;AAAA,MACF;AAAA,IACF;AAEA,WAAO;AAAA,MACL,gBAAgB,cACZ,wBAAwB,EAAE,SAAS,OAAO,QAAQ,CAAC,IACnD,aAAa,EAAE,SAAS,OAAO,QAAQ,CAAC;AAAA,MAC5C,gBAAgB,CAAC;AAAA,MACjB;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL,gBAAgB,cAAc,wBAAwB,IAAI,aAAa;AAAA,IACvE,gBAAgB;AAAA,IAChB;AAAA,EACF;AACF;",
+  "names": []
+}

package/esm/core/types/a11y-props.js

@@ -0,0 +1 @@
+//# sourceMappingURL=a11y-props.js.map

package/esm/core/types/a11y-props.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/esm/core/types/dom.js

@@ -0,0 +1 @@
+//# sourceMappingURL=dom.js.map

package/esm/core/types/dom.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/esm/core/types/heading.js

@@ -0,0 +1 @@
+//# sourceMappingURL=heading.js.map

package/esm/core/types/heading.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/esm/core/types/polymorph.js

@@ -0,0 +1 @@
+//# sourceMappingURL=polymorph.js.map

package/esm/core/types/polymorph.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/esm/core/types/role-variant.js

@@ -0,0 +1,12 @@
+const roleVariants = [
+  "neutral",
+  "primary",
+  "success",
+  "warning",
+  "critical",
+  "onAccent"
+];
+export {
+  roleVariants
+};
+//# sourceMappingURL=role-variant.js.map

package/esm/core/types/role-variant.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/types/role-variant.tsx"],
+  "sourcesContent": ["/**\n * Defines role / color variants\n * @public\n */\nexport const roleVariants = [\n  'neutral',\n  'primary',\n  'success',\n  'warning',\n  'critical',\n  'onAccent',\n] as const;\n\n/**\n * Defines the types of role variants\n * @public\n */\nexport type RoleVariantType = (typeof roleVariants)[number];\n"],
+  "mappings": "AAIO,MAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;",
+  "names": []
+}

package/esm/core/utils/_is-string-children.js

@@ -0,0 +1,16 @@
+import React from "react";
+import { FormattedMessage } from "react-intl";
+import { isElement } from "react-is";
+function isStringChildren(children) {
+  const childrenArray = React.Children.toArray(children);
+  if (!childrenArray.some(isElement)) {
+    return true;
+  }
+  return childrenArray.every(
+    (child) => !isElement(child) || isElement(child) && child.type && child.type === FormattedMessage
+  );
+}
+export {
+  isStringChildren
+};
+//# sourceMappingURL=_is-string-children.js.map

package/esm/core/utils/_is-string-children.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/utils/_is-string-children.ts"],
+  "sourcesContent": ["import React from 'react';\nimport { FormattedMessage } from 'react-intl';\nimport { isElement } from 'react-is';\n\n/**\n * Returns whether children only consist of text nodes.\n * @internal\n */\nexport function isStringChildren(children: React.ReactNode): boolean {\n  const childrenArray = React.Children.toArray(children);\n\n  if (!childrenArray.some(isElement)) {\n    return true; // All children are strings\n  }\n\n  return childrenArray.every(\n    (child) =>\n      !isElement(child) ||\n      (isElement(child) && child.type && child.type === FormattedMessage),\n  );\n}\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,wBAAwB;AACjC,SAAS,iBAAiB;AAMnB,SAAS,iBAAiB,UAAoC;AACnE,QAAM,gBAAgB,MAAM,SAAS,QAAQ,QAAQ;AAErD,MAAI,CAAC,cAAc,KAAK,SAAS,GAAG;AAClC,WAAO;AAAA,EACT;AAEA,SAAO,cAAc;AAAA,IACnB,CAAC,UACC,CAAC,UAAU,KAAK,KACf,UAAU,KAAK,KAAK,MAAM,QAAQ,MAAM,SAAS;AAAA,EACtD;AACF;",
+  "names": []
+}

package/esm/core/utils/colorUtils.css

@@ -0,0 +1,80 @@
+.colorUtils_colorUtilsCSS_color_critical__k096v44 {
+  --vars_text__k096v40: var(--dt-colors-text-critical-default, #b80031);
+  --vars_icon__k096v41: var(--dt-colors-icon-critical-default, #b80031);
+  --vars_borderColor__k096v42: var(--dt-colors-border-critical-default, #f1cdcf);
+}
+.colorUtils_colorUtilsCSS_color_neutral__k096v45 {
+  --vars_text__k096v40: var(--dt-colors-text-neutral-default, #2b2a58);
+  --vars_icon__k096v41: var(--dt-colors-icon-neutral-default, #2b2a58);
+  --vars_borderColor__k096v42: var(--dt-colors-border-neutral-default, #d2d3e1);
+}
+.colorUtils_colorUtilsCSS_color_primary__k096v46 {
+  --vars_text__k096v40: var(--dt-colors-text-primary-default, #454cc9);
+  --vars_icon__k096v41: var(--dt-colors-icon-primary-default, #454cc9);
+  --vars_borderColor__k096v42: var(--dt-colors-border-primary-default, #ccd3f3);
+}
+.colorUtils_colorUtilsCSS_color_success__k096v47 {
+  --vars_text__k096v40: var(--dt-colors-text-success-default, #2c6360);
+  --vars_icon__k096v41: var(--dt-colors-icon-success-default, #2c6360);
+  --vars_borderColor__k096v42: var(--dt-colors-border-success-default, #cad6d7);
+}
+.colorUtils_colorUtilsCSS_color_warning__k096v48 {
+  --vars_text__k096v40: var(--dt-colors-text-warning-default, #805100);
+  --vars_icon__k096v41: var(--dt-colors-icon-warning-default, #805100);
+  --vars_borderColor__k096v42: var(--dt-colors-border-warning-default, #f4e5d5);
+}
+.colorUtils_colorUtilsCSS_color_onAccent__k096v49 {
+  --vars_text__k096v40: var(--dt-colors-text-neutral-on-accent-default, #f3f3f6);
+  --vars_icon__k096v41: var(--dt-colors-icon-neutral-on-accent-default, #f3f3f6);
+  --vars_borderColor__k096v42: var(--dt-colors-border-neutral-on-accent-default, #f3f3f6);
+}
+.colorUtils_colorUtilsCSS_compound_0__k096v4e {
+  --vars_text__k096v40: var(--dt-colors-text-primary-on-accent-default, #f4f4fb);
+  --vars_icon__k096v41: var(--dt-colors-icon-primary-on-accent-default, #f4f4fb);
+  --vars_borderColor__k096v42: var(--dt-colors-border-primary-accent, #454cc9);
+}
+.colorUtils_colorUtilsCSS_compound_1__k096v4f {
+  --vars_text__k096v40: var(--dt-colors-text-success-on-accent-default, #f1f4f4);
+  --vars_icon__k096v41: var(--dt-colors-icon-success-on-accent-default, #f1f4f4);
+  --vars_borderColor__k096v42: var(--dt-colors-border-success-accent, #2c6360);
+}
+.colorUtils_colorUtilsCSS_compound_2__k096v4g {
+  --vars_text__k096v40: var(--dt-colors-text-warning-on-accent-default, #272025);
+  --vars_icon__k096v41: var(--dt-colors-icon-warning-on-accent-default, #272025);
+  --vars_borderColor__k096v42: var(--dt-colors-border-warning-accent, #805100);
+}
+.colorUtils_colorUtilsCSS_compound_3__k096v4h {
+  --vars_text__k096v40: var(--dt-colors-text-critical-on-accent-default, #f9f1f3);
+  --vars_icon__k096v41: var(--dt-colors-icon-critical-on-accent-default, #f9f1f3);
+  --vars_borderColor__k096v42: var(--dt-colors-border-critical-accent, #b80031);
+}
+.colorUtils_colorUtilsCSS_compound_4__k096v4i {
+  --vars_text__k096v40: var(--dt-colors-text-neutral-on-accent-default, #f3f3f6);
+  --vars_icon__k096v41: var(--dt-colors-icon-neutral-on-accent-default, #f3f3f6);
+  --vars_borderColor__k096v42: var(--dt-colors-border-neutral-accent, #545587);
+}
+.colorUtils_colorUtilsCSS_compound_5__k096v4j {
+  --vars_text__k096v40: var(--dt-colors-text-primary-disabled, #54558780);
+  --vars_icon__k096v41: var(--dt-colors-icon-primary-disabled, #54558780);
+  --vars_borderColor__k096v42: var(--dt-colors-border-primary-disabled, #d2d3e180);
+}
+.colorUtils_colorUtilsCSS_compound_6__k096v4k {
+  --vars_text__k096v40: var(--dt-colors-text-success-disabled, #54558780);
+  --vars_icon__k096v41: var(--dt-colors-icon-success-disabled, #54558780);
+  --vars_borderColor__k096v42: var(--dt-colors-border-success-disabled, #d2d3e180);
+}
+.colorUtils_colorUtilsCSS_compound_7__k096v4l {
+  --vars_text__k096v40: var(--dt-colors-text-warning-disabled, #54558780);
+  --vars_icon__k096v41: var(--dt-colors-icon-warning-disabled, #54558780);
+  --vars_borderColor__k096v42: var(--dt-colors-border-warning-disabled, #d2d3e180);
+}
+.colorUtils_colorUtilsCSS_compound_8__k096v4m {
+  --vars_text__k096v40: var(--dt-colors-text-critical-disabled, #54558780);
+  --vars_icon__k096v41: var(--dt-colors-icon-critical-disabled, #54558780);
+  --vars_borderColor__k096v42: var(--dt-colors-border-critical-disabled, #d2d3e180);
+}
+.colorUtils_colorUtilsCSS_compound_9__k096v4n {
+  --vars_text__k096v40: var(--dt-colors-text-neutral-disabled, #54558780);
+  --vars_icon__k096v41: var(--dt-colors-icon-neutral-disabled, #54558780);
+  --vars_borderColor__k096v42: var(--dt-colors-border-neutral-disabled, #d2d3e180);
+}

package/esm/core/utils/colorUtils.sty.js

@@ -0,0 +1,9 @@
+import "./colorUtils.css";
+import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
+var colorUtilsCSS = _7a468({ defaultClassName: "colorUtils__k096v43", variantClassNames: { color: { critical: "colorUtils_colorUtilsCSS_color_critical__k096v44", neutral: "colorUtils_colorUtilsCSS_color_neutral__k096v45", primary: "colorUtils_colorUtilsCSS_color_primary__k096v46", success: "colorUtils_colorUtilsCSS_color_success__k096v47", warning: "colorUtils_colorUtilsCSS_color_warning__k096v48", onAccent: "colorUtils_colorUtilsCSS_color_onAccent__k096v49" }, variant: { "default": "colorUtils_colorUtilsCSS_variant_default__k096v4a", accent: "colorUtils_colorUtilsCSS_variant_accent__k096v4b" }, disabled: { true: "colorUtils_colorUtilsCSS_disabled_true__k096v4c", false: "colorUtils_colorUtilsCSS_disabled_false__k096v4d" } }, defaultVariants: {}, compoundVariants: [[{ color: "primary", variant: "accent" }, "colorUtils_colorUtilsCSS_compound_0__k096v4e"], [{ color: "success", variant: "accent" }, "colorUtils_colorUtilsCSS_compound_1__k096v4f"], [{ color: "warning", variant: "accent" }, "colorUtils_colorUtilsCSS_compound_2__k096v4g"], [{ color: "critical", variant: "accent" }, "colorUtils_colorUtilsCSS_compound_3__k096v4h"], [{ color: "neutral", variant: "accent" }, "colorUtils_colorUtilsCSS_compound_4__k096v4i"], [{ color: "primary", disabled: true }, "colorUtils_colorUtilsCSS_compound_5__k096v4j"], [{ color: "success", disabled: true }, "colorUtils_colorUtilsCSS_compound_6__k096v4k"], [{ color: "warning", disabled: true }, "colorUtils_colorUtilsCSS_compound_7__k096v4l"], [{ color: "critical", disabled: true }, "colorUtils_colorUtilsCSS_compound_8__k096v4m"], [{ color: "neutral", disabled: true }, "colorUtils_colorUtilsCSS_compound_9__k096v4n"]] });
+var colorUtilsVars = { text: "var(--vars_text__k096v40)", icon: "var(--vars_icon__k096v41)", borderColor: "var(--vars_borderColor__k096v42)" };
+export {
+  colorUtilsCSS,
+  colorUtilsVars
+};
+//# sourceMappingURL=colorUtils.sty.js.map

package/esm/core/utils/colorUtils.sty.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/utils/colorUtils.css.ts"],
+  "sourcesContent": ["import './colorUtils.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var colorUtilsCSS = _7a468({defaultClassName:'colorUtils__k096v43',variantClassNames:{color:{critical:'colorUtils_colorUtilsCSS_color_critical__k096v44',neutral:'colorUtils_colorUtilsCSS_color_neutral__k096v45',primary:'colorUtils_colorUtilsCSS_color_primary__k096v46',success:'colorUtils_colorUtilsCSS_color_success__k096v47',warning:'colorUtils_colorUtilsCSS_color_warning__k096v48',onAccent:'colorUtils_colorUtilsCSS_color_onAccent__k096v49'},variant:{'default':'colorUtils_colorUtilsCSS_variant_default__k096v4a',accent:'colorUtils_colorUtilsCSS_variant_accent__k096v4b'},disabled:{true:'colorUtils_colorUtilsCSS_disabled_true__k096v4c',false:'colorUtils_colorUtilsCSS_disabled_false__k096v4d'}},defaultVariants:{},compoundVariants:[[{color:'primary',variant:'accent'},'colorUtils_colorUtilsCSS_compound_0__k096v4e'],[{color:'success',variant:'accent'},'colorUtils_colorUtilsCSS_compound_1__k096v4f'],[{color:'warning',variant:'accent'},'colorUtils_colorUtilsCSS_compound_2__k096v4g'],[{color:'critical',variant:'accent'},'colorUtils_colorUtilsCSS_compound_3__k096v4h'],[{color:'neutral',variant:'accent'},'colorUtils_colorUtilsCSS_compound_4__k096v4i'],[{color:'primary',disabled:true},'colorUtils_colorUtilsCSS_compound_5__k096v4j'],[{color:'success',disabled:true},'colorUtils_colorUtilsCSS_compound_6__k096v4k'],[{color:'warning',disabled:true},'colorUtils_colorUtilsCSS_compound_7__k096v4l'],[{color:'critical',disabled:true},'colorUtils_colorUtilsCSS_compound_8__k096v4m'],[{color:'neutral',disabled:true},'colorUtils_colorUtilsCSS_compound_9__k096v4n']]});\nexport var colorUtilsVars = {text:'var(--vars_text__k096v40)',icon:'var(--vars_icon__k096v41)',borderColor:'var(--vars_borderColor__k096v42)'};"],
+  "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,gBAAgB,OAAO,EAAC,kBAAiB,uBAAsB,mBAAkB,EAAC,OAAM,EAAC,UAAS,oDAAmD,SAAQ,mDAAkD,SAAQ,mDAAkD,SAAQ,mDAAkD,SAAQ,mDAAkD,UAAS,mDAAkD,GAAE,SAAQ,EAAC,WAAU,qDAAoD,QAAO,mDAAkD,GAAE,UAAS,EAAC,MAAK,mDAAkD,OAAM,mDAAkD,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,CAAC,EAAC,OAAM,WAAU,SAAQ,SAAQ,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,WAAU,SAAQ,SAAQ,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,WAAU,SAAQ,SAAQ,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,YAAW,SAAQ,SAAQ,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,WAAU,SAAQ,SAAQ,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,WAAU,UAAS,KAAI,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,WAAU,UAAS,KAAI,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,WAAU,UAAS,KAAI,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,YAAW,UAAS,KAAI,GAAE,8CAA8C,GAAE,CAAC,EAAC,OAAM,WAAU,UAAS,KAAI,GAAE,8CAA8C,CAAC,EAAC,CAAC;AAC7hD,IAAI,iBAAiB,EAAC,MAAK,6BAA4B,MAAK,6BAA4B,aAAY,mCAAkC;",
+  "names": []
+}

package/esm/core/utils/isBrowser.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/core/utils/isBrowser.ts"],
-  "sourcesContent": ["/**\n * @internal\n *\n * Whether the code is currently executed in a browser\n * @see https://github.com/chakra-ui/chakra-ui/blob/main/packages/utils/src/dom.ts\n */\nexport const isBrowser = (() => {\n  return !!(\n    typeof window !== 'undefined' &&\n    window.document &&\n    window.document.createElement\n  );\n})();\n"],
+  "sourcesContent": ["/**\n * @internal\n *\n * Whether the code is currently executed in a browser\n * @see {@link https://github.com/chakra-ui/chakra-ui/blob/main/packages/utils/src/dom.ts}\n */\nexport const isBrowser = (() => {\n  return !!(\n    typeof window !== 'undefined' &&\n    window.document &&\n    window.document.createElement\n  );\n})();\n"],
   "mappings": "AAMO,MAAM,aAAa,MAAM;AAC9B,SAAO,CAAC,EACN,OAAO,WAAW,eAClB,OAAO,YACP,OAAO,SAAS;AAEpB,GAAG;",
   "names": []
 }

package/esm/core/utils/merge-props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/core/utils/merge-props.ts"],
-  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n/**\n * Calls all functions in the order they were chained with the same arguments.\n */\nfunction chain(...callbacks: any[]): (...args: any[]) => void {\n  return (...args: any[]) => {\n    for (const callback of callbacks) {\n      if (typeof callback === 'function') {\n        callback(...args);\n      }\n    }\n  };\n}\n\n// taken from: https://stackoverflow.com/questions/51603250/typescript-3-parameter-list-intersection-type/51604379#51604379\n/**\n * @internal\n * Internal helper mapper type for mergeProps\n */\nexport type TupleTypes<T> = { [P in keyof T]: T[P] } extends {\n  [key: number]: infer V;\n}\n  ? NullToObject<V>\n  : never;\n\n/**\n * @internal\n * Internal helper mapper type for mergeProps\n */\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport type NullToObject<T> = T extends null | undefined ? {} : T;\n\n/**\n * @internal\n * Internal helper mapper type for mergeProps\n */\n// eslint-disable-next-line no-undef, @typescript-eslint/no-unused-vars\nexport type UnionToIntersection<U> = (\n  U extends any ? (k: U) => void : never\n) extends (k: infer I) => void\n  ? I\n  : never;\n\n/**\n * @internal\n *\n * Merges multiple props objects together. Event handlers are chained,\n * classNames are combined, and ids are deduplicated - different ids\n * will trigger a side-effect and re-render components hooked up with `useId`.\n * For all other props, the last prop object overrides all previous ones.\n * @param args - Multiple sets of props to merge together.\n */\nexport function mergeProps<\n  T extends (\n    | {\n        [key: string]: any;\n      }\n    | null\n    | undefined\n  )[],\n>(...args: T): UnionToIntersection<TupleTypes<T>> {\n  // Start with a base clone of the first argument. This is a lot faster than starting\n  // with an empty object and adding properties as we go.\n  const result = { ...args[0] };\n  for (let i = 1; i < args.length; i++) {\n    const props = args[i];\n    for (const key in props) {\n      const a = result[key];\n      const b = props[key];\n\n      // Chain events\n      if (\n        typeof a === 'function' &&\n        typeof b === 'function' &&\n        // This is a lot faster than a regex.\n        key[0] === 'o' &&\n        key[1] === 'n' &&\n        key.charCodeAt(2) >= /* 'A' */ 65 &&\n        key.charCodeAt(2) <= /* 'Z' */ 90\n      ) {\n        result[key] = chain(a, b);\n      } else {\n        result[key] = b !== undefined ? b : a;\n      }\n    }\n  }\n\n  return result as UnionToIntersection<TupleTypes<T>>;\n}\n"],
-  "mappings": "AAKA,SAAS,SAAS,WAA4C;AAC5D,SAAO,IAAI,SAAgB;AACzB,eAAW,YAAY,WAAW;AAChC,UAAI,OAAO,aAAa,YAAY;AAClC,iBAAS,GAAG,IAAI;AAAA,MAClB;AAAA,IACF;AAAA,EACF;AACF;AAwCO,SAAS,cAQX,MAA6C;AAGhD,QAAM,SAAS,EAAE,GAAG,KAAK,CAAC,EAAE;AAC5B,WAAS,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;AACpC,UAAM,QAAQ,KAAK,CAAC;AACpB,eAAW,OAAO,OAAO;AACvB,YAAM,IAAI,OAAO,GAAG;AACpB,YAAM,IAAI,MAAM,GAAG;AAGnB,UACE,OAAO,MAAM,cACb,OAAO,MAAM;AAAA,MAEb,IAAI,CAAC,MAAM,OACX,IAAI,CAAC,MAAM,OACX,IAAI,WAAW,CAAC;AAAA,MAAe,MAC/B,IAAI,WAAW,CAAC;AAAA,MAAe,IAC/B;AACA,eAAO,GAAG,IAAI,MAAM,GAAG,CAAC;AAAA,MAC1B,OAAO;AACL,eAAO,GAAG,IAAI,MAAM,SAAY,IAAI;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;",
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n/**\n * Calls all functions in the order they were chained with the same arguments.\n */\nfunction chain(...callbacks: any[]): (...args: any[]) => void {\n  return (...args: any[]) => {\n    for (const callback of callbacks) {\n      if (typeof callback === 'function') {\n        callback(...args);\n      }\n    }\n  };\n}\n\n// taken from: https://stackoverflow.com/questions/51603250/typescript-3-parameter-list-intersection-type/51604379#51604379\n/**\n * Internal helper mapper type for mergeProps.\n * @internal\n */\nexport type TupleTypes<T> = { [P in keyof T]: T[P] } extends {\n  [key: number]: infer V;\n}\n  ? NullToObject<V>\n  : never;\n\n/**\n * Internal helper mapper type for mergeProps.\n * @internal\n */\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport type NullToObject<T> = T extends null | undefined ? {} : T;\n\n/**\n * Internal helper mapper type for mergeProps.\n * @internal\n */\n// eslint-disable-next-line no-undef, @typescript-eslint/no-unused-vars\nexport type UnionToIntersection<U> = (\n  U extends any ? (k: U) => void : never\n) extends (k: infer I) => void\n  ? I\n  : never;\n\n/**\n * Merges multiple props objects together. Event handlers are chained,\n * classNames are combined, and ids are deduplicated - different ids\n * will trigger a side-effect and re-render components hooked up with `useId`.\n * For all other props, the last prop object overrides all previous ones.\n * @param args - Multiple sets of props to merge together.\n * @internal\n */\nexport function mergeProps<\n  T extends (\n    | {\n        [key: string]: any;\n      }\n    | null\n    | undefined\n  )[],\n>(...args: T): UnionToIntersection<TupleTypes<T>> {\n  // Start with a base clone of the first argument. This is a lot faster than starting\n  // with an empty object and adding properties as we go.\n  const result = { ...args[0] };\n  for (let i = 1; i < args.length; i++) {\n    const props = args[i];\n    for (const key in props) {\n      const a = result[key];\n      const b = props[key];\n\n      // Chain events\n      if (\n        typeof a === 'function' &&\n        typeof b === 'function' &&\n        // This is a lot faster than a regex.\n        key[0] === 'o' &&\n        key[1] === 'n' &&\n        key.charCodeAt(2) >= /* 'A' */ 65 &&\n        key.charCodeAt(2) <= /* 'Z' */ 90\n      ) {\n        result[key] = chain(a, b);\n      } else {\n        result[key] = b !== undefined ? b : a;\n      }\n    }\n  }\n\n  return result as UnionToIntersection<TupleTypes<T>>;\n}\n"],
+  "mappings": "AAKA,SAAS,SAAS,WAA4C;AAC5D,SAAO,IAAI,SAAgB;AACzB,eAAW,YAAY,WAAW;AAChC,UAAI,OAAO,aAAa,YAAY;AAClC,iBAAS,GAAG,IAAI;AAAA,MAClB;AAAA,IACF;AAAA,EACF;AACF;AAuCO,SAAS,cAQX,MAA6C;AAGhD,QAAM,SAAS,EAAE,GAAG,KAAK,CAAC,EAAE;AAC5B,WAAS,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;AACpC,UAAM,QAAQ,KAAK,CAAC;AACpB,eAAW,OAAO,OAAO;AACvB,YAAM,IAAI,OAAO,GAAG;AACpB,YAAM,IAAI,MAAM,GAAG;AAGnB,UACE,OAAO,MAAM,cACb,OAAO,MAAM;AAAA,MAEb,IAAI,CAAC,MAAM,OACX,IAAI,CAAC,MAAM,OACX,IAAI,WAAW,CAAC;AAAA,MAAe,MAC/B,IAAI,WAAW,CAAC;AAAA,MAAe,IAC/B;AACA,eAAO,GAAG,IAAI,MAAM,GAAG,CAAC;AAAA,MAC1B,OAAO;AACL,eAAO,GAAG,IAAI,MAAM,SAAY,IAAI;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;",
   "names": []
 }

package/esm/core/utils/seed-random.js

@@ -0,0 +1,16 @@
+const memoizedRandomGenerators = {};
+function mulberry32(seed) {
+  if (memoizedRandomGenerators[seed] === void 0) {
+    memoizedRandomGenerators[seed] = () => {
+      let t = seed += 1831565813;
+      t = Math.imul(t ^ t >>> 15, t | 1);
+      t ^= t + Math.imul(t ^ t >>> 7, t | 61);
+      return ((t ^ t >>> 14) >>> 0) / 4294967296;
+    };
+  }
+  return memoizedRandomGenerators[seed];
+}
+export {
+  mulberry32
+};
+//# sourceMappingURL=seed-random.js.map

package/esm/core/utils/seed-random.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/utils/seed-random.ts"],
+  "sourcesContent": ["/* eslint-disable no-mixed-operators */\n\n/** Memoize currified mulberry32 generators to ensure that sequences are honored for the same seed */\nconst memoizedRandomGenerators: Record<number, () => number> = {};\n\n/**\n * Generate a random seed function based on the mulberry32 algorithm\n * @internal\n */\nexport function mulberry32(seed: number) {\n  if (memoizedRandomGenerators[seed] === void 0) {\n    memoizedRandomGenerators[seed] = () => {\n      let t = (seed += 0x6d2b79f5);\n      t = Math.imul(t ^ (t >>> 15), t | 1);\n      t ^= t + Math.imul(t ^ (t >>> 7), t | 61);\n      return ((t ^ (t >>> 14)) >>> 0) / 4294967296;\n    };\n  }\n\n  return memoizedRandomGenerators[seed];\n}\n"],
+  "mappings": "AAGA,MAAM,2BAAyD,CAAC;AAMzD,SAAS,WAAW,MAAc;AACvC,MAAI,yBAAyB,IAAI,MAAM,QAAQ;AAC7C,6BAAyB,IAAI,IAAI,MAAM;AACrC,UAAI,IAAK,QAAQ;AACjB,UAAI,KAAK,KAAK,IAAK,MAAM,IAAK,IAAI,CAAC;AACnC,WAAK,IAAI,KAAK,KAAK,IAAK,MAAM,GAAI,IAAI,EAAE;AACxC,eAAS,IAAK,MAAM,QAAS,KAAK;AAAA,IACpC;AAAA,EACF;AAEA,SAAO,yBAAyB,IAAI;AACtC;",
+  "names": []
+}

package/esm/core/utils/uuidv4.js

@@ -0,0 +1,13 @@
+import { mulberry32 } from "./seed-random.js";
+function uuidv4(seed) {
+  const random = seed !== void 0 ? mulberry32(seed) : Math.random;
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (char) => {
+    const randomNumber = random() * 16 | 0;
+    const value = char === "x" ? randomNumber : randomNumber & 3 | 8;
+    return value.toString(16);
+  });
+}
+export {
+  uuidv4
+};
+//# sourceMappingURL=uuidv4.js.map

package/esm/core/utils/uuidv4.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/utils/uuidv4.ts"],
+  "sourcesContent": ["import { mulberry32 } from './seed-random.js';\n\n/**\n * Generates a uuidv4\n * @internal\n */\nexport function uuidv4(seed?: number) {\n  // If a seed is given, use a seeded random function to generate the uuid.\n  const random = seed !== void 0 ? mulberry32(seed) : Math.random;\n  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (char) => {\n    // eslint-disable-next-line no-mixed-operators\n    const randomNumber = (random() * 16) | 0;\n    const value = char === 'x' ? randomNumber : (randomNumber & 0x3) | 0x8;\n    return value.toString(16);\n  });\n}\n"],
+  "mappings": "AAAA,SAAS,kBAAkB;AAMpB,SAAS,OAAO,MAAe;AAEpC,QAAM,SAAS,SAAS,SAAS,WAAW,IAAI,IAAI,KAAK;AACzD,SAAO,uCAAuC,QAAQ,SAAS,CAAC,SAAS;AAEvE,UAAM,eAAgB,OAAO,IAAI,KAAM;AACvC,UAAM,QAAQ,SAAS,MAAM,eAAgB,eAAe,IAAO;AACnE,WAAO,MAAM,SAAS,EAAE;AAAA,EAC1B,CAAC;AACH;",
+  "names": []
+}

package/esm/index.js

@@ -1,2 +1,6 @@
 export * from "./core/index.js";
+export * from "./content/index.js";
+export * from "./layouts/index.js";
+export * from "./styles/index.js";
+export * from "./typography/index.js";
 //# sourceMappingURL=index.js.map

package/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.ts"],
-  "sourcesContent": ["export * from './core/index.js';\n"],
-  "mappings": "AAAA,cAAc;",
+  "sourcesContent": ["export * from './core/index.js';\nexport * from './content/index.js';\nexport * from './layouts/index.js';\nexport * from './styles/index.js';\nexport * from './typography/index.js';\n"],
+  "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
   "names": []
 }

package/esm/layouts/Divider/Divider.css

@@ -0,0 +1,23 @@
+.Divider_dividerCSS__1ljcfp90 {
+  border: none;
+  margin: 0;
+  overflow-wrap: break-word;
+  background-color: var(--vars_borderColor__k096v42);
+}
+.Divider_dividerCSS_orientation_horizontal__1ljcfp91 {
+  width: 100%;
+  height: var(--dt-borders-width-default, 1px);
+}
+.Divider_dividerCSS_orientation_vertical__1ljcfp92 {
+  width: var(--dt-borders-width-default, 1px);
+  height: 100%;
+}
+.Divider_dividerCSS_compound_0__1ljcfp95 {
+  flex-shrink: 0;
+}
+.Divider_dividerCSS_compound_1__1ljcfp96 {
+  flex-shrink: 0;
+  width: var(--dt-borders-width-default, 1px);
+  height: auto;
+  align-self: stretch;
+}

package/esm/layouts/Divider/Divider.js

@@ -0,0 +1,39 @@
+import clsx from "clsx";
+import React, { forwardRef } from "react";
+import { dividerCSS } from "./Divider.sty.js";
+import { colorUtilsCSS } from "../../core/utils/colorUtils.sty.js";
+const Divider = /* @__PURE__ */ forwardRef((props, ref) => {
+  const {
+    orientation = "horizontal",
+    flexItem = true,
+    as = "div",
+    color = "neutral",
+    variant = "default",
+    "data-testid": dataTestId,
+    className: consumerClassName,
+    style: consumerStyle,
+    ...remainingProps
+  } = props;
+  const DividerTag = as;
+  return /* @__PURE__ */ React.createElement(
+    DividerTag,
+    {
+      role: "separator",
+      "aria-orientation": orientation === "vertical" ? orientation : void 0,
+      ref,
+      "data-testid": dataTestId,
+      className: clsx(
+        colorUtilsCSS({ color, variant }),
+        dividerCSS({ orientation, flexItem }),
+        consumerClassName
+      ),
+      style: consumerStyle,
+      ...remainingProps
+    }
+  );
+});
+Divider.displayName = "Divider";
+export {
+  Divider
+};
+//# sourceMappingURL=Divider.js.map