@cck-ui/core 0.16.0 → 0.18.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.
Files changed (38) hide show
  1. package/cjs/components/paper/index.cjs +14 -0
  2. package/cjs/components/paper/index.cjs.map +1 -0
  3. package/cjs/components/paper/paper.cjs +401 -0
  4. package/cjs/components/paper/paper.cjs.map +1 -0
  5. package/cjs/components/paper/paper.module.cjs +7 -0
  6. package/cjs/components/paper/paper.module.cjs.map +1 -0
  7. package/cjs/components/paper/paper.utils.cjs +11 -0
  8. package/cjs/components/paper/paper.utils.cjs.map +1 -0
  9. package/cjs/index.cjs +26 -23
  10. package/cjs/index.cjs.map +1 -1
  11. package/esm/components/paper/index.mjs +11 -0
  12. package/esm/components/paper/index.mjs.map +1 -0
  13. package/esm/components/paper/paper.mjs +401 -0
  14. package/esm/components/paper/paper.mjs.map +1 -0
  15. package/esm/components/paper/paper.module.mjs +7 -0
  16. package/esm/components/paper/paper.module.mjs.map +1 -0
  17. package/esm/components/paper/paper.utils.mjs +12 -0
  18. package/esm/components/paper/paper.utils.mjs.map +1 -0
  19. package/esm/index.mjs +3 -1
  20. package/esm/index.mjs.map +1 -1
  21. package/lib/components/action-icon/action-icon-group/action-icon-group.types.d.ts +23 -0
  22. package/lib/components/action-icon/action-icon-group/action-icon-group.utils.d.ts +6 -0
  23. package/lib/components/action-icon/action-icon-group-section/action-icon-group-section.types.d.ts +34 -0
  24. package/lib/components/action-icon/action-icon-group-section/action-icon-group-section.utils.d.ts +7 -0
  25. package/lib/components/action-icon/action-icon.types.d.ts +56 -0
  26. package/lib/components/action-icon/action-icon.utils.d.ts +9 -0
  27. package/lib/components/action-icon/index.d.ts +15 -0
  28. package/lib/components/index.d.ts +1 -0
  29. package/lib/components/paper/index.d.ts +6 -0
  30. package/lib/components/paper/paper.types.d.ts +29 -0
  31. package/lib/components/paper/paper.utils.d.ts +7 -0
  32. package/package.json +1 -1
  33. package/styles/action-icon.css +189 -0
  34. package/styles/action-icon.layer.css +190 -0
  35. package/styles/paper.css +24 -0
  36. package/styles/paper.layer.css +25 -0
  37. package/styles.css +215 -0
  38. package/styles.layer.css +215 -0
