@dnanpm/ui-components 0.8.0 → 0.10.0

package/dist/components/Pagination/Pagination.utils.js

@@ -0,0 +1,76 @@
+const pageBudgets = [3, 5, 7, 9];
+const validatePages = (currentPage, totalPages) => {
+  if (!Number.isSafeInteger(totalPages) || totalPages < 0) {
+    throw new RangeError("Pagination: totalPages must be a nonnegative safe integer.");
+  }
+  if (!Number.isSafeInteger(currentPage) || currentPage < 1 || totalPages > 0 && currentPage > totalPages) {
+    throw new RangeError(
+      "Pagination: currentPage must be a positive safe integer within totalPages."
+    );
+  }
+};
+const pageItem = (page) => ({
+  key: `page-${page}`,
+  kind: "page",
+  page
+});
+const getPageItems = (currentPage, totalPages, budget) => {
+  if (totalPages === 0) return [];
+  const count = Math.min(budget, totalPages);
+  if (totalPages <= budget || budget < 7) {
+    const start2 = Math.max(
+      1,
+      Math.min(currentPage - Math.floor(count / 2), totalPages - count + 1)
+    );
+    return Array.from({ length: count }, (_, index) => pageItem(start2 + index));
+  }
+  const siblings = (budget - 5) / 2;
+  const windowSize = budget - 4;
+  const start = Math.max(2, Math.min(currentPage - siblings, totalPages - windowSize));
+  const pages = [1];
+  if (currentPage <= siblings + 2) {
+    for (let page = 2; page <= budget - 2; page++) pages.push(page);
+  } else if (currentPage >= totalPages - siblings - 1) {
+    for (let offset = budget - 3; offset >= 1; offset--) pages.push(totalPages - offset);
+  } else {
+    for (let offset = 0; offset < windowSize; offset++) pages.push(start + offset);
+  }
+  pages.push(totalPages);
+  return pages.flatMap((page, index) => {
+    const previous = pages[index - 1];
+    if (previous === void 0 || page === previous + 1) return [pageItem(page)];
+    if (page === previous + 2) return [pageItem(previous + 1), pageItem(page)];
+    return [
+      { key: `gap-${previous}-${page}`, kind: "gap", after: previous, before: page },
+      pageItem(page)
+    ];
+  });
+};
+const getPageCandidates = (currentPage, totalPages) => {
+  const candidates = /* @__PURE__ */ new Map();
+  for (const budget of pageBudgets) {
+    for (const item of getPageItems(currentPage, totalPages, budget)) {
+      const existing = candidates.get(item.key);
+      if (existing) existing.budgets.push(budget);
+      else candidates.set(item.key, { item, budgets: [budget] });
+    }
+  }
+  return [...candidates.values()].sort((a, b) => {
+    const aPosition = a.item.kind === "page" ? a.item.page : a.item.after;
+    const bPosition = b.item.kind === "page" ? b.item.page : b.item.after;
+    return aPosition - bPosition || Number(a.item.kind === "gap") - Number(b.item.kind === "gap");
+  });
+};
+const getPageWidth = (totalPages) => {
+  const digits = String(totalPages).length;
+  if (digits <= 2) return "normal";
+  return "wide";
+};
+export {
+  getPageCandidates,
+  getPageItems,
+  getPageWidth,
+  pageBudgets,
+  validatePages
+};
+//# sourceMappingURL=Pagination.utils.js.map

package/dist/components/Pagination/Pagination.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.utils.js","sources":["../../../src/components/Pagination/Pagination.utils.ts"],"sourcesContent":["export const pageBudgets = [3, 5, 7, 9] as const;\nexport type PageBudget = (typeof pageBudgets)[number];\n\nexport type PaginationItem =\n    | { readonly key: string; readonly kind: 'page'; readonly page: number }\n    | {\n          readonly key: string;\n          readonly kind: 'gap';\n          readonly after: number;\n          readonly before: number;\n      };\n\nexport interface PaginationCandidate {\n    readonly item: PaginationItem;\n    readonly budgets: readonly PageBudget[];\n}\n\nexport const validatePages = (currentPage: number, totalPages: number) => {\n    if (!Number.isSafeInteger(totalPages) || totalPages < 0) {\n        throw new RangeError('Pagination: totalPages must be a nonnegative safe integer.');\n    }\n    if (\n        !Number.isSafeInteger(currentPage) ||\n        currentPage < 1 ||\n        (totalPages > 0 && currentPage > totalPages)\n    ) {\n        throw new RangeError(\n            'Pagination: currentPage must be a positive safe integer within totalPages.',\n        );\n    }\n};\n\nconst pageItem = (page: number): PaginationItem => ({\n    key: `page-${page}`,\n    kind: 'page',\n    page,\n});\n\nexport const getPageItems = (\n    currentPage: number,\n    totalPages: number,\n    budget: PageBudget,\n): PaginationItem[] => {\n    if (totalPages === 0) return [];\n\n    const count = Math.min(budget, totalPages);\n    if (totalPages <= budget || budget < 7) {\n        const start = Math.max(\n            1,\n            Math.min(currentPage - Math.floor(count / 2), totalPages - count + 1),\n        );\n        return Array.from({ length: count }, (_, index) => pageItem(start + index));\n    }\n\n    const siblings = (budget - 5) / 2;\n    const windowSize = budget - 4;\n    const start = Math.max(2, Math.min(currentPage - siblings, totalPages - windowSize));\n    const pages = [1];\n    if (currentPage <= siblings + 2) {\n        for (let page = 2; page <= budget - 2; page++) pages.push(page);\n    } else if (currentPage >= totalPages - siblings - 1) {\n        for (let offset = budget - 3; offset >= 1; offset--) pages.push(totalPages - offset);\n    } else {\n        for (let offset = 0; offset < windowSize; offset++) pages.push(start + offset);\n    }\n    pages.push(totalPages);\n\n    return pages.flatMap((page, index): PaginationItem[] => {\n        const previous = pages[index - 1];\n        if (previous === undefined || page === previous + 1) return [pageItem(page)];\n        if (page === previous + 2) return [pageItem(previous + 1), pageItem(page)];\n        return [\n            { key: `gap-${previous}-${page}`, kind: 'gap', after: previous, before: page },\n            pageItem(page),\n        ];\n    });\n};\n\nexport const getPageCandidates = (\n    currentPage: number,\n    totalPages: number,\n): PaginationCandidate[] => {\n    const candidates = new Map<string, { item: PaginationItem; budgets: PageBudget[] }>();\n    for (const budget of pageBudgets) {\n        for (const item of getPageItems(currentPage, totalPages, budget)) {\n            const existing = candidates.get(item.key);\n            if (existing) existing.budgets.push(budget);\n            else candidates.set(item.key, { item, budgets: [budget] });\n        }\n    }\n    return [...candidates.values()].sort((a, b) => {\n        const aPosition = a.item.kind === 'page' ? a.item.page : a.item.after;\n        const bPosition = b.item.kind === 'page' ? b.item.page : b.item.after;\n        return (\n            aPosition - bPosition || Number(a.item.kind === 'gap') - Number(b.item.kind === 'gap')\n        );\n    });\n};\n\nexport const getPageWidth = (totalPages: number) => {\n    const digits = String(totalPages).length;\n    if (digits <= 2) return 'normal';\n    return 'wide';\n};\n"],"names":["start"],"mappings":"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"}

