@cck-ui/core 0.25.0 → 0.27.0

package/esm/index.mjs

@@ -58,7 +58,10 @@ import { CTransition } from "./components/transition/index.mjs";
 import { CActionIcon, CActionIconGroup, CActionIconGroupSection } from "./components/action-icon/index.mjs";
 import { CCloseButton } from "./components/close-button/index.mjs";
 import { CAlert } from "./components/alert/index.mjs";
+import { CText } from "./components/text/index.mjs";
+import { CAnchor } from "./components/anchor/index.mjs";
 import { CAspectRatio } from "./components/aspect-ratio/index.mjs";
+import { CBreadcrumbs } from "./components/breadcrumbs/index.mjs";
 import { CButton, CButtonGroup, CButtonGroupSection } from "./components/button/index.mjs";
 import { CCenter } from "./components/center/index.mjs";
 import { CContainer } from "./components/container/index.mjs";
@@ -79,7 +82,6 @@ import { CSkeleton } from "./components/skeleton/index.mjs";
 import { CSpace } from "./components/space/index.mjs";
 import { CSplitter, CSplitterPane } from "./components/splitter/index.mjs";
 import { CStack } from "./components/stack/index.mjs";
-import { CText } from "./components/text/index.mjs";
 import { CTypography } from "./components/typography/index.mjs";
 import { CVisuallyHidden } from "./components/visually-hidden/index.mjs";
 //#region packages/@cck-ui/core/src/index.ts
@@ -91,7 +93,9 @@ const components = [
 	CActionIconGroup,
 	CActionIconGroupSection,
 	CAlert,
+	CAnchor,
 	CAspectRatio,
+	CBreadcrumbs,
 	CButton,
 	CButtonGroup,
 	CButtonGroupSection,
@@ -136,6 +140,6 @@ const CckUI = { install(app) {
 	});
 } };
 //#endregion
-export { CActionIcon, CActionIconGroup, CActionIconGroupSection, CAlert, CAspectRatio, CBox, CButton, CButtonGroup, CButtonGroupSection, transitions as CCK_TRANSITIONS, CCenter, CCloseButton, CCol, CContainer, CCopyButton, CDefaultLoaders, CDivider, CEmptyState, CEmptyStateActions, CEmptyStateDescription, CEmptyStateIndicator, CEmptyStateTitle, CFileButton, CFlex, CFocusTrap, CGrid, CGroup, CImage, CLoader, CONFIG_KEY, CPaper, CPortal, CSemiCircleProgress, CSimpleGrid, CSkeleton, CSpace, CSplitter, CSplitterPane, CStack, CText, CTransition, CTypography, CVisuallyHidden, CckConfigProvider, CckUI, CckUI as default, DEFAULT_THEME, FOCUS_CLASS_NAMES, STYLE_PROPS_DATA, THEME_KEY, UnstyledButton, alpha, camelToKebabCase, colorsTuple, createTheme, createVarsResolver, darken, deepMerge, defaultCssVariablesResolver, defaultVariantColorsResolver, em, extractStyleProps, filterProps, getBaseValue, getBreakpointValue, getCSSColorVariables, getComponentName, getFontSize, getGradient, getLineHeight, getPrimaryShade, getRadius, getShadow, getSize, getSortedBreakpoints, getSpacing, getThemeColor, getTransitionProps, hashStyleProps, isLightColor, isNumber, isNumberLike, isString, isStringNumber, isUndefined, isVirtualColor, keys, luminance, mergeThemeOverrides, normalizeNumberLikeStringProp, numberLikeStringToNumber, parseStyleProps, parseThemeColor, px, rem, resolveClassNames, resolveStyles, responsiveStyleManager, rgb, rgba, stylesToString, toRgba, useCckClassNamesPrefix, useCckColorScheme, useCckCssVariablesResolver, useCckEnv, useCckIsHeadless, useCckStyleNonce, useCckStylesTransform, useCckSxTransform, useCckTheme, useCckWithStaticClasses, useComponentProps, useConfigContext, useProviderColorScheme, useRandomClassName, useStyles, virtualColor, withClasses, withExtend, withInstall, withPropsDefaultSetter, withPropsFactory, withVarsResolver };
+export { CActionIcon, CActionIconGroup, CActionIconGroupSection, CAlert, CAnchor, CAspectRatio, CBox, CBreadcrumbs, CButton, CButtonGroup, CButtonGroupSection, transitions as CCK_TRANSITIONS, CCenter, CCloseButton, CCol, CContainer, CCopyButton, CDefaultLoaders, CDivider, CEmptyState, CEmptyStateActions, CEmptyStateDescription, CEmptyStateIndicator, CEmptyStateTitle, CFileButton, CFlex, CFocusTrap, CGrid, CGroup, CImage, CLoader, CONFIG_KEY, CPaper, CPortal, CSemiCircleProgress, CSimpleGrid, CSkeleton, CSpace, CSplitter, CSplitterPane, CStack, CText, CTransition, CTypography, CVisuallyHidden, CckConfigProvider, CckUI, CckUI as default, DEFAULT_THEME, FOCUS_CLASS_NAMES, STYLE_PROPS_DATA, THEME_KEY, UnstyledButton, alpha, camelToKebabCase, colorsTuple, createTheme, createVarsResolver, darken, deepMerge, defaultCssVariablesResolver, defaultVariantColorsResolver, em, extractStyleProps, filterProps, getBaseValue, getBreakpointValue, getCSSColorVariables, getComponentName, getFontSize, getGradient, getLineHeight, getPrimaryShade, getRadius, getShadow, getSize, getSortedBreakpoints, getSpacing, getThemeColor, getTransitionProps, hashStyleProps, isLightColor, isNumber, isNumberLike, isString, isStringNumber, isUndefined, isVirtualColor, keys, luminance, mergeThemeOverrides, normalizeNumberLikeStringProp, numberLikeStringToNumber, parseStyleProps, parseThemeColor, px, rem, resolveClassNames, resolveStyles, responsiveStyleManager, rgb, rgba, stylesToString, toRgba, useCckClassNamesPrefix, useCckColorScheme, useCckCssVariablesResolver, useCckEnv, useCckIsHeadless, useCckStyleNonce, useCckStylesTransform, useCckSxTransform, useCckTheme, useCckWithStaticClasses, useComponentProps, useConfigContext, useProviderColorScheme, useRandomClassName, useStyles, virtualColor, withClasses, withExtend, withInstall, withPropsDefaultSetter, withPropsFactory, withVarsResolver };
 
 //# sourceMappingURL=index.mjs.map