@@ -0,0 +1,401 @@
1
+ "use client";
2
+ import export_helper_default from "../../_virtual/_/plugin-vue/export-helper.mjs";
3
+ import { useComponentProps } from "../../core/config-provider/use-component-props/use-component-props.mjs";
4
+ import { CBox } from "../../core/box/index.mjs";
5
+ import { useStyles } from "../../core/styles-api/use-styles/use-styles.mjs";
6
+ import { varsResolver } from "./paper.utils.mjs";
7
+ import paper_module_default from "./paper.module.mjs";
8
+ import { computed, createBlock, defineComponent, mergeProps, openBlock, ref, renderSlot, useAttrs, withCtx } from "vue";
9
+ //#region packages/@cck-ui/core/src/components/paper/paper.vue
10
+ const _sfc_main = /*@__PURE__*/ defineComponent({
11
+ name: "CPaper",
12
+ __name: "paper",
13
+ props: {
14
+ className: {
15
+ type: String,
16
+ required: false
17
+ },
18
+ style: {
19
+ type: [
20
+ Object,
21
+ Function,
22
+ Array
23
+ ],
24
+ required: false,
25
+ skipCheck: true
26
+ },
27
+ __vars: {
28
+ type: null,
29
+ required: false
30
+ },
31
+ __size: {
32
+ type: String,
33
+ required: false
34
+ },
35
+ hiddenFrom: {
36
+ type: null,
37
+ required: false
38
+ },
39
+ visibleFrom: {
40
+ type: null,
41
+ required: false
42
+ },
43
+ lightHidden: {
44
+ type: Boolean,
45
+ required: false
46
+ },
47
+ darkHidden: {
48
+ type: Boolean,
49
+ required: false
50
+ },
51
+ mod: {
52
+ type: [
53
+ Object,
54
+ String,
55
+ Array
56
+ ],
57
+ required: false
58
+ },
59
+ m: {
60
+ type: null,
61
+ required: false
62
+ },
63
+ my: {
64
+ type: null,
65
+ required: false
66
+ },
67
+ mx: {
68
+ type: null,
69
+ required: false
70
+ },
71
+ mt: {
72
+ type: null,
73
+ required: false
74
+ },
75
+ mb: {
76
+ type: null,
77
+ required: false
78
+ },
79
+ ms: {
80
+ type: null,
81
+ required: false
82
+ },
83
+ me: {
84
+ type: null,
85
+ required: false
86
+ },
87
+ mis: {
88
+ type: null,
89
+ required: false
90
+ },
91
+ mie: {
92
+ type: null,
93
+ required: false
94
+ },
95
+ ml: {
96
+ type: null,
97
+ required: false
98
+ },
99
+ mr: {
100
+ type: null,
101
+ required: false
102
+ },
103
+ p: {
104
+ type: null,
105
+ required: false
106
+ },
107
+ py: {
108
+ type: null,
109
+ required: false
110
+ },
111
+ px: {
112
+ type: null,
113
+ required: false
114
+ },
115
+ pt: {
116
+ type: null,
117
+ required: false
118
+ },
119
+ pb: {
120
+ type: null,
121
+ required: false
122
+ },
123
+ ps: {
124
+ type: null,
125
+ required: false
126
+ },
127
+ pe: {
128
+ type: null,
129
+ required: false
130
+ },
131
+ pis: {
132
+ type: null,
133
+ required: false
134
+ },
135
+ pie: {
136
+ type: null,
137
+ required: false
138
+ },
139
+ pl: {
140
+ type: null,
141
+ required: false
142
+ },
143
+ pr: {
144
+ type: null,
145
+ required: false
146
+ },
147
+ bd: {
148
+ type: null,
149
+ required: false
150
+ },
151
+ bdrs: {
152
+ type: null,
153
+ required: false
154
+ },
155
+ bg: {
156
+ type: null,
157
+ required: false
158
+ },
159
+ c: {
160
+ type: null,
161
+ required: false
162
+ },
163
+ opacity: {
164
+ type: [
165
+ String,
166
+ Object,
167
+ Number
168
+ ],
169
+ required: false
170
+ },
171
+ ff: {
172
+ type: [String, Object],
173
+ required: false
174
+ },
175
+ fz: {
176
+ type: null,
177
+ required: false
178
+ },
179
+ fw: {
180
+ type: null,
181
+ required: false
182
+ },
183
+ lts: {
184
+ type: null,
185
+ required: false
186
+ },
187
+ ta: {
188
+ type: [String, Object],
189
+ required: false
190
+ },
191
+ lh: {
192
+ type: null,
193
+ required: false
194
+ },
195
+ fs: {
196
+ type: null,
197
+ required: false
198
+ },
199
+ tt: {
200
+ type: [String, Object],
201
+ required: false
202
+ },
203
+ td: {
204
+ type: null,
205
+ required: false
206
+ },
207
+ w: {
208
+ type: null,
209
+ required: false
210
+ },
211
+ miw: {
212
+ type: null,
213
+ required: false
214
+ },
215
+ maw: {
216
+ type: null,
217
+ required: false
218
+ },
219
+ h: {
220
+ type: null,
221
+ required: false
222
+ },
223
+ mih: {
224
+ type: null,
225
+ required: false
226
+ },
227
+ mah: {
228
+ type: null,
229
+ required: false
230
+ },
231
+ bgsz: {
232
+ type: null,
233
+ required: false
234
+ },
235
+ bgp: {
236
+ type: null,
237
+ required: false
238
+ },
239
+ bgr: {
240
+ type: null,
241
+ required: false
242
+ },
243
+ bga: {
244
+ type: null,
245
+ required: false
246
+ },
247
+ pos: {
248
+ type: [String, Object],
249
+ required: false
250
+ },
251
+ top: {
252
+ type: null,
253
+ required: false
254
+ },
255
+ left: {
256
+ type: null,
257
+ required: false
258
+ },
259
+ bottom: {
260
+ type: null,
261
+ required: false
262
+ },
263
+ right: {
264
+ type: null,
265
+ required: false
266
+ },
267
+ inset: {
268
+ type: null,
269
+ required: false
270
+ },
271
+ display: {
272
+ type: null,
273
+ required: false
274
+ },
275
+ flex: {
276
+ type: null,
277
+ required: false
278
+ },
279
+ shadow: {
280
+ type: null,
281
+ required: false
282
+ },
283
+ radius: {
284
+ type: null,
285
+ required: false
286
+ },
287
+ withBorder: {
288
+ type: Boolean,
289
+ required: false
290
+ },
291
+ unstyled: {
292
+ type: Boolean,
293
+ required: false
294
+ },
295
+ variant: {
296
+ type: null,
297
+ required: false
298
+ },
299
+ classNames: {
300
+ type: null,
301
+ required: false
302
+ },
303
+ styles: {
304
+ type: null,
305
+ required: false
306
+ },
307
+ vars: {
308
+ type: Function,
309
+ required: false
310
+ },
311
+ attributes: {
312
+ type: null,
313
+ required: false
314
+ }
315
+ },
316
+ setup(__props, { expose: __expose }) {
317
+ const _root = ref(null);
318
+ const attrs = useAttrs();
319
+ const rawProps = __props;
320
+ const props = useComponentProps({
321
+ component: "CPaper",
322
+ defaultProps: {},
323
+ props: rawProps
324
+ });
325
+ const knownProps = [
326
+ "classNames",
327
+ "className",
328
+ "style",
329
+ "styles",
330
+ "unstyled",
331
+ "withBorder",
332
+ "vars",
333
+ "radius",
334
+ "shadow",
335
+ "variant",
336
+ "mod",
337
+ "attributes"
338
+ ];
339
+ const modList = computed(() => [{ "data-with-border": props.value.withBorder }]);
340
+ const getStyles = useStyles({
341
+ name: "Paper",
342
+ props: {
343
+ ...props.value,
344
+ ...attrs
345
+ },
346
+ classes: paper_module_default,
347
+ className: props.value.className,
348
+ style: props.value.style,
349
+ classNames: props.value.classNames,
350
+ styles: props.value.styles,
351
+ unstyled: props.value.unstyled,
352
+ attributes: props.value.attributes,
353
+ vars: props.value.vars,
354
+ varsResolver
355
+ });
356
+ const rootAttrs = computed(() => getStyles("root"));
357
+ const mergedAttrs = computed(() => {
358
+ const others = {};
359
+ const propsValue = props.value;
360
+ for (const key in propsValue) if (!knownProps.includes(key)) others[key] = propsValue[key];
361
+ const userMod = props.value.mod;
362
+ const mergedMod = [...Array.isArray(userMod) ? userMod : [userMod].filter(Boolean), ...modList.value || []];
363
+ return {
364
+ ...others,
365
+ mod: mergedMod,
366
+ ...rootAttrs.value
367
+ };
368
+ });
369
+ __expose({ root: computed(() => _root.value?.root ?? null) });
370
+ const __returned__ = {
371
+ _root,
372
+ attrs,
373
+ rawProps,
374
+ props,
375
+ knownProps,
376
+ modList,
377
+ getStyles,
378
+ rootAttrs,
379
+ mergedAttrs,
380
+ get CBox() {
381
+ return CBox;
382
+ }
383
+ };
384
+ Object.defineProperty(__returned__, "__isScriptSetup", {
385
+ enumerable: false,
386
+ value: true
387
+ });
388
+ return __returned__;
389
+ }
390
+ });
391
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
392
+ return openBlock(), createBlock($setup["CBox"], mergeProps({ ref: "_root" }, $setup.mergedAttrs, { variant: $setup.props.variant }), {
393
+ default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
394
+ _: 3
395
+ }, 16, ["variant"]);
396
+ }
397
+ var paper_default = /*#__PURE__*/ export_helper_default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/components/paper/paper.vue"]]);
398
+ //#endregion
399
+ export { paper_default as default };
400
+
401
+ //# sourceMappingURL=paper.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"paper.mjs","names":[],"sources":["../../../src/components/paper/paper.vue"],"sourcesContent":["<template>\n <c-box ref=\"_root\" v-bind=\"mergedAttrs\" :variant=\"props.variant\">\n <slot />\n </c-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue'\nimport classes from './paper.module.css'\nimport { CBox, useComponentProps, useStyles } from '../../core'\nimport { PaperFactory, PaperProps } from './paper.types'\nimport { varsResolver } from './paper.utils'\n\ndefineOptions({\n name: 'CPaper',\n})\n\nconst _root = ref<InstanceType<typeof CBox> | null>(null)\n\nconst attrs = useAttrs()\n\nconst rawProps = defineProps<PaperProps>()\n\nconst props = useComponentProps({\n component: 'CPaper',\n defaultProps: {},\n props: rawProps,\n})\n\nconst knownProps = [\n 'classNames',\n 'className',\n 'style',\n 'styles',\n 'unstyled',\n 'withBorder',\n 'vars',\n 'radius',\n 'shadow',\n 'variant',\n 'mod',\n 'attributes',\n]\n\nconst modList = computed(() => [\n {\n 'data-with-border': props.value.withBorder,\n },\n])\n\nconst getStyles = useStyles<PaperFactory>({\n name: 'Paper',\n props: { ...props.value, ...attrs } as PaperProps,\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'))\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiBA,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,MAAM,aAAa;GACjB;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;EAEA,MAAM,UAAU,eAAe,CAC7B,EACE,oBAAoB,MAAM,MAAM,WAClC,CACF,CAAC;EAED,MAAM,YAAY,UAAwB;GACxC,MAAM;GACN,OAAO;IAAE,GAAG,MAAM;IAAO,GAAG;GAAM;GAClC,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;GACxB,MAAM,MAAM,MAAM;GAClB;EACF,CAAC;EAED,MAAM,YAAY,eAAe,UAAU,MAAM,CAAC;EAElD,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;;;;;;;;;;;;;;;;;;;;;;;qBAnFC,YAEQ,OAAA,SAFR,WAEQ,EAFD,KAAI,QAAO,GAAS,OAAA,aAAW,EAAG,SAAS,OAAA,MAAM,QAAA,CAAA,GAAA;yBAC9C,CAAR,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA"}
@@ -0,0 +1,7 @@
1
+ "use client";
2
+ //#region packages/@cck-ui/core/src/components/paper/paper.module.css
3
+ var paper_module_default = { "root": "m_a4a0a883" };
4
+ //#endregion
5
+ export { paper_module_default as default };
6
+
7
+ //# sourceMappingURL=paper.module.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"paper.module.mjs","names":[],"sources":["../../../src/components/paper/paper.module.css"],"sourcesContent":[".root {\n --paper-radius: var(--c-radius-default);\n\n outline: 0;\n -webkit-tap-heighlight-color: transparent;\n display: block;\n touch-action: manipulation;\n text-decoration: none;\n border-radius: var(--paper-radius);\n box-shadow: var(--paper-shadow);\n background-color: var(--c-color-body);\n\n @mixin light {\n --paper-border-color: var(--c-color-gray-3);\n }\n\n @mixin dark {\n --paper-border-color: var(--c-color-dark-4);\n }\n\n &:where([data-with-border]) {\n border: rem(1px) solid var(--paper-border-color);\n }\n}\n"],"mappings":";;AAAA,IAAA,uBAAe,EAAC,QAAO,aAAY"}
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ import { getRadius, getShadow } 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/paper/paper.utils.ts
5
+ const varsResolver = createVarsResolver((_, { radius, shadow }) => ({ root: {
6
+ "--paper-radius": radius === void 0 ? void 0 : getRadius(radius),
7
+ "--paper-shadow": getShadow(shadow)
8
+ } }));
9
+ //#endregion
10
+ export { varsResolver };
11
+
12
+ //# sourceMappingURL=paper.utils.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"paper.utils.mjs","names":[],"sources":["../../../src/components/paper/paper.utils.ts"],"sourcesContent":["import { createVarsResolver, getRadius, getShadow } from '../../core'\nimport { PaperFactory } from './paper.types'\n\nexport const varsResolver = createVarsResolver<PaperFactory>((_, { radius, shadow }) => ({\n root: {\n '--paper-radius': radius === undefined ? undefined : getRadius(radius),\n '--paper-shadow': getShadow(shadow),\n },\n}))\n"],"mappings":";;;;AAGA,MAAa,eAAe,oBAAkC,GAAG,EAAE,QAAQ,cAAc,EACvF,MAAM;CACJ,kBAAkB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;CACrE,kBAAkB,UAAU,MAAM;AACpC,EACF,EAAE"}
package/esm/index.mjs CHANGED
@@ -65,6 +65,7 @@ import { CEmptyState, CEmptyStateActions, CEmptyStateDescription, CEmptyStateInd
65
65
  import { CFlex } from "./components/flex/index.mjs";
66
66
  import { CCol, CGrid } from "./components/grid/index.mjs";
67
67
  import { CGroup } from "./components/group/index.mjs";
68
+ import { CPaper } from "./components/paper/index.mjs";
68
69
  import { CSemiCircleProgress } from "./components/semi-circle-progress/index.mjs";
69
70
  import { CSimpleGrid } from "./components/simple-grid/index.mjs";
70
71
  import { CSkeleton } from "./components/skeleton/index.mjs";
@@ -95,6 +96,7 @@ const components = [
95
96
  CGrid,
96
97
  CGroup,
97
98
  CLoader,
99
+ CPaper,
98
100
  CSemiCircleProgress,
99
101
  CSimpleGrid,
100
102
  CSkeleton,
@@ -114,6 +116,6 @@ const CckUI = { install(app) {
114
116
  });
115
117
  } };
