@cck-ui/core 0.4.9 → 0.5.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/button/button.cjs +71 -63
- package/cjs/components/button/button.cjs.map +1 -1
- package/cjs/components/button/button.utils.cjs +28 -0
- package/cjs/components/button/button.utils.cjs.map +1 -0
- package/cjs/components/button/index.cjs +5 -1
- package/cjs/components/button/index.cjs.map +1 -1
- package/cjs/components/grid/col/col.cjs +33 -16
- package/cjs/components/grid/col/col.cjs.map +1 -1
- package/cjs/components/grid/grid.cjs +63 -34
- package/cjs/components/grid/grid.cjs.map +1 -1
- package/cjs/components/grid/grid.constants.cjs.map +1 -1
- package/cjs/components/grid/grid.utils.cjs +11 -0
- package/cjs/components/grid/grid.utils.cjs.map +1 -0
- package/cjs/components/grid/index.cjs +7 -2
- package/cjs/components/grid/index.cjs.map +1 -1
- package/cjs/components/loader/loader.module.cjs.map +1 -1
- package/cjs/components/loader/loaders/bars.cjs +6 -3
- package/cjs/components/loader/loaders/bars.cjs.map +1 -1
- package/cjs/components/loader/loaders/dots.cjs +6 -3
- package/cjs/components/loader/loaders/dots.cjs.map +1 -1
- package/cjs/components/loader/loaders/oval.cjs +6 -3
- package/cjs/components/loader/loaders/oval.cjs.map +1 -1
- package/cjs/components/transition/transition.cjs +1 -1
- package/cjs/components/unstyled-button/unstyled-button.cjs +32 -22
- package/cjs/components/unstyled-button/unstyled-button.cjs.map +1 -1
- package/cjs/core/box/box.cjs +40 -28
- package/cjs/core/box/box.cjs.map +1 -1
- package/cjs/core/box/get-box-style/get-box-style.cjs.map +1 -1
- package/cjs/core/box/style-props/extract-style-props/extract-style-props.cjs.map +1 -1
- package/cjs/core/box/style-props/parse-style-props/sort-media-queries.cjs.map +1 -1
- package/cjs/core/box/style-props/resolvers/border-resolver/border-resolver.cjs.map +1 -1
- package/cjs/core/box/style-props/resolvers/color-resolver/color-resolver.cjs.map +1 -1
- package/cjs/core/box/style-props/resolvers/font-family-resolver/font-family-resolver.cjs.map +1 -1
- package/cjs/core/box/style-props/resolvers/index.cjs.map +1 -1
- package/cjs/core/box/style-props/style-props-data.cjs.map +1 -1
- package/cjs/core/config-provider/cck-classes-style/cck-classes-style.cjs +58 -0
- package/cjs/core/config-provider/cck-classes-style/cck-classes-style.cjs.map +1 -0
- package/cjs/core/config-provider/color-functions/get-gradient/get-gradient.cjs +3 -3
- package/cjs/core/config-provider/color-functions/get-gradient/get-gradient.cjs.map +1 -1
- package/cjs/core/config-provider/color-functions/rgba/rgba.cjs +8 -0
- package/cjs/core/config-provider/color-functions/rgba/rgba.cjs.map +1 -1
- package/cjs/core/config-provider/color-functions/to-rgba/to-rgba.cjs.map +1 -1
- package/cjs/core/config-provider/config-provider.cjs +39 -24
- package/cjs/core/config-provider/config-provider.cjs.map +1 -1
- package/cjs/core/config-provider/default-colors.cjs.map +1 -1
- package/cjs/core/config-provider/index.cjs +6 -1
- package/cjs/core/config-provider/index.cjs.map +1 -1
- package/cjs/core/config-provider/merge-cck-theme/merge-cck-theme.cjs +2 -2
- package/cjs/core/config-provider/merge-cck-theme/merge-cck-theme.cjs.map +1 -1
- package/cjs/core/config-provider/merge-theme-overrides/merge-theme-overrides.cjs +10 -0
- package/cjs/core/config-provider/merge-theme-overrides/merge-theme-overrides.cjs.map +1 -0
- package/cjs/core/config-provider/use-component-props/use-component-props.cjs +35 -0
- package/cjs/core/config-provider/use-component-props/use-component-props.cjs.map +1 -0
- package/cjs/core/responsive-style-manager/css-object-to-string/css-object-to-string.cjs.map +1 -1
- package/cjs/core/responsive-style-manager/normalize-number-like-string-prop/normalize-number-like-string-prop.cjs +1 -1
- package/cjs/core/responsive-style-manager/normalize-number-like-string-prop/normalize-number-like-string-prop.cjs.map +1 -1
- package/cjs/core/responsive-style-manager/responsive-style-manager.cjs.map +1 -1
- package/cjs/core/responsive-style-manager/styles-to-string/styles-to-string.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-resolved-class-names/get-resolved-class-names.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-root-class-name/get-root-class-name.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-selector-class-name/get-selector-class-name.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-static-class-names/get-static-class-names.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-variant-class-name/get-variant-class-name.cjs.map +1 -1
- package/cjs/core/utils/deep-merge/deep-merge.cjs +18 -0
- package/cjs/core/utils/deep-merge/deep-merge.cjs.map +1 -0
- package/cjs/core/utils/get-breakpoint-value/get-breakpoint-value.cjs.map +1 -1
- package/cjs/core/utils/get-size/get-size.cjs +2 -2
- package/cjs/core/utils/get-size/get-size.cjs.map +1 -1
- package/cjs/core/utils/get-sorted-breakpoints/get-sorted-breakpoints.cjs.map +1 -1
- package/cjs/core/utils/number-like-string-to-number/number-like-string-to-number.cjs.map +1 -1
- package/cjs/core/utils/units-converters/px.cjs.map +1 -1
- package/cjs/core/utils/units-converters/rem.cjs.map +1 -1
- package/cjs/core/utils/vue/component.cjs.map +1 -1
- package/cjs/core/utils/vue/install.cjs +3 -3
- package/cjs/core/utils/vue/install.cjs.map +1 -1
- package/cjs/core/utils/vue/statics.cjs +38 -0
- package/cjs/core/utils/vue/statics.cjs.map +1 -0
- package/cjs/index.cjs +13 -7
- package/cjs/index.cjs.map +1 -1
- package/esm/components/button/button.mjs +71 -63
- package/esm/components/button/button.mjs.map +1 -1
- package/esm/components/button/button.utils.mjs +29 -0
- package/esm/components/button/button.utils.mjs.map +1 -0
- package/esm/components/button/index.mjs +5 -1
- package/esm/components/button/index.mjs.map +1 -1
- package/esm/components/grid/col/col.mjs +34 -17
- package/esm/components/grid/col/col.mjs.map +1 -1
- package/esm/components/grid/grid.constants.mjs.map +1 -1
- package/esm/components/grid/grid.mjs +63 -34
- package/esm/components/grid/grid.mjs.map +1 -1
- package/esm/components/grid/grid.utils.mjs +12 -0
- package/esm/components/grid/grid.utils.mjs.map +1 -0
- package/esm/components/grid/index.mjs +6 -2
- package/esm/components/grid/index.mjs.map +1 -1
- package/esm/components/loader/loader.module.mjs.map +1 -1
- package/esm/components/loader/loaders/bars.mjs +7 -4
- package/esm/components/loader/loaders/bars.mjs.map +1 -1
- package/esm/components/loader/loaders/dots.mjs +7 -4
- package/esm/components/loader/loaders/dots.mjs.map +1 -1
- package/esm/components/loader/loaders/oval.mjs +7 -4
- package/esm/components/loader/loaders/oval.mjs.map +1 -1
- package/esm/components/transition/transition.mjs +1 -1
- package/esm/components/unstyled-button/unstyled-button.mjs +33 -23
- package/esm/components/unstyled-button/unstyled-button.mjs.map +1 -1
- package/esm/core/box/box.mjs +41 -29
- package/esm/core/box/box.mjs.map +1 -1
- package/esm/core/box/get-box-style/get-box-style.mjs.map +1 -1
- package/esm/core/box/style-props/extract-style-props/extract-style-props.mjs.map +1 -1
- package/esm/core/box/style-props/parse-style-props/sort-media-queries.mjs.map +1 -1
- package/esm/core/box/style-props/resolvers/border-resolver/border-resolver.mjs.map +1 -1
- package/esm/core/box/style-props/resolvers/color-resolver/color-resolver.mjs.map +1 -1
- package/esm/core/box/style-props/resolvers/font-family-resolver/font-family-resolver.mjs.map +1 -1
- package/esm/core/box/style-props/resolvers/index.mjs.map +1 -1
- package/esm/core/box/style-props/style-props-data.mjs.map +1 -1
- package/esm/core/config-provider/cck-classes-style/cck-classes-style.mjs +58 -0
- package/esm/core/config-provider/cck-classes-style/cck-classes-style.mjs.map +1 -0
- package/esm/core/config-provider/color-functions/get-gradient/get-gradient.mjs +3 -3
- package/esm/core/config-provider/color-functions/get-gradient/get-gradient.mjs.map +1 -1
- package/esm/core/config-provider/color-functions/rgba/rgba.mjs +8 -1
- package/esm/core/config-provider/color-functions/rgba/rgba.mjs.map +1 -1
- package/esm/core/config-provider/color-functions/to-rgba/to-rgba.mjs.map +1 -1
- package/esm/core/config-provider/config-provider.mjs +40 -25
- package/esm/core/config-provider/config-provider.mjs.map +1 -1
- package/esm/core/config-provider/default-colors.mjs.map +1 -1
- package/esm/core/config-provider/index.mjs +5 -3
- package/esm/core/config-provider/index.mjs.map +1 -1
- package/esm/core/config-provider/merge-cck-theme/merge-cck-theme.mjs +2 -2
- package/esm/core/config-provider/merge-cck-theme/merge-cck-theme.mjs.map +1 -1
- package/esm/core/config-provider/merge-theme-overrides/merge-theme-overrides.mjs +10 -0
- package/esm/core/config-provider/merge-theme-overrides/merge-theme-overrides.mjs.map +1 -0
- package/esm/core/config-provider/use-component-props/use-component-props.mjs +35 -0
- package/esm/core/config-provider/use-component-props/use-component-props.mjs.map +1 -0
- package/esm/core/responsive-style-manager/css-object-to-string/css-object-to-string.mjs.map +1 -1
- package/esm/core/responsive-style-manager/normalize-number-like-string-prop/normalize-number-like-string-prop.mjs +1 -1
- package/esm/core/responsive-style-manager/normalize-number-like-string-prop/normalize-number-like-string-prop.mjs.map +1 -1
- package/esm/core/responsive-style-manager/responsive-style-manager.mjs.map +1 -1
- package/esm/core/responsive-style-manager/styles-to-string/styles-to-string.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/get-resolved-class-names/get-resolved-class-names.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/get-root-class-name/get-root-class-name.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/get-selector-class-name/get-selector-class-name.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/get-static-class-names/get-static-class-names.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/get-variant-class-name/get-variant-class-name.mjs.map +1 -1
- package/esm/core/utils/deep-merge/deep-merge.mjs +18 -0
- package/esm/core/utils/deep-merge/deep-merge.mjs.map +1 -0
- package/esm/core/utils/get-breakpoint-value/get-breakpoint-value.mjs.map +1 -1
- package/esm/core/utils/get-size/get-size.mjs +2 -2
- package/esm/core/utils/get-size/get-size.mjs.map +1 -1
- package/esm/core/utils/get-sorted-breakpoints/get-sorted-breakpoints.mjs.map +1 -1
- package/esm/core/utils/number-like-string-to-number/number-like-string-to-number.mjs.map +1 -1
- package/esm/core/utils/units-converters/px.mjs.map +1 -1
- package/esm/core/utils/units-converters/rem.mjs.map +1 -1
- package/esm/core/utils/vue/component.mjs.map +1 -1
- package/esm/core/utils/vue/install.mjs +2 -2
- package/esm/core/utils/vue/install.mjs.map +1 -1
- package/esm/core/utils/vue/statics.mjs +35 -0
- package/esm/core/utils/vue/statics.mjs.map +1 -0
- package/esm/index.mjs +7 -5
- package/esm/index.mjs.map +1 -1
- package/lib/components/button/button.utils.d.ts +9 -0
- package/lib/components/button/index.d.ts +3 -3
- package/lib/components/grid/grid.utils.d.ts +9 -0
- package/lib/components/grid/index.d.ts +6 -5
- package/lib/core/config-provider/cck-classes-style/index.d.ts +2 -0
- package/lib/core/config-provider/color-functions/index.d.ts +1 -1
- package/lib/core/config-provider/color-functions/rgba/rgba.d.ts +1 -0
- package/lib/core/config-provider/index.d.ts +2 -0
- package/lib/core/config-provider/merge-theme-overrides/merge-theme-overrides.d.ts +2 -0
- package/lib/core/config-provider/use-component-props/use-component-props.d.ts +7 -0
- package/lib/core/responsive-style-manager/responsive-style-manager.d.ts +1 -0
- package/lib/core/styles-api/index.d.ts +1 -1
- package/lib/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.d.ts +1 -1
- package/lib/core/styles-api/use-styles/get-class-name/get-resolved-class-names/get-resolved-class-names.d.ts +1 -1
- package/lib/core/styles-api/use-styles/get-class-name/get-static-class-names/get-static-class-names.d.ts +1 -1
- package/lib/core/styles-api/use-styles/get-class-name/get-variant-class-name/get-variant-class-name.d.ts +1 -1
- package/lib/core/utils/deep-merge/deep-merge.d.ts +1 -0
- package/lib/core/utils/index.d.ts +4 -5
- package/lib/core/utils/vue/index.d.ts +1 -0
- package/lib/core/utils/vue/statics.d.ts +14 -0
- package/lib/core/utils/vue/typescript.d.ts +8 -0
- package/package.json +2 -1
- package/styles/loader.css +1 -2
- package/styles/loader.layer.css +1 -2
- package/styles.css +1 -2
- package/styles.layer.css +1 -2
- package/cjs/core/utils/color.cjs +0 -112
- package/cjs/core/utils/color.cjs.map +0 -1
- package/cjs/core/utils/dom/style.cjs +0 -13
- package/cjs/core/utils/dom/style.cjs.map +0 -1
- package/esm/core/utils/color.mjs +0 -110
- package/esm/core/utils/color.mjs.map +0 -1
- package/esm/core/utils/dom/style.mjs +0 -12
- package/esm/core/utils/dom/style.mjs.map +0 -1
- package/lib/core/utils/color.d.ts +0 -11
- package/lib/core/utils/dom/index.d.ts +0 -1
- package/lib/core/utils/dom/style.d.ts +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-static-class-names.cjs","names":[],"sources":["../../../../../../src/core/styles-api/use-styles/get-class-name/get-static-class-names/get-static-class-names.ts"],"sourcesContent":["interface GetStaticClassNamesInput {\n themeName: string[]\n selector: string\n classNamesPrefix: string\n withStaticClass?: boolean\n}\n\nexport function getStaticClassNames({\n themeName,\n classNamesPrefix,\n selector,\n withStaticClass
|
|
1
|
+
{"version":3,"file":"get-static-class-names.cjs","names":[],"sources":["../../../../../../src/core/styles-api/use-styles/get-class-name/get-static-class-names/get-static-class-names.ts"],"sourcesContent":["interface GetStaticClassNamesInput {\n themeName: string[]\n selector: string\n classNamesPrefix: string\n withStaticClass?: boolean\n}\n\nexport function getStaticClassNames({\n themeName,\n classNamesPrefix,\n selector,\n withStaticClass,\n}: GetStaticClassNamesInput) {\n if (withStaticClass === false) {\n return []\n }\n\n return themeName.map((n) => `${classNamesPrefix}-${n}-${selector}`)\n}\n"],"mappings":";;AAOA,SAAgB,oBAAoB,EAClC,WACA,kBACA,UACA,mBAC2B;CAC3B,IAAI,oBAAoB,OACtB,OAAO,CAAC;CAGV,OAAO,UAAU,KAAK,MAAM,GAAG,iBAAiB,GAAG,EAAE,GAAG,UAAU;AACpE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-variant-class-name.cjs","names":[],"sources":["../../../../../../src/core/styles-api/use-styles/get-class-name/get-variant-class-name/get-variant-class-name.ts"],"sourcesContent":["import { GetStylesApiOptions } from '../../../styles-api.types'\n\ninterface GetVariantClassNameInput {\n options: GetStylesApiOptions | undefined\n classes: Record<string, string>\n selector: string\n unstyled: boolean | undefined\n}\n\n/**\n * @returns Variant className, variant is always separated from selector with `--`, for example, `tab--default`\n */\nexport function getVariantClassName({\n options,\n classes,\n selector,\n unstyled
|
|
1
|
+
{"version":3,"file":"get-variant-class-name.cjs","names":[],"sources":["../../../../../../src/core/styles-api/use-styles/get-class-name/get-variant-class-name/get-variant-class-name.ts"],"sourcesContent":["import { GetStylesApiOptions } from '../../../styles-api.types'\n\ninterface GetVariantClassNameInput {\n options: GetStylesApiOptions | undefined\n classes: Record<string, string>\n selector: string\n unstyled: boolean | undefined\n}\n\n/**\n * @returns Variant className, variant is always separated from selector with `--`, for example, `tab--default`\n */\nexport function getVariantClassName({\n options,\n classes,\n selector,\n unstyled,\n}: GetVariantClassNameInput) {\n return options?.variant && !unstyled ? classes[`${selector}--${options.variant}`] : undefined\n}\n"],"mappings":";;;;;AAYA,SAAgB,oBAAoB,EAClC,SACA,SACA,UACA,YAC2B;CAC3B,OAAO,SAAS,WAAW,CAAC,WAAW,QAAQ,GAAG,SAAS,IAAI,QAAQ,aAAa,KAAA;AACtF"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
//#region packages/@cck-ui/core/src/core/utils/deep-merge/deep-merge.ts
|
|
2
|
+
function isObject(item) {
|
|
3
|
+
return item && typeof item === "object" && !Array.isArray(item);
|
|
4
|
+
}
|
|
5
|
+
function deepMerge(target, source) {
|
|
6
|
+
const result = { ...target };
|
|
7
|
+
const _source = source;
|
|
8
|
+
if (isObject(target) && isObject(source)) Object.keys(source).forEach((key) => {
|
|
9
|
+
if (isObject(_source[key])) if (!(key in target)) result[key] = _source[key];
|
|
10
|
+
else result[key] = deepMerge(result[key], _source[key]);
|
|
11
|
+
else result[key] = _source[key];
|
|
12
|
+
});
|
|
13
|
+
return result;
|
|
14
|
+
}
|
|
15
|
+
//#endregion
|
|
16
|
+
exports.deepMerge = deepMerge;
|
|
17
|
+
|
|
18
|
+
//# sourceMappingURL=deep-merge.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"deep-merge.cjs","names":[],"sources":["../../../../src/core/utils/deep-merge/deep-merge.ts"],"sourcesContent":["function isObject(item: unknown) {\n return item && typeof item === 'object' && !Array.isArray(item)\n}\n\nexport function deepMerge<T extends object>(target: T, source: any): T {\n const result: Record<string, any> = { ...target }\n const _source: Record<string, any> = source\n\n if (isObject(target) && isObject(source)) {\n Object.keys(source).forEach((key) => {\n if (isObject(_source[key])) {\n if (!(key in target)) {\n result[key] = _source[key]\n } else {\n result[key] = deepMerge(result[key], _source[key])\n }\n } else {\n result[key] = _source[key]\n }\n })\n }\n\n return result as T\n}\n"],"mappings":";AAAA,SAAS,SAAS,MAAe;CAC/B,OAAO,QAAQ,OAAO,SAAS,YAAY,CAAC,MAAM,QAAQ,IAAI;AAChE;AAEA,SAAgB,UAA4B,QAAW,QAAgB;CACrE,MAAM,SAA8B,EAAE,GAAG,OAAO;CAChD,MAAM,UAA+B;CAErC,IAAI,SAAS,MAAM,KAAK,SAAS,MAAM,GACrC,OAAO,KAAK,MAAM,CAAC,CAAC,SAAS,QAAQ;EACnC,IAAI,SAAS,QAAQ,IAAI,GACvB,IAAI,EAAE,OAAO,SACX,OAAO,OAAO,QAAQ;OAEtB,OAAO,OAAO,UAAU,OAAO,MAAM,QAAQ,IAAI;OAGnD,OAAO,OAAO,QAAQ;CAE1B,CAAC;CAGH,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-breakpoint-value.cjs","names":["px"],"sources":["../../../../src/core/utils/get-breakpoint-value/get-breakpoint-value.ts"],"sourcesContent":["import { CBreakpoint } from '../../config-provider'\nimport { px } from '../units-converters'\n\nexport type BreakpointsSource = Record<CBreakpoint, number | string>\n\nexport function getBreakpointValue(
|
|
1
|
+
{"version":3,"file":"get-breakpoint-value.cjs","names":["px"],"sources":["../../../../src/core/utils/get-breakpoint-value/get-breakpoint-value.ts"],"sourcesContent":["import { CBreakpoint } from '../../config-provider'\nimport { px } from '../units-converters'\n\nexport type BreakpointsSource = Record<CBreakpoint, number | string>\n\nexport function getBreakpointValue(breakpoint: number | string, breakpoints: BreakpointsSource) {\n if (breakpoint in breakpoints) {\n return px(breakpoints[breakpoint as CBreakpoint]) as number\n }\n return px(breakpoint) as number\n}\n"],"mappings":";;;AAKA,SAAgB,mBAAmB,YAA6B,aAAgC;CAC9F,IAAI,cAAc,aAChB,OAAOA,WAAAA,GAAG,YAAY,WAA0B;CAElD,OAAOA,WAAAA,GAAG,UAAU;AACtB"}
|
|
@@ -3,7 +3,7 @@ const require_rem = require("../units-converters/rem.cjs");
|
|
|
3
3
|
const require_is_number_like = require("../is-number-like/is-number-like.cjs");
|
|
4
4
|
//#region packages/@cck-ui/core/src/core/utils/get-size/get-size.ts
|
|
5
5
|
function getSize(size, prefix = "size", convertToRem = true) {
|
|
6
|
-
if (size === void 0) return
|
|
6
|
+
if (size === void 0) return;
|
|
7
7
|
return require_is_number_like.isNumberLike(size) ? convertToRem ? require_rem.rem(size) : size : `var(--${prefix}-${size})`;
|
|
8
8
|
}
|
|
9
9
|
function getSpacing(size) {
|
|
@@ -20,7 +20,7 @@ function getLineHeight(size) {
|
|
|
20
20
|
return getSize(size, "c-line-height", false);
|
|
21
21
|
}
|
|
22
22
|
function getShadow(size) {
|
|
23
|
-
if (!size) return
|
|
23
|
+
if (!size) return;
|
|
24
24
|
return getSize(size, "c-shadow", false);
|
|
25
25
|
}
|
|
26
26
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-size.cjs","names":["isNumberLike","rem"],"sources":["../../../../src/core/utils/get-size/get-size.ts"],"sourcesContent":["import { isNumberLike } from '../is-number-like/is-number-like'\nimport { rem } from '../units-converters'\n\nexport function getSize(
|
|
1
|
+
{"version":3,"file":"get-size.cjs","names":["isNumberLike","rem"],"sources":["../../../../src/core/utils/get-size/get-size.ts"],"sourcesContent":["import { isNumberLike } from '../is-number-like/is-number-like'\nimport { rem } from '../units-converters'\n\nexport function getSize(size: unknown, prefix = 'size', convertToRem = true): string | undefined {\n if (size === undefined) {\n return undefined\n }\n\n return isNumberLike(size)\n ? convertToRem\n ? rem(size)\n : (size as string)\n : `var(--${prefix}-${size})`\n}\n\nexport function getSpacing(size: unknown) {\n return getSize(size, 'c-spacing')\n}\n\nexport function getRadius(size: unknown) {\n if (size === undefined) {\n return `var(--c-radius-default)`\n }\n\n return getSize(size, 'c-radius')\n}\n\nexport function getFontSize(size: unknown) {\n return getSize(size, 'c-font-size')\n}\n\nexport function getLineHeight(size: unknown) {\n return getSize(size, 'c-line-height', false)\n}\n\nexport function getShadow(size: unknown) {\n if (!size) {\n return undefined\n }\n\n return getSize(size, 'c-shadow', false)\n}\n"],"mappings":";;;;AAGA,SAAgB,QAAQ,MAAe,SAAS,QAAQ,eAAe,MAA0B;CAC/F,IAAI,SAAS,KAAA,GACX;CAGF,OAAOA,uBAAAA,aAAa,IAAI,IACpB,eACEC,YAAAA,IAAI,IAAI,IACP,OACH,SAAS,OAAO,GAAG,KAAK;AAC9B;AAEA,SAAgB,WAAW,MAAe;CACxC,OAAO,QAAQ,MAAM,WAAW;AAClC;AAEA,SAAgB,UAAU,MAAe;CACvC,IAAI,SAAS,KAAA,GACX,OAAO;CAGT,OAAO,QAAQ,MAAM,UAAU;AACjC;AAEA,SAAgB,YAAY,MAAe;CACzC,OAAO,QAAQ,MAAM,aAAa;AACpC;AAEA,SAAgB,cAAc,MAAe;CAC3C,OAAO,QAAQ,MAAM,iBAAiB,KAAK;AAC7C;AAEA,SAAgB,UAAU,MAAe;CACvC,IAAI,CAAC,MACH;CAGF,OAAO,QAAQ,MAAM,YAAY,KAAK;AACxC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-sorted-breakpoints.cjs","names":["getBreakpointValue"],"sources":["../../../../src/core/utils/get-sorted-breakpoints/get-sorted-breakpoints.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"get-sorted-breakpoints.cjs","names":["getBreakpointValue"],"sources":["../../../../src/core/utils/get-sorted-breakpoints/get-sorted-breakpoints.ts"],"sourcesContent":["import { BreakpointsSource, getBreakpointValue } from '../get-breakpoint-value/get-breakpoint-value'\n\nexport function getSortedBreakpoints(values: string[], breakpoints: BreakpointsSource) {\n const convertedBreakpoints = values.map((breakpoint) => ({\n value: breakpoint,\n px: getBreakpointValue(breakpoint, breakpoints),\n }))\n\n convertedBreakpoints.sort((a, b) => a.px - b.px)\n return convertedBreakpoints\n}\n"],"mappings":";;;AAEA,SAAgB,qBAAqB,QAAkB,aAAgC;CACrF,MAAM,uBAAuB,OAAO,KAAK,gBAAgB;EACvD,OAAO;EACP,IAAIA,6BAAAA,mBAAmB,YAAY,WAAW;CAChD,EAAE;CAEF,qBAAqB,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE,EAAE;CAC/C,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"number-like-string-to-number.cjs","names":[],"sources":["../../../../src/core/utils/number-like-string-to-number/number-like-string-to-number.ts"],"sourcesContent":["import { NumberLikeString } from '../../box'\n\nexport function numberLikeStringToNumber(
|
|
1
|
+
{"version":3,"file":"number-like-string-to-number.cjs","names":[],"sources":["../../../../src/core/utils/number-like-string-to-number/number-like-string-to-number.ts"],"sourcesContent":["import { NumberLikeString } from '../../box'\n\nexport function numberLikeStringToNumber(value: NumberLikeString, fallback: number = 0): number {\n if (typeof value === 'number') {\n return value\n }\n const parsed = Number(value)\n return Number.isNaN(parsed) ? fallback : parsed\n}\n"],"mappings":";;AAEA,SAAgB,yBAAyB,OAAyB,WAAmB,GAAW;CAC9F,IAAI,OAAO,UAAU,UACnB,OAAO;CAET,MAAM,SAAS,OAAO,KAAK;CAC3B,OAAO,OAAO,MAAM,MAAM,IAAI,WAAW;AAC3C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"px.cjs","names":[],"sources":["../../../../src/core/utils/units-converters/px.ts"],"sourcesContent":["function getTransformdScaledValue(value: unknown) {\n if (typeof value !== 'string' || !value.includes('var(--c-scale)'))\n return value\n\n return value\n .match(/^calc\\((.*?)\\)$/)?.[1]\n .split('*')[0]\n .trim()\n}\n\nexport function px(value: unknown) {\n const transformedValue = getTransformdScaledValue(value)\n\n if (typeof transformedValue === 'number') return transformedValue\n\n if (typeof transformedValue === 'string') {\n if (transformedValue.includes('calc') || transformedValue.includes('var'))\n return transformedValue\n\n if (transformedValue.includes('px'))\n return Number(transformedValue.replace('px', ''))\n\n if (transformedValue.includes('rem'))\n return Number(transformedValue.replace('rem', '')) * 16\n\n if (transformedValue.includes('em'))\n return Number(transformedValue.replace('em', '')) * 16\n\n return Number(transformedValue)\n }\n\n return Number.NaN\n}\n"],"mappings":";AAAA,SAAS,yBAAyB,OAAgB;CAChD,IAAI,OAAO,UAAU,YAAY,CAAC,MAAM,SAAS,gBAAgB,GAC/D,OAAO;
|
|
1
|
+
{"version":3,"file":"px.cjs","names":[],"sources":["../../../../src/core/utils/units-converters/px.ts"],"sourcesContent":["function getTransformdScaledValue(value: unknown) {\n if (typeof value !== 'string' || !value.includes('var(--c-scale)')) {\n return value\n }\n\n return value\n .match(/^calc\\((.*?)\\)$/)?.[1]\n .split('*')[0]\n .trim()\n}\n\nexport function px(value: unknown) {\n const transformedValue = getTransformdScaledValue(value)\n\n if (typeof transformedValue === 'number') {\n return transformedValue\n }\n\n if (typeof transformedValue === 'string') {\n if (transformedValue.includes('calc') || transformedValue.includes('var')) {\n return transformedValue\n }\n\n if (transformedValue.includes('px')) {\n return Number(transformedValue.replace('px', ''))\n }\n\n if (transformedValue.includes('rem')) {\n return Number(transformedValue.replace('rem', '')) * 16\n }\n\n if (transformedValue.includes('em')) {\n return Number(transformedValue.replace('em', '')) * 16\n }\n\n return Number(transformedValue)\n }\n\n return Number.NaN\n}\n"],"mappings":";AAAA,SAAS,yBAAyB,OAAgB;CAChD,IAAI,OAAO,UAAU,YAAY,CAAC,MAAM,SAAS,gBAAgB,GAC/D,OAAO;CAGT,OAAO,MACJ,MAAM,iBAAiB,CAAC,GAAG,EAAE,CAC7B,MAAM,GAAG,CAAC,CAAC,EAAE,CACb,KAAK;AACV;AAEA,SAAgB,GAAG,OAAgB;CACjC,MAAM,mBAAmB,yBAAyB,KAAK;CAEvD,IAAI,OAAO,qBAAqB,UAC9B,OAAO;CAGT,IAAI,OAAO,qBAAqB,UAAU;EACxC,IAAI,iBAAiB,SAAS,MAAM,KAAK,iBAAiB,SAAS,KAAK,GACtE,OAAO;EAGT,IAAI,iBAAiB,SAAS,IAAI,GAChC,OAAO,OAAO,iBAAiB,QAAQ,MAAM,EAAE,CAAC;EAGlD,IAAI,iBAAiB,SAAS,KAAK,GACjC,OAAO,OAAO,iBAAiB,QAAQ,OAAO,EAAE,CAAC,IAAI;EAGvD,IAAI,iBAAiB,SAAS,IAAI,GAChC,OAAO,OAAO,iBAAiB,QAAQ,MAAM,EAAE,CAAC,IAAI;EAGtD,OAAO,OAAO,gBAAgB;CAChC;CAEA,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rem.cjs","names":[],"sources":["../../../../src/core/utils/units-converters/rem.ts"],"sourcesContent":["function scaleRem(remValue: string) {\n if (remValue === '0rem') return '0rem'\n return `calc(${remValue} * var(--c-scale))`\n}\n\nfunction createConverter(units: string, { shouldScale = false } = {}) {\n function converter(value: unknown): string {\n if (value === 0 || value === '0') return `0${units}`\n\n if (typeof value === 'number') {\n const val = `${value / 16}${units}`\n return shouldScale ? scaleRem(val) : val\n }\n\n if (typeof value === 'string') {\n if (value === '') return value\n\n if (
|
|
1
|
+
{"version":3,"file":"rem.cjs","names":[],"sources":["../../../../src/core/utils/units-converters/rem.ts"],"sourcesContent":["function scaleRem(remValue: string) {\n if (remValue === '0rem') {\n return '0rem'\n }\n return `calc(${remValue} * var(--c-scale))`\n}\n\nfunction createConverter(units: string, { shouldScale = false } = {}) {\n function converter(value: unknown): string {\n if (value === 0 || value === '0') {\n return `0${units}`\n }\n\n if (typeof value === 'number') {\n const val = `${value / 16}${units}`\n return shouldScale ? scaleRem(val) : val\n }\n\n if (typeof value === 'string') {\n if (value === '') {\n return value\n }\n\n if (value.startsWith('calc(') || value.startsWith('clamp(') || value.includes('rgba(')) {\n return value\n }\n\n if (value.includes(',')) {\n return value\n .split(',')\n .map((val) => converter(val))\n .join(',')\n }\n\n if (value.includes(' ')) {\n return value\n .split(' ')\n .map((val) => converter(val))\n .join(' ')\n }\n\n const replaced = value.replace('px', '')\n if (!Number.isNaN(Number(replaced))) {\n const val = `${Number(replaced) / 16}${units}`\n return shouldScale ? scaleRem(val) : val\n }\n }\n\n return value as string\n }\n\n return converter\n}\n\nexport const rem = createConverter('rem', { shouldScale: true })\nexport const em = createConverter('em')\n"],"mappings":";AAAA,SAAS,SAAS,UAAkB;CAClC,IAAI,aAAa,QACf,OAAO;CAET,OAAO,QAAQ,SAAS;AAC1B;AAEA,SAAS,gBAAgB,OAAe,EAAE,cAAc,UAAU,CAAC,GAAG;CACpE,SAAS,UAAU,OAAwB;EACzC,IAAI,UAAU,KAAK,UAAU,KAC3B,OAAO,IAAI;EAGb,IAAI,OAAO,UAAU,UAAU;GAC7B,MAAM,MAAM,GAAG,QAAQ,KAAK;GAC5B,OAAO,cAAc,SAAS,GAAG,IAAI;EACvC;EAEA,IAAI,OAAO,UAAU,UAAU;GAC7B,IAAI,UAAU,IACZ,OAAO;GAGT,IAAI,MAAM,WAAW,OAAO,KAAK,MAAM,WAAW,QAAQ,KAAK,MAAM,SAAS,OAAO,GACnF,OAAO;GAGT,IAAI,MAAM,SAAS,GAAG,GACpB,OAAO,MACJ,MAAM,GAAG,CAAC,CACV,KAAK,QAAQ,UAAU,GAAG,CAAC,CAAC,CAC5B,KAAK,GAAG;GAGb,IAAI,MAAM,SAAS,GAAG,GACpB,OAAO,MACJ,MAAM,GAAG,CAAC,CACV,KAAK,QAAQ,UAAU,GAAG,CAAC,CAAC,CAC5B,KAAK,GAAG;GAGb,MAAM,WAAW,MAAM,QAAQ,MAAM,EAAE;GACvC,IAAI,CAAC,OAAO,MAAM,OAAO,QAAQ,CAAC,GAAG;IACnC,MAAM,MAAM,GAAG,OAAO,QAAQ,IAAI,KAAK;IACvC,OAAO,cAAc,SAAS,GAAG,IAAI;GACvC;EACF;EAEA,OAAO;CACT;CAEA,OAAO;AACT;AAEA,MAAa,MAAM,gBAAgB,OAAO,EAAE,aAAa,KAAK,CAAC;AAC/D,MAAa,KAAK,gBAAgB,IAAI"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component.cjs","names":[],"sources":["../../../../src/core/utils/vue/component.ts"],"sourcesContent":["export function getComponentName(component: any): string {\n if (typeof component === 'string') return component\n if (component && typeof component === 'object') {\n return component.name || component.__name || 'unknown component'\n }\n return String(component)\n}\n"],"mappings":";;AAAA,SAAgB,iBAAiB,WAAwB;CACvD,IAAI,OAAO,cAAc,
|
|
1
|
+
{"version":3,"file":"component.cjs","names":[],"sources":["../../../../src/core/utils/vue/component.ts"],"sourcesContent":["export function getComponentName(component: any): string {\n if (typeof component === 'string') {\n return component\n }\n if (component && typeof component === 'object') {\n return component.name || component.__name || 'unknown component'\n }\n return String(component)\n}\n"],"mappings":";;AAAA,SAAgB,iBAAiB,WAAwB;CACvD,IAAI,OAAO,cAAc,UACvB,OAAO;CAET,IAAI,aAAa,OAAO,cAAc,UACpC,OAAO,UAAU,QAAQ,UAAU,UAAU;CAE/C,OAAO,OAAO,SAAS;AACzB"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
let _vue_shared = require("@vue/shared");
|
|
3
2
|
let es_toolkit = require("es-toolkit");
|
|
4
3
|
//#region packages/@cck-ui/core/src/core/utils/vue/install.ts
|
|
4
|
+
const hasOwn = (obj, key) => Object.hasOwn(obj, key);
|
|
5
5
|
const withPropsDefaultSetter = (target) => {
|
|
6
6
|
const _p = target.props;
|
|
7
|
-
const props =
|
|
7
|
+
const props = Array.isArray(_p) ? Object.fromEntries(_p.map((key) => [key, {}])) : _p;
|
|
8
8
|
target.setPropsDefaults = (defaults) => {
|
|
9
9
|
if (!props) return;
|
|
10
10
|
for (const [key, value] of Object.entries(defaults)) {
|
|
11
11
|
const prop = props[key];
|
|
12
|
-
if (!
|
|
12
|
+
if (!hasOwn(props, key)) continue;
|
|
13
13
|
if ((0, es_toolkit.isPlainObject)(prop)) {
|
|
14
14
|
props[key] = {
|
|
15
15
|
...props,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"install.cjs","names":[],"sources":["../../../../src/core/utils/vue/install.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"install.cjs","names":[],"sources":["../../../../src/core/utils/vue/install.ts"],"sourcesContent":["import { isPlainObject } from 'es-toolkit'\nimport type { SFCWithInstall } from './typescript'\n\nconst hasOwn = (obj: object, key: string | symbol): boolean => Object.hasOwn(obj, key)\n\nexport const withPropsDefaultSetter = (target: any) => {\n const _p = target.props\n const props = Array.isArray(_p) ? Object.fromEntries(_p.map((key) => [key, {}])) : _p\n\n target.setPropsDefaults = (defaults: Record<string, any>) => {\n if (!props) {\n return\n }\n\n for (const [key, value] of Object.entries(defaults)) {\n const prop = props[key]\n\n if (!hasOwn(props, key)) {\n continue\n }\n\n if (isPlainObject(prop)) {\n props[key] = {\n ...props,\n default: value,\n }\n continue\n }\n\n props[key] = {\n type: prop,\n default: value,\n }\n }\n\n target.props = props\n }\n}\n\nexport const withInstall = <T, E extends Record<string, any>>(main: T, extra?: E) => {\n ;(main as SFCWithInstall<T>).install = (app): void => {\n for (const comp of [main, ...Object.values(extra ?? [])]) {\n app.component(comp.name, comp)\n }\n }\n\n if (extra) {\n for (const [key, comp] of Object.entries(extra)) {\n ;(main as any)[key] = comp\n }\n }\n withPropsDefaultSetter(main)\n return main as SFCWithInstall<T> & E\n}\n"],"mappings":";;;AAGA,MAAM,UAAU,KAAa,QAAkC,OAAO,OAAO,KAAK,GAAG;AAErF,MAAa,0BAA0B,WAAgB;CACrD,MAAM,KAAK,OAAO;CAClB,MAAM,QAAQ,MAAM,QAAQ,EAAE,IAAI,OAAO,YAAY,GAAG,KAAK,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;CAEnF,OAAO,oBAAoB,aAAkC;EAC3D,IAAI,CAAC,OACH;EAGF,KAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,QAAQ,GAAG;GACnD,MAAM,OAAO,MAAM;GAEnB,IAAI,CAAC,OAAO,OAAO,GAAG,GACpB;GAGF,KAAA,GAAA,WAAA,cAAA,CAAkB,IAAI,GAAG;IACvB,MAAM,OAAO;KACX,GAAG;KACH,SAAS;IACX;IACA;GACF;GAEA,MAAM,OAAO;IACX,MAAM;IACN,SAAS;GACX;EACF;EAEA,OAAO,QAAQ;CACjB;AACF;AAEA,MAAa,eAAiD,MAAS,UAAc;CAClF,KAA4B,WAAW,QAAc;EACpD,KAAK,MAAM,QAAQ,CAAC,MAAM,GAAG,OAAO,OAAO,SAAS,CAAC,CAAC,CAAC,GACrD,IAAI,UAAU,KAAK,MAAM,IAAI;CAEjC;CAEA,IAAI,OACF,KAAK,MAAM,CAAC,KAAK,SAAS,OAAO,QAAQ,KAAK,GAC3C,KAAc,OAAO;CAG1B,uBAAuB,IAAI;CAC3B,OAAO;AACT"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
let vue = require("vue");
|
|
3
|
+
//#region packages/@cck-ui/core/src/core/utils/vue/statics.ts
|
|
4
|
+
function withExtend(component) {
|
|
5
|
+
component.extend = (config) => config;
|
|
6
|
+
return component;
|
|
7
|
+
}
|
|
8
|
+
const withClasses = (component, classes) => {
|
|
9
|
+
component.classes = classes;
|
|
10
|
+
return component;
|
|
11
|
+
};
|
|
12
|
+
const withVarsResolver = (component, varsResolver) => {
|
|
13
|
+
component.varsResolver = varsResolver;
|
|
14
|
+
return component;
|
|
15
|
+
};
|
|
16
|
+
const withPropsFactory = (component) => {
|
|
17
|
+
component.withProps = (defaultProps) => {
|
|
18
|
+
return (0, vue.defineComponent)({
|
|
19
|
+
name: `WithProps(${component.name || "Component"})`,
|
|
20
|
+
props: component.props || {},
|
|
21
|
+
setup(props, { slots }) {
|
|
22
|
+
const mergedProps = (0, vue.computed)(() => ({
|
|
23
|
+
...defaultProps,
|
|
24
|
+
...props
|
|
25
|
+
}));
|
|
26
|
+
return () => (0, vue.h)(component, mergedProps.value, slots);
|
|
27
|
+
}
|
|
28
|
+
});
|
|
29
|
+
};
|
|
30
|
+
return component;
|
|
31
|
+
};
|
|
32
|
+
//#endregion
|
|
33
|
+
exports.withClasses = withClasses;
|
|
34
|
+
exports.withExtend = withExtend;
|
|
35
|
+
exports.withPropsFactory = withPropsFactory;
|
|
36
|
+
exports.withVarsResolver = withVarsResolver;
|
|
37
|
+
|
|
38
|
+
//# sourceMappingURL=statics.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"statics.cjs","names":[],"sources":["../../../../src/core/utils/vue/statics.ts"],"sourcesContent":["import { computed, defineComponent, h } from 'vue'\nimport { CThemeComponent } from '../../config-provider'\nimport { VarsResolver } from '../../styles-api'\n\nexport function withExtend<T>(\n component: T\n): T & { extend: (config: CThemeComponent) => CThemeComponent } {\n ;(component as any).extend = (config: CThemeComponent) => config\n return component as T & { extend: (config: CThemeComponent) => CThemeComponent }\n}\n\nexport const withClasses = <T, C extends Record<string, string>>(\n component: T,\n classes: C\n): T & { classes: C } => {\n ;(component as any).classes = classes\n return component as T & { classes: C }\n}\n\nexport const withVarsResolver = <T, V extends VarsResolver<any>>(\n component: T,\n varsResolver: V\n): T & { varsResolver: V } => {\n ;(component as any).varsResolver = varsResolver\n return component as T & { varsResolver: V }\n}\n\nexport const withPropsFactory = <T extends Record<string, any>>(component: T) => {\n ;(component as any).withProps = (defaultProps: Partial<T>) => {\n return defineComponent({\n name: `WithProps(${(component as any).name || 'Component'})`,\n props: (component as any).props || {},\n setup(props, { slots }) {\n const mergedProps = computed(() => ({\n ...defaultProps,\n ...props,\n }))\n\n return () => h(component, mergedProps.value, slots)\n },\n })\n }\n\n return component as T & { withProps: (defaultProps: Partial<T>) => any }\n}\n"],"mappings":";;;AAIA,SAAgB,WACd,WAC8D;CAC7D,UAAmB,UAAU,WAA4B;CAC1D,OAAO;AACT;AAEA,MAAa,eACX,WACA,YACuB;CACtB,UAAmB,UAAU;CAC9B,OAAO;AACT;AAEA,MAAa,oBACX,WACA,iBAC4B;CAC3B,UAAmB,eAAe;CACnC,OAAO;AACT;AAEA,MAAa,oBAAmD,cAAiB;CAC9E,UAAmB,aAAa,iBAA6B;EAC5D,QAAA,GAAA,IAAA,gBAAA,CAAuB;GACrB,MAAM,aAAc,UAAkB,QAAQ,YAAY;GAC1D,OAAQ,UAAkB,SAAS,CAAC;GACpC,MAAM,OAAO,EAAE,SAAS;IACtB,MAAM,eAAA,GAAA,IAAA,SAAA,QAA8B;KAClC,GAAG;KACH,GAAG;IACL,EAAE;IAEF,cAAA,GAAA,IAAA,EAAA,CAAe,WAAW,YAAY,OAAO,KAAK;GACpD;EACF,CAAC;CACH;CAEA,OAAO;AACT"}
|
package/cjs/index.cjs
CHANGED
|
@@ -2,6 +2,7 @@ Object.defineProperties(exports, {
|
|
|
2
2
|
__esModule: { value: true },
|
|
3
3
|
[Symbol.toStringTag]: { value: "Module" }
|
|
4
4
|
});
|
|
5
|
+
const require_deep_merge = require("./core/utils/deep-merge/deep-merge.cjs");
|
|
5
6
|
const require_camel_to_kebab_case = require("./core/utils/camel-to-kebab-case/camel-to-kebab-case.cjs");
|
|
6
7
|
const require_filter_props = require("./core/utils/filter-props/filter-props.cjs");
|
|
7
8
|
const require_get_base_value = require("./core/utils/get-base-value/get-base-value.cjs");
|
|
@@ -15,9 +16,8 @@ const require_number_like_string_to_number = require("./core/utils/number-like-s
|
|
|
15
16
|
const require_keys = require("./core/utils/keys/keys.cjs");
|
|
16
17
|
const require_component = require("./core/utils/vue/component.cjs");
|
|
17
18
|
const require_install = require("./core/utils/vue/install.cjs");
|
|
18
|
-
const
|
|
19
|
+
const require_statics = require("./core/utils/vue/statics.cjs");
|
|
19
20
|
const require_index = require("./core/utils/types/index.cjs");
|
|
20
|
-
const require_style = require("./core/utils/dom/style.cjs");
|
|
21
21
|
const require_config_provider_types = require("./core/config-provider/config-provider.types.cjs");
|
|
22
22
|
const require_use_provider_color_scheme = require("./core/config-provider/use-cck-color-scheme/use-provider-color-scheme.cjs");
|
|
23
23
|
const require_colors_tuple = require("./core/config-provider/color-functions/colors-tuple/colors-tuple.cjs");
|
|
@@ -31,12 +31,14 @@ const require_get_theme_color = require("./core/config-provider/color-functions/
|
|
|
31
31
|
const require_get_gradient = require("./core/config-provider/color-functions/get-gradient/get-gradient.cjs");
|
|
32
32
|
const require_default_variant_colors_resolver = require("./core/config-provider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs");
|
|
33
33
|
const require_default_theme = require("./core/config-provider/default-theme.cjs");
|
|
34
|
+
const require_config_provider_context = require("./core/config-provider/config-provider.context.cjs");
|
|
35
|
+
const require_use_component_props = require("./core/config-provider/use-component-props/use-component-props.cjs");
|
|
34
36
|
const require_virtual_color = require("./core/config-provider/cck-css-variables/virtual-color/virtual-color.cjs");
|
|
35
37
|
const require_get_css_color_variables = require("./core/config-provider/cck-css-variables/get-css-color-variables.cjs");
|
|
36
38
|
const require_default_css_variables_resolver = require("./core/config-provider/cck-css-variables/default-css-variables-resolver.cjs");
|
|
37
|
-
const require_config_provider_context = require("./core/config-provider/config-provider.context.cjs");
|
|
38
39
|
const require_create_theme = require("./core/config-provider/create-theme/create-theme.cjs");
|
|
39
40
|
const require_use_cck_color_scheme = require("./core/config-provider/use-cck-color-scheme/use-cck-color-scheme.cjs");
|
|
41
|
+
const require_merge_theme_overrides = require("./core/config-provider/merge-theme-overrides/merge-theme-overrides.cjs");
|
|
40
42
|
const require_index$1 = require("./core/config-provider/index.cjs");
|
|
41
43
|
const require_extract_style_props = require("./core/box/style-props/extract-style-props/extract-style-props.cjs");
|
|
42
44
|
const require_parse_style_props = require("./core/box/style-props/parse-style-props/parse-style-props.cjs");
|
|
@@ -110,20 +112,18 @@ exports.FOCUS_CLASS_NAMES = require_get_global_class_names.FOCUS_CLASS_NAMES;
|
|
|
110
112
|
exports.STYLE_PROPS_DATA = require_style_props_data.STYLE_PROPS_DATA;
|
|
111
113
|
exports.THEME_KEY = require_config_provider_types.THEME_KEY;
|
|
112
114
|
exports.UnstyledButton = require_index$3.UnstyledButton;
|
|
113
|
-
exports.addUnit = require_style.addUnit;
|
|
114
115
|
exports.alpha = require_rgba.alpha;
|
|
115
116
|
exports.camelToKebabCase = require_camel_to_kebab_case.camelToKebabCase;
|
|
116
|
-
exports.clearShadeCache = require_color.clearShadeCache;
|
|
117
117
|
exports.colorsTuple = require_colors_tuple.colorsTuple;
|
|
118
118
|
exports.createTheme = require_create_theme.createTheme;
|
|
119
119
|
exports.createVarsResolver = require_create_vars_resolver.createVarsResolver;
|
|
120
120
|
exports.darken = require_darken.darken;
|
|
121
|
+
exports.deepMerge = require_deep_merge.deepMerge;
|
|
121
122
|
exports.defaultCssVariablesResolver = require_default_css_variables_resolver.defaultCssVariablesResolver;
|
|
122
123
|
exports.defaultVariantColorsResolver = require_default_variant_colors_resolver.defaultVariantColorsResolver;
|
|
123
124
|
exports.em = require_rem.em;
|
|
124
125
|
exports.extractStyleProps = require_extract_style_props.extractStyleProps;
|
|
125
126
|
exports.filterProps = require_filter_props.filterProps;
|
|
126
|
-
exports.generateColorShades = require_color.generateColorShades;
|
|
127
127
|
exports.getBaseValue = require_get_base_value.getBaseValue;
|
|
128
128
|
exports.getBreakpointValue = require_get_breakpoint_value.getBreakpointValue;
|
|
129
129
|
exports.getCSSColorVariables = require_get_css_color_variables.getCSSColorVariables;
|
|
@@ -154,6 +154,7 @@ exports.isUndefined = require_index.isUndefined;
|
|
|
154
154
|
exports.isVirtualColor = require_virtual_color.isVirtualColor;
|
|
155
155
|
exports.keys = require_keys.keys;
|
|
156
156
|
exports.luminance = require_luminance.luminance;
|
|
157
|
+
exports.mergeThemeOverrides = require_merge_theme_overrides.mergeThemeOverrides;
|
|
157
158
|
exports.normalizeNumberLikeStringProp = require_normalize_number_like_string_prop.normalizeNumberLikeStringProp;
|
|
158
159
|
exports.numberLikeStringToNumber = require_number_like_string_to_number.numberLikeStringToNumber;
|
|
159
160
|
exports.parseStyleProps = require_parse_style_props.parseStyleProps;
|
|
@@ -163,8 +164,8 @@ exports.rem = require_rem.rem;
|
|
|
163
164
|
exports.resolveClassNames = require_resolve_class_names.resolveClassNames;
|
|
164
165
|
exports.resolveStyles = require_resolve_styles.resolveStyles;
|
|
165
166
|
exports.responsiveStyleManager = require_responsive_style_manager.responsiveStyleManager;
|
|
167
|
+
exports.rgb = require_rgba.rgb;
|
|
166
168
|
exports.rgba = require_rgba.rgba;
|
|
167
|
-
exports.setColorAlpha = require_color.setColorAlpha;
|
|
168
169
|
exports.stylesToString = require_styles_to_string.stylesToString;
|
|
169
170
|
exports.toRgba = require_to_rgba.toRgba;
|
|
170
171
|
exports.useCckClassNamesPrefix = require_config_provider_context.useCckClassNamesPrefix;
|
|
@@ -177,12 +178,17 @@ exports.useCckStylesTransform = require_config_provider_context.useCckStylesTran
|
|
|
177
178
|
exports.useCckSxTransform = require_config_provider_context.useCckSxTransform;
|
|
178
179
|
exports.useCckTheme = require_config_provider_context.useCckTheme;
|
|
179
180
|
exports.useCckWithStaticClasses = require_config_provider_context.useCckWithStaticClasses;
|
|
181
|
+
exports.useComponentProps = require_use_component_props.useComponentProps;
|
|
180
182
|
exports.useConfigContext = require_config_provider_context.useConfigContext;
|
|
181
183
|
exports.useProviderColorScheme = require_use_provider_color_scheme.useProviderColorScheme;
|
|
182
184
|
exports.useRandomClassName = require_use_random_classname.useRandomClassName;
|
|
183
185
|
exports.useStyles = require_use_styles.useStyles;
|
|
184
186
|
exports.virtualColor = require_virtual_color.virtualColor;
|
|
187
|
+
exports.withClasses = require_statics.withClasses;
|
|
188
|
+
exports.withExtend = require_statics.withExtend;
|
|
185
189
|
exports.withInstall = require_install.withInstall;
|
|
186
190
|
exports.withPropsDefaultSetter = require_install.withPropsDefaultSetter;
|
|
191
|
+
exports.withPropsFactory = require_statics.withPropsFactory;
|
|
192
|
+
exports.withVarsResolver = require_statics.withVarsResolver;
|
|
187
193
|
|
|
188
194
|
//# sourceMappingURL=index.cjs.map
|
package/cjs/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","names":["CckConfigProvider","CBox","CButton","CButtonGroup","CButtonGroupSection","CGrid","CCol","CGroup","CLoader","CSimpleGrid","CText","CTransition","UnstyledButton"],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCol,\n CGrid,\n CGroup,\n CLoader,\n CSimpleGrid,\n CText,\n CTransition,\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 CButton,\n CButtonGroup,\n CButtonGroupSection,\n CGrid,\n CCol,\n CGroup,\n CLoader,\n CSimpleGrid,\n CText,\n CTransition,\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.cjs","names":["CckConfigProvider","CBox","CButton","CButtonGroup","CButtonGroupSection","CGrid","CCol","CGroup","CLoader","CSimpleGrid","CText","CTransition","UnstyledButton"],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCol,\n CGrid,\n CGroup,\n CLoader,\n CSimpleGrid,\n CText,\n CTransition,\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 CButton,\n CButtonGroup,\n CButtonGroupSection,\n CGrid,\n CCol,\n CGroup,\n CLoader,\n CSimpleGrid,\n CText,\n CTransition,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjBA,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,iBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;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"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { rem } from "../../core/utils/units-converters/rem.mjs";
|
|
3
|
-
import { getFontSize, getRadius, getSize } from "../../core/utils/get-size/get-size.mjs";
|
|
4
3
|
import export_helper_default from "../../_virtual/_/plugin-vue/export-helper.mjs";
|
|
4
|
+
import { useComponentProps } from "../../core/config-provider/use-component-props/use-component-props.mjs";
|
|
5
5
|
import { CBox } from "../../core/box/index.mjs";
|
|
6
|
-
import { createVarsResolver } from "../../core/styles-api/create-vars-resolver/create-vars-resolver.mjs";
|
|
7
6
|
import { useStyles } from "../../core/styles-api/use-styles/use-styles.mjs";
|
|
8
7
|
import button_module_default from "./button.module.mjs";
|
|
9
8
|
import { UnstyledButton } from "../unstyled-button/index.mjs";
|
|
9
|
+
import { varsResolver } from "./button.utils.mjs";
|
|
10
10
|
import { CLoader } from "../loader/index.mjs";
|
|
11
11
|
import { CTransition } from "../transition/index.mjs";
|
|
12
|
-
import { computed, createBlock, createCommentVNode, createVNode, defineComponent, mergeProps, openBlock, renderSlot, resolveDynamicComponent, useSlots, withCtx } from "vue";
|
|
12
|
+
import { computed, createBlock, createCommentVNode, createVNode, defineComponent, mergeProps, openBlock, ref, renderSlot, resolveDynamicComponent, useAttrs, useSlots, withCtx } from "vue";
|
|
13
13
|
//#region packages/@cck-ui/core/src/components/button/button.vue
|
|
14
14
|
const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
15
15
|
name: "CButton",
|
|
@@ -358,7 +358,10 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
358
358
|
}
|
|
359
359
|
},
|
|
360
360
|
setup(__props, { expose: __expose }) {
|
|
361
|
-
|
|
361
|
+
const _root = ref(null);
|
|
362
|
+
const _inner = ref(null);
|
|
363
|
+
const _label = ref(null);
|
|
364
|
+
const attrs = useAttrs();
|
|
362
365
|
const slots = useSlots();
|
|
363
366
|
const hasLeftSlot = computed(() => !!slots["left-section"]);
|
|
364
367
|
const hasRightSlot = computed(() => !!slots["right-section"]);
|
|
@@ -374,28 +377,12 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
374
377
|
common: { transformOrigin: "center" },
|
|
375
378
|
transitionProperty: "transform, opacity"
|
|
376
379
|
};
|
|
377
|
-
const
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
variant: variant || "default",
|
|
383
|
-
autoContrast
|
|
384
|
-
});
|
|
385
|
-
return { root: {
|
|
386
|
-
"--button-justify": justify,
|
|
387
|
-
"--button-height": getSize(size, "button-height"),
|
|
388
|
-
"--button-padding-x": getSize(size, "button-padding-x"),
|
|
389
|
-
"--button-fz": size?.includes("compact") ? getFontSize(size.replace("compact-", "")) : getFontSize(size),
|
|
390
|
-
"--button-radius": radius === void 0 ? void 0 : getRadius(radius),
|
|
391
|
-
"--button-bg": color || variant ? colors.background : void 0,
|
|
392
|
-
"--button-hover": color || variant ? colors.hover : void 0,
|
|
393
|
-
"--button-color": colors.color,
|
|
394
|
-
"--button-bd": color || variant ? colors.border : void 0,
|
|
395
|
-
"--button-hover-color": color || variant ? colors.hoverColor : void 0
|
|
396
|
-
} };
|
|
380
|
+
const rawProps = __props;
|
|
381
|
+
const props = useComponentProps({
|
|
382
|
+
component: "CButton",
|
|
383
|
+
defaultProps: {},
|
|
384
|
+
props: rawProps
|
|
397
385
|
});
|
|
398
|
-
const props = __props;
|
|
399
386
|
const knownProps = [
|
|
400
387
|
"style",
|
|
401
388
|
"vars",
|
|
@@ -419,46 +406,69 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
419
406
|
];
|
|
420
407
|
const getStyles = useStyles({
|
|
421
408
|
name: "Button",
|
|
422
|
-
props
|
|
409
|
+
props: {
|
|
410
|
+
...props.value,
|
|
411
|
+
...attrs
|
|
412
|
+
},
|
|
423
413
|
classes: button_module_default,
|
|
424
|
-
className: props.className,
|
|
425
|
-
style: props.style,
|
|
426
|
-
classNames: props.classNames,
|
|
427
|
-
styles: props.styles,
|
|
428
|
-
unstyled: props.unstyled,
|
|
429
|
-
attributes: props.attributes,
|
|
430
|
-
vars: props.vars,
|
|
414
|
+
className: props.value.className,
|
|
415
|
+
style: props.value.style,
|
|
416
|
+
classNames: props.value.classNames,
|
|
417
|
+
styles: props.value.styles,
|
|
418
|
+
unstyled: props.value.unstyled,
|
|
419
|
+
attributes: props.value.attributes,
|
|
420
|
+
vars: props.value.vars,
|
|
431
421
|
varsResolver
|
|
432
422
|
});
|
|
433
|
-
const
|
|
423
|
+
const modList = computed(() => [
|
|
424
|
+
{ disabled: props.value.disabled || props.value.dataDisabled },
|
|
425
|
+
{ loading: props.value.loading },
|
|
426
|
+
{ block: props.value.fullWidth },
|
|
427
|
+
{ "with-left-section": hasLeftSlot.value || !!props.value.leftSection },
|
|
428
|
+
{ "with-right-section": hasRightSlot.value || !!props.value.rightSection }
|
|
429
|
+
]);
|
|
430
|
+
const rootAttrs = computed(() => getStyles("root", { active: !props.value.disabled && !props.value.loading && !props.value.dataDisabled }));
|
|
431
|
+
const mergedRootAttrs = computed(() => {
|
|
432
|
+
const others = {};
|
|
433
|
+
const propsValue = props.value;
|
|
434
|
+
Object.keys(propsValue).forEach((key) => {
|
|
435
|
+
if (!knownProps.includes(key)) others[key] = propsValue[key];
|
|
436
|
+
});
|
|
437
|
+
const userMod = props.value.mod;
|
|
438
|
+
const mergedMod = [...Array.isArray(userMod) ? userMod : [userMod].filter(Boolean), ...modList.value || []];
|
|
439
|
+
return {
|
|
440
|
+
...others,
|
|
441
|
+
mod: mergedMod,
|
|
442
|
+
...rootAttrs.value
|
|
443
|
+
};
|
|
444
|
+
});
|
|
445
|
+
const innerAttrs = computed(() => getStyles("inner"));
|
|
446
|
+
const sectionAttrs = computed(() => getStyles("section"));
|
|
447
|
+
const labelAttrs = computed(() => getStyles("label"));
|
|
448
|
+
__expose({
|
|
449
|
+
root: computed(() => _root.value?.root ?? null),
|
|
450
|
+
inner: _inner.value,
|
|
451
|
+
label: _label.value
|
|
452
|
+
});
|
|
434
453
|
const __returned__ = {
|
|
454
|
+
_root,
|
|
455
|
+
_inner,
|
|
456
|
+
_label,
|
|
457
|
+
attrs,
|
|
435
458
|
slots,
|
|
436
459
|
hasLeftSlot,
|
|
437
460
|
hasRightSlot,
|
|
438
461
|
loaderTransition,
|
|
439
|
-
|
|
462
|
+
rawProps,
|
|
440
463
|
props,
|
|
441
464
|
knownProps,
|
|
442
465
|
getStyles,
|
|
466
|
+
modList,
|
|
443
467
|
rootAttrs,
|
|
444
|
-
mergedRootAttrs
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
...others,
|
|
449
|
-
...rootAttrs.value
|
|
450
|
-
};
|
|
451
|
-
}),
|
|
452
|
-
innerAttrs: computed(() => getStyles("inner")),
|
|
453
|
-
sectionAttrs: computed(() => getStyles("section")),
|
|
454
|
-
labelAttrs: computed(() => getStyles("label")),
|
|
455
|
-
modList: computed(() => [{
|
|
456
|
-
disabled: props.disabled || props.dataDisabled,
|
|
457
|
-
loading: props.loading,
|
|
458
|
-
block: props.fullWidth,
|
|
459
|
-
"with-left-section": hasLeftSlot.value || !!props.leftSection,
|
|
460
|
-
"with-right-section": hasRightSlot.value || !!props.rightSection
|
|
461
|
-
}]),
|
|
468
|
+
mergedRootAttrs,
|
|
469
|
+
innerAttrs,
|
|
470
|
+
sectionAttrs,
|
|
471
|
+
labelAttrs,
|
|
462
472
|
get CBox() {
|
|
463
473
|
return CBox;
|
|
464
474
|
},
|
|
@@ -480,10 +490,9 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
480
490
|
}
|
|
481
491
|
});
|
|
482
492
|
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
483
|
-
return openBlock(), createBlock($setup["UnstyledButton"], mergeProps($setup.mergedRootAttrs, {
|
|
493
|
+
return openBlock(), createBlock($setup["UnstyledButton"], mergeProps({ ref: "_root" }, $setup.mergedRootAttrs, {
|
|
484
494
|
disabled: $props.disabled || $props.loading,
|
|
485
|
-
unstyled: $props.unstyled
|
|
486
|
-
mod: $setup.modList
|
|
495
|
+
unstyled: $props.unstyled
|
|
487
496
|
}), {
|
|
488
497
|
default: withCtx(() => [typeof $setup.props.loading === "boolean" ? (openBlock(), createBlock($setup["CTransition"], {
|
|
489
498
|
key: 0,
|
|
@@ -491,7 +500,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
491
500
|
transition: $setup.loaderTransition,
|
|
492
501
|
duration: 150
|
|
493
502
|
}, {
|
|
494
|
-
default: withCtx(({ styles }) => [createVNode($setup["CBox"], mergeProps({
|
|
503
|
+
default: withCtx(({ styles }) => [createVNode($setup["CBox"], mergeProps({
|
|
504
|
+
ref: "_inner",
|
|
505
|
+
tag: "span"
|
|
506
|
+
}, $setup.getStyles("loader", { style: styles }), { "aria-hidden": "true" }), {
|
|
495
507
|
default: withCtx(() => [createVNode($setup["CLoader"], mergeProps({
|
|
496
508
|
color: "var(--button-color)",
|
|
497
509
|
size: "calc(var(--button-height) / 1.8)"
|
|
@@ -514,7 +526,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
514
526
|
default: withCtx(() => [createCommentVNode(" TODO "), (openBlock(), createBlock(resolveDynamicComponent($props.leftSection)))]),
|
|
515
527
|
_: 1
|
|
516
528
|
}, 16)) : createCommentVNode("v-if", true),
|
|
517
|
-
createVNode($setup["CBox"], mergeProps($setup.labelAttrs, {
|
|
529
|
+
createVNode($setup["CBox"], mergeProps({ ref: "_label" }, $setup.labelAttrs, {
|
|
518
530
|
tag: "span",
|
|
519
531
|
mod: { loading: $props.loading }
|
|
520
532
|
}), {
|
|
@@ -538,11 +550,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
538
550
|
_: 3
|
|
539
551
|
}, 16)]),
|
|
540
552
|
_: 3
|
|
541
|
-
}, 16, [
|
|
542
|
-
"disabled",
|
|
543
|
-
"unstyled",
|
|
544
|
-
"mod"
|
|
545
|
-
]);
|
|
553
|
+
}, 16, ["disabled", "unstyled"]);
|
|
546
554
|
}
|
|
547
555
|
var button_default = /*#__PURE__*/ export_helper_default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/components/button/button.vue"]]);
|
|
548
556
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.mjs","names":[],"sources":["../../../src/components/button/button.vue"],"sourcesContent":["<template>\n <unstyled-button\n v-bind=\"mergedRootAttrs\"\n :disabled=\"disabled || loading\"\n :unstyled=\"unstyled\"\n
|
|
1
|
+
{"version":3,"file":"button.mjs","names":[],"sources":["../../../src/components/button/button.vue"],"sourcesContent":["<template>\n <unstyled-button\n ref=\"_root\"\n v-bind=\"mergedRootAttrs\"\n :disabled=\"disabled || loading\"\n :unstyled=\"unstyled\"\n >\n <c-transition\n v-if=\"typeof props.loading === 'boolean'\"\n :mounted=\"props.loading\"\n :transition=\"loaderTransition\"\n :duration=\"150\"\n >\n <template #default=\"{ styles }\">\n <c-box\n ref=\"_inner\"\n tag=\"span\"\n v-bind=\"getStyles('loader', { style: styles })\"\n aria-hidden=\"true\"\n >\n <c-loader\n color=\"var(--button-color)\"\n size=\"calc(var(--button-height) / 1.8)\"\n v-bind=\"props.loaderProps\"\n ></c-loader>\n </c-box>\n </template>\n </c-transition>\n\n <c-box tag=\"span\" v-bind=\"innerAttrs\">\n <c-box\n v-if=\"$slots['left-section']\"\n v-bind=\"sectionAttrs\"\n tag=\"span\"\n :mod=\"{ position: 'left' }\"\n >\n <slot name=\"left-section\"></slot>\n </c-box>\n <c-box v-else-if=\"leftSection\" v-bind=\"sectionAttrs\" tag=\"span\" :mod=\"{ position: 'left' }\">\n <!-- TODO -->\n <component :is=\"leftSection\" />\n </c-box>\n <c-box ref=\"_label\" v-bind=\"labelAttrs\" tag=\"span\" :mod=\"{ loading }\">\n <slot />\n </c-box>\n <c-box\n v-if=\"$slots['right-section']\"\n v-bind=\"sectionAttrs\"\n tag=\"span\"\n :mod=\"{ position: 'right' }\"\n >\n <slot name=\"right-section\"></slot>\n </c-box>\n <c-box v-else-if=\"rightSection\" v-bind=\"sectionAttrs\" tag=\"span\" :mod=\"{ position: 'right' }\">\n <!-- TODO -->\n <component :is=\"rightSection\" />\n </c-box>\n </c-box>\n </unstyled-button>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs, useSlots } from 'vue'\nimport { CBox, rem, useComponentProps, useStyles } from '../../core'\nimport { UnstyledButton } from '../unstyled-button'\nimport { ButtonFactory, type ButtonProps } from './button.types'\nimport { varsResolver } from './button.utils'\nimport classes from './button.module.css'\nimport { CLoader } from '../loader'\nimport { CTransition, CckTransition } from '../transition'\n\ndefineOptions({\n name: 'CButton',\n})\n\ndefineSlots<{\n 'left-section': any\n 'right-section': any\n default: any\n}>()\n\nconst _root = ref<InstanceType<typeof UnstyledButton> | null>(null)\nconst _inner = ref<HTMLSpanElement | null>(null)\nconst _label = ref<HTMLSpanElement | null>(null)\n\nconst attrs = useAttrs()\nconst slots = useSlots()\n\nconst hasLeftSlot = computed(() => !!slots['left-section'])\nconst hasRightSlot = computed(() => !!slots['right-section'])\n\nconst loaderTransition: CckTransition = {\n in: { opacity: 1, transform: `translate(-50%, calc(-50% + ${rem(1)}))` },\n out: { opacity: 0, transform: 'translate(-50%, -200%)' },\n common: { transformOrigin: 'center' },\n transitionProperty: 'transform, opacity',\n}\n\nconst rawProps = defineProps<ButtonProps>()\n\nconst props = useComponentProps({\n component: 'CButton',\n defaultProps: {},\n props: rawProps,\n})\n\nconst knownProps = [\n 'style',\n 'vars',\n 'className',\n 'color',\n 'disabled',\n 'leftSection',\n 'rightSection',\n 'fullWidth',\n 'radius',\n 'loading',\n 'loaderProps',\n 'gradient',\n 'classNames',\n 'styles',\n 'unstyled',\n 'dataDisabled',\n 'autoContrast',\n 'mod',\n 'attributes',\n]\n\nconst getStyles = useStyles<ButtonFactory>({\n name: 'Button',\n props: { ...props.value, ...attrs } as ButtonProps,\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 modList = computed(() => [\n {\n disabled: props.value.disabled || props.value.dataDisabled,\n },\n { loading: props.value.loading },\n { block: props.value.fullWidth },\n { 'with-left-section': hasLeftSlot.value || !!props.value.leftSection },\n { 'with-right-section': hasRightSlot.value || !!props.value.rightSection },\n])\n\nconst rootAttrs = computed(() =>\n getStyles('root', {\n active: !props.value.disabled && !props.value.loading && !props.value.dataDisabled,\n })\n)\nconst mergedRootAttrs = computed(() => {\n const others: Record<string, any> = {}\n const propsValue = props.value\n Object.keys(propsValue).forEach((key) => {\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\nconst innerAttrs = computed(() => getStyles('inner'))\nconst sectionAttrs = computed(() => getStyles('section'))\nconst labelAttrs = computed(() => getStyles('label'))\n\ndefineExpose({\n root: computed(() => _root.value?.root ?? null),\n inner: _inner.value,\n label: _label.value,\n})\n</script>\n"],"mappings":"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"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { getFontSize, getRadius, getSize } from "../../core/utils/get-size/get-size.mjs";
|
|
3
|
+
import { createVarsResolver } from "../../core/styles-api/create-vars-resolver/create-vars-resolver.mjs";
|
|
4
|
+
//#region packages/@cck-ui/core/src/components/button/button.utils.ts
|
|
5
|
+
const varsResolver = createVarsResolver((theme, { radius, color, gradient, variant, size, justify, autoContrast }) => {
|
|
6
|
+
const colors = theme.variantColorResolver({
|
|
7
|
+
color: color || theme.primaryColor,
|
|
8
|
+
theme,
|
|
9
|
+
gradient,
|
|
10
|
+
variant: variant || "default",
|
|
11
|
+
autoContrast
|
|
12
|
+
});
|
|
13
|
+
return { root: {
|
|
14
|
+
"--button-justify": justify,
|
|
15
|
+
"--button-height": getSize(size, "button-height"),
|
|
16
|
+
"--button-padding-x": getSize(size, "button-padding-x"),
|
|
17
|
+
"--button-fz": size?.includes("compact") ? getFontSize(size.replace("compact-", "")) : getFontSize(size),
|
|
18
|
+
"--button-radius": radius === void 0 ? void 0 : getRadius(radius),
|
|
19
|
+
"--button-bg": color || variant ? colors.background : void 0,
|
|
20
|
+
"--button-hover": color || variant ? colors.hover : void 0,
|
|
21
|
+
"--button-color": colors.color,
|
|
22
|
+
"--button-bd": color || variant ? colors.border : void 0,
|
|
23
|
+
"--button-hover-color": color || variant ? colors.hoverColor : void 0
|
|
24
|
+
} };
|
|
25
|
+
});
|
|
26
|
+
//#endregion
|
|
27
|
+
export { varsResolver };
|
|
28
|
+
|
|
29
|
+
//# sourceMappingURL=button.utils.mjs.map
|