@cck-ui/core 0.39.0 → 0.41.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 (50) hide show
  1. package/cjs/components/blockquote/blockquote.cjs +435 -0
  2. package/cjs/components/blockquote/blockquote.cjs.map +1 -0
  3. package/cjs/components/blockquote/blockquote.module.cjs +11 -0
  4. package/cjs/components/blockquote/blockquote.module.cjs.map +1 -0
  5. package/cjs/components/blockquote/blockquote.utils.cjs +31 -0
  6. package/cjs/components/blockquote/blockquote.utils.cjs.map +1 -0
  7. package/cjs/components/blockquote/index.cjs +14 -0
  8. package/cjs/components/blockquote/index.cjs.map +1 -0
  9. package/cjs/components/code/code.cjs +401 -0
  10. package/cjs/components/code/code.cjs.map +1 -0
  11. package/cjs/components/code/code.module.cjs +7 -0
  12. package/cjs/components/code/code.module.cjs.map +1 -0
  13. package/cjs/components/code/code.utils.cjs +8 -0
  14. package/cjs/components/code/code.utils.cjs.map +1 -0
  15. package/cjs/components/code/index.cjs +14 -0
  16. package/cjs/components/code/index.cjs.map +1 -0
  17. package/cjs/index.cjs +117 -111
  18. package/cjs/index.cjs.map +1 -1
  19. package/esm/components/blockquote/blockquote.mjs +435 -0
  20. package/esm/components/blockquote/blockquote.mjs.map +1 -0
  21. package/esm/components/blockquote/blockquote.module.mjs +11 -0
  22. package/esm/components/blockquote/blockquote.module.mjs.map +1 -0
  23. package/esm/components/blockquote/blockquote.utils.mjs +32 -0
  24. package/esm/components/blockquote/blockquote.utils.mjs.map +1 -0
  25. package/esm/components/blockquote/index.mjs +11 -0
  26. package/esm/components/blockquote/index.mjs.map +1 -0
  27. package/esm/components/code/code.mjs +401 -0
  28. package/esm/components/code/code.mjs.map +1 -0
  29. package/esm/components/code/code.module.mjs +7 -0
  30. package/esm/components/code/code.module.mjs.map +1 -0
  31. package/esm/components/code/code.utils.mjs +9 -0
  32. package/esm/components/code/code.utils.mjs.map +1 -0
  33. package/esm/components/code/index.mjs +11 -0
  34. package/esm/components/code/index.mjs.map +1 -0
  35. package/esm/index.mjs +5 -1
  36. package/esm/index.mjs.map +1 -1
  37. package/lib/components/blockquote/blockquote.types.d.ts +30 -0
  38. package/lib/components/blockquote/blockquote.utils.d.ts +6 -0
  39. package/lib/components/blockquote/index.d.ts +6 -0
  40. package/lib/components/code/code.types.d.ts +17 -0
  41. package/lib/components/code/code.utils.d.ts +6 -0
  42. package/lib/components/code/index.d.ts +6 -0
  43. package/lib/components/index.d.ts +2 -0
  44. package/package.json +1 -1
  45. package/styles/blockquote.css +42 -0
  46. package/styles/blockquote.layer.css +43 -0
  47. package/styles/code.css +21 -0
  48. package/styles/code.layer.css +22 -0
  49. package/styles.css +65 -0
  50. package/styles.layer.css +65 -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 code_module_default from "./code.module.mjs";
