@cck-ui/core 0.25.0 → 0.26.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/anchor/anchor.cjs +430 -0
- package/cjs/components/anchor/anchor.cjs.map +1 -0
- package/cjs/components/anchor/anchor.module.cjs +7 -0
- package/cjs/components/anchor/anchor.module.cjs.map +1 -0
- package/cjs/components/anchor/index.cjs +13 -0
- package/cjs/components/anchor/index.cjs.map +1 -0
- package/cjs/components/text/text.cjs.map +1 -1
- package/cjs/index.cjs +91 -88
- package/cjs/index.cjs.map +1 -1
- package/esm/components/anchor/anchor.mjs +428 -0
- package/esm/components/anchor/anchor.mjs.map +1 -0
- package/esm/components/anchor/anchor.module.mjs +7 -0
- package/esm/components/anchor/anchor.module.mjs.map +1 -0
- package/esm/components/anchor/index.mjs +10 -0
- package/esm/components/anchor/index.mjs.map +1 -0
- package/esm/components/text/text.mjs.map +1 -1
- package/esm/index.mjs +4 -2
- package/esm/index.mjs.map +1 -1
- package/lib/components/anchor/anchor.types.d.ts +16 -0
- package/lib/components/anchor/index.d.ts +6 -0
- package/lib/components/index.d.ts +1 -0
- package/package.json +1 -1
- package/styles/anchor.css +56 -0
- package/styles/anchor.layer.css +57 -0
- package/styles.css +109 -52
- package/styles.layer.css +109 -52
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { withInstall } from "../../core/utils/vue/install.mjs";
|
|
3
|
+
import { withClasses, withExtend, withPropsFactory } from "../../core/utils/vue/statics.mjs";
|
|
4
|
+
import anchor_module_default from "./anchor.module.mjs";
|
|
5
|
+
import anchor_default from "./anchor.mjs";
|
|
6
|
+
const CAnchor = withInstall(withPropsFactory(withExtend(withClasses(anchor_default, anchor_module_default))));
|
|
7
|
+
//#endregion
|
|
8
|
+
export { CAnchor, CAnchor as default };
|
|
9
|
+
|
|
10
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.mjs","names":["Anchor","classes"],"sources":["../../../src/components/anchor/index.ts"],"sourcesContent":["import {\n SFCWithInstallAndClasses,\n withClasses,\n withExtend,\n withInstall,\n withPropsFactory,\n} from '../../core'\n\nimport classes from './anchor.module.css'\nimport Anchor from './anchor.vue'\n\nconst AnchorWithStatic = withPropsFactory(withExtend(withClasses(Anchor, classes)))\n\nexport const CAnchor: SFCWithInstallAndClasses<typeof Anchor, typeof classes> =\n withInstall(AnchorWithStatic)\n\nexport default CAnchor\n\nexport * from './anchor.types'\n"],"mappings":";;;;;AAaA,MAAa,UACX,YAHuB,iBAAiB,WAAW,YAAYA,gBAAQC,qBAAO,CAAC,CAGnE,CAAgB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text.mjs","names":[],"sources":["../../../src/components/text/text.vue"],"sourcesContent":["<template>\n <c-box\n ref=\"_root\"\n v-bind=\"mergedAttrs\"\n :size=\"props.size\"\n :tag=\"props.span ? 'span' : 'p'\"\n :variant=\"props.variant\"\n >\n <slot />\n </c-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue'\nimport type { TextFactory, TextProps, TextTruncate } from './text.types
|
|
1
|
+
{"version":3,"file":"text.mjs","names":[],"sources":["../../../src/components/text/text.vue"],"sourcesContent":["<template>\n <c-box\n ref=\"_root\"\n v-bind=\"mergedAttrs\"\n :size=\"props.size\"\n :tag=\"props.span ? 'span' : 'p'\"\n :variant=\"props.variant\"\n >\n <slot />\n </c-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue'\nimport type { TextFactory, TextProps, TextTruncate } from './text.types'\nimport classes from './text.module.css'\nimport { useStyles, CBox, useComponentProps, CStyleProp } from '../../core'\nimport { varsResolver } from './text.utils'\n\ndefineOptions({\n name: 'CText',\n})\n\nconst _root = ref<InstanceType<typeof CBox> | null>(null)\n\nconst attrs = useAttrs()\n\nconst rawProps = defineProps<TextProps>()\n\nconst props = useComponentProps({\n component: 'CText',\n defaultProps: {},\n props: rawProps,\n})\n\nfunction getTextTruncate(truncate: TextTruncate | undefined) {\n if (truncate === 'start') {\n return 'start'\n }\n\n if (truncate === 'end' || truncate) {\n return 'end'\n }\n\n return undefined\n}\n\nconst knownProps = [\n 'lineClamp',\n 'truncate',\n 'inline',\n 'inherit',\n 'gradient',\n 'span',\n 'textWrap',\n '__staticSelector',\n 'vars',\n 'className',\n 'style',\n 'classNames',\n 'styles',\n 'unstyled',\n 'variant',\n 'mod',\n 'size',\n 'attributes',\n]\n\nconst modList = computed(() => [\n {\n 'data-truncate': getTextTruncate(props.value.truncate),\n 'data-line-clamp': typeof props.value.lineClamp === 'number',\n 'data-inline': props.value.inline,\n 'data-inherit': props.value.inherit,\n },\n])\n\nconst styleProps = computed(() => ({\n ...props.value,\n ...attrs,\n style: (attrs.style ?? props.value.style) as CStyleProp,\n}))\n\nconst getStyles = useStyles<TextFactory>({\n name: ['Text', props.value.__staticSelector],\n props: styleProps,\n classes,\n className: () => props.value.className,\n style: () => props.value.style,\n classNames: props.value.classNames,\n styles: props.value.styles,\n unstyled: props.value.unstyled,\n attributes: props.value.attributes,\n vars: props.value.vars,\n varsResolver,\n})\n\nconst rootAttrs = computed(() => getStyles('root', { focusable: true }))\n\nconst mergedAttrs = computed(() => {\n const others: Record<string, any> = {}\n const propsValue = props.value\n for (const key in propsValue) {\n if (!knownProps.includes(key)) {\n others[key] = propsValue[key as keyof typeof propsValue]\n }\n }\n const userMod = props.value.mod\n const mergedMod = [\n ...(Array.isArray(userMod) ? userMod : [userMod].filter(Boolean)),\n ...(modList.value || []),\n ]\n return { ...others, mod: mergedMod, ...rootAttrs.value }\n})\n\ndefineExpose({\n root: computed(() => _root.value?.root ?? null),\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuBA,MAAM,QAAQ,IAAsC,IAAI;EAExD,MAAM,QAAQ,SAAS;EAEvB,MAAM,WAAW;EAEjB,MAAM,QAAQ,kBAAkB;GAC9B,WAAW;GACX,cAAc,CAAC;GACf,OAAO;EACT,CAAC;EAED,SAAS,gBAAgB,UAAoC;GAC3D,IAAI,aAAa,SACf,OAAO;GAGT,IAAI,aAAa,SAAS,UACxB,OAAO;EAIX;EAEA,MAAM,aAAa;GACjB;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EAEA,MAAM,UAAU,eAAe,CAC7B;GACE,iBAAiB,gBAAgB,MAAM,MAAM,QAAQ;GACrD,mBAAmB,OAAO,MAAM,MAAM,cAAc;GACpD,eAAe,MAAM,MAAM;GAC3B,gBAAgB,MAAM,MAAM;EAC9B,CACF,CAAC;EAED,MAAM,aAAa,gBAAgB;GACjC,GAAG,MAAM;GACT,GAAG;GACH,OAAQ,MAAM,SAAS,MAAM,MAAM;EACrC,EAAE;EAEF,MAAM,YAAY,UAAuB;GACvC,MAAM,CAAC,QAAQ,MAAM,MAAM,gBAAgB;GAC3C,OAAO;GACP,SAAA;GACA,iBAAiB,MAAM,MAAM;GAC7B,aAAa,MAAM,MAAM;GACzB,YAAY,MAAM,MAAM;GACxB,QAAQ,MAAM,MAAM;GACpB,UAAU,MAAM,MAAM;GACtB,YAAY,MAAM,MAAM;GACxB,MAAM,MAAM,MAAM;GAClB;EACF,CAAC;EAED,MAAM,YAAY,eAAe,UAAU,QAAQ,EAAE,WAAW,KAAK,CAAC,CAAC;EAEvE,MAAM,cAAc,eAAe;GACjC,MAAM,SAA8B,CAAC;GACrC,MAAM,aAAa,MAAM;GACzB,KAAK,MAAM,OAAO,YAChB,IAAI,CAAC,WAAW,SAAS,GAAG,GAC1B,OAAO,OAAO,WAAW;GAG7B,MAAM,UAAU,MAAM,MAAM;GAC5B,MAAM,YAAY,CAChB,GAAI,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,CAAC,CAAC,OAAO,OAAO,GAC/D,GAAI,QAAQ,SAAS,CAAC,CACxB;GACA,OAAO;IAAE,GAAG;IAAQ,KAAK;IAAW,GAAG,UAAU;GAAM;EACzD,CAAC;EAED,SAAa,EACX,MAAM,eAAe,MAAM,OAAO,QAAQ,IAAI,EAChD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;qBApHC,YAQQ,OAAA,SARR,WAQQ,EAPN,KAAI,QAAO,GACH,OAAA,aAAW;EAClB,MAAM,OAAA,MAAM;EACZ,KAAK,OAAA,MAAM,OAAI,SAAA;EACf,SAAS,OAAA,MAAM;;yBAER,CAAR,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA"}
|
package/esm/index.mjs
CHANGED
|
@@ -58,6 +58,8 @@ import { CTransition } from "./components/transition/index.mjs";
|
|
|
58
58
|
import { CActionIcon, CActionIconGroup, CActionIconGroupSection } from "./components/action-icon/index.mjs";
|
|
59
59
|
import { CCloseButton } from "./components/close-button/index.mjs";
|
|
60
60
|
import { CAlert } from "./components/alert/index.mjs";
|
|
61
|
+
import { CText } from "./components/text/index.mjs";
|
|
62
|
+
import { CAnchor } from "./components/anchor/index.mjs";
|
|
61
63
|
import { CAspectRatio } from "./components/aspect-ratio/index.mjs";
|
|
62
64
|
import { CButton, CButtonGroup, CButtonGroupSection } from "./components/button/index.mjs";
|
|
63
65
|
import { CCenter } from "./components/center/index.mjs";
|
|
@@ -79,7 +81,6 @@ import { CSkeleton } from "./components/skeleton/index.mjs";
|
|
|
79
81
|
import { CSpace } from "./components/space/index.mjs";
|
|
80
82
|
import { CSplitter, CSplitterPane } from "./components/splitter/index.mjs";
|
|
81
83
|
import { CStack } from "./components/stack/index.mjs";
|
|
82
|
-
import { CText } from "./components/text/index.mjs";
|
|
83
84
|
import { CTypography } from "./components/typography/index.mjs";
|
|
84
85
|
import { CVisuallyHidden } from "./components/visually-hidden/index.mjs";
|
|
85
86
|
//#region packages/@cck-ui/core/src/index.ts
|
|
@@ -91,6 +92,7 @@ const components = [
|
|
|
91
92
|
CActionIconGroup,
|
|
92
93
|
CActionIconGroupSection,
|
|
93
94
|
CAlert,
|
|
95
|
+
CAnchor,
|
|
94
96
|
CAspectRatio,
|
|
95
97
|
CButton,
|
|
96
98
|
CButtonGroup,
|
|
@@ -136,6 +138,6 @@ const CckUI = { install(app) {
|
|
|
136
138
|
});
|
|
137
139
|
} };
|
|
138
140
|
//#endregion
|
|
139
|
-
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 };
|
|
141
|
+
export { CActionIcon, CActionIconGroup, CActionIconGroupSection, CAlert, CAnchor, 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 };
|
|
140
142
|
|
|
141
143
|
//# sourceMappingURL=index.mjs.map
|
package/esm/index.mjs.map
CHANGED
|
@@ -1 +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":"
|
|
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 CAnchor,\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 CAnchor,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,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;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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { PolymorphicFactory } from '../../core';
|
|
2
|
+
import { TextCssVariables, TextProps, TextStylesNames, TextVariant } from '../text';
|
|
3
|
+
export type AnchorStylesNames = TextStylesNames;
|
|
4
|
+
export type AnchorVariant = TextVariant;
|
|
5
|
+
export type AnchorCssVariables = TextCssVariables;
|
|
6
|
+
export interface AnchorProps extends Omit<TextProps, 'span'> {
|
|
7
|
+
underline?: 'always' | 'hover' | 'not-hover' | 'never';
|
|
8
|
+
}
|
|
9
|
+
export type AnchorFactory = PolymorphicFactory<{
|
|
10
|
+
props: AnchorProps;
|
|
11
|
+
defaultComponent: 'a';
|
|
12
|
+
defaultRef: HTMLAnchorElement;
|
|
13
|
+
stylesNames: AnchorStylesNames;
|
|
14
|
+
vars: AnchorCssVariables;
|
|
15
|
+
variant: AnchorVariant;
|
|
16
|
+
}>;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { SFCWithInstallAndClasses } from '../../core';
|
|
2
|
+
import classes from './anchor.module.css';
|
|
3
|
+
import Anchor from './anchor.vue';
|
|
4
|
+
export declare const CAnchor: SFCWithInstallAndClasses<typeof Anchor, typeof classes>;
|
|
5
|
+
export default CAnchor;
|
|
6
|
+
export * from './anchor.types';
|
package/package.json
CHANGED
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
.m_213348fa {
|
|
2
|
+
color: var(--c-color-anchor);
|
|
3
|
+
text-decoration: none;
|
|
4
|
+
appearance: none;
|
|
5
|
+
border: none;
|
|
6
|
+
display: inline;
|
|
7
|
+
padding: 0;
|
|
8
|
+
margin: 0;
|
|
9
|
+
background-color: transparent;
|
|
10
|
+
cursor: pointer;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@media (hover: hover) {
|
|
14
|
+
|
|
15
|
+
.m_213348fa:where([data-underline='hover']):hover {
|
|
16
|
+
text-decoration: underline;
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
@media (hover: none) {
|
|
21
|
+
|
|
22
|
+
.m_213348fa:where([data-underline='hover']):active {
|
|
23
|
+
text-decoration: underline;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.m_213348fa:where([data-underline='not-hover']) {
|
|
28
|
+
text-decoration: underline;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
@media (hover: hover) {
|
|
32
|
+
|
|
33
|
+
.m_213348fa:where([data-underline='not-hover']):hover {
|
|
34
|
+
text-decoration: none;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
@media (hover: none) {
|
|
39
|
+
|
|
40
|
+
.m_213348fa:where([data-underline='not-hover']):active {
|
|
41
|
+
text-decoration: none;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.m_213348fa:where([data-underline='always']) {
|
|
46
|
+
text-decoration: underline;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.m_213348fa:where([data-variant='gradient']),
|
|
50
|
+
.m_213348fa:where([data-variant='gradient']):hover {
|
|
51
|
+
text-decoration: none;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.m_213348fa:where([data-line-clamp]) {
|
|
55
|
+
display: -webkit-box;
|
|
56
|
+
}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
@layer cck {.m_213348fa {
|
|
2
|
+
color: var(--c-color-anchor);
|
|
3
|
+
text-decoration: none;
|
|
4
|
+
appearance: none;
|
|
5
|
+
border: none;
|
|
6
|
+
display: inline;
|
|
7
|
+
padding: 0;
|
|
8
|
+
margin: 0;
|
|
9
|
+
background-color: transparent;
|
|
10
|
+
cursor: pointer;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@media (hover: hover) {
|
|
14
|
+
|
|
15
|
+
.m_213348fa:where([data-underline='hover']):hover {
|
|
16
|
+
text-decoration: underline;
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
@media (hover: none) {
|
|
21
|
+
|
|
22
|
+
.m_213348fa:where([data-underline='hover']):active {
|
|
23
|
+
text-decoration: underline;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.m_213348fa:where([data-underline='not-hover']) {
|
|
28
|
+
text-decoration: underline;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
@media (hover: hover) {
|
|
32
|
+
|
|
33
|
+
.m_213348fa:where([data-underline='not-hover']):hover {
|
|
34
|
+
text-decoration: none;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
@media (hover: none) {
|
|
39
|
+
|
|
40
|
+
.m_213348fa:where([data-underline='not-hover']):active {
|
|
41
|
+
text-decoration: none;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.m_213348fa:where([data-underline='always']) {
|
|
46
|
+
text-decoration: underline;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.m_213348fa:where([data-variant='gradient']),
|
|
50
|
+
.m_213348fa:where([data-variant='gradient']):hover {
|
|
51
|
+
text-decoration: none;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.m_213348fa:where([data-line-clamp]) {
|
|
55
|
+
display: -webkit-box;
|
|
56
|
+
}
|
|
57
|
+
}
|
package/styles.css
CHANGED
|
@@ -605,6 +605,115 @@ fieldset:disabled .c-active:active {
|
|
|
605
605
|
--c-color-orange-outline-hover: rgba(253, 126, 20, 0.05);
|
|
606
606
|
}
|
|
607
607
|
|
|
608
|
+
.m_3f669182 {
|
|
609
|
+
-webkit-tap-highlight-color: transparent;
|
|
610
|
+
text-decoration: none;
|
|
611
|
+
font-size: var(--text-fz, var(--c-font-size-md));
|
|
612
|
+
line-height: var(--text-lh, var(--c-line-height-md));
|
|
613
|
+
font-weight: var(--c-font-weight-regular);
|
|
614
|
+
text-wrap: var(--text-text-wrap, var(--c-text-wrap));
|
|
615
|
+
margin: 0;
|
|
616
|
+
padding: 0;
|
|
617
|
+
}
|
|
618
|
+
|
|
619
|
+
.m_3f669182:where([data-truncate]) {
|
|
620
|
+
overflow: hidden;
|
|
621
|
+
text-overflow: ellipsis;
|
|
622
|
+
white-space: nowrap;
|
|
623
|
+
}
|
|
624
|
+
|
|
625
|
+
.m_3f669182:where([data-truncate='start']) {
|
|
626
|
+
direction: rtl;
|
|
627
|
+
text-align: end;
|
|
628
|
+
}
|
|
629
|
+
|
|
630
|
+
:where([dir="rtl"]) .m_3f669182:where([data-truncate='start']) {
|
|
631
|
+
direction: ltr;
|
|
632
|
+
text-align: start;
|
|
633
|
+
}
|
|
634
|
+
|
|
635
|
+
.m_3f669182:where([data-variant='gradient']) {
|
|
636
|
+
background-image: var(--text-gradient);
|
|
637
|
+
-webkit-text-fill-color: transparent;
|
|
638
|
+
-webkit-background-clip: text;
|
|
639
|
+
background-clip: text;
|
|
640
|
+
}
|
|
641
|
+
|
|
642
|
+
.m_3f669182:where([data-line-clamp]) {
|
|
643
|
+
overflow: hidden;
|
|
644
|
+
text-overflow: ellipsis;
|
|
645
|
+
display: -webkit-box;
|
|
646
|
+
-webkit-line-clamp: var(--text-line-clamp);
|
|
647
|
+
-webkit-box-orient: vertical;
|
|
648
|
+
}
|
|
649
|
+
|
|
650
|
+
.m_3f669182:where([data-inherit]) {
|
|
651
|
+
line-height: inherit;
|
|
652
|
+
font-weight: inherit;
|
|
653
|
+
font-size: inherit;
|
|
654
|
+
}
|
|
655
|
+
|
|
656
|
+
.m_3f669182:where([data-inline]) {
|
|
657
|
+
line-height: 1;
|
|
658
|
+
}
|
|
659
|
+
|
|
660
|
+
.m_213348fa {
|
|
661
|
+
color: var(--c-color-anchor);
|
|
662
|
+
text-decoration: none;
|
|
663
|
+
appearance: none;
|
|
664
|
+
border: none;
|
|
665
|
+
display: inline;
|
|
666
|
+
padding: 0;
|
|
667
|
+
margin: 0;
|
|
668
|
+
background-color: transparent;
|
|
669
|
+
cursor: pointer;
|
|
670
|
+
}
|
|
671
|
+
|
|
672
|
+
@media (hover: hover) {
|
|
673
|
+
|
|
674
|
+
.m_213348fa:where([data-underline='hover']):hover {
|
|
675
|
+
text-decoration: underline;
|
|
676
|
+
}
|
|
677
|
+
}
|
|
678
|
+
|
|
679
|
+
@media (hover: none) {
|
|
680
|
+
|
|
681
|
+
.m_213348fa:where([data-underline='hover']):active {
|
|
682
|
+
text-decoration: underline;
|
|
683
|
+
}
|
|
684
|
+
}
|
|
685
|
+
|
|
686
|
+
.m_213348fa:where([data-underline='not-hover']) {
|
|
687
|
+
text-decoration: underline;
|
|
688
|
+
}
|
|
689
|
+
|
|
690
|
+
@media (hover: hover) {
|
|
691
|
+
|
|
692
|
+
.m_213348fa:where([data-underline='not-hover']):hover {
|
|
693
|
+
text-decoration: none;
|
|
694
|
+
}
|
|
695
|
+
}
|
|
696
|
+
|
|
697
|
+
@media (hover: none) {
|
|
698
|
+
|
|
699
|
+
.m_213348fa:where([data-underline='not-hover']):active {
|
|
700
|
+
text-decoration: none;
|
|
701
|
+
}
|
|
702
|
+
}
|
|
703
|
+
|
|
704
|
+
.m_213348fa:where([data-underline='always']) {
|
|
705
|
+
text-decoration: underline;
|
|
706
|
+
}
|
|
707
|
+
|
|
708
|
+
.m_213348fa:where([data-variant='gradient']),
|
|
709
|
+
.m_213348fa:where([data-variant='gradient']):hover {
|
|
710
|
+
text-decoration: none;
|
|
711
|
+
}
|
|
712
|
+
|
|
713
|
+
.m_213348fa:where([data-line-clamp]) {
|
|
714
|
+
display: -webkit-box;
|
|
715
|
+
}
|
|
716
|
+
|
|
608
717
|
.m_537a2afc {
|
|
609
718
|
background-color: transparent;
|
|
610
719
|
cursor: pointer;
|
|
@@ -1881,58 +1990,6 @@ fieldset:disabled .c-active:active {
|
|
|
1881
1990
|
gap: var(--stack-gap, var(--c-spacing-md));
|
|
1882
1991
|
}
|
|
1883
1992
|
|
|
1884
|
-
.m_3f669182 {
|
|
1885
|
-
-webkit-tap-highlight-color: transparent;
|
|
1886
|
-
text-decoration: none;
|
|
1887
|
-
font-size: var(--text-fz, var(--c-font-size-md));
|
|
1888
|
-
line-height: var(--text-lh, var(--c-line-height-md));
|
|
1889
|
-
font-weight: var(--c-font-weight-regular);
|
|
1890
|
-
text-wrap: var(--text-text-wrap, var(--c-text-wrap));
|
|
1891
|
-
margin: 0;
|
|
1892
|
-
padding: 0;
|
|
1893
|
-
}
|
|
1894
|
-
|
|
1895
|
-
.m_3f669182:where([data-truncate]) {
|
|
1896
|
-
overflow: hidden;
|
|
1897
|
-
text-overflow: ellipsis;
|
|
1898
|
-
white-space: nowrap;
|
|
1899
|
-
}
|
|
1900
|
-
|
|
1901
|
-
.m_3f669182:where([data-truncate='start']) {
|
|
1902
|
-
direction: rtl;
|
|
1903
|
-
text-align: end;
|
|
1904
|
-
}
|
|
1905
|
-
|
|
1906
|
-
:where([dir="rtl"]) .m_3f669182:where([data-truncate='start']) {
|
|
1907
|
-
direction: ltr;
|
|
1908
|
-
text-align: start;
|
|
1909
|
-
}
|
|
1910
|
-
|
|
1911
|
-
.m_3f669182:where([data-variant='gradient']) {
|
|
1912
|
-
background-image: var(--text-gradient);
|
|
1913
|
-
-webkit-text-fill-color: transparent;
|
|
1914
|
-
-webkit-background-clip: text;
|
|
1915
|
-
background-clip: text;
|
|
1916
|
-
}
|
|
1917
|
-
|
|
1918
|
-
.m_3f669182:where([data-line-clamp]) {
|
|
1919
|
-
overflow: hidden;
|
|
1920
|
-
text-overflow: ellipsis;
|
|
1921
|
-
display: -webkit-box;
|
|
1922
|
-
-webkit-line-clamp: var(--text-line-clamp);
|
|
1923
|
-
-webkit-box-orient: vertical;
|
|
1924
|
-
}
|
|
1925
|
-
|
|
1926
|
-
.m_3f669182:where([data-inherit]) {
|
|
1927
|
-
line-height: inherit;
|
|
1928
|
-
font-weight: inherit;
|
|
1929
|
-
font-size: inherit;
|
|
1930
|
-
}
|
|
1931
|
-
|
|
1932
|
-
.m_3f669182:where([data-inline]) {
|
|
1933
|
-
line-height: 1;
|
|
1934
|
-
}
|
|
1935
|
-
|
|
1936
1993
|
.m_487612c0 :first-child {
|
|
1937
1994
|
margin-top: 0;
|
|
1938
1995
|
}
|
package/styles.layer.css
CHANGED
|
@@ -605,6 +605,115 @@ fieldset:disabled .c-active:active {
|
|
|
605
605
|
--c-color-orange-outline-hover: rgba(253, 126, 20, 0.05);
|
|
606
606
|
}
|
|
607
607
|
|
|
608
|
+
.m_3f669182 {
|
|
609
|
+
-webkit-tap-highlight-color: transparent;
|
|
610
|
+
text-decoration: none;
|
|
611
|
+
font-size: var(--text-fz, var(--c-font-size-md));
|
|
612
|
+
line-height: var(--text-lh, var(--c-line-height-md));
|
|
613
|
+
font-weight: var(--c-font-weight-regular);
|
|
614
|
+
text-wrap: var(--text-text-wrap, var(--c-text-wrap));
|
|
615
|
+
margin: 0;
|
|
616
|
+
padding: 0;
|
|
617
|
+
}
|
|
618
|
+
|
|
619
|
+
.m_3f669182:where([data-truncate]) {
|
|
620
|
+
overflow: hidden;
|
|
621
|
+
text-overflow: ellipsis;
|
|
622
|
+
white-space: nowrap;
|
|
623
|
+
}
|
|
624
|
+
|
|
625
|
+
.m_3f669182:where([data-truncate='start']) {
|
|
626
|
+
direction: rtl;
|
|
627
|
+
text-align: end;
|
|
628
|
+
}
|
|
629
|
+
|
|
630
|
+
:where([dir="rtl"]) .m_3f669182:where([data-truncate='start']) {
|
|
631
|
+
direction: ltr;
|
|
632
|
+
text-align: start;
|
|
633
|
+
}
|
|
634
|
+
|
|
635
|
+
.m_3f669182:where([data-variant='gradient']) {
|
|
636
|
+
background-image: var(--text-gradient);
|
|
637
|
+
-webkit-text-fill-color: transparent;
|
|
638
|
+
-webkit-background-clip: text;
|
|
639
|
+
background-clip: text;
|
|
640
|
+
}
|
|
641
|
+
|
|
642
|
+
.m_3f669182:where([data-line-clamp]) {
|
|
643
|
+
overflow: hidden;
|
|
644
|
+
text-overflow: ellipsis;
|
|
645
|
+
display: -webkit-box;
|
|
646
|
+
-webkit-line-clamp: var(--text-line-clamp);
|
|
647
|
+
-webkit-box-orient: vertical;
|
|
648
|
+
}
|
|
649
|
+
|
|
650
|
+
.m_3f669182:where([data-inherit]) {
|
|
651
|
+
line-height: inherit;
|
|
652
|
+
font-weight: inherit;
|
|
653
|
+
font-size: inherit;
|
|
654
|
+
}
|
|
655
|
+
|
|
656
|
+
.m_3f669182:where([data-inline]) {
|
|
657
|
+
line-height: 1;
|
|
658
|
+
}
|
|
659
|
+
|
|
660
|
+
.m_213348fa {
|
|
661
|
+
color: var(--c-color-anchor);
|
|
662
|
+
text-decoration: none;
|
|
663
|
+
appearance: none;
|
|
664
|
+
border: none;
|
|
665
|
+
display: inline;
|
|
666
|
+
padding: 0;
|
|
667
|
+
margin: 0;
|
|
668
|
+
background-color: transparent;
|
|
669
|
+
cursor: pointer;
|
|
670
|
+
}
|
|
671
|
+
|
|
672
|
+
@media (hover: hover) {
|
|
673
|
+
|
|
674
|
+
.m_213348fa:where([data-underline='hover']):hover {
|
|
675
|
+
text-decoration: underline;
|
|
676
|
+
}
|
|
677
|
+
}
|
|
678
|
+
|
|
679
|
+
@media (hover: none) {
|
|
680
|
+
|
|
681
|
+
.m_213348fa:where([data-underline='hover']):active {
|
|
682
|
+
text-decoration: underline;
|
|
683
|
+
}
|
|
684
|
+
}
|
|
685
|
+
|
|
686
|
+
.m_213348fa:where([data-underline='not-hover']) {
|
|
687
|
+
text-decoration: underline;
|
|
688
|
+
}
|
|
689
|
+
|
|
690
|
+
@media (hover: hover) {
|
|
691
|
+
|
|
692
|
+
.m_213348fa:where([data-underline='not-hover']):hover {
|
|
693
|
+
text-decoration: none;
|
|
694
|
+
}
|
|
695
|
+
}
|
|
696
|
+
|
|
697
|
+
@media (hover: none) {
|
|
698
|
+
|
|
699
|
+
.m_213348fa:where([data-underline='not-hover']):active {
|
|
700
|
+
text-decoration: none;
|
|
701
|
+
}
|
|
702
|
+
}
|
|
703
|
+
|
|
704
|
+
.m_213348fa:where([data-underline='always']) {
|
|
705
|
+
text-decoration: underline;
|
|
706
|
+
}
|
|
707
|
+
|
|
708
|
+
.m_213348fa:where([data-variant='gradient']),
|
|
709
|
+
.m_213348fa:where([data-variant='gradient']):hover {
|
|
710
|
+
text-decoration: none;
|
|
711
|
+
}
|
|
712
|
+
|
|
713
|
+
.m_213348fa:where([data-line-clamp]) {
|
|
714
|
+
display: -webkit-box;
|
|
715
|
+
}
|
|
716
|
+
|
|
608
717
|
.m_537a2afc {
|
|
609
718
|
background-color: transparent;
|
|
610
719
|
cursor: pointer;
|
|
@@ -1881,58 +1990,6 @@ fieldset:disabled .c-active:active {
|
|
|
1881
1990
|
gap: var(--stack-gap, var(--c-spacing-md));
|
|
1882
1991
|
}
|
|
1883
1992
|
|
|
1884
|
-
.m_3f669182 {
|
|
1885
|
-
-webkit-tap-highlight-color: transparent;
|
|
1886
|
-
text-decoration: none;
|
|
1887
|
-
font-size: var(--text-fz, var(--c-font-size-md));
|
|
1888
|
-
line-height: var(--text-lh, var(--c-line-height-md));
|
|
1889
|
-
font-weight: var(--c-font-weight-regular);
|
|
1890
|
-
text-wrap: var(--text-text-wrap, var(--c-text-wrap));
|
|
1891
|
-
margin: 0;
|
|
1892
|
-
padding: 0;
|
|
1893
|
-
}
|
|
1894
|
-
|
|
1895
|
-
.m_3f669182:where([data-truncate]) {
|
|
1896
|
-
overflow: hidden;
|
|
1897
|
-
text-overflow: ellipsis;
|
|
1898
|
-
white-space: nowrap;
|
|
1899
|
-
}
|
|
1900
|
-
|
|
1901
|
-
.m_3f669182:where([data-truncate='start']) {
|
|
1902
|
-
direction: rtl;
|
|
1903
|
-
text-align: end;
|
|
1904
|
-
}
|
|
1905
|
-
|
|
1906
|
-
:where([dir="rtl"]) .m_3f669182:where([data-truncate='start']) {
|
|
1907
|
-
direction: ltr;
|
|
1908
|
-
text-align: start;
|
|
1909
|
-
}
|
|
1910
|
-
|
|
1911
|
-
.m_3f669182:where([data-variant='gradient']) {
|
|
1912
|
-
background-image: var(--text-gradient);
|
|
1913
|
-
-webkit-text-fill-color: transparent;
|
|
1914
|
-
-webkit-background-clip: text;
|
|
1915
|
-
background-clip: text;
|
|
1916
|
-
}
|
|
1917
|
-
|
|
1918
|
-
.m_3f669182:where([data-line-clamp]) {
|
|
1919
|
-
overflow: hidden;
|
|
1920
|
-
text-overflow: ellipsis;
|
|
1921
|
-
display: -webkit-box;
|
|
1922
|
-
-webkit-line-clamp: var(--text-line-clamp);
|
|
1923
|
-
-webkit-box-orient: vertical;
|
|
1924
|
-
}
|
|
1925
|
-
|
|
1926
|
-
.m_3f669182:where([data-inherit]) {
|
|
1927
|
-
line-height: inherit;
|
|
1928
|
-
font-weight: inherit;
|
|
1929
|
-
font-size: inherit;
|
|
1930
|
-
}
|
|
1931
|
-
|
|
1932
|
-
.m_3f669182:where([data-inline]) {
|
|
1933
|
-
line-height: 1;
|
|
1934
|
-
}
|
|
1935
|
-
|
|
1936
1993
|
.m_487612c0 :first-child {
|
|
1937
1994
|
margin-top: 0;
|
|
1938
1995
|
}
|