package/esm/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n  CActionIcon,\n  CActionIconGroup,\n  CActionIconGroupSection,\n  CAlert,\n  CAspectRatio,\n  CButton,\n  CButtonGroup,\n  CButtonGroupSection,\n  CCenter,\n  CCloseButton,\n  CCol,\n  CContainer,\n  CCopyButton,\n  CDivider,\n  CEmptyState,\n  CEmptyStateActions,\n  CEmptyStateDescription,\n  CEmptyStateIndicator,\n  CEmptyStateTitle,\n  CFileButton,\n  CFlex,\n  CFocusTrap,\n  CGrid,\n  CGroup,\n  CImage,\n  CLoader,\n  CPaper,\n  CPortal,\n  CSemiCircleProgress,\n  CSimpleGrid,\n  CSkeleton,\n  CSpace,\n  CSplitter,\n  CSplitterPane,\n  CStack,\n  CText,\n  CTransition,\n  CTypography,\n  CVisuallyHidden,\n  UnstyledButton,\n} from './components'\nimport { CckConfigProvider, CBox } from './core'\n\nconst INSTALLED_KEY = Symbol('INSTALLED_KEY')\n\nconst components = [\n  CckConfigProvider,\n  CBox,\n  CActionIcon,\n  CActionIconGroup,\n  CActionIconGroupSection,\n  CAlert,\n  CAspectRatio,\n  CButton,\n  CButtonGroup,\n  CButtonGroupSection,\n  CCenter,\n  CCloseButton,\n  CCol,\n  CContainer,\n  CCopyButton,\n  CDivider,\n  CEmptyState,\n  CEmptyStateActions,\n  CEmptyStateDescription,\n  CEmptyStateIndicator,\n  CEmptyStateTitle,\n  CFileButton,\n  CFlex,\n  CFocusTrap,\n  CGrid,\n  CGroup,\n  CImage,\n  CLoader,\n  CPaper,\n  CPortal,\n  CSemiCircleProgress,\n  CSimpleGrid,\n  CSkeleton,\n  CSpace,\n  CSplitter,\n  CSplitterPane,\n  CStack,\n  CText,\n  CTransition,\n  CTypography,\n  CVisuallyHidden,\n  UnstyledButton,\n]\n\nconst CckUI: Plugin = {\n  install(app: App) {\n    if ((app as any)[INSTALLED_KEY]) {\n      return\n    }\n    ;(app as any)[INSTALLED_KEY] = true\n    components.forEach((c) => {\n      if (c.name) {\n        app.component(c.name, c)\n      }\n    })\n  },\n}\n\nexport default CckUI\nexport { CckUI }\n\nexport * from './components'\nexport * from './core'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,QAAgB,EACpB,QAAQ,KAAU;CAChB,IAAK,IAAY,gBACf;CAED,IAAa,iBAAiB;CAC/B,WAAW,SAAS,MAAM;EACxB,IAAI,EAAE,MACJ,IAAI,UAAU,EAAE,MAAM,CAAC;CAE3B,CAAC;AACH,EACF"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n  CActionIcon,\n  CActionIconGroup,\n  CActionIconGroupSection,\n  CAlert,\n  CAnchor,\n  CAspectRatio,\n  CBreadcrumbs,\n  CButton,\n  CButtonGroup,\n  CButtonGroupSection,\n  CCenter,\n  CCloseButton,\n  CCol,\n  CContainer,\n  CCopyButton,\n  CDivider,\n  CEmptyState,\n  CEmptyStateActions,\n  CEmptyStateDescription,\n  CEmptyStateIndicator,\n  CEmptyStateTitle,\n  CFileButton,\n  CFlex,\n  CFocusTrap,\n  CGrid,\n  CGroup,\n  CImage,\n  CLoader,\n  CPaper,\n  CPortal,\n  CSemiCircleProgress,\n  CSimpleGrid,\n  CSkeleton,\n  CSpace,\n  CSplitter,\n  CSplitterPane,\n  CStack,\n  CText,\n  CTransition,\n  CTypography,\n  CVisuallyHidden,\n  UnstyledButton,\n} from './components'\nimport { CckConfigProvider, CBox } from './core'\n\nconst INSTALLED_KEY = Symbol('INSTALLED_KEY')\n\nconst components = [\n  CckConfigProvider,\n  CBox,\n  CActionIcon,\n  CActionIconGroup,\n  CActionIconGroupSection,\n  CAlert,\n  CAnchor,\n  CAspectRatio,\n  CBreadcrumbs,\n  CButton,\n  CButtonGroup,\n  CButtonGroupSection,\n  CCenter,\n  CCloseButton,\n  CCol,\n  CContainer,\n  CCopyButton,\n  CDivider,\n  CEmptyState,\n  CEmptyStateActions,\n  CEmptyStateDescription,\n  CEmptyStateIndicator,\n  CEmptyStateTitle,\n  CFileButton,\n  CFlex,\n  CFocusTrap,\n  CGrid,\n  CGroup,\n  CImage,\n  CLoader,\n  CPaper,\n  CPortal,\n  CSemiCircleProgress,\n  CSimpleGrid,\n  CSkeleton,\n  CSpace,\n  CSplitter,\n  CSplitterPane,\n  CStack,\n  CText,\n  CTransition,\n  CTypography,\n  CVisuallyHidden,\n  UnstyledButton,\n]\n\nconst CckUI: Plugin = {\n  install(app: App) {\n    if ((app as any)[INSTALLED_KEY]) {\n      return\n    }\n    ;(app as any)[INSTALLED_KEY] = true\n    components.forEach((c) => {\n      if (c.name) {\n        app.component(c.name, c)\n      }\n    })\n  },\n}\n\nexport default CckUI\nexport { CckUI }\n\nexport * from './components'\nexport * from './core'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+CA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,QAAgB,EACpB,QAAQ,KAAU;CAChB,IAAK,IAAY,gBACf;CAED,IAAa,iBAAiB;CAC/B,WAAW,SAAS,MAAM;EACxB,IAAI,EAAE,MACJ,IAAI,UAAU,EAAE,MAAM,CAAC;CAE3B,CAAC;AACH,EACF"}