116
118
  //#endregion
117
- export { CAlert, CAspectRatio, CBox, CButton, CButtonGroup, CButtonGroupSection, transitions as CCK_TRANSITIONS, CCenter, CCloseButton, CCol, CContainer, CDefaultLoaders, CEmptyState, CEmptyStateActions, CEmptyStateDescription, CEmptyStateIndicator, CEmptyStateTitle, CFlex, CGrid, CGroup, CLoader, CONFIG_KEY, CSemiCircleProgress, CSimpleGrid, CSkeleton, CSpace, CSplitter, CSplitterPane, CStack, CText, CTransition, 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 };
119
+ export { CAlert, CAspectRatio, CBox, CButton, CButtonGroup, CButtonGroupSection, transitions as CCK_TRANSITIONS, CCenter, CCloseButton, CCol, CContainer, CDefaultLoaders, CEmptyState, CEmptyStateActions, CEmptyStateDescription, CEmptyStateIndicator, CEmptyStateTitle, CFlex, CGrid, CGroup, CLoader, CONFIG_KEY, CPaper, CSemiCircleProgress, CSimpleGrid, CSkeleton, CSpace, CSplitter, CSplitterPane, CStack, CText, CTransition, 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 };
118
120
 
119
121
  //# 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 CAlert,\n CAspectRatio,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCenter,\n CCloseButton,\n CCol,\n CContainer,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFlex,\n CGrid,\n CGroup,\n CLoader,\n CSemiCircleProgress,\n CSimpleGrid,\n CSkeleton,\n CSpace,\n CSplitter,\n CSplitterPane,\n CStack,\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 CAlert,\n CAspectRatio,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCenter,\n CCloseButton,\n CCol,\n CContainer,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFlex,\n CGrid,\n CGroup,\n CLoader,\n CSemiCircleProgress,\n CSimpleGrid,\n CSkeleton,\n CSpace,\n CSplitter,\n CSplitterPane,\n CStack,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,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;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