7
+ import { varsResolver } from "./code.utils.mjs";
8
+ import { computed, createBlock, defineComponent, mergeProps, openBlock, ref, renderSlot, useAttrs, withCtx } from "vue";
9
+ //#region packages/@cck-ui/core/src/components/code/code.vue
10
+ const _sfc_main = /*@__PURE__*/ defineComponent({
11
+ name: "CCode",
12
+ __name: "code",
13
+ props: {
14
+ color: {
15
+ type: null,
16
+ required: false
17
+ },
18
+ block: {
19
+ type: Boolean,
20
+ required: false
21
+ },
22
+ className: {
23
+ type: String,
24
+ required: false
25
+ },
26
+ style: {
27
+ type: [
28
+ Object,
29
+ Function,
30
+ Array
31
+ ],
32
+ required: false,
33
+ skipCheck: true
34
+ },
35
+ __vars: {
36
+ type: null,
37
+ required: false
38
+ },
39
+ __size: {
40
+ type: String,
41
+ required: false
42
+ },
43
+ hiddenFrom: {
44
+ type: null,
45
+ required: false
46
+ },
47
+ visibleFrom: {
48
+ type: null,
49
+ required: false
50
+ },
51
+ lightHidden: {
52
+ type: Boolean,
53
+ required: false
54
+ },
55
+ darkHidden: {
56
+ type: Boolean,
57
+ required: false
58
+ },
59
+ mod: {
60
+ type: [
61
+ Object,
62
+ String,
63
+ Array
64
+ ],
65
+ required: false
66
+ },
67
+ m: {
68
+ type: null,
69
+ required: false
70
+ },
71
+ my: {
72
+ type: null,
73
+ required: false
74
+ },
75
+ mx: {
76
+ type: null,
77
+ required: false
78
+ },
79
+ mt: {
80
+ type: null,
81
+ required: false
82
+ },
83
+ mb: {
84
+ type: null,
85
+ required: false
86
+ },
87
+ ms: {
88
+ type: null,
89
+ required: false
90
+ },
91
+ me: {
92
+ type: null,
93
+ required: false
94
+ },
95
+ mis: {
96
+ type: null,
97
+ required: false
98
+ },
99
+ mie: {
100
+ type: null,
101
+ required: false
102
+ },
103
+ ml: {
104
+ type: null,
105
+ required: false
106
+ },
107
+ mr: {
108
+ type: null,
109
+ required: false
110
+ },
111
+ p: {
112
+ type: null,
113
+ required: false
114
+ },
115
+ py: {
116
+ type: null,
117
+ required: false
118
+ },
119
+ px: {
120
+ type: null,
121
+ required: false
122
+ },
123
+ pt: {
124
+ type: null,
125
+ required: false
126
+ },
127
+ pb: {
128
+ type: null,
129
+ required: false
130
+ },
131
+ ps: {
132
+ type: null,
133
+ required: false
134
+ },
135
+ pe: {
136
+ type: null,
137
+ required: false
138
+ },
139
+ pis: {
140
+ type: null,
141
+ required: false
142
+ },
143
+ pie: {
144
+ type: null,
145
+ required: false
146
+ },
147
+ pl: {
148
+ type: null,
149
+ required: false
150
+ },
151
+ pr: {
152
+ type: null,
153
+ required: false
154
+ },
155
+ bd: {
156
+ type: null,
157
+ required: false
158
+ },
159
+ bdrs: {
160
+ type: null,
161
+ required: false
162
+ },
163
+ bg: {
164
+ type: null,
165
+ required: false
166
+ },
167
+ c: {
168
+ type: null,
169
+ required: false
170
+ },
171
+ opacity: {
172
+ type: [
173
+ String,
174
+ Object,
175
+ Number
176
+ ],
177
+ required: false
178
+ },
179
+ ff: {
180
+ type: [String, Object],
181
+ required: false
182
+ },
183
+ fz: {
184
+ type: null,
185
+ required: false
186
+ },
187
+ fw: {
188
+ type: null,
189
+ required: false
190
+ },
191
+ lts: {
192
+ type: null,
193
+ required: false
194
+ },
195
+ ta: {
196
+ type: [String, Object],
197
+ required: false
198
+ },
199
+ lh: {
200
+ type: null,
201
+ required: false
202
+ },
203
+ fs: {
204
+ type: null,
205
+ required: false
206
+ },
207
+ tt: {
208
+ type: [String, Object],
209
+ required: false
210
+ },
211
+ td: {
212
+ type: null,
213
+ required: false
214
+ },
215
+ w: {
216
+ type: null,
217
+ required: false
218
+ },
219
+ miw: {
220
+ type: null,
221
+ required: false
222
+ },
223
+ maw: {
224
+ type: null,
225
+ required: false
226
+ },
227
+ h: {
228
+ type: null,
229
+ required: false
230
+ },
231
+ mih: {
232
+ type: null,
233
+ required: false
234
+ },
235
+ mah: {
236
+ type: null,
237
+ required: false
238
+ },
239
+ bgsz: {
240
+ type: null,
241
+ required: false
242
+ },
243
+ bgp: {
244
+ type: null,
245
+ required: false
246
+ },
247
+ bgr: {
248
+ type: null,
249
+ required: false
250
+ },
251
+ bga: {
252
+ type: null,
253
+ required: false
254
+ },
255
+ pos: {
256
+ type: [String, Object],
257
+ required: false
258
+ },
259
+ top: {
260
+ type: null,
261
+ required: false
262
+ },
263
+ left: {
264
+ type: null,
265
+ required: false
266
+ },
267
+ bottom: {
268
+ type: null,
269
+ required: false
270
+ },
271
+ right: {
272
+ type: null,
273
+ required: false
274
+ },
275
+ inset: {
276
+ type: null,
277
+ required: false
278
+ },
279
+ display: {
280
+ type: null,
281
+ required: false
282
+ },
283
+ flex: {
284
+ type: null,
285
+ required: false
286
+ },
287
+ unstyled: {
288
+ type: Boolean,
289
+ required: false
290
+ },
291
+ variant: {
292
+ type: null,
293
+ required: false
294
+ },
295
+ classNames: {
296
+ type: null,
297
+ required: false
298
+ },
299
+ styles: {
300
+ type: null,
301
+ required: false
302
+ },
303
+ vars: {
304
+ type: Function,
305
+ required: false
306
+ },
307
+ attributes: {
308
+ type: null,
309
+ required: false
310
+ }
311
+ },
312
+ setup(__props, { expose: __expose }) {
313
+ const _root = ref(null);
314
+ const attrs = useAttrs();
315
+ const rawProps = __props;
316
+ const props = useComponentProps({
317
+ component: "CCode",
318
+ defaultProps: {},
319
+ props: rawProps
320
+ });
321
+ const knownProps = [
322
+ "classNames",
323
+ "className",
324
+ "style",
325
+ "styles",
326
+ "unstyled",
327
+ "vars",
328
+ "color",
329
+ "block",
330
+ "mod",
331
+ "attributes"
332
+ ];
333
+ const styleProps = computed(() => ({
334
+ ...props.value,
335
+ ...attrs,
336
+ style: attrs.style ?? props.value.style
337
+ }));
338
+ const getStyels = useStyles({
339
+ name: "Code",
340
+ classes: code_module_default,
341
+ props: styleProps,
342
+ className: () => props.value.className,
343
+ style: () => props.value.style,
344
+ classNames: props.value.classNames,
345
+ styles: props.value.styles,
346
+ unstyled: props.value.unstyled,
347
+ attributes: props.value.attributes,
348
+ vars: props.value.vars,
349
+ varsResolver
350
+ });
351
+ const rootAttrs = computed(() => getStyels("root"));
352
+ const modList = computed(() => [{ block: props.value.block }]);
353
+ const mergedAttrs = computed(() => {
354
+ const others = {};
355
+ const propsValue = props.value;
356
+ for (const key in propsValue) if (!knownProps.includes(key)) others[key] = propsValue[key];
357
+ const userMod = props.value.mod;
358
+ const mergedMod = [...Array.isArray(userMod) ? userMod : [userMod], ...modList.value];
359
+ return {
360
+ ...others,
361
+ mod: mergedMod,
362
+ ...rootAttrs.value
363
+ };
364
+ });
365
+ __expose({ root: computed(() => _root.value?.root ?? null) });
366
+ const __returned__ = {
367
+ _root,
368
+ attrs,
369
+ rawProps,
370
+ props,
371
+ knownProps,
372
+ styleProps,
373
+ getStyels,
374
+ rootAttrs,
375
+ modList,
376
+ mergedAttrs,
377
+ get CBox() {
378
+ return CBox;
379
+ }
380
+ };
381
+ Object.defineProperty(__returned__, "__isScriptSetup", {
382
+ enumerable: false,
383
+ value: true
384
+ });
385
+ return __returned__;
386
+ }
387
+ });
388
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
389
+ return openBlock(), createBlock($setup["CBox"], mergeProps({
390
+ dir: "ltr",
391
+ ref: "_root"
392
+ }, $setup.mergedAttrs, { tag: $setup.props.block ? "pre" : "code" }), {
393
+ default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
394
+ _: 3
395
+ }, 16, ["tag"]);
396
+ }
397
+ var code_default = /*#__PURE__*/ export_helper_default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/components/code/code.vue"]]);
398
+ //#endregion
399
+ export { code_default as default };
400
+
401
+ //# sourceMappingURL=code.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"code.mjs","names":[],"sources":["../../../src/components/code/code.vue"],"sourcesContent":["<template>\n <c-box dir=\"ltr\" ref=\"_root\" v-bind=\"mergedAttrs\" :tag=\"props.block ? 'pre' : 'code'\">\n <slot />\n </c-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue'\nimport classes from './code.module.css'\nimport { CBox, CStyleProp, useComponentProps, useStyles } from '../../core'\nimport { CodeFactory, CodeProps } from './code.types'\nimport { varsResolver } from './code.utils'\n\ndefineOptions({\n name: 'CCode',\n})\n\nconst _root = ref<InstanceType<typeof CBox> | null>(null)\n\nconst attrs = useAttrs()\n\nconst rawProps = defineProps<CodeProps>()\n\nconst props = useComponentProps({\n component: 'CCode',\n defaultProps: {},\n props: rawProps,\n})\n\nconst knownProps = [\n 'classNames',\n 'className',\n 'style',\n 'styles',\n 'unstyled',\n 'vars',\n 'color',\n 'block',\n 'mod',\n 'attributes',\n]\n\nconst styleProps = computed(() => ({\n ...props.value,\n ...attrs,\n style: (attrs.style ?? props.value.style) as CStyleProp,\n}))\n\nconst getStyels = useStyles<CodeFactory>({\n name: 'Code',\n classes,\n props: styleProps,\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(() => getStyels('root'))\n\nconst modList = computed(() => [{ block: props.value.block }])\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 = [...(Array.isArray(userMod) ? userMod : [userMod]), ...modList.value]\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;EACF;EAEA,MAAM,aAAa,gBAAgB;GACjC,GAAG,MAAM;GACT,GAAG;GACH,OAAQ,MAAM,SAAS,MAAM,MAAM;EACrC,EAAE;EAEF,MAAM,YAAY,UAAuB;GACvC,MAAM;GACN,SAAA;GACA,OAAO;GACP,iBAAiB,MAAM,MAAM;GAC7B,aAAa,MAAM,MAAM;GACzB,YAAY,MAAM,MAAM;GACxB,QAAQ,MAAM,MAAM;GACpB,UAAU,MAAM,MAAM;GACtB,YAAY,MAAM,MAAM;GACxB,MAAM,MAAM,MAAM;GAClB;EACF,CAAC;EAED,MAAM,YAAY,eAAe,UAAU,MAAM,CAAC;EAElD,MAAM,UAAU,eAAe,CAAC,EAAE,OAAO,MAAM,MAAM,MAAM,CAAC,CAAC;EAE7D,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,CAAC,GAAI,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,GAAI,GAAG,QAAQ,KAAK;GACtF,OAAO;IAAE,GAAG;IAAQ,KAAK;IAAW,GAAG,UAAU;GAAM;EACzD,CAAC;EAED,SAAa,EACX,MAAM,eAAe,MAAM,OAAO,QAAQ,IAAI,EAChD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;qBAhFC,YAEQ,OAAA,SAFR,WAEQ;EAFD,KAAI;EAAM,KAAI;IAAgB,OAAA,aAAW,EAAG,KAAK,OAAA,MAAM,QAAK,QAAA,OAAA,CAAA,GAAA;yBACzD,CAAR,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA"}
@@ -0,0 +1,7 @@
1
+ "use client";
2
+ //#region packages/@cck-ui/core/src/components/code/code.module.css
3
+ var code_module_default = { "root": "m_3a11a0c2" };
4
+ //#endregion
5
+ export { code_module_default as default };
6
+
7
+ //# sourceMappingURL=code.module.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"code.module.mjs","names":[],"sources":["../../../src/components/code/code.module.css"],"sourcesContent":[".root {\n font-family: var(--c-font-family-monospace);\n line-height: var(--c-line-height);\n padding: 2px calc(var(--c-spacing-xs) / 2);\n border-radius: var(--c-radius-sm);\n font-size: var(--c-font-size-xs);\n margin: 0;\n overflow: auto;\n\n @mixin where-light {\n background-color: var(--code-bg, var(--c-color-gray-0));\n }\n\n @mixin where-dark {\n background-color: var(--code-bg, var(--c-color-dark-6));\n }\n\n &[data-block] {\n padding: var(--c-spacing-xs);\n }\n}\n"],"mappings":";;AAAA,IAAA,sBAAe,EAAC,QAAO,aAAY"}
@@ -0,0 +1,9 @@
1
+ "use client";
2
+ import { getThemeColor } from "../../core/config-provider/color-functions/get-theme-color/get-theme-color.mjs";
3
+ import { createVarsResolver } from "../../core/styles-api/create-vars-resolver/create-vars-resolver.mjs";
4
+ //#region packages/@cck-ui/core/src/components/code/code.utils.ts
5
+ const varsResolver = createVarsResolver((theme, { color }) => ({ root: { "--code-bg": color ? getThemeColor(color, theme) : void 0 } }));
6
+ //#endregion
7
+ export { varsResolver };
8
+
9
+ //# sourceMappingURL=code.utils.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"code.utils.mjs","names":[],"sources":["../../../src/components/code/code.utils.ts"],"sourcesContent":["import { createVarsResolver, getThemeColor } from '../../core'\nimport { CodeFactory } from './code.types'\n\nexport const varsResolver = createVarsResolver<CodeFactory>((theme, { color }) => ({\n root: {\n '--code-bg': color ? getThemeColor(color, theme) : undefined,\n },\n}))\n"],"mappings":";;;;AAGA,MAAa,eAAe,oBAAiC,OAAO,EAAE,aAAa,EACjF,MAAM,EACJ,aAAa,QAAQ,cAAc,OAAO,KAAK,IAAI,KAAA,EACrD,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 code_module_default from "./code.module.mjs";
5
+ import { varsResolver } from "./code.utils.mjs";
6
+ import code_default from "./code.mjs";
7
+ const CCode = withInstall(withPropsFactory(withExtend(withVarsResolver(withClasses(code_default, code_module_default), varsResolver))));
8
+ //#endregion
9
+ export { CCode, CCode as default };
10
+
11
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mjs","names":["Code","classes"],"sources":["../../../src/components/code/index.ts"],"sourcesContent":["import {\n SFCWithInstallAndClasses,\n withClasses,\n withExtend,\n withInstall,\n withPropsFactory,\n withVarsResolver,\n} from '../../core'\nimport classes from './code.module.css'\nimport { varsResolver } from './code.utils'\nimport Code from './code.vue'\n\nconst CodeWithStatics = withPropsFactory(\n withExtend(withVarsResolver(withClasses(Code, classes), varsResolver))\n)\n\nexport const CCode: SFCWithInstallAndClasses<typeof Code, typeof classes> =\n withInstall(CodeWithStatics)\n\nexport default CCode\n\nexport * from './code.types'\n"],"mappings":";;;;;;AAgBA,MAAa,QACX,YALsB,iBACtB,WAAW,iBAAiB,YAAYA,cAAMC,mBAAO,GAAG,YAAY,CAAC,CAIzD,CAAe"}
package/esm/index.mjs CHANGED
@@ -68,11 +68,13 @@ import { CAspectRatio } from "./components/aspect-ratio/index.mjs";
68
68
  import { CAvatar, CAvatarGroup } from "./components/avatar/index.mjs";