package/dist/components/Pagination/index.d.ts

@@ -0,0 +1,3 @@
+export { Pagination } from './Pagination';
+export type { PaginationProps } from './Pagination.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Pagination/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/Pictograph/Pictograph.css

@@ -1,4 +1,8 @@
-@layer dds-components {/**
+@layer dds-base, dds-components;
+
+@layer dds-components { @layer fallback, components; }
+
+@layer dds-components.components{/**
  * Pictograph Component Styles
  *
  * Grid-based layout for pictograph items with responsive columns,
@@ -199,4 +203,7 @@
         --_pictograph-icon-color: var(--color-semantic-foreground-inverse);
     }
 }
-}
+
+/**
+ * Do not edit directly, this file was auto-generated.
+ */ }

package/dist/components/Pictograph/PictographItem.css

@@ -1,4 +1,8 @@
-@layer dds-components {/**
+@layer dds-base, dds-components;
+
+@layer dds-components { @layer fallback, components; }
+
+@layer dds-components.components{/**
  * PictographItem Component Styles
  *
  * Individual pictograph item containing an icon and text area.
@@ -63,4 +67,7 @@
 ._pictograph-item_1jsnm_9[data-pictograph-content='long'] ._pictograph-item__text_1jsnm_35 > p {
     font: var(--_pictograph-long-body-font);
 }
-}
+
+/**
+ * Do not edit directly, this file was auto-generated.
+ */ }

package/dist/components/Quote/Quote.css

@@ -1,4 +1,4 @@
-@layer dds-components {._quote_1dakr_1 {
+@layer dds-base, dds-components;@layer dds-components { @layer fallback, components; }@layer dds-components.components{._quote_1dakr_1 {
     display: flex;
     align-items: flex-start;
     gap: var(--spacing-space-20);
@@ -92,4 +92,7 @@
         color: CanvasText;
     }
 }
-}
+
+/**
+ * Do not edit directly, this file was auto-generated.
+ */ }

package/dist/components/Spinner/Spinner.css

@@ -1,4 +1,8 @@
-@layer dds-components {/* ─────────────────────────────────────────────────────────────
+@layer dds-base, dds-components;
+
+@layer dds-components { @layer fallback, components; }
+
+@layer dds-components.components{/* ─────────────────────────────────────────────────────────────
    Spinner — base
    ───────────────────────────────────────────────────────────── */
 
@@ -113,4 +117,7 @@
         animation-duration: 3s;
     }
 }
-}
+
+/**
+ * Do not edit directly, this file was auto-generated.
+ */ }

package/dist/design-tokens/dist/tokens.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const LayoutSemanticBreakpointDesktop = "1024px";
+exports.LayoutSemanticBreakpointDesktop = LayoutSemanticBreakpointDesktop;
+//# sourceMappingURL=tokens.cjs.map

