npm - @cck-ui/core - Versions diffs - 0.20.1 → 0.20.2 - Mend

@cck-ui/core 0.20.1 → 0.20.2

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.

Files changed (110) hide show

package/esm/components/unstyled-button/unstyled-button.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"unstyled-button.mjs","names":[],"sources":["../../../src/components/unstyled-button/unstyled-button.vue"],"sourcesContent":["<template>\n <c-box\n ref=\"_root\"\n v-bind=\"mergedAttrs\"\n :tag=\"tag\"\n :type=\"tag === 'button' ? 'button' : undefined\"\n >\n <slot />\n </c-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue'\nimport { CBox, CStyleProp, useComponentProps, useStyles } from '../../core'\nimport type { UnstyledButtonFactory, UnstyledButtonProps } from './unstyled-button.types'\nimport classes from './unstyled-button.module.css'\n\ndefineOptions({\n name: 'UnstyledButton',\n})\n\nconst attrs = useAttrs()\n\nconst rawProps = defineProps<UnstyledButtonProps>()\n\nconst props = useComponentProps({\n component: 'UnstyledButton',\n defaultProps: {\n __staticSelector: 'UnstyledButton',\n },\n props: rawProps,\n})\n\nconst { tag = 'button' } = props.value\n\nconst _root = ref<InstanceType<typeof CBox> \| null>(null)\n\nconst knownProps = [\n 'className',\n 'tag',\n '__staticSelector',\n 'unstyled',\n 'classNames',\n 'styles',\n 'style',\n 'attributes',\n]\n\nconst styleProps = computed(() => ({\n ...props.value,\n ...attrs,\n style: (attrs.style ?? props.value.style) as CStyleProp,\n}))\n\nconst getStyles = useStyles<UnstyledButtonFactory>({\n name: 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})\n\nconst rootAttrs = computed(() => getStyles('root', { focusable: true }))\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 return { ...others, ...rootAttrs.value }\n})\n\ndefineExpose({\n root: computed(() => _root.value?.root ?? null),\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,QAAQ,SAAS;EAEvB,MAAM,WAAW;EAEjB,MAAM,QAAQ,kBAAkB;GAC9B,WAAW;GACX,cAAc,EACZ,kBAAkB,iBACpB;GACA,OAAO;EACT,CAAC;EAED,MAAM,EAAE,MAAM,aAAa,MAAM;EAEjC,MAAM,QAAQ,IAAsC,IAAI;EAExD,MAAM,aAAa;GACjB;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EAEA,MAAM,aAAa,gBAAgB;GACjC,GAAG,MAAM;GACT,GAAG;GACH,OAAQ,MAAM,SAAS,MAAM,MAAM;EACrC,EAAE;EAEF,MAAM,YAAY,UAAiC;GACjD,MAAM,MAAM,MAAM;GAClB,OAAO;GACP,SAAA;GACA,~~WAAW~~,MAAM,MAAM;~~GACvB~~,~~OAAO~~,MAAM,MAAM;~~GACnB~~,YAAY,MAAM,MAAM;GACxB,QAAQ,MAAM,MAAM;GACpB,UAAU,MAAM,MAAM;GACtB,YAAY,MAAM,MAAM;EAC1B,CAAC;EAED,MAAM,YAAY,eAAe,UAAU,QAAQ,EAAE,WAAW,KAAK,CAAC,CAAC;EACvE,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,OAAO;IAAE,GAAG;IAAQ,GAAG,UAAU;GAAM;EACzC,CAAC;EAED,SAAa,EACX,MAAM,eAAe,MAAM,OAAO,QAAQ,IAAI,EAChD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;qBA/EC,YAOQ,OAAA,SAPR,WAOQ,EANN,KAAI,QAAO,GACH,OAAA,aAAW;EAClB,KAAK,OAAA;EACL,MAAM,OAAA,QAAG,WAAA,WAA2B,KAAA;;yBAE7B,CAAR,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA"}
1	+ {"version":3,"file":"unstyled-button.mjs","names":[],"sources":["../../../src/components/unstyled-button/unstyled-button.vue"],"sourcesContent":["<template>\n <c-box\n ref=\"_root\"\n v-bind=\"mergedAttrs\"\n :tag=\"tag\"\n :type=\"tag === 'button' ? 'button' : undefined\"\n >\n <slot />\n </c-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue'\nimport { CBox, CStyleProp, useComponentProps, useStyles } from '../../core'\nimport type { UnstyledButtonFactory, UnstyledButtonProps } from './unstyled-button.types'\nimport classes from './unstyled-button.module.css'\n\ndefineOptions({\n name: 'UnstyledButton',\n})\n\nconst attrs = useAttrs()\n\nconst rawProps = defineProps<UnstyledButtonProps>()\n\nconst props = useComponentProps({\n component: 'UnstyledButton',\n defaultProps: {\n __staticSelector: 'UnstyledButton',\n },\n props: rawProps,\n})\n\nconst { tag = 'button' } = props.value\n\nconst _root = ref<InstanceType<typeof CBox> \| null>(null)\n\nconst knownProps = [\n 'className',\n 'tag',\n '__staticSelector',\n 'unstyled',\n 'classNames',\n 'styles',\n 'style',\n 'attributes',\n]\n\nconst styleProps = computed(() => ({\n ...props.value,\n ...attrs,\n style: (attrs.style ?? props.value.style) as CStyleProp,\n}))\n\nconst getStyles = useStyles<UnstyledButtonFactory>({\n name: 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})\n\nconst rootAttrs = computed(() => getStyles('root', { focusable: true }))\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 return { ...others, ...rootAttrs.value }\n})\n\ndefineExpose({\n root: computed(() => _root.value?.root ?? null),\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,QAAQ,SAAS;EAEvB,MAAM,WAAW;EAEjB,MAAM,QAAQ,kBAAkB;GAC9B,WAAW;GACX,cAAc,EACZ,kBAAkB,iBACpB;GACA,OAAO;EACT,CAAC;EAED,MAAM,EAAE,MAAM,aAAa,MAAM;EAEjC,MAAM,QAAQ,IAAsC,IAAI;EAExD,MAAM,aAAa;GACjB;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EAEA,MAAM,aAAa,gBAAgB;GACjC,GAAG,MAAM;GACT,GAAG;GACH,OAAQ,MAAM,SAAS,MAAM,MAAM;EACrC,EAAE;EAEF,MAAM,YAAY,UAAiC;GACjD,MAAM,MAAM,MAAM;GAClB,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;EAC1B,CAAC;EAED,MAAM,YAAY,eAAe,UAAU,QAAQ,EAAE,WAAW,KAAK,CAAC,CAAC;EACvE,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,OAAO;IAAE,GAAG;IAAQ,GAAG,UAAU;GAAM;EACzC,CAAC;EAED,SAAa,EACX,MAAM,eAAe,MAAM,OAAO,QAAQ,IAAI,EAChD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;qBA/EC,YAOQ,OAAA,SAPR,WAOQ,EANN,KAAI,QAAO,GACH,OAAA,aAAW;EAClB,KAAK,OAAA;EACL,MAAM,OAAA,QAAG,WAAA,WAA2B,KAAA;;yBAE7B,CAAR,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA"}

package/esm/core/styles-api/use-styles/use-styles.mjs CHANGED Viewed

@@ -24,6 +24,8 @@ function useStyles({ name, classes, props, stylesCtx, className, style, rootSele
 	return (selector, options) => {
 		const currentProps = toValue(props);
 		const currentCtx = toValue(stylesCtx);
+		const currentStyle = toValue(style);
+		const currentClassName = toValue(className);
 		const resolvedClassNames = resolveClassNames({
 			theme,
 			classNames,
@@ -61,7 +63,7 @@ function useStyles({ name, classes, props, stylesCtx, className, style, rootSele
 			vars?.(theme, currentProps, currentCtx)
 		]);
 		const resolvedRootStyle = resolveStyle({
-			style,
+			style: currentStyle,
 			theme
 		});
 		return {
@@ -76,7 +78,7 @@ function useStyles({ name, classes, props, stylesCtx, className, style, rootSele
 				resolvedThemeClassNames,
 				classes,
 				unstyled,
-				className,
+				className: currentClassName,
 				rootSelector,
 				props: currentProps,
 				stylesCtx: currentCtx,

package/esm/core/styles-api/use-styles/use-styles.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-styles.mjs","names":[],"sources":["../../../../src/core/styles-api/use-styles/use-styles.ts"],"sourcesContent":["import {\n Attributes,\n ClassNames,\n ClassNamesArray,\n GetStylesApiOptions,\n Styles,\n} from '../styles-api.types'\nimport { PartialVarsResolver, VarsResolver } from '../create-vars-resolver/create-vars-resolver'\nimport { useStylesTransform } from './use-transformed-styles'\nimport { resolveClassNames } from './get-class-name/resolve-class-names/resolve-class-names'\nimport { resolveStyles } from './get-style/resolve-styles/resolve-styles'\nimport { mergeVars } from './get-style/resolve-vars/merge-vars'\nimport { resolveStyle } from './get-style/resolve-style/resolve-style'\nimport { getClassName } from './get-class-name/get-class-name'\nimport { Properties } from 'csstype'\nimport { getStyle } from './get-style/get-style'\nimport { FactoryPayload } from '../../factory'\nimport { CStyleProp } from '../../box'\nimport {\n useCckClassNamesPrefix,\n useCckIsHeadless,\n useCckTheme,\n useCckWithStaticClasses,\n} from '../../config-provider'\nimport { MaybeRefOrGetter, toValue } from 'vue'\n\nexport interface UseStylesInput<Payload extends FactoryPayload> {\n name: string \| (string \| undefined)[]\n classes: Payload['stylesNames'] extends string ? Record<string, string> : never\n props: MaybeRefOrGetter<Payload['props']>\n stylesCtx?: MaybeRefOrGetter<Payload['ctx'] \| undefined>\n className?: string \| undefined\n style?: CStyleProp\n rootSelector?: Payload['stylesNames']\n unstyled?: boolean\n classNames?: ClassNames<Payload> \| ClassNamesArray<Payload>\n styles?: Styles<Payload>\n vars?: PartialVarsResolver<Payload>\n varsResolver?: VarsResolver<Payload>\n attributes?: Attributes<Payload>\n}\n\nexport type GetStylesApi<Payload extends FactoryPayload> = (\n selector: NonNullable<Payload['stylesNames']>,\n options?: GetStylesApiOptions\n) => {\n className: string\n style: Properties\n}\n\nexport function useStyles<Payload extends FactoryPayload>({\n name,\n classes,\n props,\n stylesCtx,\n className,\n style,\n rootSelector = 'root' as NonNullable<Payload['stylesNames']>,\n unstyled,\n classNames,\n styles,\n vars,\n varsResolver,\n attributes,\n}: UseStylesInput<Payload>): GetStylesApi<Payload> {\n const _theme = useCckTheme()\n const theme = _theme.value\n const classNamesPrefix = useCckClassNamesPrefix()\n const withStaticClasses = useCckWithStaticClasses()\n const headless = useCckIsHeadless()\n\n const themeNames = Array.isArray(name) ? name : [name]\n const themeName = themeNames.filter((n) => n) as string[]\n\n const { withStylesTransform, getTransformedStyles } = useStylesTransform({\n props,\n stylesCtx,\n themeName,\n theme,\n })\n\n return (selector, options) => {\n const currentProps = toValue(props) as Payload['props']\n const currentCtx = toValue(stylesCtx) as Payload['ctx'] \| undefined\n\n const resolvedClassNames = resolveClassNames({\n theme,\n classNames,\n props: currentProps,\n stylesCtx: currentCtx,\n })\n\n const resolvedThemeClassNames = themeName.map((n) =>\n resolveClassNames({\n theme,\n classNames: theme.components?.[n]?.classNames,\n props: currentProps,\n stylesCtx: currentCtx,\n })\n )\n\n const resolvedComponentStyles = withStylesTransform\n ? {}\n : resolveStyles({ theme, styles, props: currentProps, stylesCtx: currentCtx })\n\n const resolvedThemeStyles: Record<string, any> = {}\n if (!withStylesTransform) {\n for (const n of themeName) {\n const resolved = resolveStyles({\n theme,\n styles: theme.components?.[n]?.styles,\n props: currentProps,\n stylesCtx: currentCtx,\n })\n for (const key of Object.keys(resolved)) {\n resolvedThemeStyles[key] = {\n ...resolvedThemeStyles[key],\n ...resolved[key],\n }\n }\n }\n }\n\n const resolvedVars = mergeVars([\n headless ? {} : varsResolver?.(theme, currentProps, currentCtx),\n ...themeName.map((n) => theme.components?.[n]?.vars?.(theme, currentProps, currentCtx)),\n vars?.(theme, currentProps, currentCtx),\n ])\n\n const resolvedRootStyle = resolveStyle({ style, theme })\n\n return {\n ...attributes?.[selector],\n\n className: getClassName({\n theme,\n options,\n themeName,\n selector,\n classNamesPrefix,\n resolvedClassNames,\n resolvedThemeClassNames,\n classes,\n unstyled,\n className,\n rootSelector,\n props: currentProps,\n stylesCtx: currentCtx,\n withStaticClasses,\n headless,\n transformedStyles: getTransformedStyles([options?.styles, styles]),\n }),\n\n style: getStyle({\n theme,\n selector,\n options,\n props: currentProps,\n stylesCtx: currentCtx,\n rootSelector,\n withStylesTransform,\n resolvedStyles: resolvedComponentStyles,\n resolvedThemeStyles,\n resolvedVars,\n resolvedRootStyle,\n }),\n }\n }\n}\n"],"mappings":";;;;;;;;;;;AAkDA,SAAgB,UAA0C,EACxD,MACA,SACA,OACA,WACA,WACA,OACA,eAAe,QACf,UACA,YACA,QACA,MACA,cACA,cACiD;CAEjD,MAAM,QADS,YACI,CAAC,CAAC;CACrB,MAAM,mBAAmB,uBAAuB;CAChD,MAAM,oBAAoB,wBAAwB;CAClD,MAAM,WAAW,iBAAiB;CAGlC,MAAM,aADa,MAAM,QAAQ,IAAI,IAAI,OAAO,CAAC,IAAI,EAAA,CACxB,QAAQ,MAAM,CAAC;CAE5C,MAAM,EAAE,qBAAqB,yBAAyB,mBAAmB;EACvE;EACA;EACA;EACA;CACF,CAAC;CAED,QAAQ,UAAU,YAAY;EAC5B,MAAM,eAAe,QAAQ,KAAK;EAClC,MAAM,aAAa,QAAQ,SAAS;~~EAEpC~~,MAAM,qBAAqB,kBAAkB;GAC3C;GACA;GACA,OAAO;GACP,WAAW;EACb,CAAC;EAED,MAAM,0BAA0B,UAAU,KAAK,MAC7C,kBAAkB;GAChB;GACA,YAAY,MAAM,aAAa,EAAE,EAAE;GACnC,OAAO;GACP,WAAW;EACb,CAAC,CACH;EAEA,MAAM,0BAA0B,sBAC5B,CAAC,IACD,cAAc;GAAE;GAAO;GAAQ,OAAO;GAAc,WAAW;EAAW,CAAC;EAE/E,MAAM,sBAA2C,CAAC;EAClD,IAAI,CAAC,qBACH,KAAK,MAAM,KAAK,WAAW;GACzB,MAAM,WAAW,cAAc;IAC7B;IACA,QAAQ,MAAM,aAAa,EAAE,EAAE;IAC/B,OAAO;IACP,WAAW;GACb,CAAC;GACD,KAAK,MAAM,OAAO,OAAO,KAAK,QAAQ,GACpC,oBAAoB,OAAO;IACzB,GAAG,oBAAoB;IACvB,GAAG,SAAS;GACd;EAEJ;EAGF,MAAM,eAAe,UAAU;GAC7B,WAAW,CAAC,IAAI,eAAe,OAAO,cAAc,UAAU;GAC9D,GAAG,UAAU,KAAK,MAAM,MAAM,aAAa,EAAE,EAAE,OAAO,OAAO,cAAc,UAAU,CAAC;GACtF,OAAO,OAAO,cAAc,UAAU;EACxC,CAAC;EAED,MAAM,oBAAoB,aAAa;GAAE;~~GAAO~~;EAAM,CAAC;~~EAEvD~~,OAAO;GACL,GAAG,aAAa;GAEhB,WAAW,aAAa;IACtB;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;~~IACA~~;IACA,OAAO;IACP,WAAW;IACX;IACA;IACA,mBAAmB,qBAAqB,CAAC,SAAS,QAAQ,MAAM,CAAC;GACnE,CAAC;GAED,OAAO,SAAS;IACd;IACA;IACA;IACA,OAAO;IACP,WAAW;IACX;IACA;IACA,gBAAgB;IAChB;IACA;IACA;GACF,CAAC;EACH;CACF;AACF"}
1	+ {"version":3,"file":"use-styles.mjs","names":[],"sources":["../../../../src/core/styles-api/use-styles/use-styles.ts"],"sourcesContent":["import {\n Attributes,\n ClassNames,\n ClassNamesArray,\n GetStylesApiOptions,\n Styles,\n} from '../styles-api.types'\nimport { PartialVarsResolver, VarsResolver } from '../create-vars-resolver/create-vars-resolver'\nimport { useStylesTransform } from './use-transformed-styles'\nimport { resolveClassNames } from './get-class-name/resolve-class-names/resolve-class-names'\nimport { resolveStyles } from './get-style/resolve-styles/resolve-styles'\nimport { mergeVars } from './get-style/resolve-vars/merge-vars'\nimport { resolveStyle } from './get-style/resolve-style/resolve-style'\nimport { getClassName } from './get-class-name/get-class-name'\nimport { Properties } from 'csstype'\nimport { getStyle } from './get-style/get-style'\nimport { FactoryPayload } from '../../factory'\nimport { CStyleProp } from '../../box'\nimport {\n useCckClassNamesPrefix,\n useCckIsHeadless,\n useCckTheme,\n useCckWithStaticClasses,\n} from '../../config-provider'\nimport { MaybeRefOrGetter, toValue } from 'vue'\n\nexport interface UseStylesInput<Payload extends FactoryPayload> {\n name: string \| (string \| undefined)[]\n classes: Payload['stylesNames'] extends string ? Record<string, string> : never\n props: MaybeRefOrGetter<Payload['props']>\n stylesCtx?: MaybeRefOrGetter<Payload['ctx'] \| undefined>\n className?: MaybeRefOrGetter<string \| undefined>\n style?: MaybeRefOrGetter<CStyleProp \| undefined>\n rootSelector?: Payload['stylesNames']\n unstyled?: boolean\n classNames?: ClassNames<Payload> \| ClassNamesArray<Payload>\n styles?: Styles<Payload>\n vars?: PartialVarsResolver<Payload>\n varsResolver?: VarsResolver<Payload>\n attributes?: Attributes<Payload>\n}\n\nexport type GetStylesApi<Payload extends FactoryPayload> = (\n selector: NonNullable<Payload['stylesNames']>,\n options?: GetStylesApiOptions\n) => {\n className: string\n style: Properties\n}\n\nexport function useStyles<Payload extends FactoryPayload>({\n name,\n classes,\n props,\n stylesCtx,\n className,\n style,\n rootSelector = 'root' as NonNullable<Payload['stylesNames']>,\n unstyled,\n classNames,\n styles,\n vars,\n varsResolver,\n attributes,\n}: UseStylesInput<Payload>): GetStylesApi<Payload> {\n const _theme = useCckTheme()\n const theme = _theme.value\n const classNamesPrefix = useCckClassNamesPrefix()\n const withStaticClasses = useCckWithStaticClasses()\n const headless = useCckIsHeadless()\n\n const themeNames = Array.isArray(name) ? name : [name]\n const themeName = themeNames.filter((n) => n) as string[]\n\n const { withStylesTransform, getTransformedStyles } = useStylesTransform({\n props,\n stylesCtx,\n themeName,\n theme,\n })\n\n return (selector, options) => {\n const currentProps = toValue(props) as Payload['props']\n const currentCtx = toValue(stylesCtx) as Payload['ctx'] \| undefined\n const currentStyle = toValue(style) as CStyleProp \| undefined\n const currentClassName = toValue(className)\n\n const resolvedClassNames = resolveClassNames({\n theme,\n classNames,\n props: currentProps,\n stylesCtx: currentCtx,\n })\n\n const resolvedThemeClassNames = themeName.map((n) =>\n resolveClassNames({\n theme,\n classNames: theme.components?.[n]?.classNames,\n props: currentProps,\n stylesCtx: currentCtx,\n })\n )\n\n const resolvedComponentStyles = withStylesTransform\n ? {}\n : resolveStyles({ theme, styles, props: currentProps, stylesCtx: currentCtx })\n\n const resolvedThemeStyles: Record<string, any> = {}\n if (!withStylesTransform) {\n for (const n of themeName) {\n const resolved = resolveStyles({\n theme,\n styles: theme.components?.[n]?.styles,\n props: currentProps,\n stylesCtx: currentCtx,\n })\n for (const key of Object.keys(resolved)) {\n resolvedThemeStyles[key] = {\n ...resolvedThemeStyles[key],\n ...resolved[key],\n }\n }\n }\n }\n\n const resolvedVars = mergeVars([\n headless ? {} : varsResolver?.(theme, currentProps, currentCtx),\n ...themeName.map((n) => theme.components?.[n]?.vars?.(theme, currentProps, currentCtx)),\n vars?.(theme, currentProps, currentCtx),\n ])\n\n const resolvedRootStyle = resolveStyle({ style: currentStyle, theme })\n\n return {\n ...attributes?.[selector],\n\n className: getClassName({\n theme,\n options,\n themeName,\n selector,\n classNamesPrefix,\n resolvedClassNames,\n resolvedThemeClassNames,\n classes,\n unstyled,\n className: currentClassName,\n rootSelector,\n props: currentProps,\n stylesCtx: currentCtx,\n withStaticClasses,\n headless,\n transformedStyles: getTransformedStyles([options?.styles, styles]),\n }),\n\n style: getStyle({\n theme,\n selector,\n options,\n props: currentProps,\n stylesCtx: currentCtx,\n rootSelector,\n withStylesTransform,\n resolvedStyles: resolvedComponentStyles,\n resolvedThemeStyles,\n resolvedVars,\n resolvedRootStyle,\n }),\n }\n }\n}\n"],"mappings":";;;;;;;;;;;AAkDA,SAAgB,UAA0C,EACxD,MACA,SACA,OACA,WACA,WACA,OACA,eAAe,QACf,UACA,YACA,QACA,MACA,cACA,cACiD;CAEjD,MAAM,QADS,YACI,CAAC,CAAC;CACrB,MAAM,mBAAmB,uBAAuB;CAChD,MAAM,oBAAoB,wBAAwB;CAClD,MAAM,WAAW,iBAAiB;CAGlC,MAAM,aADa,MAAM,QAAQ,IAAI,IAAI,OAAO,CAAC,IAAI,EAAA,CACxB,QAAQ,MAAM,CAAC;CAE5C,MAAM,EAAE,qBAAqB,yBAAyB,mBAAmB;EACvE;EACA;EACA;EACA;CACF,CAAC;CAED,QAAQ,UAAU,YAAY;EAC5B,MAAM,eAAe,QAAQ,KAAK;EAClC,MAAM,aAAa,QAAQ,SAAS;EACpC,MAAM,eAAe,QAAQ,KAAK;EAClC,MAAM,mBAAmB,QAAQ,SAAS;EAE1C,MAAM,qBAAqB,kBAAkB;GAC3C;GACA;GACA,OAAO;GACP,WAAW;EACb,CAAC;EAED,MAAM,0BAA0B,UAAU,KAAK,MAC7C,kBAAkB;GAChB;GACA,YAAY,MAAM,aAAa,EAAE,EAAE;GACnC,OAAO;GACP,WAAW;EACb,CAAC,CACH;EAEA,MAAM,0BAA0B,sBAC5B,CAAC,IACD,cAAc;GAAE;GAAO;GAAQ,OAAO;GAAc,WAAW;EAAW,CAAC;EAE/E,MAAM,sBAA2C,CAAC;EAClD,IAAI,CAAC,qBACH,KAAK,MAAM,KAAK,WAAW;GACzB,MAAM,WAAW,cAAc;IAC7B;IACA,QAAQ,MAAM,aAAa,EAAE,EAAE;IAC/B,OAAO;IACP,WAAW;GACb,CAAC;GACD,KAAK,MAAM,OAAO,OAAO,KAAK,QAAQ,GACpC,oBAAoB,OAAO;IACzB,GAAG,oBAAoB;IACvB,GAAG,SAAS;GACd;EAEJ;EAGF,MAAM,eAAe,UAAU;GAC7B,WAAW,CAAC,IAAI,eAAe,OAAO,cAAc,UAAU;GAC9D,GAAG,UAAU,KAAK,MAAM,MAAM,aAAa,EAAE,EAAE,OAAO,OAAO,cAAc,UAAU,CAAC;GACtF,OAAO,OAAO,cAAc,UAAU;EACxC,CAAC;EAED,MAAM,oBAAoB,aAAa;GAAE,OAAO;GAAc;EAAM,CAAC;EAErE,OAAO;GACL,GAAG,aAAa;GAEhB,WAAW,aAAa;IACtB;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,WAAW;IACX;IACA,OAAO;IACP,WAAW;IACX;IACA;IACA,mBAAmB,qBAAqB,CAAC,SAAS,QAAQ,MAAM,CAAC;GACnE,CAAC;GAED,OAAO,SAAS;IACd;IACA;IACA;IACA,OAAO;IACP,WAAW;IACX;IACA;IACA,gBAAgB;IAChB;IACA;IACA;GACF,CAAC;EACH;CACF;AACF"}

package/lib/core/styles-api/use-styles/use-styles.d.ts CHANGED Viewed

@@ -9,8 +9,8 @@ export interface UseStylesInput<Payload extends FactoryPayload> {
     classes: Payload['stylesNames'] extends string ? Record<string, string> : never;
     props: MaybeRefOrGetter<Payload['props']>;
     stylesCtx?: MaybeRefOrGetter<Payload['ctx'] | undefined>;
-    className?: string | undefined;
-    style?: CStyleProp;
+    className?: MaybeRefOrGetter<string | undefined>;
+    style?: MaybeRefOrGetter<CStyleProp | undefined>;
     rootSelector?: Payload['stylesNames'];
     unstyled?: boolean;
     classNames?: ClassNames<Payload> | ClassNamesArray<Payload>;

package/package.json CHANGED Viewed

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