69
69
  import { CBackgroundImage } from "./components/background-image/index.mjs";
70
70
  import { CBadge } from "./components/badge/index.mjs";
71
+ import { CBlockquote } from "./components/blockquote/index.mjs";
71
72
  import { CBreadcrumbs } from "./components/breadcrumbs/index.mjs";
72
73
  import { CBurger } from "./components/burger/index.mjs";
73
74
  import { CButton, CButtonGroup, CButtonGroupSection } from "./components/button/index.mjs";
74
75
  import { CCard, CCardSection } from "./components/card/index.mjs";
75
76
  import { CCenter } from "./components/center/index.mjs";
77
+ import { CCode } from "./components/code/index.mjs";
76
78
  import { CColorSwatch } from "./components/color-swatch/index.mjs";
77
79
  import { CContainer } from "./components/container/index.mjs";
78
80
  import { CCopyButton } from "./components/copy-button/index.mjs";
@@ -113,6 +115,7 @@ const components = [
113
115
  CAvatarGroup,
114
116
  CBackgroundImage,
115
117
  CBadge,
118
+ CBlockquote,
116
119
  CBreadcrumbs,
117
120
  CBurger,
118
121
  CButton,
@@ -122,6 +125,7 @@ const components = [
122
125
  CCardSection,
123
126
  CCenter,
124
127
  CCloseButton,
128
+ CCode,
125
129
  CCol,
126
130
  CColorSwatch,
127
131
  CContainer,
@@ -169,6 +173,6 @@ const CckUI = { install(app) {
169
173
  });
170
174
  } };