package/dist/design-tokens/dist/tokens.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.cjs","sources":["../../../../design-tokens/dist/tokens.js"],"sourcesContent":["/**\n * Do not edit directly, this file was auto-generated.\n */\n\nexport const ColorSemanticForegroundDefault = \"#121212\";\nexport const ColorSemanticForegroundMuted = \"#505050\";\nexport const ColorSemanticForegroundInverse = \"#ffffff\";\nexport const ColorSemanticForegroundPrimaryStrong = \"#da0070\";\nexport const ColorSemanticForegroundPrimaryMid = \"#ff82c1\";\nexport const ColorSemanticForegroundPrimarySoft = \"#ffbfe0\";\nexport const ColorSemanticForegroundSecondaryStrong = \"#551c3e\";\nexport const ColorSemanticForegroundSecondaryMid = \"#69214c\";\nexport const ColorSemanticForegroundSecondarySoft = \"#792a59\";\nexport const ColorSemanticForegroundStatusError = \"#dd0a0a\";\nexport const ColorSemanticForegroundStatusWarning = \"#eb6600\";\nexport const ColorSemanticForegroundStatusSuccess = \"#008500\";\nexport const ColorSemanticForegroundStatusInfo = \"#0b7c99\";\nexport const ColorSemanticForegroundLink = \"#da0070\";\nexport const ColorSemanticForegroundLinkInverse = \"#ffffff\";\nexport const ColorSemanticForegroundLinkHover = \"#ae005a\";\nexport const ColorSemanticForegroundLinkInverseHover = \"#ffffffcc\";\nexport const ColorSemanticForegroundInverseMuted = \"#ffffffb3\";\nexport const ColorSemanticSurfaceBase = \"#ffffff\";\nexport const ColorSemanticSurfaceNeutralSoft = \"#fdfbfa\";\nexport const ColorSemanticSurfaceNeutralMid = \"#f8f4f1\";\nexport const ColorSemanticSurfaceNeutralStrong = \"#ede8e1\";\nexport const ColorSemanticSurfacePrimaryStrong = \"#da0070\";\nexport const ColorSemanticSurfacePrimaryMid = \"#ff82c1\";\nexport const ColorSemanticSurfacePrimarySoft = \"#ffbfe0\";\nexport const ColorSemanticSurfaceSecondaryStrong = \"#551c3e\";\nexport const ColorSemanticSurfaceSecondaryMid = \"#69214c\";\nexport const ColorSemanticSurfaceSecondarySoft = \"#792a59\";\nexport const ColorSemanticSurfaceBaseInverse = \"#121212\";\nexport const ColorSemanticBorderNeutralMid = \"#d4d2ce\";\nexport const ColorSemanticBorderNeutralSoft = \"#e7e5e3\";\nexport const ColorSemanticBorderNeutralBase = \"#efeeed\";\nexport const ColorSemanticBorderNeutralStrong = \"#948b89\";\nexport const ColorSemanticBorderSecondary = \"#551c3e\";\nexport const ColorSemanticBorderPrimary = \"#da0070\";\nexport const ColorSemanticBorderFocus = \"#0064e2\";\nexport const ColorSemanticBorderInverse = \"#ffffff\";\nexport const ColorSemanticBorderError = \"#dd0a0a\";\nexport const ColorSemanticBorderWarning = \"#eb6600\";\nexport const ColorSemanticBorderSuccess = \"#008500\";\nexport const ColorSemanticBorderInfo = \"#0b7c99\";\nexport const ColorSemanticUtilityFocusSoft = \"#d8e9ff\";\nexport const ColorSemanticUtilityFocusStrong = \"#0064e2\";\nexport const ColorSemanticUtilityOverlayStrong = \"#551c3e66\";\nexport const ColorSemanticUtilityOverlaySoft = \"#551c3e1a\";\nexport const ColorSemanticStatusInfo = \"#0b7c99\";\nexport const ColorSemanticStatusSuccess = \"#008500\";\nexport const ColorSemanticStatusWarning = \"#eb6600\";\nexport const ColorSemanticStatusError = \"#dd0a0a\";\nexport const ColorSemanticAccentLemonStrong = \"#fff347\";\nexport const ColorSemanticAccentLemonMid = \"#fff9a3\";\nexport const ColorSemanticAccentLemonSoft = \"#fffaba\";\nexport const ColorSemanticAccentOrangeStrong = \"#ffa633\";\nexport const ColorSemanticAccentOrangeMid = \"#ffca85\";\nexport const ColorSemanticAccentOrangeSoft = \"#ffdbad\";\nexport const ColorSemanticAccentSkyStrong = \"#2ecaf0\";\nexport const ColorSemanticAccentSkyMid = \"#77dcf5\";\nexport const ColorSemanticAccentSkySoft = \"#96e4f8\";\nexport const ColorSemanticInteractivePrimaryDefault = \"#da0070\";\nexport const ColorSemanticInteractivePrimaryHover = \"#ae005a\";\nexport const ColorSemanticInteractivePrimaryActive = \"#f7007f\";\nexport const ColorSemanticInteractivePrimaryDisabled = \"#da00704d\";\nexport const ColorSemanticInteractivePrimaryFocus = \"#ae005a\";\nexport const ColorSemanticInteractiveSecondaryDefault = \"#551c3e\";\nexport const ColorSemanticInteractiveSecondaryHover = \"#441632\";\nexport const ColorSemanticInteractiveSecondaryFocus = \"#441632\";\nexport const ColorSemanticInteractiveSecondaryActive = \"#732654\";\nexport const ColorSemanticInteractiveSecondaryDisabled = \"#551c3e4d\";\nexport const ColorSemanticInteractiveNeutralDefault = \"#ede8e1\";\nexport const ColorSemanticInteractiveNeutralHover = \"#cabca7\";\nexport const ColorSemanticInteractiveNeutralFocus = \"#cabca7\";\nexport const ColorSemanticInteractiveNeutralActive = \"#efeae4\";\nexport const ColorSemanticInteractiveNeutralDisabled = \"#ede8e14d\";\nexport const ColorSemanticInteractiveFocusRing = \"#0064e2\";\nexport const ColorSemanticInteractiveFocusRingWeak = \"#d8e9ff\";\nexport const ColorSemanticInteractiveInverseDefault = \"#ffffff\";\nexport const ColorSemanticInteractiveInverseHover = \"#ffffff\";\nexport const ColorSemanticInteractiveInverseFocus = \"#ffffff\";\nexport const ColorSemanticInteractiveInverseActive = \"#ffffffe6\";\nexport const ColorSemanticInteractiveInverseDisabled = \"#ffffff4d\";\nexport const ColorSemanticInteractiveAuxiliaryDefault = \"#ffdbad\";\nexport const ColorSemanticInteractiveAuxiliaryHover = \"#ffb557\";\nexport const ColorSemanticInteractiveAuxiliaryFocus = \"#ffb557\";\nexport const ColorSemanticInteractiveAuxiliaryActive = \"#ffdbad\";\nexport const ColorSemanticInteractiveAuxiliaryDisabled = \"#ffdbad4d\";\nexport const RadiusSemanticNone = \"0px\";\nexport const RadiusSemanticSm = \"4px\";\nexport const RadiusSemanticMd = \"8px\";\nexport const RadiusSemanticLg = \"12px\";\nexport const RadiusSemanticFull = \"1000px\";\nexport const BorderwidthSemanticNone = \"0px\";\nexport const BorderwidthSemanticXs = \"1px\";\nexport const BorderwidthSemanticMd = \"3px\";\nexport const BorderwidthSemanticLg = \"4px\";\nexport const BorderwidthSemanticXl = \"5px\";\nexport const BorderwidthSemanticXxl = \"6px\";\nexport const BorderwidthSemanticSm = \"2px\";\nexport const SpacingSpace0 = \"0px\";\nexport const SpacingSpace4 = \"4px\";\nexport const SpacingSpace8 = \"8px\";\nexport const SpacingSpace12 = \"12px\";\nexport const SpacingSpace16 = \"16px\";\nexport const SpacingSpace20 = \"20px\";\nexport const SpacingSpace24 = \"24px\";\nexport const SpacingSpace32 = \"32px\";\nexport const SpacingSpace40 = \"40px\";\nexport const SpacingSpace48 = \"48px\";\nexport const SpacingSpace64 = \"64px\";\nexport const SpacingSpace80 = \"80px\";\nexport const SpacingSpace96 = \"96px\";\nexport const SpacingSpace112 = \"112px\";\nexport const SpacingSpace128 = \"128px\";\nexport const SpacingSpace144 = \"144px\";\nexport const SpacingSpace160 = \"160px\";\nexport const TypographyFontSizeHeadingXxl = \"48px\";\nexport const TypographyFontSizeHeadingXl = \"40px\";\nexport const TypographyFontSizeHeadingLg = \"34px\";\nexport const TypographyFontSizeHeadingMd = \"28px\";\nexport const TypographyFontSizeHeadingSm = \"24px\";\nexport const TypographyFontSizeHeadingXs = \"20px\";\nexport const TypographyFontSizeHeadingXxs = \"18px\";\nexport const TypographyFontSizeTextLg = \"20px\";\nexport const TypographyFontSizeTextMd = \"16px\";\nexport const TypographyFontSizeTextSm = \"14px\";\nexport const TypographyFontSizeTextXs = \"12px\";\nexport const TypographyFontSizePricingLg = \"34px\";\nexport const TypographyFontSizePricingMd = \"30px\";\nexport const TypographyFontSizePricingSm = \"24px\";\nexport const TypographyFontSizePricingXs = \"20px\";\nexport const TypographyFontWeightRegular = 400;\nexport const TypographyFontWeightMedium = 500;\nexport const TypographyFontWeightBold = 700;\nexport const TypographyFontWeightBlack = 900;\nexport const TypographyFontWeightDemiBold = 600;\nexport const TypographyLineHeightXs = 1;\nexport const TypographyLineHeightSm = 1.15;\nexport const TypographyLineHeightMd = 1.25;\nexport const TypographyLineHeightLg = 1.5;\nexport const TypographyLetterSpacingTight = \"-0.02em\";\nexport const TypographyLetterSpacingNormal = \"0em\";\nexport const TypographyLetterSpacingWide = \"0.02em\";\nexport const TypographyFontFamilyHeading = \"DNA Heading\";\nexport const TypographyFontFamilyText = \"DNA Text\";\nexport const ElevationSemanticElevationLowColor = \"#1212120f\";\nexport const ElevationSemanticElevationLowOffsetX = \"0px\";\nexport const ElevationSemanticElevationLowOffsetY = \"2px\";\nexport const ElevationSemanticElevationLowBlur = \"16px\";\nexport const ElevationSemanticElevationLowSpread = \"0px\";\nexport const ElevationSemanticElevationMediumColor = \"#12121214\";\nexport const ElevationSemanticElevationMediumOffsetX = \"0px\";\nexport const ElevationSemanticElevationMediumOffsetY = \"4px\";\nexport const ElevationSemanticElevationMediumBlur = \"24px\";\nexport const ElevationSemanticElevationMediumSpread = \"0px\";\nexport const ElevationSemanticElevationHighColor = \"#12121229\";\nexport const ElevationSemanticElevationHighOffsetX = \"0px\";\nexport const ElevationSemanticElevationHighOffsetY = \"8px\";\nexport const ElevationSemanticElevationHighBlur = \"64px\";\nexport const ElevationSemanticElevationHighSpread = \"0px\";\nexport const ZindexSemanticBelow = -1;\nexport const ZindexSemanticBase = 0;\nexport const ZindexSemanticRaised = 200;\nexport const ZindexSemanticSticky = 400;\nexport const ZindexSemanticPopup = 600;\nexport const ZindexSemanticNavigation = 1000;\nexport const ZindexSemanticWidget = 1040;\nexport const ZindexSemanticOverlay = 1100;\nexport const ZindexSemanticDialog = 1200;\nexport const ZindexSemanticSystem = 1300;\nexport const LayoutSemanticBreakpointSmallMobile = \"360px\";\nexport const LayoutSemanticBreakpointLargeMobile = \"480px\";\nexport const LayoutSemanticBreakpointTablet = \"768px\";\nexport const LayoutSemanticBreakpointDesktop = \"1024px\";\nexport const LayoutSemanticBreakpointLargeDesktop = \"1344px\";\nexport const LayoutSemanticPageMinWidth = \"320px\";\nexport const LayoutSemanticPageMaxWidth = \"2560px\";\nexport const LayoutSemanticContainerNarrow = \"628px\";\nexport const LayoutSemanticContainerDefault = \"845px\";\nexport const LayoutSemanticContainerWide = \"1280px\";\n"],"names":[],"mappings":";;AA+KY,MAAC,kCAAkC;;"}

