@cck-ui/core 0.6.1 → 0.8.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 (53) hide show
  1. package/cjs/components/aspect-ratio/aspect-ratio.cjs +389 -0
  2. package/cjs/components/aspect-ratio/aspect-ratio.cjs.map +1 -0
  3. package/cjs/components/aspect-ratio/aspect-ratio.module.cjs +7 -0
  4. package/cjs/components/aspect-ratio/aspect-ratio.module.cjs.map +1 -0
  5. package/cjs/components/aspect-ratio/aspect-ratio.utils.cjs +7 -0
  6. package/cjs/components/aspect-ratio/aspect-ratio.utils.cjs.map +1 -0
  7. package/cjs/components/aspect-ratio/index.cjs +14 -0
  8. package/cjs/components/aspect-ratio/index.cjs.map +1 -0
  9. package/cjs/components/center/center.cjs +390 -0
  10. package/cjs/components/center/center.cjs.map +1 -0
  11. package/cjs/components/center/center.module.cjs +7 -0
  12. package/cjs/components/center/center.module.cjs.map +1 -0
  13. package/cjs/components/center/index.cjs +13 -0
  14. package/cjs/components/center/index.cjs.map +1 -0
  15. package/cjs/components/grid/grid.cjs +1 -1
  16. package/cjs/components/grid/grid.cjs.map +1 -1
  17. package/cjs/components/simple-grid/simple-grid.cjs +1 -1
  18. package/cjs/components/simple-grid/simple-grid.cjs.map +1 -1
  19. package/cjs/index.cjs +38 -34
  20. package/cjs/index.cjs.map +1 -1
  21. package/esm/components/aspect-ratio/aspect-ratio.mjs +389 -0
  22. package/esm/components/aspect-ratio/aspect-ratio.mjs.map +1 -0
  23. package/esm/components/aspect-ratio/aspect-ratio.module.mjs +7 -0
  24. package/esm/components/aspect-ratio/aspect-ratio.module.mjs.map +1 -0
  25. package/esm/components/aspect-ratio/aspect-ratio.utils.mjs +8 -0
  26. package/esm/components/aspect-ratio/aspect-ratio.utils.mjs.map +1 -0
  27. package/esm/components/aspect-ratio/index.mjs +11 -0
  28. package/esm/components/aspect-ratio/index.mjs.map +1 -0
  29. package/esm/components/center/center.mjs +390 -0
  30. package/esm/components/center/center.mjs.map +1 -0
  31. package/esm/components/center/center.module.mjs +7 -0
  32. package/esm/components/center/center.module.mjs.map +1 -0
  33. package/esm/components/center/index.mjs +10 -0
  34. package/esm/components/center/index.mjs.map +1 -0
  35. package/esm/components/grid/grid.mjs +1 -1
  36. package/esm/components/grid/grid.mjs.map +1 -1
  37. package/esm/components/simple-grid/simple-grid.mjs +1 -1
  38. package/esm/components/simple-grid/simple-grid.mjs.map +1 -1
  39. package/esm/index.mjs +3 -1
  40. package/esm/index.mjs.map +1 -1
  41. package/lib/components/aspect-ratio/aspect-ratio.types.d.ts +18 -0
  42. package/lib/components/aspect-ratio/aspect-ratio.utils.d.ts +6 -0
  43. package/lib/components/aspect-ratio/index.d.ts +6 -0
  44. package/lib/components/center/center.types.d.ts +14 -0
  45. package/lib/components/center/index.d.ts +6 -0
  46. package/lib/components/index.d.ts +2 -0
  47. package/package.json +1 -1
  48. package/styles/aspect-ratio.css +13 -0
  49. package/styles/aspect-ratio.layer.css +14 -0
  50. package/styles/center.css +9 -0
  51. package/styles/center.layer.css +10 -0
  52. package/styles.css +24 -0
  53. package/styles.layer.css +24 -0