171
175
  //#endregion
172
- export { CActionIcon, CActionIconGroup, CActionIconGroupSection, CAffix, CAlert, CAnchor, CAspectRatio, CAvatar, CAvatarGroup, CBackgroundImage, CBadge, CBox, CBreadcrumbs, CBurger, CButton, CButtonGroup, CButtonGroupSection, transitions as CCK_TRANSITIONS, CCard, CCardSection, CCenter, CCloseButton, CCol, CColorSwatch, CContainer, CCopyButton, CDataList, CDataListItem, CDataListItemLabel, CDataListItemValue, CDefaultLoaders, CDivider, CEmptyState, CEmptyStateActions, CEmptyStateDescription, CEmptyStateIndicator, CEmptyStateTitle, CFileButton, CFlex, CFocusTrap, CGrid, CGroup, CImage, CIndicator, CKbd, CLoader, CNumberFormatter, CONFIG_KEY, CPaper, CPortal, CSemiCircleProgress, CSimpleGrid, CSkeleton, CSpace, CSplitter, CSplitterPane, CStack, CText, CTransition, CTypography, CVisuallyHidden, CckConfigProvider, CckUI, CckUI as default, DEFAULT_THEME, FOCUS_CLASS_NAMES, STYLE_PROPS_DATA, THEME_KEY, UnstyledButton, alpha, camelToKebabCase, colorsTuple, createTheme, createVarsResolver, darken, deepMerge, defaultCssVariablesResolver, defaultVariantColorsResolver, em, extractStyleProps, filterFalsyChildren, filterProps, getBaseValue, getBreakpointValue, getCSSColorVariables, getComponentName, getDefaultZIndex, 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 };
176
+ export { CActionIcon, CActionIconGroup, CActionIconGroupSection, CAffix, CAlert, CAnchor, CAspectRatio, CAvatar, CAvatarGroup, CBackgroundImage, CBadge, CBlockquote, CBox, CBreadcrumbs, CBurger, CButton, CButtonGroup, CButtonGroupSection, transitions as CCK_TRANSITIONS, CCard, CCardSection, CCenter, CCloseButton, CCode, CCol, CColorSwatch, CContainer, CCopyButton, CDataList, CDataListItem, CDataListItemLabel, CDataListItemValue, CDefaultLoaders, CDivider, CEmptyState, CEmptyStateActions, CEmptyStateDescription, CEmptyStateIndicator, CEmptyStateTitle, CFileButton, CFlex, CFocusTrap, CGrid, CGroup, CImage, CIndicator, CKbd, CLoader, CNumberFormatter, CONFIG_KEY, CPaper, CPortal, CSemiCircleProgress, CSimpleGrid, CSkeleton, CSpace, CSplitter, CSplitterPane, CStack, CText, CTransition, CTypography, CVisuallyHidden, CckConfigProvider, CckUI, CckUI as default, DEFAULT_THEME, FOCUS_CLASS_NAMES, STYLE_PROPS_DATA, THEME_KEY, UnstyledButton, alpha, camelToKebabCase, colorsTuple, createTheme, createVarsResolver, darken, deepMerge, defaultCssVariablesResolver, defaultVariantColorsResolver, em, extractStyleProps, filterFalsyChildren, filterProps, getBaseValue, getBreakpointValue, getCSSColorVariables, getComponentName, getDefaultZIndex, 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 };
173
177
 