package/dist/design-tokens/dist/tokens.js

@@ -0,0 +1,5 @@
+const LayoutSemanticBreakpointDesktop = "1024px";
+export {
+  LayoutSemanticBreakpointDesktop
+};
+//# sourceMappingURL=tokens.js.map

package/dist/design-tokens/dist/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","sources":["../../../../design-tokens/dist/tokens.js"],"sourcesContent":["/**\n * Do not edit directly, this file was auto-generated.\n */\n\nexport const ColorSemanticForegroundDefault = \"#121212\";\nexport const ColorSemanticForegroundMuted = \"#505050\";\nexport const ColorSemanticForegroundInverse = \"#ffffff\";\nexport const ColorSemanticForegroundPrimaryStrong = \"#da0070\";\nexport const ColorSemanticForegroundPrimaryMid = \"#ff82c1\";\nexport const ColorSemanticForegroundPrimarySoft = \"#ffbfe0\";\nexport const ColorSemanticForegroundSecondaryStrong = \"#551c3e\";\nexport const ColorSemanticForegroundSecondaryMid = \"#69214c\";\nexport const ColorSemanticForegroundSecondarySoft = \"#792a59\";\nexport const ColorSemanticForegroundStatusError = \"#dd0a0a\";\nexport const ColorSemanticForegroundStatusWarning = \"#eb6600\";\nexport const ColorSemanticForegroundStatusSuccess = \"#008500\";\nexport const ColorSemanticForegroundStatusInfo = \"#0b7c99\";\nexport const ColorSemanticForegroundLink = \"#da0070\";\nexport const ColorSemanticForegroundLinkInverse = \"#ffffff\";\nexport const ColorSemanticForegroundLinkHover = \"#ae005a\";\nexport const ColorSemanticForegroundLinkInverseHover = \"#ffffffcc\";\nexport const ColorSemanticForegroundInverseMuted = \"#ffffffb3\";\nexport const ColorSemanticSurfaceBase = \"#ffffff\";\nexport const ColorSemanticSurfaceNeutralSoft = \"#fdfbfa\";\nexport const ColorSemanticSurfaceNeutralMid = \"#f8f4f1\";\nexport const ColorSemanticSurfaceNeutralStrong = \"#ede8e1\";\nexport const ColorSemanticSurfacePrimaryStrong = \"#da0070\";\nexport const ColorSemanticSurfacePrimaryMid = \"#ff82c1\";\nexport const ColorSemanticSurfacePrimarySoft = \"#ffbfe0\";\nexport const ColorSemanticSurfaceSecondaryStrong = \"#551c3e\";\nexport const ColorSemanticSurfaceSecondaryMid = \"#69214c\";\nexport const ColorSemanticSurfaceSecondarySoft = \"#792a59\";\nexport const ColorSemanticSurfaceBaseInverse = \"#121212\";\nexport const ColorSemanticBorderNeutralMid = \"#d4d2ce\";\nexport const ColorSemanticBorderNeutralSoft = \"#e7e5e3\";\nexport const ColorSemanticBorderNeutralBase = \"#efeeed\";\nexport const ColorSemanticBorderNeutralStrong = \"#948b89\";\nexport const ColorSemanticBorderSecondary = \"#551c3e\";\nexport const ColorSemanticBorderPrimary = \"#da0070\";\nexport const ColorSemanticBorderFocus = \"#0064e2\";\nexport const ColorSemanticBorderInverse = \"#ffffff\";\nexport const ColorSemanticBorderError = \"#dd0a0a\";\nexport const ColorSemanticBorderWarning = \"#eb6600\";\nexport const ColorSemanticBorderSuccess = \"#008500\";\nexport const ColorSemanticBorderInfo = \"#0b7c99\";\nexport const ColorSemanticUtilityFocusSoft = \"#d8e9ff\";\nexport const ColorSemanticUtilityFocusStrong = \"#0064e2\";\nexport const ColorSemanticUtilityOverlayStrong = \"#551c3e66\";\nexport const ColorSemanticUtilityOverlaySoft = \"#551c3e1a\";\nexport const ColorSemanticStatusInfo = \"#0b7c99\";\nexport const ColorSemanticStatusSuccess = \"#008500\";\nexport const ColorSemanticStatusWarning = \"#eb6600\";\nexport const ColorSemanticStatusError = \"#dd0a0a\";\nexport const ColorSemanticAccentLemonStrong = \"#fff347\";\nexport const ColorSemanticAccentLemonMid = \"#fff9a3\";\nexport const ColorSemanticAccentLemonSoft = \"#fffaba\";\nexport const ColorSemanticAccentOrangeStrong = \"#ffa633\";\nexport const ColorSemanticAccentOrangeMid = \"#ffca85\";\nexport const ColorSemanticAccentOrangeSoft = \"#ffdbad\";\nexport const ColorSemanticAccentSkyStrong = \"#2ecaf0\";\nexport const ColorSemanticAccentSkyMid = \"#77dcf5\";\nexport const ColorSemanticAccentSkySoft = \"#96e4f8\";\nexport const ColorSemanticInteractivePrimaryDefault = \"#da0070\";\nexport const ColorSemanticInteractivePrimaryHover = \"#ae005a\";\nexport const ColorSemanticInteractivePrimaryActive = \"#f7007f\";\nexport const ColorSemanticInteractivePrimaryDisabled = \"#da00704d\";\nexport const ColorSemanticInteractivePrimaryFocus = \"#ae005a\";\nexport const ColorSemanticInteractiveSecondaryDefault = \"#551c3e\";\nexport const ColorSemanticInteractiveSecondaryHover = \"#441632\";\nexport const ColorSemanticInteractiveSecondaryFocus = \"#441632\";\nexport const ColorSemanticInteractiveSecondaryActive = \"#732654\";\nexport const ColorSemanticInteractiveSecondaryDisabled = \"#551c3e4d\";\nexport const ColorSemanticInteractiveNeutralDefault = \"#ede8e1\";\nexport const ColorSemanticInteractiveNeutralHover = \"#cabca7\";\nexport const ColorSemanticInteractiveNeutralFocus = \"#cabca7\";\nexport const ColorSemanticInteractiveNeutralActive = \"#efeae4\";\nexport const ColorSemanticInteractiveNeutralDisabled = \"#ede8e14d\";\nexport const ColorSemanticInteractiveFocusRing = \"#0064e2\";\nexport const ColorSemanticInteractiveFocusRingWeak = \"#d8e9ff\";\nexport const ColorSemanticInteractiveInverseDefault = \"#ffffff\";\nexport const ColorSemanticInteractiveInverseHover = \"#ffffff\";\nexport const ColorSemanticInteractiveInverseFocus = \"#ffffff\";\nexport const ColorSemanticInteractiveInverseActive = \"#ffffffe6\";\nexport const ColorSemanticInteractiveInverseDisabled = \"#ffffff4d\";\nexport const ColorSemanticInteractiveAuxiliaryDefault = \"#ffdbad\";\nexport const ColorSemanticInteractiveAuxiliaryHover = \"#ffb557\";\nexport const ColorSemanticInteractiveAuxiliaryFocus = \"#ffb557\";\nexport const ColorSemanticInteractiveAuxiliaryActive = \"#ffdbad\";\nexport const ColorSemanticInteractiveAuxiliaryDisabled = \"#ffdbad4d\";\nexport const RadiusSemanticNone = \"0px\";\nexport const RadiusSemanticSm = \"4px\";\nexport const RadiusSemanticMd = \"8px\";\nexport const RadiusSemanticLg = \"12px\";\nexport const RadiusSemanticFull = \"1000px\";\nexport const BorderwidthSemanticNone = \"0px\";\nexport const BorderwidthSemanticXs = \"1px\";\nexport const BorderwidthSemanticMd = \"3px\";\nexport const BorderwidthSemanticLg = \"4px\";\nexport const BorderwidthSemanticXl = \"5px\";\nexport const BorderwidthSemanticXxl = \"6px\";\nexport const BorderwidthSemanticSm = \"2px\";\nexport const SpacingSpace0 = \"0px\";\nexport const SpacingSpace4 = \"4px\";\nexport const SpacingSpace8 = \"8px\";\nexport const SpacingSpace12 = \"12px\";\nexport const SpacingSpace16 = \"16px\";\nexport const SpacingSpace20 = \"20px\";\nexport const SpacingSpace24 = \"24px\";\nexport const SpacingSpace32 = \"32px\";\nexport const SpacingSpace40 = \"40px\";\nexport const SpacingSpace48 = \"48px\";\nexport const SpacingSpace64 = \"64px\";\nexport const SpacingSpace80 = \"80px\";\nexport const SpacingSpace96 = \"96px\";\nexport const SpacingSpace112 = \"112px\";\nexport const SpacingSpace128 = \"128px\";\nexport const SpacingSpace144 = \"144px\";\nexport const SpacingSpace160 = \"160px\";\nexport const TypographyFontSizeHeadingXxl = \"48px\";\nexport const TypographyFontSizeHeadingXl = \"40px\";\nexport const TypographyFontSizeHeadingLg = \"34px\";\nexport const TypographyFontSizeHeadingMd = \"28px\";\nexport const TypographyFontSizeHeadingSm = \"24px\";\nexport const TypographyFontSizeHeadingXs = \"20px\";\nexport const TypographyFontSizeHeadingXxs = \"18px\";\nexport const TypographyFontSizeTextLg = \"20px\";\nexport const TypographyFontSizeTextMd = \"16px\";\nexport const TypographyFontSizeTextSm = \"14px\";\nexport const TypographyFontSizeTextXs = \"12px\";\nexport const TypographyFontSizePricingLg = \"34px\";\nexport const TypographyFontSizePricingMd = \"30px\";\nexport const TypographyFontSizePricingSm = \"24px\";\nexport const TypographyFontSizePricingXs = \"20px\";\nexport const TypographyFontWeightRegular = 400;\nexport const TypographyFontWeightMedium = 500;\nexport const TypographyFontWeightBold = 700;\nexport const TypographyFontWeightBlack = 900;\nexport const TypographyFontWeightDemiBold = 600;\nexport const TypographyLineHeightXs = 1;\nexport const TypographyLineHeightSm = 1.15;\nexport const TypographyLineHeightMd = 1.25;\nexport const TypographyLineHeightLg = 1.5;\nexport const TypographyLetterSpacingTight = \"-0.02em\";\nexport const TypographyLetterSpacingNormal = \"0em\";\nexport const TypographyLetterSpacingWide = \"0.02em\";\nexport const TypographyFontFamilyHeading = \"DNA Heading\";\nexport const TypographyFontFamilyText = \"DNA Text\";\nexport const ElevationSemanticElevationLowColor = \"#1212120f\";\nexport const ElevationSemanticElevationLowOffsetX = \"0px\";\nexport const ElevationSemanticElevationLowOffsetY = \"2px\";\nexport const ElevationSemanticElevationLowBlur = \"16px\";\nexport const ElevationSemanticElevationLowSpread = \"0px\";\nexport const ElevationSemanticElevationMediumColor = \"#12121214\";\nexport const ElevationSemanticElevationMediumOffsetX = \"0px\";\nexport const ElevationSemanticElevationMediumOffsetY = \"4px\";\nexport const ElevationSemanticElevationMediumBlur = \"24px\";\nexport const ElevationSemanticElevationMediumSpread = \"0px\";\nexport const ElevationSemanticElevationHighColor = \"#12121229\";\nexport const ElevationSemanticElevationHighOffsetX = \"0px\";\nexport const ElevationSemanticElevationHighOffsetY = \"8px\";\nexport const ElevationSemanticElevationHighBlur = \"64px\";\nexport const ElevationSemanticElevationHighSpread = \"0px\";\nexport const ZindexSemanticBelow = -1;\nexport const ZindexSemanticBase = 0;\nexport const ZindexSemanticRaised = 200;\nexport const ZindexSemanticSticky = 400;\nexport const ZindexSemanticPopup = 600;\nexport const ZindexSemanticNavigation = 1000;\nexport const ZindexSemanticWidget = 1040;\nexport const ZindexSemanticOverlay = 1100;\nexport const ZindexSemanticDialog = 1200;\nexport const ZindexSemanticSystem = 1300;\nexport const LayoutSemanticBreakpointSmallMobile = \"360px\";\nexport const LayoutSemanticBreakpointLargeMobile = \"480px\";\nexport const LayoutSemanticBreakpointTablet = \"768px\";\nexport const LayoutSemanticBreakpointDesktop = \"1024px\";\nexport const LayoutSemanticBreakpointLargeDesktop = \"1344px\";\nexport const LayoutSemanticPageMinWidth = \"320px\";\nexport const LayoutSemanticPageMaxWidth = \"2560px\";\nexport const LayoutSemanticContainerNarrow = \"628px\";\nexport const LayoutSemanticContainerDefault = \"845px\";\nexport const LayoutSemanticContainerWide = \"1280px\";\n"],"names":[],"mappings":"AA+KY,MAAC,kCAAkC;"}