package/lib/components/anchor/anchor.types.d.ts

@@ -0,0 +1,16 @@
+import { PolymorphicFactory } from '../../core';
+import { TextCssVariables, TextProps, TextStylesNames, TextVariant } from '../text';
+export type AnchorStylesNames = TextStylesNames;
+export type AnchorVariant = TextVariant;
+export type AnchorCssVariables = TextCssVariables;
+export interface AnchorProps extends Omit<TextProps, 'span'> {
+    underline?: 'always' | 'hover' | 'not-hover' | 'never';
+}
+export type AnchorFactory = PolymorphicFactory<{
+    props: AnchorProps;
+    defaultComponent: 'a';
+    defaultRef: HTMLAnchorElement;
+    stylesNames: AnchorStylesNames;
+    vars: AnchorCssVariables;
+    variant: AnchorVariant;
+}>;

package/lib/components/anchor/index.d.ts

@@ -0,0 +1,6 @@
+import { SFCWithInstallAndClasses } from '../../core';
+import classes from './anchor.module.css';
+import Anchor from './anchor.vue';
+export declare const CAnchor: SFCWithInstallAndClasses<typeof Anchor, typeof classes>;
+export default CAnchor;
+export * from './anchor.types';

package/lib/components/breadcrumbs/breadcrumbs.types.d.ts