@@ -0,0 +1,389 @@
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 aspect_ratio_module_default from "./aspect-ratio.module.mjs";
7
+ import { varsResolver } from "./aspect-ratio.utils.mjs";
8
+ import { computed, createBlock, defineComponent, mergeProps, openBlock, ref, renderSlot, useAttrs, withCtx } from "vue";
9
+ //#region packages/@cck-ui/core/src/components/aspect-ratio/aspect-ratio.vue
10
+ const _sfc_main = /*@__PURE__*/ defineComponent({
11
+ name: "CAspectRatio",
12
+ __name: "aspect-ratio",
13
+ props: {
14
+ ratio: {
15
+ type: Number,
16
+ required: false
17
+ },
18
+ className: {
19
+ type: String,
20
+ required: false
21
+ },
22
+ style: {
23
+ type: [
24
+ Object,
25
+ Function,
26
+ Array
27
+ ],
28
+ required: false,
29
+ skipCheck: true
30
+ },
31
+ __vars: {
32
+ type: null,
33
+ required: false
34
+ },
35
+ __size: {
36
+ type: String,
37
+ required: false
38
+ },
39
+ hiddenFrom: {
40
+ type: null,
41
+ required: false
42
+ },
43
+ visibleFrom: {
44
+ type: null,
45
+ required: false
46
+ },
47
+ lightHidden: {
48
+ type: Boolean,
49
+ required: false
50
+ },
51
+ darkHidden: {
52
+ type: Boolean,
53
+ required: false
54
+ },
55
+ mod: {
56
+ type: [
57
+ Object,
58
+ String,
59
+ Array
60
+ ],
61
+ required: false
62
+ },
63
+ m: {
64
+ type: null,
65
+ required: false
66
+ },
67
+ my: {
68
+ type: null,
69
+ required: false
70
+ },
71
+ mx: {
72
+ type: null,
73
+ required: false
74
+ },
75
+ mt: {
76
+ type: null,
77
+ required: false
78
+ },
79
+ mb: {
80
+ type: null,
81
+ required: false
82
+ },
83
+ ms: {
84
+ type: null,
85
+ required: false
86
+ },
87
+ me: {
88
+ type: null,
89
+ required: false
90
+ },
91
+ mis: {
92
+ type: null,
93
+ required: false
94
+ },
95
+ mie: {
96
+ type: null,
97
+ required: false
98
+ },
99
+ ml: {
100
+ type: null,
101
+ required: false
102
+ },
103
+ mr: {
104
+ type: null,
105
+ required: false
106
+ },
107
+ p: {
108
+ type: null,
109
+ required: false
110
+ },
111
+ py: {
112
+ type: null,
113
+ required: false
114
+ },
115
+ px: {
116
+ type: null,
117
+ required: false
118
+ },
119
+ pt: {
120
+ type: null,
121
+ required: false
122
+ },
123
+ pb: {
124
+ type: null,
125
+ required: false
126
+ },
127
+ ps: {
128
+ type: null,
129
+ required: false
130
+ },
131
+ pe: {
132
+ type: null,
133
+ required: false
134
+ },
135
+ pis: {
136
+ type: null,
137
+ required: false
138
+ },
139
+ pie: {
140
+ type: null,
141
+ required: false
142
+ },
143
+ pl: {
144
+ type: null,
145
+ required: false
146
+ },
147
+ pr: {
148
+ type: null,
149
+ required: false
150
+ },
151
+ bd: {
152
+ type: null,
153
+ required: false
154
+ },
155
+ bdrs: {
156
+ type: null,
157
+ required: false
158
+ },
159
+ bg: {
160
+ type: null,
161
+ required: false
162
+ },
163
+ c: {
164
+ type: null,
165
+ required: false
166
+ },
167
+ opacity: {
168
+ type: [
169
+ String,
170
+ Object,
171
+ Number
172
+ ],
173
+ required: false
174
+ },
175
+ ff: {
176
+ type: [String, Object],
177
+ required: false
178
+ },
179
+ fz: {
180
+ type: null,
181
+ required: false
182
+ },
183
+ fw: {
184
+ type: null,
185
+ required: false
186
+ },
187
+ lts: {
188
+ type: null,
189
+ required: false
190
+ },
191
+ ta: {
192
+ type: [String, Object],
193
+ required: false
194
+ },
195
+ lh: {
196
+ type: null,
197
+ required: false
198
+ },
199
+ fs: {
200
+ type: null,
201
+ required: false
202
+ },
203
+ tt: {
204
+ type: [String, Object],
205
+ required: false
206
+ },
207
+ td: {
208
+ type: null,
209
+ required: false
210
+ },
211
+ w: {
212
+ type: null,
213
+ required: false
214
+ },
215
+ miw: {
216
+ type: null,
217
+ required: false
218
+ },
219
+ maw: {
220
+ type: null,
221
+ required: false
222
+ },
223
+ h: {
224
+ type: null,
225
+ required: false
226
+ },
227
+ mih: {
228
+ type: null,
229
+ required: false
230
+ },
231
+ mah: {
232
+ type: null,
233
+ required: false
234
+ },
235
+ bgsz: {
236
+ type: null,
237
+ required: false
238
+ },
239
+ bgp: {
240
+ type: null,
241
+ required: false
242
+ },
243
+ bgr: {
244
+ type: null,
245
+ required: false
246
+ },
247
+ bga: {
248
+ type: null,
249
+ required: false
250
+ },
251
+ pos: {
252
+ type: [String, Object],
253
+ required: false
254
+ },
255
+ top: {
256
+ type: null,
257
+ required: false
258
+ },
259
+ left: {
260
+ type: null,
261
+ required: false
262
+ },
263
+ bottom: {
264
+ type: null,
265
+ required: false
266
+ },
267
+ right: {
268
+ type: null,
269
+ required: false
270
+ },
271
+ inset: {
272
+ type: null,
273
+ required: false
274
+ },
275
+ display: {
276
+ type: null,
277
+ required: false
278
+ },
279
+ flex: {
280
+ type: null,
281
+ required: false
282
+ },
283
+ unstyled: {
284
+ type: Boolean,
285
+ required: false
286
+ },
287
+ variant: {
288
+ type: null,
289
+ required: false
290
+ },
291
+ classNames: {
292
+ type: null,
293
+ required: false
294
+ },
295
+ styles: {
296
+ type: null,
297
+ required: false
298
+ },
299
+ vars: {
300
+ type: Function,
301
+ required: false
302
+ },
303
+ attributes: {
304
+ type: null,
305
+ required: false
306
+ }
307
+ },
308
+ setup(__props, { expose: __expose }) {
309
+ const _root = ref(null);
310
+ const attrs = useAttrs();
311
+ const rawProps = __props;
312
+ const props = useComponentProps({
313
+ component: "CAspectRatio",
314
+ defaultProps: {},
315
+ props: rawProps
316
+ });
317
+ const knownProps = [
318
+ "classNames",
319
+ "className",
320
+ "style",
321
+ "styles",
322
+ "unstyled",
323
+ "vars",
324
+ "ratio",
325
+ "attrubutes"
326
+ ];
327
+ const getStyles = useStyles({
328
+ name: "AspectRatio",
329
+ props: {
330
+ ...props.value,
331
+ ...attrs
332
+ },
333
+ classes: aspect_ratio_module_default,
334
+ className: props.value.className,
335
+ classNames: props.value.classNames,
336
+ style: props.value.style,
337
+ styles: props.value.styles,
338
+ unstyled: props.value.unstyled,
339
+ attributes: props.value.attributes,
340
+ vars: props.value.vars,
341
+ varsResolver
342
+ });
343
+ const rootAttrs = computed(() => getStyles("root"));
344
+ const mergedAttrs = computed(() => {
345
+ const others = {};
346
+ const propsValue = props.value;
347
+ Object.keys(propsValue).forEach((key) => {
348
+ if (!knownProps.includes(key)) others[key] = propsValue[key];
349
+ });
350
+ const userMod = props.value.mod;
351
+ const mergedMod = [...Array.isArray(userMod) ? userMod : [userMod].filter(Boolean)];
352
+ return {
353
+ ...others,
354
+ mod: mergedMod,
355
+ ...rootAttrs.value
356
+ };
357
+ });
358
+ __expose({ root: computed(() => _root.value?.root ?? null) });
359
+ const __returned__ = {
360
+ _root,
361
+ attrs,
362
+ rawProps,
363
+ props,
364
+ knownProps,
365
+ getStyles,
366
+ rootAttrs,
367
+ mergedAttrs,
368
+ get CBox() {
369
+ return CBox;
370
+ }
371
+ };
372
+ Object.defineProperty(__returned__, "__isScriptSetup", {
373
+ enumerable: false,
374
+ value: true
375
+ });
376
+ return __returned__;
377
+ }
378
+ });
379
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
380
+ return openBlock(), createBlock($setup["CBox"], mergeProps({ ref: "_root" }, $setup.mergedAttrs), {
381
+ default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
382
+ _: 3
383
+ }, 16);
384
+ }
385
+ var aspect_ratio_default = /*#__PURE__*/ export_helper_default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/components/aspect-ratio/aspect-ratio.vue"]]);
386
+ //#endregion
387
+ export { aspect_ratio_default as default };
388
+
389
+ //# sourceMappingURL=aspect-ratio.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aspect-ratio.mjs","names":[],"sources":["../../../src/components/aspect-ratio/aspect-ratio.vue"],"sourcesContent":["<template>\n <c-box ref=\"_root\" v-bind=\"mergedAttrs\">\n <slot />\n </c-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue'\nimport { AspectRatioFactory, AspectRatioProps } from './aspect-ratio.types'\nimport { CBox, useComponentProps, useStyles } from '../../core'\nimport classes from './aspect-ratio.module.css'\nimport { varsResolver } from './aspect-ratio.utils'\n\ndefineOptions({\n name: 'CAspectRatio',\n})\n\nconst _root = ref<InstanceType<typeof CBox> | null>(null)\n\nconst attrs = useAttrs()\n\nconst rawProps = defineProps<AspectRatioProps>()\n\nconst props = useComponentProps({\n component: 'CAspectRatio',\n defaultProps: {},\n props: rawProps,\n})\n\nconst knownProps = [\n 'classNames',\n 'className',\n 'style',\n 'styles',\n 'unstyled',\n 'vars',\n 'ratio',\n 'attrubutes',\n]\n\nconst getStyles = useStyles<AspectRatioFactory>({\n name: 'AspectRatio',\n props: { ...props.value, ...attrs } as AspectRatioProps,\n classes,\n className: props.value.className,\n classNames: props.value.classNames,\n style: props.value.style,\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 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 = [...(Array.isArray(userMod) ? userMod : [userMod].filter(Boolean))]\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;EACF;EAEA,MAAM,YAAY,UAA8B;GAC9C,MAAM;GACN,OAAO;IAAE,GAAG,MAAM;IAAO,GAAG;GAAM;GAClC,SAAA;GACA,WAAW,MAAM,MAAM;GACvB,YAAY,MAAM,MAAM;GACxB,OAAO,MAAM,MAAM;GACnB,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,OAAO,KAAK,UAAU,CAAC,CAAC,SAAS,QAAQ;IACvC,IAAI,CAAC,WAAW,SAAS,GAAG,GAC1B,OAAO,OAAO,WAAW;GAE7B,CAAC;GACD,MAAM,UAAU,MAAM,MAAM;GAC5B,MAAM,YAAY,CAAC,GAAI,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,CAAC,CAAC,OAAO,OAAO,CAAE;GACpF,OAAO;IAAE,GAAG;IAAQ,KAAK;IAAW,GAAG,UAAU;GAAM;EACzD,CAAC;EAED,SAAa,EACX,MAAM,eAAe,MAAM,OAAO,QAAQ,IAAI,EAChD,CAAC;;;;;;;;;;;;;;;;;;;;;;qBAtEC,YAEQ,OAAA,SAFR,WAEQ,EAFD,KAAI,QAAO,GAAS,OAAA,WAAW,GAAA;yBAC5B,CAAR,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA"}
@@ -0,0 +1,7 @@
1
+ "use client";
2
+ //#region packages/@cck-ui/core/src/components/aspect-ratio/aspect-ratio.module.css
3
+ var aspect_ratio_module_default = { "root": "m_31f351f9" };
4
+ //#endregion
5
+ export { aspect_ratio_module_default as default };
6
+
7
+ //# sourceMappingURL=aspect-ratio.module.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aspect-ratio.module.mjs","names":[],"sources":["../../../src/components/aspect-ratio/aspect-ratio.module.css"],"sourcesContent":[".root {\n --ar-ratio: 1;\n max-width: 100%;\n\n & > :where(*:not(style)) {\n aspect-ratio: var(--ar-ratio);\n width: 100%;\n }\n\n & > :where(img, video) {\n object-fit: cover;\n }\n}\n"],"mappings":";;AAAA,IAAA,8BAAe,EAAC,QAAO,aAAY"}
@@ -0,0 +1,8 @@
1
+ "use client";
2
+ import { createVarsResolver } from "../../core/styles-api/create-vars-resolver/create-vars-resolver.mjs";
3
+ //#region packages/@cck-ui/core/src/components/aspect-ratio/aspect-ratio.utils.ts
4
+ const varsResolver = createVarsResolver((_, { ratio }) => ({ root: { "--ar-ratio": ratio?.toString() } }));
5
+ //#endregion
6
+ export { varsResolver };
7
+
8
+ //# sourceMappingURL=aspect-ratio.utils.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aspect-ratio.utils.mjs","names":[],"sources":["../../../src/components/aspect-ratio/aspect-ratio.utils.ts"],"sourcesContent":["import { createVarsResolver } from '../../core'\nimport { AspectRatioFactory } from './aspect-ratio.types'\n\nexport const varsResolver = createVarsResolver<AspectRatioFactory>((_, { ratio }) => ({\n root: {\n '--ar-ratio': ratio?.toString(),\n },\n}))\n"],"mappings":";;;AAGA,MAAa,eAAe,oBAAwC,GAAG,EAAE,aAAa,EACpF,MAAM,EACJ,cAAc,OAAO,SAAS,EAChC,EACF,EAAE"}
@@ -0,0 +1,11 @@
1
+ "use client";
2
+ import { withInstall } from "../../core/utils/vue/install.mjs";
3
+ import { withClasses, withExtend, withPropsFactory, withVarsResolver } from "../../core/utils/vue/statics.mjs";
4
+ import aspect_ratio_module_default from "./aspect-ratio.module.mjs";
5
+ import { varsResolver } from "./aspect-ratio.utils.mjs";
6
+ import aspect_ratio_default from "./aspect-ratio.mjs";
7
+ const CAspectRatio = withInstall(withPropsFactory(withExtend(withVarsResolver(withClasses(aspect_ratio_default, aspect_ratio_module_default), varsResolver))));
8
+ //#endregion
9
+ export { CAspectRatio, CAspectRatio as default };
10
+
11
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mjs","names":["AspectRatio","classes"],"sources":["../../../src/components/aspect-ratio/index.ts"],"sourcesContent":["import AspectRatio from './aspect-ratio.vue'\nimport classes from './aspect-ratio.module.css'\nimport { varsResolver } from './aspect-ratio.utils'\nimport {\n SFCWithInstallAndClasses,\n withClasses,\n withExtend,\n withInstall,\n withPropsFactory,\n withVarsResolver,\n} from '../../core'\n\nconst AspectRatioWithStatic = withPropsFactory(\n withExtend(withVarsResolver(withClasses(AspectRatio, classes), varsResolver))\n)\n\nexport const CAspectRatio: SFCWithInstallAndClasses<typeof AspectRatio, typeof classes> =\n withInstall(AspectRatioWithStatic)\n\nexport default CAspectRatio\n\nexport * from './aspect-ratio.types'\n"],"mappings":";;;;;;AAgBA,MAAa,eACX,YAL4B,iBAC5B,WAAW,iBAAiB,YAAYA,sBAAaC,2BAAO,GAAG,YAAY,CAAC,CAIhE,CAAqB"}