package/dist/index.cjs

@@ -3,10 +3,13 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 ;/* empty css                   */
 const Accordion = require("./components/Accordion/Accordion.cjs");
 const AccordionItem = require("./components/AccordionItem/AccordionItem.cjs");
+const Avatar = require("./components/Avatar/Avatar.cjs");
 const Breadcrumb = require("./components/Breadcrumb/Breadcrumb.cjs");
 const Button = require("./components/Button/Button.cjs");
 const ButtonCard = require("./components/ButtonCard/ButtonCard.cjs");
+const Checkbox = require("./components/Checkbox/Checkbox.cjs");
 const ColorScheme = require("./components/ColorScheme/ColorScheme.cjs");
+const ContentCard = require("./components/ContentCard/ContentCard.cjs");
 const Drawer = require("./components/Drawer/Drawer.cjs");
 const Footer = require("./components/Footer/Footer.cjs");
 const FunctionButton = require("./components/FunctionButton/FunctionButton.cjs");
@@ -16,6 +19,7 @@ const Label = require("./components/Label/Label.cjs");
 const MainNavigation = require("./components/MainNavigation/MainNavigation.cjs");
 const Modal = require("./components/Modal/Modal.cjs");
 const Notification = require("./components/Notification/Notification.cjs");
+const Pagination = require("./components/Pagination/Pagination.cjs");
 const Pictograph = require("./components/Pictograph/Pictograph.cjs");
 const PictographItem = require("./components/Pictograph/PictographItem.cjs");
 const Quote = require("./components/Quote/Quote.cjs");