174
178
  //# sourceMappingURL=index.mjs.map
package/esm/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","names":[],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n CActionIcon,\n CActionIconGroup,\n CActionIconGroupSection,\n CAffix,\n CAlert,\n CAnchor,\n CAspectRatio,\n CAvatar,\n CAvatarGroup,\n CBackgroundImage,\n CBadge,\n CBreadcrumbs,\n CBurger,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCard,\n CCardSection,\n CCenter,\n CCloseButton,\n CCol,\n CColorSwatch,\n CContainer,\n CCopyButton,\n CDataList,\n CDataListItem,\n CDataListItemLabel,\n CDataListItemValue,\n CDivider,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFileButton,\n CFlex,\n CFocusTrap,\n CGrid,\n CGroup,\n CImage,\n CIndicator,\n CKbd,\n CLoader,\n CNumberFormatter,\n CPaper,\n CPortal,\n CSemiCircleProgress,\n CSimpleGrid,\n CSkeleton,\n CSpace,\n CSplitter,\n CSplitterPane,\n CStack,\n CText,\n CTransition,\n CTypography,\n CVisuallyHidden,\n UnstyledButton,\n} from './components'\nimport { CckConfigProvider, CBox } from './core'\n\nconst INSTALLED_KEY = Symbol('INSTALLED_KEY')\n\nconst components = [\n CckConfigProvider,\n CBox,\n CActionIcon,\n CActionIconGroup,\n CActionIconGroupSection,\n CAffix,\n CAlert,\n CAnchor,\n CAspectRatio,\n CAvatar,\n CAvatarGroup,\n CBackgroundImage,\n CBadge,\n CBreadcrumbs,\n CBurger,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCard,\n CCardSection,\n CCenter,\n CCloseButton,\n CCol,\n CColorSwatch,\n CContainer,\n CCopyButton,\n CDataList,\n CDataListItem,\n CDataListItemLabel,\n CDataListItemValue,\n CDivider,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFileButton,\n CFlex,\n CFocusTrap,\n CGrid,\n CGroup,\n CImage,\n CIndicator,\n CKbd,\n CLoader,\n CNumberFormatter,\n CPaper,\n CPortal,\n CSemiCircleProgress,\n CSimpleGrid,\n CSkeleton,\n CSpace,\n CSplitter,\n CSplitterPane,\n CStack,\n CText,\n CTransition,\n CTypography,\n CVisuallyHidden,\n UnstyledButton,\n]\n\nconst CckUI: Plugin = {\n install(app: App) {\n if ((app as any)[INSTALLED_KEY]) {\n return\n }\n ;(app as any)[INSTALLED_KEY] = true\n components.forEach((c) => {\n if (c.name) {\n app.component(c.name, c)\n }\n })\n },\n}\n\nexport default CckUI\nexport { CckUI }\n\nexport * from './components'\nexport * from './core'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;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 CActionIcon,\n CActionIconGroup,\n CActionIconGroupSection,\n CAffix,\n CAlert,\n CAnchor,\n CAspectRatio,\n CAvatar,\n CAvatarGroup,\n CBackgroundImage,\n CBadge,\n CBlockquote,\n CBreadcrumbs,\n CBurger,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCard,\n CCardSection,\n CCenter,\n CCloseButton,\n CCode,\n CCol,\n CColorSwatch,\n CContainer,\n CCopyButton,\n CDataList,\n CDataListItem,\n CDataListItemLabel,\n CDataListItemValue,\n CDivider,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFileButton,\n CFlex,\n CFocusTrap,\n CGrid,\n CGroup,\n CImage,\n CIndicator,\n CKbd,\n CLoader,\n CNumberFormatter,\n CPaper,\n CPortal,\n CSemiCircleProgress,\n CSimpleGrid,\n CSkeleton,\n CSpace,\n CSplitter,\n CSplitterPane,\n CStack,\n CText,\n CTransition,\n CTypography,\n CVisuallyHidden,\n UnstyledButton,\n} from './components'\nimport { CckConfigProvider, CBox } from './core'\n\nconst INSTALLED_KEY = Symbol('INSTALLED_KEY')\n\nconst components = [\n CckConfigProvider,\n CBox,\n CActionIcon,\n CActionIconGroup,\n CActionIconGroupSection,\n CAffix,\n CAlert,\n CAnchor,\n CAspectRatio,\n CAvatar,\n CAvatarGroup,\n CBackgroundImage,\n CBadge,\n CBlockquote,\n CBreadcrumbs,\n CBurger,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCard,\n CCardSection,\n CCenter,\n CCloseButton,\n CCode,\n CCol,\n CColorSwatch,\n CContainer,\n CCopyButton,\n CDataList,\n CDataListItem,\n CDataListItemLabel,\n CDataListItemValue,\n CDivider,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFileButton,\n CFlex,\n CFocusTrap,\n CGrid,\n CGroup,\n CImage,\n CIndicator,\n CKbd,\n CLoader,\n CNumberFormatter,\n CPaper,\n CPortal,\n CSemiCircleProgress,\n CSimpleGrid,\n CSkeleton,\n CSpace,\n CSplitter,\n CSplitterPane,\n CStack,\n CText,\n CTransition,\n CTypography,\n CVisuallyHidden,\n UnstyledButton,\n]\n\nconst CckUI: Plugin = {\n install(app: App) {\n if ((app as any)[INSTALLED_KEY]) {\n return\n }\n ;(app as any)[INSTALLED_KEY] = true\n components.forEach((c) => {\n if (c.name) {\n app.component(c.name, c)\n }\n })\n },\n}\n\nexport default CckUI\nexport { CckUI }\n\nexport * from './components'\nexport * from './core'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;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,30 @@
1
+ import { BoxProps, CColor, CRadius, ElementProps, Factory, StylesApiProps } from '../../core';
2
+ export type BlockquoteStylesNames = 'root' | 'icon' | 'cite';
3
+ export type BlockquoteCssVariables = {
4
+ root: '--bq-bg-light' | '--bq-bg-dark' | '--bq-bd' | '--bq-icon-size' | '--bq-radius' | '--bq-text-wrap';
5
+ };
6
+ export interface BlockquoteProps extends BoxProps, StylesApiProps<BlockquoteFactory>, ElementProps<'blockquote', 'div'> {
7
+ /**
8
+ * Controls icon-wrapper span `width` and `height`, numbers are converted to rem
9
+ * @default 40
10
+ */
11
+ iconSize?: number | string;
12
+ /**
13
+ * Key of `theme.colors` or any valid CSS color
14
+ * @default theme.primaryColor
15
+ */
16
+ color?: CColor;
17
+ /**
18
+ * Key of `theme.radius` or any valid CSS value to set `border-radius`
19
+ * @default theme.defaultRadius
20
+ */
21
+ radius?: CRadius;
22
+ /** Controls `text-wrap` CSS property */
23
+ textWrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty' | 'stable';
24
+ }
25
+ export type BlockquoteFactory = Factory<{
26
+ props: BlockquoteProps;
27
+ ref: HTMLQuoteElement;
28
+ stylesNames: BlockquoteStylesNames;
29
+ vars: BlockquoteCssVariables;
30
+ }>;
@@ -0,0 +1,6 @@
1
+ export declare const varsResolver: import("../..").VarsResolver<{
2
+ props: import("./blockquote.types").BlockquoteProps;
3
+ ref: HTMLQuoteElement;
4
+ stylesNames: import("./blockquote.types").BlockquoteStylesNames;
5
+ vars: import("./blockquote.types").BlockquoteCssVariables;
6
+ }>;
@@ -0,0 +1,6 @@
1
+ import { SFCWithInstallAndClasses } from '../../core';
2
+ import Blockquote from './blockquote.vue';
3
+ import classes from './blockquote.module.css';
4
+ export declare const CBlockquote: SFCWithInstallAndClasses<typeof Blockquote, typeof classes>;
5
+ export default CBlockquote;
6
+ export * from './blockquote.types';
@@ -0,0 +1,17 @@
1
+ import { BoxProps, CColor, ElementProps, Factory, StylesApiProps } from '../../core';
2
+ export type CodeStylesNames = 'root';
3
+ export type CodeCssVariables = {
4
+ root: '--code-bg';
5
+ };
6
+ export interface CodeProps extends BoxProps, StylesApiProps<CodeFactory>, /* @vue-ignore */ ElementProps<'code'> {
7
+ /** Key of `theme.colors` or any valid CSS color, controls `background-color` of the code. By default, calculated based on the color scheme. */
8
+ color?: CColor;
9
+ /** If set, code is rendered in `pre` */
10
+ block?: boolean;
11
+ }
12
+ export type CodeFactory = Factory<{
13
+ props: CodeProps;
14
+ ref: HTMLElement;
15
+ stylesNames: CodeStylesNames;
16
+ vars: CodeCssVariables;
17
+ }>;
@@ -0,0 +1,6 @@
1
+ export declare const varsResolver: import("../..").VarsResolver<{
2
+ props: import("./code.types").CodeProps;
3
+ ref: HTMLElement;
4
+ stylesNames: import("./code.types").CodeStylesNames;
5
+ vars: import("./code.types").CodeCssVariables;
6
+ }>;
@@ -0,0 +1,6 @@
1
+ import { SFCWithInstallAndClasses } from '../../core';
2
+ import classes from './code.module.css';
3
+ import Code from './code.vue';
4
+ export declare const CCode: SFCWithInstallAndClasses<typeof Code, typeof classes>;
5
+ export default CCode;
6
+ export * from './code.types';
@@ -6,12 +6,14 @@ export * from './aspect-ratio';
6
6
  export * from './avatar';