@@ -0,0 +1,25 @@
+import { VNode } from 'vue';
+import { BoxProps, CSpacing, ElementProps, Factory, StylesApiProps } from '../../core';
+export type BreadcrumbsStylesNames = 'root' | 'separator' | 'breadcrumb';
+export type BreadcrumbsCssVariables = {
+    root: '--bc-separator-margin';
+};
+export type SeparatorRenderer = (child: VNode, index: number, length: number) => string | VNode;
+export interface BreadcrumbsProps extends BoxProps, StylesApiProps<BreadcrumbsFactory>, /* @vue-ignore */ ElementProps<'div'> {
+    /**
+     * Separator between children
+     * @default '/'
+     */
+    separator?: string | VNode | SeparatorRenderer;
+    /**
+     * Controls spacing between separator and breadcrumb
+     * @default 'xs'
+     */
+    separatorMargin?: CSpacing;
+}
+export type BreadcrumbsFactory = Factory<{
+    props: BreadcrumbsProps;
+    ref: HTMLDivElement;
+    stylesNames: BreadcrumbsStylesNames;
+    vars: BreadcrumbsCssVariables;
+}>;

package/lib/components/breadcrumbs/breadcrumbs.utils.d.ts

@@ -0,0 +1,6 @@
+export declare const varsResolver: import("../..").VarsResolver<{
+    props: import("./breadcrumbs.types").BreadcrumbsProps;
+    ref: HTMLDivElement;
+    stylesNames: import("./breadcrumbs.types").BreadcrumbsStylesNames;
+    vars: import("./breadcrumbs.types").BreadcrumbsCssVariables;
+}>;

package/lib/components/breadcrumbs/filter-falsy-children/filter-falsy-children.d.ts

@@ -0,0 +1,2 @@
+import { VNode } from 'vue';
+export declare function filterFalsyChildren(children: unknown): VNode[];

package/lib/components/breadcrumbs/index.d.ts

@@ -0,0 +1,6 @@
+import { SFCWithInstallAndClasses } from '../../core';
+import Breadcrumbs from './breadcrumbs.vue';
+import classes from './breadcrumbs.module.css';
+export declare const CBreadcrumbs: SFCWithInstallAndClasses<typeof Breadcrumbs, typeof classes>;
+export default CBreadcrumbs;
+export * from './breadcrumbs.types';

package/lib/components/index.d.ts

@@ -1,6 +1,8 @@
 export * from './action-icon';
 export * from './alert';
+export * from './anchor';
 export * from './aspect-ratio';
+export * from './breadcrumbs';
 export * from './button';
 export * from './center';
 export * from './close-button';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cck-ui/core",
-  "version": "0.25.0",
+  "version": "0.27.0",
   "description": "Vue component library focused on usability, accessibility and developer experience",
   "homepage": "https://cck-ui.jackatlas.xyz",
   "license": "ISC",

package/styles/anchor.css

@@ -0,0 +1,56 @@
+.m_213348fa {
+  color: var(--c-color-anchor);
+  text-decoration: none;
+  appearance: none;
+  border: none;
+  display: inline;
+  padding: 0;
+  margin: 0;
+  background-color: transparent;
+  cursor: pointer;
+}
+
+  @media (hover: hover) {
+
+  .m_213348fa:where([data-underline='hover']):hover {
+      text-decoration: underline;
+  }
+}
+
+  @media (hover: none) {
+
+  .m_213348fa:where([data-underline='hover']):active {
+      text-decoration: underline;
+  }
+}
+
+  .m_213348fa:where([data-underline='not-hover']) {
+    text-decoration: underline;
+  }
+
+  @media (hover: hover) {
+
+  .m_213348fa:where([data-underline='not-hover']):hover {
+      text-decoration: none;
+  }
+}
+
+  @media (hover: none) {
+
+  .m_213348fa:where([data-underline='not-hover']):active {
+      text-decoration: none;
+  }
+}
+
+  .m_213348fa:where([data-underline='always']) {
+    text-decoration: underline;
+  }
+
+  .m_213348fa:where([data-variant='gradient']),
+    .m_213348fa:where([data-variant='gradient']):hover {
+      text-decoration: none;
+    }
+
+  .m_213348fa:where([data-line-clamp]) {
+    display: -webkit-box;
+  }