@@ -23,10 +27,13 @@ const Spinner = require("./components/Spinner/Spinner.cjs");
 const cn = require("./utils/cn/cn.cjs");
 exports.Accordion = Accordion.Accordion;
 exports.AccordionItem = AccordionItem.AccordionItem;
+exports.Avatar = Avatar.Avatar;
 exports.Breadcrumb = Breadcrumb.Breadcrumb;
 exports.Button = Button.Button;
 exports.ButtonCard = ButtonCard.ButtonCard;
+exports.Checkbox = Checkbox.Checkbox;
 exports.ColorScheme = ColorScheme.ColorScheme;
+exports.ContentCard = ContentCard.ContentCard;
 exports.Drawer = Drawer.Drawer;
 exports.Footer = Footer.Footer;
 exports.FunctionButton = FunctionButton.FunctionButton;
@@ -36,6 +43,7 @@ exports.Label = Label.Label;
 exports.MainNavigation = MainNavigation.MainNavigation;
 exports.Modal = Modal.Modal;
 exports.Notification = Notification.Notification;
+exports.Pagination = Pagination.Pagination;
 exports.Pictograph = Pictograph.Pictograph;
 exports.PictographItem = PictographItem.PictographItem;
 exports.Quote = Quote.Quote;

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.d.ts

@@ -1,9 +1,11 @@
 export { Accordion } from './components/Accordion';
 export { AccordionItem } from './components/AccordionItem';
+export { Avatar } from './components/Avatar';
 export { Breadcrumb } from './components/Breadcrumb';
 export { Button } from './components/Button';
 export { ButtonCard } from './components/ButtonCard';
 export { ColorScheme } from './components/ColorScheme';
+export { ContentCard } from './components/ContentCard';
 export { Drawer } from './components/Drawer';
 export { Footer } from './components/Footer';
 export { Hero } from './components/Hero';
@@ -16,16 +18,20 @@ export { Quote } from './components/Quote';
 export { Spinner } from './components/Spinner';
 export { IconButton } from './components/IconButton';
 export { FunctionButton } from './components/FunctionButton';
+export { Pagination } from './components/Pagination';
+export { Checkbox } from './components/Checkbox';
 export type { AccordionProps } from './components/Accordion';
 export type { AccordionItemProps } from './components/AccordionItem';
+export type { AvatarBackground, AvatarIcon, AvatarOrientation, AvatarProps, AvatarSize, AvatarVariant, } from './components/Avatar';
 export type { BreadcrumbItem, BreadcrumbLinkProps, BreadcrumbProps } from './components/Breadcrumb';
-export type { ButtonProps, ButtonLinkProps, ButtonVariant, ButtonSize } from './components/Button';
+export type { ButtonProps, ButtonLinkProps, ButtonVariant, ButtonSize, ButtonIcon, ButtonIconPosition, } from './components/Button';
 export type { ButtonCardIcon, ButtonCardLinkProps, ButtonCardProps, ButtonCardSize, } from './components/ButtonCard';
 export type { ColorSchemeProps, ColorSchemeValue } from './components/ColorScheme';