+ {"version":3,"file":"index.mjs","names":[],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n CAlert,\n CAspectRatio,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCenter,\n CCloseButton,\n CCol,\n CContainer,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFlex,\n CGrid,\n CGroup,\n CLoader,\n CPaper,\n CSemiCircleProgress,\n CSimpleGrid,\n CSkeleton,\n CSpace,\n CSplitter,\n CSplitterPane,\n CStack,\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 CAlert,\n CAspectRatio,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCenter,\n CCloseButton,\n CCol,\n CContainer,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFlex,\n CGrid,\n CGroup,\n CLoader,\n CPaper,\n CSemiCircleProgress,\n CSimpleGrid,\n CSkeleton,\n CSpace,\n CSplitter,\n CSplitterPane,\n CStack,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCA,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;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,23 @@
1
+ import { BoxProps, ElementProps, Factory, StylesApiProps } from '../../../core';
2
+ export type ActionIconGroupStylesNames = 'group';
3
+ export type ActionIconGroupCssVariables = {
4
+ group: '--ai-border-width';
5
+ };
6
+ export interface ActionIconGroupProps extends BoxProps, StylesApiProps<ActionIconGroupFactory>, /* @vue-ignore */ ElementProps<'div'> {
7
+ /**
8
+ * @description Group orientation
9
+ * @default 'horizontal'
10
+ */
11
+ orientation?: 'horizontal' | 'vertical';
12
+ /**
13
+ * @description `border-width` of the child components.
14
+ * @default 1
15
+ */
16
+ borderWidth?: number | string;
17
+ }
18
+ export type ActionIconGroupFactory = Factory<{
19
+ props: ActionIconGroupProps;
20
+ ref: HTMLDivElement;
21
+ stylesNames: ActionIconGroupStylesNames;
22
+ vars: ActionIconGroupCssVariables;
23
+ }>;
@@ -0,0 +1,6 @@
1
+ export declare const varsResolver: import("../../..").VarsResolver<{
2
+ props: import("./action-icon-group.types").ActionIconGroupProps;
3
+ ref: HTMLDivElement;
4
+ stylesNames: import("./action-icon-group.types").ActionIconGroupStylesNames;
5
+ vars: import("./action-icon-group.types").ActionIconGroupCssVariables;
6
+ }>;
@@ -0,0 +1,34 @@
1
+ import { BoxProps, CGradient, CRadius, CSize, ElementProps, Factory, StylesApiProps } from '../../../core';
2
+ import { ActionIconVariant } from '../action-icon.types';
3
+ export type ActionIconGroupSectionStylesNames = 'groupSection';
4
+ export type ActionIconGroupSectionCssVariables = {
5
+ groupSection: '--section-radius' | '--section-bg' | '--section-color' | '--section-bd' | '--section-height' | '--section-padding-x' | '--section-fz';
6
+ };
7
+ export interface ActionIconGroupSectionProps extends BoxProps, StylesApiProps<ActionIconGroupSectionFactory>, ElementProps<'div'> {
8
+ /**
9
+ * @description Key of `theme.radius` or any valid CSS value to set `border-radius`
10
+ * @default theme.defaultRadius
11
+ */
12
+ radius?: CRadius;
13
+ /**
14
+ * @description Gradient values used with `variant="gradient"`.
15
+ * @default theme.defaultGradient
16
+ */
17
+ gradient?: CGradient;
18
+ /**
19
+ * @description If set, adjusts text color based on background color for `filled` variant
20
+ */
21
+ autoContrast?: boolean;
22
+ /**
23
+ * @description Controls section `height`, `font-size` and horizontal `padding`
24
+ * @default 'sm'
25
+ */
26
+ size?: CSize | (string & {}) | number;
27
+ }
28
+ export type ActionIconGroupSectionFactory = Factory<{
29
+ props: ActionIconGroupSectionProps;
30
+ ref: HTMLDivElement;
31
+ stylesNames: ActionIconGroupSectionStylesNames;
32
+ vars: ActionIconGroupSectionCssVariables;
33
+ variant: ActionIconVariant;
34
+ }>;
@@ -0,0 +1,7 @@
1
+ export declare const varsResolver: import("../../..").VarsResolver<{
2
+ props: import("./action-icon-group-section.types").ActionIconGroupSectionProps;
3
+ ref: HTMLDivElement;
4
+ stylesNames: import("./action-icon-group-section.types").ActionIconGroupSectionStylesNames;
5
+ vars: import("./action-icon-group-section.types").ActionIconGroupSectionCssVariables;
6
+ variant: import("..").ActionIconVariant;
7
+ }>;
@@ -0,0 +1,56 @@
1
+ import { BoxProps, CColor, CGradient, CRadius, CSize, PolymorphicFactory, StylesApiProps } from '../../core';
2
+ import { LoaderProps } from '../loader';
3
+ export type ActionIconVariant = 'default' | 'filled' | 'light' | 'outline' | 'dashed' | 'transparent' | 'white' | 'subtle' | 'gradient';
4
+ export type ActionIconStylesNames = 'root' | 'loader' | 'icon';
5
+ export type ActionIconCssVariables = {
6
+ root: '--ai-radius' | '--ai-size' | '--ai-bg' | '--ai-hover' | '--ai-hover-color' | '--ai-color' | '--ai-bd';
7
+ };
8
+ export interface ActionIconProps extends BoxProps, StylesApiProps<ActionIconFactory> {
9
+ dataDisabled?: boolean;
10
+ __staticSelector?: string;
11
+ /**
12
+ * @description If set, `Loader` component is displayed instead of the `children`
13
+ */
14
+ loading?: boolean;
15
+ /**
16
+ * @description Props passed down to the `Loader` component. Ignored when `loading` prop is not set.
17
+ */
18
+ loaderProps?: LoaderProps;
19
+ /**
20
+ * @description Controls width and height of the button. Numbers are converted to rem.
21
+ * @default 'md'
22
+ */
23
+ size?: CSize | `input-${CSize}` | (string & {}) | number;
24
+ /**
25
+ * @description Key of `theme.colors` or any valid CSS color.
26
+ * @default theme.primaryColor
27
+ */
28
+ color?: CColor;
29
+ /**
30
+ * @description Key of `theme.radius` or any valid CSS value to set border-radius. Numbers are converted to rem.
31
+ * @default theme.defaultRadius
32
+ */
33
+ radius?: CRadius;
34
+ /**
35
+ * @description Gradient values used with `variant="gradient"`.
36
+ * @default theme.defaultGradient
37
+ */
38
+ gradient?: CGradient;
39
+ /**
40
+ * @description Sets `disabled` attributes, prevents interactions
41
+ */
42
+ disabled?: boolean;
43
+ /**
44
+ * @description If set, adjusts text color based on background color for `filled` variant
45
+ */
46
+ autoContrast?: boolean;
47
+ }
48
+ export type ActionIconFactory = PolymorphicFactory<{
49
+ props: ActionIconProps;
50
+ defaultComponent: 'button';
51
+ defaultRef: HTMLButtonElement;
52
+ stylesNames: ActionIconStylesNames;
53
+ variant: ActionIconVariant;
54
+ vars: ActionIconCssVariables;
55
+ staticComponents: {};
56
+ }>;
@@ -0,0 +1,9 @@
1
+ export declare const varsResolver: import("../..").VarsResolver<{
2
+ props: import("./action-icon.types").ActionIconProps;
3
+ defaultComponent: "button";
4
+ defaultRef: HTMLButtonElement;
5
+ stylesNames: import("./action-icon.types").ActionIconStylesNames;
6
+ variant: import("./action-icon.types").ActionIconVariant;
7
+ vars: import("./action-icon.types").ActionIconCssVariables;
8
+ staticComponents: {};
9
+ }>;
@@ -0,0 +1,15 @@
1
+ import ActionIconGroup from './action-icon-group/action-icon-group.vue';
2
+ import ActionIconGroupSection from './action-icon-group-section/action-icon-group-section.vue';
3
+ import ActionIcon from './action-icon.vue';
4
+ import classes from './action-icon.module.css';
5
+ import { SFCWithInstallAndClasses } from '../../core';
6
+ export declare const CActionIconGroup: SFCWithInstallAndClasses<typeof ActionIconGroup, typeof classes>;
7
+ export declare const CActionIconGroupSection: SFCWithInstallAndClasses<typeof ActionIconGroupSection, typeof classes>;
8
+ export declare const CActionIcon: SFCWithInstallAndClasses<typeof ActionIcon, typeof classes> & {
9
+ CActionIconGroup: typeof CActionIconGroup;
10
+ CActionIconGroupSection: typeof CActionIconGroupSection;
11
+ };
12
+ export default CActionIcon;
13
+ export * from './action-icon-group/action-icon-group.types';
14
+ export * from './action-icon-group-section/action-icon-group-section.types';
15
+ export * from './action-icon.types';
@@ -9,6 +9,7 @@ export * from './flex';
9
9
  export * from './grid';
10
10
  export * from './group';
11
11
  export * from './loader';
12
+ export * from './paper';
12
13
  export * from './semi-circle-progress';
13
14
  export * from './simple-grid';
14
15
  export * from './skeleton';
@@ -0,0 +1,6 @@
1
+ import { SFCWithInstallAndClasses } from '../../core';
2
+ import Paper from './paper.vue';
3
+ import classes from './paper.module.css';
4
+ export declare const CPaper: SFCWithInstallAndClasses<typeof Paper, typeof classes>;
5
+ export default CPaper;
6
+ export * from './paper.types';