7
7
  export * from './background-image';
8
8
  export * from './badge';
9
+ export * from './blockquote';
9
10
  export * from './breadcrumbs';
10
11
  export * from './burger';
11
12
  export * from './button';
12
13
  export * from './card';
13
14
  export * from './center';
14
15
  export * from './close-button';
16
+ export * from './code';
15
17
  export * from './color-swatch';
16
18
  export * from './container';
17
19
  export * from './copy-button';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cck-ui/core",
3
- "version": "0.39.0",
3
+ "version": "0.41.0",
4
4
  "description": "Vue component library focused on usability, accessibility and developer experience",
5
5
  "homepage": "https://cck-ui.jackatlas.xyz",
6
6
  "license": "ISC",
@@ -0,0 +1,42 @@
1
+ .m_195949e0 {
2
+ --blockquote-border: 3px solid var(--bq-bd);
3
+
4
+ position: relative;
5
+ margin: 0;
6
+ text-wrap: var(--bq-text-wrap, var(--c-text-wrap));
7
+ border-inline-start: var(--blockquote-border);
8
+ border-start-end-radius: var(--bq-radius);
9
+ border-end-end-radius: var(--bq-radius);
10
+ padding: var(--c-spacing-xl) calc(2.375rem * var(--c-scale));
11
+ }
12
+
13
+ :where([data-c-color-scheme='light']) .m_195949e0 {
14
+ background-color: var(--bq-bg-light);
15
+ }
16
+
17
+ :where([data-c-color-scheme='dark']) .m_195949e0 {
18
+ background-color: var(--bq-bg-dark);
19
+ }
20
+
21
+ .m_19550577 {
22
+ --blockquote-icon-offset: calc(var(--bq-icon-size) / -2);
23
+
24
+ position: absolute;
25
+ color: var(--bq-bd);
26
+ background-color: var(--c-color-body);
27
+ display: flex;
28
+ align-items: center;
29
+ justify-content: center;
30
+ top: var(--blockquote-icon-offset);
31
+ inset-inline-start: var(--blockquote-icon-offset);
32
+ width: var(--bq-icon-size);
33
+ height: var(--bq-icon-size);
34
+ border-radius: var(--bq-icon-size);
35
+ }
36
+
37
+ .m_19526255 {
38
+ display: block;
39
+ margin-top: var(--c-spacing-md);
40
+ opacity: 0.6;
41
+ font-size: 85%;
42
+ }