+export type { ContentCardAppearance, ContentCardArticleProps, ContentCardDivProps, ContentCardElement, ContentCardHeadingLevel, ContentCardLiProps, ContentCardLogoBackground, ContentCardMediaKind, ContentCardMediaPosition, ContentCardMediaWidth, ContentCardProps, ContentCardSectionProps, } from './components/ContentCard';
 export type { DrawerHeaderStyle, DrawerProps, DrawerSide, DrawerSize } from './components/Drawer';
 export type { FooterAppLink, FooterAppLinks, FooterLanguage, FooterLink, FooterLinkMeta, FooterLinkProps, FooterMandatoryLink, FooterNavigationGroup, FooterOrganization, FooterProps, FooterRenderLink, FooterSocialLink, FooterSocialPlatform, FooterTopSectionGroup, FooterTopSectionLink, } from './components/Footer';
 export type { HeroProps, HeroHeadingLevel, HeroCommonImageProps, HeroImageComponent, } from './components/Hero';
-export type { MainNavigationItem, MainNavigationLink, MainNavigationOrganizationLink, MainNavigationPanel, MainNavigationProps, MainNavigationSubmenuColumn, } from './components/MainNavigation';
+export type { MainNavigationItem, MainNavigationLanguageCode, MainNavigationLanguageLinkProps, MainNavigationLanguageOption, MainNavigationLink, MainNavigationOrganizationLink, MainNavigationPanel, MainNavigationProps, MainNavigationRenderLanguageLink, MainNavigationSubmenuColumn, } from './components/MainNavigation';
 export type { NotificationProps, NotificationVariant } from './components/Notification';
 export type { LabelProps, LabelVariant } from './components/Label';
 export type { ModalHeaderStyle, ModalProps, ModalSize } from './components/Modal';
@@ -34,6 +40,8 @@ export type { QuoteProps } from './components/Quote';
 export type { SpinnerColor, SpinnerProps, SpinnerSize } from './components/Spinner';
 export type { Icon, IconPosition, IconButtonLinkProps, IconButtonProps, IconButtonSize, } from './components/IconButton';
 export type { FunctionButtonIcon, FunctionButtonProps, FunctionButtonSize, FunctionButtonVariant, } from './components/FunctionButton';
+export type { PaginationProps } from './components/Pagination';
+export type { CheckboxProps } from './components/Checkbox';
 export { cn } from './utils';
 export type { CnDictionary, CnInput } from './utils';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -1,10 +1,13 @@
 /* empty css                 */
 import { Accordion } from "./components/Accordion/Accordion.js";
 import { AccordionItem } from "./components/AccordionItem/AccordionItem.js";
+import { Avatar } from "./components/Avatar/Avatar.js";
 import { Breadcrumb } from "./components/Breadcrumb/Breadcrumb.js";
 import { Button } from "./components/Button/Button.js";
 import { ButtonCard } from "./components/ButtonCard/ButtonCard.js";
+import { Checkbox } from "./components/Checkbox/Checkbox.js";
 import { ColorScheme } from "./components/ColorScheme/ColorScheme.js";
+import { ContentCard } from "./components/ContentCard/ContentCard.js";
 import { Drawer } from "./components/Drawer/Drawer.js";
 import { Footer } from "./components/Footer/Footer.js";
 import { FunctionButton } from "./components/FunctionButton/FunctionButton.js";
@@ -14,6 +17,7 @@ import { Label } from "./components/Label/Label.js";
 import { MainNavigation } from "./components/MainNavigation/MainNavigation.js";
 import { Modal } from "./components/Modal/Modal.js";
 import { Notification } from "./components/Notification/Notification.js";
+import { Pagination } from "./components/Pagination/Pagination.js";
 import { Pictograph } from "./components/Pictograph/Pictograph.js";
 import { PictographItem } from "./components/Pictograph/PictographItem.js";
 import { Quote } from "./components/Quote/Quote.js";