package/styles/anchor.layer.css

@@ -0,0 +1,57 @@
+@layer cck {.m_213348fa {
+  color: var(--c-color-anchor);
+  text-decoration: none;
+  appearance: none;
+  border: none;
+  display: inline;
+  padding: 0;
+  margin: 0;
+  background-color: transparent;
+  cursor: pointer;
+}
+
+  @media (hover: hover) {
+
+  .m_213348fa:where([data-underline='hover']):hover {
+      text-decoration: underline;
+  }
+}
+
+  @media (hover: none) {
+
+  .m_213348fa:where([data-underline='hover']):active {
+      text-decoration: underline;
+  }
+}
+
+  .m_213348fa:where([data-underline='not-hover']) {
+    text-decoration: underline;
+  }
+
+  @media (hover: hover) {
+
+  .m_213348fa:where([data-underline='not-hover']):hover {
+      text-decoration: none;
+  }
+}
+
+  @media (hover: none) {
+
+  .m_213348fa:where([data-underline='not-hover']):active {
+      text-decoration: none;
+  }
+}
+
+  .m_213348fa:where([data-underline='always']) {
+    text-decoration: underline;
+  }
+
+  .m_213348fa:where([data-variant='gradient']),
+    .m_213348fa:where([data-variant='gradient']):hover {
+      text-decoration: none;
+    }
+
+  .m_213348fa:where([data-line-clamp]) {
+    display: -webkit-box;
+  }
+}

package/styles/breadcrumbs.css