@@ -22,10 +26,13 @@ import { cn } from "./utils/cn/cn.js";
 export {
   Accordion,
   AccordionItem,
+  Avatar,
   Breadcrumb,
   Button,
   ButtonCard,
+  Checkbox,
   ColorScheme,
+  ContentCard,
   Drawer,
   Footer,
   FunctionButton,
@@ -35,6 +42,7 @@ export {
   MainNavigation,
   Modal,
   Notification,
+  Pagination,
   Pictograph,
   PictographItem,
   Quote,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/styles/utilities.css

@@ -0,0 +1,6 @@
+@layer dds-base, dds-components;
+
+@import './utils/elevation.css';
+@import './utils/focus.css';
+@import './utils/overlay.css';
+@import './utils/text-decoration.css';

package/dist/styles/utils/elevation.css

@@ -1,31 +1,39 @@
-@layer dds-components {._elevationLow_dspr0_1 {
-    --_elevation-style: var(--elevation-semantic-elevation-low-offset-x)
-        var(--elevation-semantic-elevation-low-offset-y)
-        var(--elevation-semantic-elevation-low-blur) var(--elevation-semantic-elevation-low-spread)
-        var(--elevation-semantic-elevation-low-color);
-}
+@layer dds-base, dds-components;
 
-._elevationMedium_dspr0_8 {
-    --_elevation-style: var(--elevation-semantic-elevation-medium-offset-x)
-        var(--elevation-semantic-elevation-medium-offset-y)
-        var(--elevation-semantic-elevation-medium-blur)
-        var(--elevation-semantic-elevation-medium-spread)
-        var(--elevation-semantic-elevation-medium-color);
+@layer dds-components {
+    @layer fallback, components;
 }
 
-._elevationHigh_dspr0_16 {
-    --_elevation-style: var(--elevation-semantic-elevation-high-offset-x)
-        var(--elevation-semantic-elevation-high-offset-y)
-        var(--elevation-semantic-elevation-high-blur)
-        var(--elevation-semantic-elevation-high-spread)
-        var(--elevation-semantic-elevation-high-color);
-}
+@layer dds-components.components {
+    .dds-elevation-low {
+        --_elevation-style: var(--elevation-semantic-elevation-low-offset-x)
+            var(--elevation-semantic-elevation-low-offset-y)
+            var(--elevation-semantic-elevation-low-blur)
+            var(--elevation-semantic-elevation-low-spread)
+            var(--elevation-semantic-elevation-low-color);
+    }
 
-._elevationLow_dspr0_1,
-._elevationMedium_dspr0_8,
-._elevationHigh_dspr0_16 {
-    border: var(--borderwidth-semantic-xs) solid var(--color-semantic-border-neutral-base);
-    box-shadow: var(--_elevation-style);
-    border-radius: var(--radius-semantic-md);
-}
+    .dds-elevation-medium {
+        --_elevation-style: var(--elevation-semantic-elevation-medium-offset-x)
+            var(--elevation-semantic-elevation-medium-offset-y)
+            var(--elevation-semantic-elevation-medium-blur)
+            var(--elevation-semantic-elevation-medium-spread)
+            var(--elevation-semantic-elevation-medium-color);
+    }
+
+    .dds-elevation-high {
+        --_elevation-style: var(--elevation-semantic-elevation-high-offset-x)
+            var(--elevation-semantic-elevation-high-offset-y)
+            var(--elevation-semantic-elevation-high-blur)
+            var(--elevation-semantic-elevation-high-spread)
+            var(--elevation-semantic-elevation-high-color);
+    }
+
+    .dds-elevation-low,
+    .dds-elevation-medium,
+    .dds-elevation-high {
+        border: var(--borderwidth-semantic-xs) solid var(--color-semantic-border-neutral-base);
+        box-shadow: var(--_elevation-style);
+        border-radius: var(--radius-semantic-md);
+    }
 }

package/dist/styles/utils/focus.css

@@ -1,88 +1,86 @@
-@layer dds-components {._focusable_bhneb_1 {
-    /* Marker class for shared focus treatment */
-}
-
-._focusable_bhneb_1:where(:focus, :focus-visible) {
-    border-radius: var(--radius-semantic-sm);
-}
-
-._focusable_bhneb_1:focus {
-    outline-color: transparent;
-}
+@layer dds-base, dds-components;
 
-._focusable_bhneb_1:focus-visible {
-    /* Transparent outline ensures a visible ring fallback in forced colors. */
-    outline: 2px solid transparent;
-    outline-offset: 2px;
-    box-shadow:
-        0 0 0 2px var(--color-semantic-utility-focus-soft),
-        0 0 0 4px var(--color-semantic-utility-focus-strong);
+@layer dds-components {
+    @layer fallback, components;
 }
 
-@media (forced-colors: active) {
-    ._focusable_bhneb_1:focus-visible {
-        outline-color: Highlight;
-        box-shadow: none;
+@layer dds-components.fallback {
+    .dds-focusable:where(:focus, :focus-visible),
+    .dds-focusable-inset:where(:focus, :focus-visible) {
+        border-radius: var(--radius-semantic-sm);
     }
 }
 
-._focusableInset_bhneb_29 {
-    /* Marker class for inset focus treatment (ring stays inside the element boundary) */
-}
+@layer dds-components.components {
+    .dds-focusable {
+        /* Marker class for shared focus treatment */
+    }
 
-._focusableInset_bhneb_29:where(:focus, :focus-visible) {
-    border-radius: var(--radius-semantic-sm);
-}
+    .dds-focusable:focus {
+        outline-color: transparent;
+    }
 
-._focusableInset_bhneb_29:focus {
-    outline-color: transparent;
-}
+    .dds-focusable:focus-visible {
+        outline: 2px solid transparent;
+        outline-offset: 2px;
+        box-shadow:
+            0 0 0 2px var(--color-semantic-utility-focus-soft),
+            0 0 0 4px var(--color-semantic-utility-focus-strong);
+    }
 
-._focusableInset_bhneb_29:focus-visible {
-    outline: 2px solid transparent;
-    box-shadow:
-        inset 0 0 0 2px var(--color-semantic-utility-focus-strong),
-        inset 0 0 0 4px var(--color-semantic-utility-focus-soft);
-}
+    @media (forced-colors: active) {
+        .dds-focusable:focus-visible {
+            outline-color: Highlight;
+            box-shadow: none;
+        }
+    }
 
-@media (forced-colors: active) {
-    ._focusableInset_bhneb_29:focus-visible {
-        outline-color: Highlight;
-        box-shadow: none;
+    .dds-focusable-inset {
+        /* Marker class for inset focus treatment (ring stays inside the element boundary) */
     }
-}
 
-@scope ([data-color-scheme='dark']) to ([data-color-scheme='light']) {
-    ._focusable_bhneb_1:focus-visible {
-        box-shadow:
-            0 0 0 2px var(--color-semantic-utility-focus-strong),
-            0 0 0 4px var(--color-semantic-utility-focus-soft);
+    .dds-focusable-inset:focus {
+        outline-color: transparent;
     }
 
-    ._focusableInset_bhneb_29:focus-visible {
+    .dds-focusable-inset:focus-visible {
+        outline: 2px solid transparent;
         box-shadow:
-            inset 0 0 0 2px var(--color-semantic-utility-focus-soft),
-            inset 0 0 0 4px var(--color-semantic-utility-focus-strong);
+            inset 0 0 0 2px var(--color-semantic-utility-focus-strong),
+            inset 0 0 0 4px var(--color-semantic-utility-focus-soft);
     }
 
     @media (forced-colors: active) {
-        ._focusable_bhneb_1:focus-visible,
-        ._focusableInset_bhneb_29:focus-visible {
+        .dds-focusable-inset:focus-visible {
+            outline-color: Highlight;
             box-shadow: none;
         }
     }
-}
 
-._focusClipGuard_bhneb_76 {
-    /*
-     * Prevents focus rings from being clipped when the container uses overflow: hidden.
-     *
-     * Usage:
-     * - Apply this class to the clipping container.
-     * - Override --focus-clip-guard-bleed-inline when a component needs a custom bleed amount.
-     */
-    --focus-clip-guard-bleed-inline: var(--spacing-space-4);
-    margin-inline: calc(var(--focus-clip-guard-bleed-inline) * -1);
-    padding-inline: var(--focus-clip-guard-bleed-inline);
-}
+    @scope ([data-color-scheme='dark']) to ([data-color-scheme='light']) {
+        .dds-focusable:focus-visible {
+            box-shadow:
+                0 0 0 2px var(--color-semantic-utility-focus-strong),
+                0 0 0 4px var(--color-semantic-utility-focus-soft);
+        }
+
+        .dds-focusable-inset:focus-visible {
+            box-shadow:
+                inset 0 0 0 2px var(--color-semantic-utility-focus-soft),
+                inset 0 0 0 4px var(--color-semantic-utility-focus-strong);
+        }
+
+        @media (forced-colors: active) {
+            .dds-focusable:focus-visible,
+            .dds-focusable-inset:focus-visible {
+                box-shadow: none;
+            }
+        }
+    }
+
+    .dds-focus-clip-guard {
+        --focus-clip-guard-bleed-inline: var(--spacing-space-4);
+        margin-inline: calc(var(--focus-clip-guard-bleed-inline) * -1);
+        padding-inline: var(--focus-clip-guard-bleed-inline);
+    }
 }