@@ -0,0 +1,27 @@
+.m_bd72d3bf {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.m_c7302920 {
+  line-height: 1;
+  word-spacing: nowrap;
+  -webkit-tap-highlight-color: transparent;
+}
+
+.m_ceadd228 {
+  margin-inline: var(--bc-separator-margin, var(--c-spacing-xs));
+  line-height: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+:where([data-c-color-scheme='light']) .m_ceadd228 {
+    color: var(--c-color-gray-7);
+}
+
+:where([data-c-color-scheme='dark']) .m_ceadd228 {
+    color: var(--c-color-dark-2);
+}

package/styles/breadcrumbs.layer.css

@@ -0,0 +1,28 @@
+@layer cck {.m_bd72d3bf {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.m_c7302920 {
+  line-height: 1;
+  word-spacing: nowrap;
+  -webkit-tap-highlight-color: transparent;
+}
+
+.m_ceadd228 {
+  margin-inline: var(--bc-separator-margin, var(--c-spacing-xs));
+  line-height: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+:where([data-c-color-scheme='light']) .m_ceadd228 {
+    color: var(--c-color-gray-7);
+}
+
+:where([data-c-color-scheme='dark']) .m_ceadd228 {
+    color: var(--c-color-dark-2);
+}
+}

package/styles.css

@@ -605,6 +605,115 @@ fieldset:disabled .c-active:active {
   --c-color-orange-outline-hover: rgba(253, 126, 20, 0.05);
 }
 
+.m_3f669182 {
+  -webkit-tap-highlight-color: transparent;
+  text-decoration: none;
+  font-size: var(--text-fz, var(--c-font-size-md));
+  line-height: var(--text-lh, var(--c-line-height-md));
+  font-weight: var(--c-font-weight-regular);
+  text-wrap: var(--text-text-wrap, var(--c-text-wrap));
+  margin: 0;
+  padding: 0;
+}
+
+  .m_3f669182:where([data-truncate]) {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .m_3f669182:where([data-truncate='start']) {
+    direction: rtl;
+    text-align: end;
+  }
+
+  :where([dir="rtl"]) .m_3f669182:where([data-truncate='start']) {
+      direction: ltr;
+      text-align: start;
+}
+
+  .m_3f669182:where([data-variant='gradient']) {
+    background-image: var(--text-gradient);
+    -webkit-text-fill-color: transparent;
+    -webkit-background-clip: text;
+    background-clip: text;
+  }
+
+  .m_3f669182:where([data-line-clamp]) {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: var(--text-line-clamp);
+    -webkit-box-orient: vertical;
+  }
+
+  .m_3f669182:where([data-inherit]) {
+    line-height: inherit;
+    font-weight: inherit;
+    font-size: inherit;
+  }
+
+  .m_3f669182:where([data-inline]) {
+    line-height: 1;
+  }
+
+.m_213348fa {
+  color: var(--c-color-anchor);
+  text-decoration: none;
+  appearance: none;
+  border: none;
+  display: inline;
+  padding: 0;
+  margin: 0;
+  background-color: transparent;
+  cursor: pointer;
+}
+
+  @media (hover: hover) {
+
+  .m_213348fa:where([data-underline='hover']):hover {
+      text-decoration: underline;
+  }
+}
+
+  @media (hover: none) {
+
+  .m_213348fa:where([data-underline='hover']):active {
+      text-decoration: underline;
+  }
+}
+
+  .m_213348fa:where([data-underline='not-hover']) {
+    text-decoration: underline;
+  }
+
+  @media (hover: hover) {
+
+  .m_213348fa:where([data-underline='not-hover']):hover {
+      text-decoration: none;
+  }
+}
+
+  @media (hover: none) {
+
+  .m_213348fa:where([data-underline='not-hover']):active {
+      text-decoration: none;
+  }
+}
+
+  .m_213348fa:where([data-underline='always']) {
+    text-decoration: underline;
+  }
+
+  .m_213348fa:where([data-variant='gradient']),
+    .m_213348fa:where([data-variant='gradient']):hover {
+      text-decoration: none;
+    }
+
+  .m_213348fa:where([data-line-clamp]) {
+    display: -webkit-box;
+  }
+
 .m_537a2afc {
   background-color: transparent;
   cursor: pointer;
@@ -1169,6 +1278,34 @@ fieldset:disabled .c-active:active {
     object-fit: cover;
   }
 
+.m_bd72d3bf {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.m_c7302920 {
+  line-height: 1;
+  word-spacing: nowrap;
+  -webkit-tap-highlight-color: transparent;
+}
+
+.m_ceadd228 {
+  margin-inline: var(--bc-separator-margin, var(--c-spacing-xs));
+  line-height: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+:where([data-c-color-scheme='light']) .m_ceadd228 {
+    color: var(--c-color-gray-7);
+}
+
+:where([data-c-color-scheme='dark']) .m_ceadd228 {
+    color: var(--c-color-dark-2);
+}
+
 .m_e0e8435a {
   display: flex;
   align-items: center;
@@ -1881,58 +2018,6 @@ fieldset:disabled .c-active:active {
   gap: var(--stack-gap, var(--c-spacing-md));
 }
 
-.m_3f669182 {
-  -webkit-tap-highlight-color: transparent;
-  text-decoration: none;
-  font-size: var(--text-fz, var(--c-font-size-md));
-  line-height: var(--text-lh, var(--c-line-height-md));
-  font-weight: var(--c-font-weight-regular);
-  text-wrap: var(--text-text-wrap, var(--c-text-wrap));
-  margin: 0;
-  padding: 0;
-}
-
-  .m_3f669182:where([data-truncate]) {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  .m_3f669182:where([data-truncate='start']) {
-    direction: rtl;
-    text-align: end;
-  }
-
-  :where([dir="rtl"]) .m_3f669182:where([data-truncate='start']) {
-      direction: ltr;
-      text-align: start;
-}
-
-  .m_3f669182:where([data-variant='gradient']) {
-    background-image: var(--text-gradient);
-    -webkit-text-fill-color: transparent;
-    -webkit-background-clip: text;
-    background-clip: text;
-  }
-
-  .m_3f669182:where([data-line-clamp]) {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display: -webkit-box;
-    -webkit-line-clamp: var(--text-line-clamp);
-    -webkit-box-orient: vertical;
-  }
-
-  .m_3f669182:where([data-inherit]) {
-    line-height: inherit;
-    font-weight: inherit;
-    font-size: inherit;
-  }
-
-  .m_3f669182:where([data-inline]) {
-    line-height: 1;
-  }
-
 .m_487612c0 :first-child {
     margin-top: 0;
   }