@cck-ui/core 0.18.5 → 0.20.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 (39) hide show
  1. package/cjs/components/copy-button/copy-button.cjs +59 -0
  2. package/cjs/components/copy-button/copy-button.cjs.map +1 -0
  3. package/cjs/components/copy-button/index.cjs +10 -0
  4. package/cjs/components/copy-button/index.cjs.map +1 -0
  5. package/cjs/components/image/image.cjs +429 -0
  6. package/cjs/components/image/image.cjs.map +1 -0
  7. package/cjs/components/image/image.module.cjs +7 -0
  8. package/cjs/components/image/image.module.cjs.map +1 -0
  9. package/cjs/components/image/image.utils.cjs +11 -0
  10. package/cjs/components/image/image.utils.cjs.map +1 -0
  11. package/cjs/components/image/index.cjs +14 -0
  12. package/cjs/components/image/index.cjs.map +1 -0
  13. package/cjs/index.cjs +54 -48
  14. package/cjs/index.cjs.map +1 -1
  15. package/esm/components/copy-button/copy-button.mjs +59 -0
  16. package/esm/components/copy-button/copy-button.mjs.map +1 -0
  17. package/esm/components/copy-button/index.mjs +9 -0
  18. package/esm/components/copy-button/index.mjs.map +1 -0
  19. package/esm/components/image/image.mjs +429 -0
  20. package/esm/components/image/image.mjs.map +1 -0
  21. package/esm/components/image/image.module.mjs +7 -0
  22. package/esm/components/image/image.module.mjs.map +1 -0
  23. package/esm/components/image/image.utils.mjs +12 -0
  24. package/esm/components/image/image.utils.mjs.map +1 -0
  25. package/esm/components/image/index.mjs +11 -0
  26. package/esm/components/image/index.mjs.map +1 -0
  27. package/esm/index.mjs +5 -1
  28. package/esm/index.mjs.map +1 -1
  29. package/lib/components/copy-button/copy-button.types.d.ts +11 -0
  30. package/lib/components/copy-button/index.d.ts +3 -0
  31. package/lib/components/image/image.types.d.ts +33 -0
  32. package/lib/components/image/image.utils.d.ts +7 -0
  33. package/lib/components/image/index.d.ts +6 -0
  34. package/lib/components/index.d.ts +2 -0
  35. package/package.json +1 -1
  36. package/styles/image.css +6 -0
  37. package/styles/image.layer.css +7 -0
  38. package/styles.css +7 -0
  39. package/styles.layer.css +7 -0
package/cjs/index.cjs CHANGED
@@ -66,18 +66,20 @@ const require_index$9 = require("./components/aspect-ratio/index.cjs");
66
66
  const require_index$10 = require("./components/button/index.cjs");
67
67
  const require_index$11 = require("./components/center/index.cjs");
68
68
  const require_index$12 = require("./components/container/index.cjs");
69
- const require_index$13 = require("./components/empty-state/index.cjs");
70
- const require_index$14 = require("./components/flex/index.cjs");
71
- const require_index$15 = require("./components/grid/index.cjs");
72
- const require_index$16 = require("./components/group/index.cjs");
73
- const require_index$17 = require("./components/paper/index.cjs");
74
- const require_index$18 = require("./components/semi-circle-progress/index.cjs");
75
- const require_index$19 = require("./components/simple-grid/index.cjs");
76
- const require_index$20 = require("./components/skeleton/index.cjs");
77
- const require_index$21 = require("./components/space/index.cjs");
78
- const require_index$22 = require("./components/splitter/index.cjs");
79
- const require_index$23 = require("./components/stack/index.cjs");
80
- const require_index$24 = require("./components/text/index.cjs");
69
+ const require_index$13 = require("./components/copy-button/index.cjs");
70
+ const require_index$14 = require("./components/empty-state/index.cjs");
71
+ const require_index$15 = require("./components/flex/index.cjs");
72
+ const require_index$16 = require("./components/grid/index.cjs");
73
+ const require_index$17 = require("./components/group/index.cjs");
74
+ const require_index$18 = require("./components/image/index.cjs");
75
+ const require_index$19 = require("./components/paper/index.cjs");
76
+ const require_index$20 = require("./components/semi-circle-progress/index.cjs");
77
+ const require_index$21 = require("./components/simple-grid/index.cjs");
78
+ const require_index$22 = require("./components/skeleton/index.cjs");
79
+ const require_index$23 = require("./components/space/index.cjs");
80
+ const require_index$24 = require("./components/splitter/index.cjs");
81
+ const require_index$25 = require("./components/stack/index.cjs");
82
+ const require_index$26 = require("./components/text/index.cjs");
81
83
  let _vue_shared = require("@vue/shared");
82
84
  //#region packages/@cck-ui/core/src/index.ts
83
85
  const INSTALLED_KEY = Symbol("INSTALLED_KEY");
@@ -94,26 +96,28 @@ const components = [
94
96
  require_index$10.CButtonGroupSection,
95
97
  require_index$11.CCenter,
96
98
  require_index$7.CCloseButton,
97
- require_index$15.CCol,
99
+ require_index$16.CCol,
98
100
  require_index$12.CContainer,
99
- require_index$13.CEmptyState,
100
- require_index$13.CEmptyStateActions,
101
- require_index$13.CEmptyStateDescription,
102
- require_index$13.CEmptyStateIndicator,
103
- require_index$13.CEmptyStateTitle,
104
- require_index$14.CFlex,
105
- require_index$15.CGrid,
106
- require_index$16.CGroup,
101
+ require_index$13.CCopyButton,
102
+ require_index$14.CEmptyState,
103
+ require_index$14.CEmptyStateActions,
104
+ require_index$14.CEmptyStateDescription,
105
+ require_index$14.CEmptyStateIndicator,
106
+ require_index$14.CEmptyStateTitle,
107
+ require_index$15.CFlex,
108
+ require_index$16.CGrid,
109
+ require_index$17.CGroup,
110
+ require_index$18.CImage,
107
111
  require_index$4.CLoader,
108
- require_index$17.CPaper,
109
- require_index$18.CSemiCircleProgress,
110
- require_index$19.CSimpleGrid,
111
- require_index$20.CSkeleton,
112
- require_index$21.CSpace,
113
- require_index$22.CSplitter,
114
- require_index$22.CSplitterPane,
115
- require_index$23.CStack,
116
- require_index$24.CText,
112
+ require_index$19.CPaper,
113
+ require_index$20.CSemiCircleProgress,
114
+ require_index$21.CSimpleGrid,
115
+ require_index$22.CSkeleton,
116
+ require_index$23.CSpace,
117
+ require_index$24.CSplitter,
118
+ require_index$24.CSplitterPane,
119
+ require_index$25.CStack,
120
+ require_index$26.CText,
117
121
  require_index$5.CTransition,
118
122
  require_index$3.UnstyledButton
119
123
  ];
@@ -137,28 +141,30 @@ exports.CButtonGroupSection = require_index$10.CButtonGroupSection;
137
141
  exports.CCK_TRANSITIONS = require_transitions.transitions;
138
142
  exports.CCenter = require_index$11.CCenter;
139
143
  exports.CCloseButton = require_index$7.CCloseButton;
140
- exports.CCol = require_index$15.CCol;
144
+ exports.CCol = require_index$16.CCol;
141
145
  exports.CContainer = require_index$12.CContainer;
146
+ exports.CCopyButton = require_index$13.CCopyButton;
142
147
  exports.CDefaultLoaders = require_index$4.CDefaultLoaders;
143
- exports.CEmptyState = require_index$13.CEmptyState;
144
- exports.CEmptyStateActions = require_index$13.CEmptyStateActions;
145
- exports.CEmptyStateDescription = require_index$13.CEmptyStateDescription;
146
- exports.CEmptyStateIndicator = require_index$13.CEmptyStateIndicator;
147
- exports.CEmptyStateTitle = require_index$13.CEmptyStateTitle;
148
- exports.CFlex = require_index$14.CFlex;
149
- exports.CGrid = require_index$15.CGrid;
150
- exports.CGroup = require_index$16.CGroup;
148
+ exports.CEmptyState = require_index$14.CEmptyState;
149
+ exports.CEmptyStateActions = require_index$14.CEmptyStateActions;
150
+ exports.CEmptyStateDescription = require_index$14.CEmptyStateDescription;
151
+ exports.CEmptyStateIndicator = require_index$14.CEmptyStateIndicator;
152
+ exports.CEmptyStateTitle = require_index$14.CEmptyStateTitle;
153
+ exports.CFlex = require_index$15.CFlex;
154
+ exports.CGrid = require_index$16.CGrid;
155
+ exports.CGroup = require_index$17.CGroup;
156
+ exports.CImage = require_index$18.CImage;
151
157
  exports.CLoader = require_index$4.CLoader;
152
158
  exports.CONFIG_KEY = require_config_provider_types.CONFIG_KEY;
153
- exports.CPaper = require_index$17.CPaper;
154
- exports.CSemiCircleProgress = require_index$18.CSemiCircleProgress;
155
- exports.CSimpleGrid = require_index$19.CSimpleGrid;
156
- exports.CSkeleton = require_index$20.CSkeleton;
157
- exports.CSpace = require_index$21.CSpace;
158
- exports.CSplitter = require_index$22.CSplitter;
159
- exports.CSplitterPane = require_index$22.CSplitterPane;
160
- exports.CStack = require_index$23.CStack;
161
- exports.CText = require_index$24.CText;
159
+ exports.CPaper = require_index$19.CPaper;
160
+ exports.CSemiCircleProgress = require_index$20.CSemiCircleProgress;
161
+ exports.CSimpleGrid = require_index$21.CSimpleGrid;
162
+ exports.CSkeleton = require_index$22.CSkeleton;
163
+ exports.CSpace = require_index$23.CSpace;
164
+ exports.CSplitter = require_index$24.CSplitter;
165
+ exports.CSplitterPane = require_index$24.CSplitterPane;
166
+ exports.CStack = require_index$25.CStack;
167
+ exports.CText = require_index$26.CText;
162
168
  exports.CTransition = require_index$5.CTransition;
163
169
  exports.CckConfigProvider = require_index$1.CckConfigProvider;
164
170
  exports.CckUI = CckUI;
package/cjs/index.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","names":["CckConfigProvider","CBox","CActionIcon","CActionIconGroup","CActionIconGroupSection","CAlert","CAspectRatio","CButton","CButtonGroup","CButtonGroupSection","CCenter","CCloseButton","CCol","CContainer","CEmptyState","CEmptyStateActions","CEmptyStateDescription","CEmptyStateIndicator","CEmptyStateTitle","CFlex","CGrid","CGroup","CLoader","CPaper","CSemiCircleProgress","CSimpleGrid","CSkeleton","CSpace","CSplitter","CSplitterPane","CStack","CText","CTransition","UnstyledButton"],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n CActionIcon,\n CActionIconGroup,\n CActionIconGroupSection,\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 CActionIcon,\n CActionIconGroup,\n CActionIconGroupSection,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjBA,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,gBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,gBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;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
+ {"version":3,"file":"index.cjs","names":["CckConfigProvider","CBox","CActionIcon","CActionIconGroup","CActionIconGroupSection","CAlert","CAspectRatio","CButton","CButtonGroup","CButtonGroupSection","CCenter","CCloseButton","CCol","CContainer","CCopyButton","CEmptyState","CEmptyStateActions","CEmptyStateDescription","CEmptyStateIndicator","CEmptyStateTitle","CFlex","CGrid","CGroup","CImage","CLoader","CPaper","CSemiCircleProgress","CSimpleGrid","CSkeleton","CSpace","CSplitter","CSplitterPane","CStack","CText","CTransition","UnstyledButton"],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n CActionIcon,\n CActionIconGroup,\n CActionIconGroupSection,\n CAlert,\n CAspectRatio,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCenter,\n CCloseButton,\n CCol,\n CContainer,\n CCopyButton,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFlex,\n CGrid,\n CGroup,\n CImage,\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 CActionIcon,\n CActionIconGroup,\n CActionIconGroupSection,\n CAlert,\n CAspectRatio,\n CButton,\n CButtonGroup,\n CButtonGroupSection,\n CCenter,\n CCloseButton,\n CCol,\n CContainer,\n CCopyButton,\n CEmptyState,\n CEmptyStateActions,\n CEmptyStateDescription,\n CEmptyStateIndicator,\n CEmptyStateTitle,\n CFlex,\n CGrid,\n CGroup,\n CImage,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjBA,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,gBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,gBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,gBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;CACAC,iBAAAA;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"}
@@ -0,0 +1,59 @@
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 { computed, defineComponent, renderSlot } from "vue";
5
+ import { useClipboard } from "@cck-ui/hooks";
6
+ //#region packages/@cck-ui/core/src/components/copy-button/copy-button.vue
7
+ const _sfc_main = /*@__PURE__*/ defineComponent({
8
+ name: "CCopyButton",
9
+ __name: "copy-button",
10
+ props: {
11
+ timeout: {
12
+ type: Number,
13
+ required: false
14
+ },
15
+ value: {
16
+ type: String,
17
+ required: true
18
+ }
19
+ },
20
+ setup(__props, { expose: __expose }) {
21
+ __expose();
22
+ const rawProps = __props;
23
+ const defaultProps = { timeout: 1e3 };
24
+ const props = useComponentProps({
25
+ component: "CCopyButton",
26
+ defaultProps,
27
+ props: rawProps
28
+ });
29
+ const clipboard = useClipboard({ copiedDuring: props.value.timeout });
30
+ const copied = computed(() => clipboard.copied.value);
31
+ const copy = async () => {
32
+ await clipboard.copy(props.value.value);
33
+ };
34
+ const __returned__ = {
35
+ rawProps,
36
+ defaultProps,
37
+ props,
38
+ clipboard,
39
+ copied,
40
+ copy
41
+ };
42
+ Object.defineProperty(__returned__, "__isScriptSetup", {
43
+ enumerable: false,
44
+ value: true
45
+ });
46
+ return __returned__;
47
+ }
48
+ });
49
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
50
+ return renderSlot(_ctx.$slots, "default", {
51
+ copied: $setup.copied,
52
+ copy: $setup.copy
53
+ });
54
+ }
55
+ var copy_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/copy-button/copy-button.vue"]]);
56
+ //#endregion
57
+ export { copy_button_default as default };
58
+
59
+ //# sourceMappingURL=copy-button.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"copy-button.mjs","names":[],"sources":["../../../src/components/copy-button/copy-button.vue"],"sourcesContent":["<template>\n <slot :copied=\"copied\" :copy=\"copy\" />\n</template>\n\n<script setup lang=\"ts\">\nimport { useClipboard } from '@cck-ui/hooks'\nimport { useComponentProps } from '../../core'\nimport { CopyButtonProps } from './copy-button.types'\nimport { computed } from 'vue'\n\ndefineOptions({\n name: 'CCopyButton',\n})\n\nconst rawProps = defineProps<CopyButtonProps>()\n\nconst defaultProps = {\n timeout: 1000,\n} satisfies Partial<CopyButtonProps>\n\nconst props = useComponentProps({\n component: 'CCopyButton',\n defaultProps,\n props: rawProps,\n})\n\nconst clipboard = useClipboard({ copiedDuring: props.value.timeout })\nconst copied = computed(() => clipboard.copied.value)\nconst copy = async () => {\n await clipboard.copy(props.value.value)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAcA,MAAM,WAAW;EAEjB,MAAM,eAAe,EACnB,SAAS,IACX;EAEA,MAAM,QAAQ,kBAAkB;GAC9B,WAAW;GACX;GACA,OAAO;EACT,CAAC;EAED,MAAM,YAAY,aAAa,EAAE,cAAc,MAAM,MAAM,QAAQ,CAAC;EACpE,MAAM,SAAS,eAAe,UAAU,OAAO,KAAK;EACpD,MAAM,OAAO,YAAY;GACvB,MAAM,UAAU,KAAK,MAAM,MAAM,KAAK;EACxC;;;;;;;;;;;;;;;;;QA7BE,WAAsC,KAAA,QAAA,WAAA;EAA/B,QAAQ,OAAA;EAAS,MAAM,OAAA"}
@@ -0,0 +1,9 @@
1
+ "use client";
2
+ import { withInstall } from "../../core/utils/vue/install.mjs";
3
+ import copy_button_default from "./copy-button.mjs";
4
+ //#region packages/@cck-ui/core/src/components/copy-button/index.ts
5
+ const CCopyButton = withInstall(copy_button_default);
6
+ //#endregion
7
+ export { CCopyButton, CCopyButton as default };
8
+
9
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mjs","names":["CopyButton"],"sources":["../../../src/components/copy-button/index.ts"],"sourcesContent":["import { withInstall } from '../../core'\nimport CopyButton from './copy-button.vue'\n\nexport const CCopyButton = withInstall(CopyButton)\n\nexport default CCopyButton\n\nexport * from './copy-button.types'\n"],"mappings":";;;;AAGA,MAAa,cAAc,YAAYA,mBAAU"}
@@ -0,0 +1,429 @@
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 "./image.utils.mjs";
7
+ import image_module_default from "./image.module.mjs";
8
+ import { computed, createBlock, defineComponent, mergeProps, openBlock, ref, useAttrs, watch } from "vue";
9
+ //#region packages/@cck-ui/core/src/components/image/image.vue
10
+ const _sfc_main = /*@__PURE__*/ defineComponent({
11
+ name: "CImage",
12
+ __name: "image",
13
+ props: {
14
+ radius: {
15
+ type: null,
16
+ required: false
17
+ },
18
+ fit: {
19
+ type: null,
20
+ required: false
21
+ },
22
+ fallbackSrc: {
23
+ type: String,
24
+ required: false
25
+ },
26
+ src: {
27
+ type: null,
28
+ required: false
29
+ },
30
+ className: {
31
+ type: String,
32
+ required: false
33
+ },
34
+ style: {
35
+ type: [
36
+ Object,
37
+ Function,
38
+ Array
39
+ ],
40
+ required: false,
41
+ skipCheck: true
42
+ },
43
+ __vars: {
44
+ type: null,
45
+ required: false
46
+ },
47
+ __size: {
48
+ type: String,
49
+ required: false
50
+ },
51
+ hiddenFrom: {
52
+ type: null,
53
+ required: false
54
+ },
55
+ visibleFrom: {
56
+ type: null,
57
+ required: false
58
+ },
59
+ lightHidden: {
60
+ type: Boolean,
61
+ required: false
62
+ },
63
+ darkHidden: {
64
+ type: Boolean,
65
+ required: false
66
+ },
67
+ mod: {
68
+ type: [
69
+ Object,
70
+ String,
71
+ Array
72
+ ],
73
+ required: false
74
+ },
75
+ m: {
76
+ type: null,
77
+ required: false
78
+ },
79
+ my: {
80
+ type: null,
81
+ required: false
82
+ },
83
+ mx: {
84
+ type: null,
85
+ required: false
86
+ },
87
+ mt: {
88
+ type: null,
89
+ required: false
90
+ },
91
+ mb: {
92
+ type: null,
93
+ required: false
94
+ },
95
+ ms: {
96
+ type: null,
97
+ required: false
98
+ },
99
+ me: {
100
+ type: null,
101
+ required: false
102
+ },
103
+ mis: {
104
+ type: null,
105
+ required: false
106
+ },
107
+ mie: {
108
+ type: null,
109
+ required: false
110
+ },
111
+ ml: {
112
+ type: null,
113
+ required: false
114
+ },
115
+ mr: {
116
+ type: null,
117
+ required: false
118
+ },
119
+ p: {
120
+ type: null,
121
+ required: false
122
+ },
123
+ py: {
124
+ type: null,
125
+ required: false
126
+ },
127
+ px: {
128
+ type: null,
129
+ required: false
130
+ },
131
+ pt: {
132
+ type: null,
133
+ required: false
134
+ },
135
+ pb: {
136
+ type: null,
137
+ required: false
138
+ },
139
+ ps: {
140
+ type: null,
141
+ required: false
142
+ },
143
+ pe: {
144
+ type: null,
145
+ required: false
146
+ },
147
+ pis: {
148
+ type: null,
149
+ required: false
150
+ },
151
+ pie: {
152
+ type: null,
153
+ required: false
154
+ },
155
+ pl: {
156
+ type: null,
157
+ required: false
158
+ },
159
+ pr: {
160
+ type: null,
161
+ required: false
162
+ },
163
+ bd: {
164
+ type: null,
165
+ required: false
166
+ },
167
+ bdrs: {
168
+ type: null,
169
+ required: false
170
+ },
171
+ bg: {
172
+ type: null,
173
+ required: false
174
+ },
175
+ c: {
176
+ type: null,
177
+ required: false
178
+ },
179
+ opacity: {
180
+ type: [
181
+ String,
182
+ Object,
183
+ Number
184
+ ],
185
+ required: false
186
+ },
187
+ ff: {
188
+ type: [String, Object],
189
+ required: false
190
+ },
191
+ fz: {
192
+ type: null,
193
+ required: false
194
+ },
195
+ fw: {
196
+ type: null,
197
+ required: false
198
+ },
199
+ lts: {
200
+ type: null,
201
+ required: false
202
+ },
203
+ ta: {
204
+ type: [String, Object],
205
+ required: false
206
+ },
207
+ lh: {
208
+ type: null,
209
+ required: false
210
+ },
211
+ fs: {
212
+ type: null,
213
+ required: false
214
+ },
215
+ tt: {
216
+ type: [String, Object],
217
+ required: false
218
+ },
219
+ td: {
220
+ type: null,
221
+ required: false
222
+ },
223
+ w: {
224
+ type: null,
225
+ required: false
226
+ },
227
+ miw: {
228
+ type: null,
229
+ required: false
230
+ },
231
+ maw: {
232
+ type: null,
233
+ required: false
234
+ },
235
+ h: {
236
+ type: null,
237
+ required: false
238
+ },
239
+ mih: {
240
+ type: null,
241
+ required: false
242
+ },
243
+ mah: {
244
+ type: null,
245
+ required: false
246
+ },
247
+ bgsz: {
248
+ type: null,
249
+ required: false
250
+ },
251
+ bgp: {
252
+ type: null,
253
+ required: false
254
+ },
255
+ bgr: {
256
+ type: null,
257
+ required: false
258
+ },
259
+ bga: {
260
+ type: null,
261
+ required: false
262
+ },
263
+ pos: {
264
+ type: [String, Object],
265
+ required: false
266
+ },
267
+ top: {
268
+ type: null,
269
+ required: false
270
+ },
271
+ left: {
272
+ type: null,
273
+ required: false
274
+ },
275
+ bottom: {
276
+ type: null,
277
+ required: false
278
+ },
279
+ right: {
280
+ type: null,
281
+ required: false
282
+ },
283
+ inset: {
284
+ type: null,
285
+ required: false
286
+ },
287
+ display: {
288
+ type: null,
289
+ required: false
290
+ },
291
+ flex: {
292
+ type: null,
293
+ required: false
294
+ },
295
+ unstyled: {
296
+ type: Boolean,
297
+ required: false
298
+ },
299
+ variant: {
300
+ type: null,
301
+ required: false
302
+ },
303
+ classNames: {
304
+ type: null,
305
+ required: false
306
+ },
307
+ styles: {
308
+ type: null,
309
+ required: false
310
+ },
311
+ vars: {
312
+ type: Function,
313
+ required: false
314
+ },
315
+ attributes: {
316
+ type: null,
317
+ required: false
318
+ }
319
+ },
320
+ emits: ["error"],
321
+ setup(__props, { expose: __expose, emit: __emit }) {
322
+ const emits = __emit;
323
+ const _root = ref(null);
324
+ const attrs = useAttrs();
325
+ const rawProps = __props;
326
+ const props = useComponentProps({
327
+ component: "CImage",
328
+ defaultProps: {},
329
+ props: rawProps
330
+ });
331
+ const knownProps = [
332
+ "classNames",
333
+ "className",
334
+ "style",
335
+ "styles",
336
+ "unstyled",
337
+ "vars",
338
+ "src",
339
+ "radius",
340
+ "fit",
341
+ "fallbackSrc",
342
+ "mod",
343
+ "attributes"
344
+ ];
345
+ const getStyles = useStyles({
346
+ name: "Image",
347
+ classes: image_module_default,
348
+ props: {
349
+ ...props.value,
350
+ ...attrs
351
+ },
352
+ className: props.value.className,
353
+ classNames: props.value.classNames,
354
+ style: props.value.style,
355
+ styles: props.value.styles,
356
+ unstyled: props.value.unstyled,
357
+ attributes: props.value.attributes,
358
+ vars: props.value.vars,
359
+ varsResolver
360
+ });
361
+ const hasError = ref(!props.value.src);
362
+ watch(() => props.value.src, (newSrc) => {
363
+ hasError.value = !newSrc;
364
+ });
365
+ const currentSrc = computed(() => {
366
+ if (hasError.value && props.value.fallbackSrc) return props.value.fallbackSrc;
367
+ return props.value.src;
368
+ });
369
+ const handleError = (event) => {
370
+ emits("error", event);
371
+ hasError.value = true;
372
+ };
373
+ const modList = computed(() => {
374
+ if (hasError.value && props.value.fallbackSrc) return ["fallback"];
375
+ return [];
376
+ });
377
+ const rootAttrs = computed(() => getStyles("root"));
378
+ const mergedAttrs = computed(() => {
379
+ const others = {};
380
+ const propsValue = props.value;
381
+ for (const key in propsValue) if (!knownProps.includes(key)) others[key] = propsValue[key];
382
+ const userMod = props.value.mod;
383
+ const mergedMod = [...Array.isArray(userMod) ? userMod : [userMod].filter(Boolean), ...modList.value || []];
384
+ return {
385
+ ...others,
386
+ mod: mergedMod,
387
+ ...rootAttrs.value
388
+ };
389
+ });
390
+ __expose({ root: computed(() => _root.value?.root ?? null) });
391
+ const __returned__ = {
392
+ emits,
393
+ _root,
394
+ attrs,
395
+ rawProps,
396
+ props,
397
+ knownProps,
398
+ getStyles,
399
+ hasError,
400
+ currentSrc,
401
+ handleError,
402
+ modList,
403
+ rootAttrs,
404
+ mergedAttrs,
405
+ get CBox() {
406
+ return CBox;
407
+ }
408
+ };
409
+ Object.defineProperty(__returned__, "__isScriptSetup", {
410
+ enumerable: false,
411
+ value: true
412
+ });
413
+ return __returned__;
414
+ }
415
+ });
416
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
417
+ return openBlock(), createBlock($setup["CBox"], mergeProps({
418
+ ref: "_root",
419
+ tag: "img"
420
+ }, $setup.mergedAttrs, {
421
+ src: $setup.currentSrc,
422
+ onError: $setup.handleError
423
+ }), null, 16, ["src"]);
424
+ }
425
+ var image_default = /*#__PURE__*/ export_helper_default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/components/image/image.vue"]]);
426
+ //#endregion
427
+ export { image_default as default };
428
+
429
+ //# sourceMappingURL=image.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"image.mjs","names":[],"sources":["../../../src/components/image/image.vue"],"sourcesContent":["<template>\n <c-box ref=\"_root\" tag=\"img\" v-bind=\"mergedAttrs\" :src=\"currentSrc\" @error=\"handleError\"></c-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useAttrs, watch } from 'vue'\nimport { CBox, useComponentProps, useStyles } from '../../core'\nimport { ImageFactory, ImageProps } from './image.types'\nimport { varsResolver } from './image.utils'\nimport classes from './image.module.css'\n\ndefineOptions({\n name: 'CImage',\n})\n\nconst emits = defineEmits<{\n error: [event: Event]\n}>()\n\nconst _root = ref<InstanceType<typeof CBox> | null>(null)\n\nconst attrs = useAttrs()\n\nconst rawProps = defineProps<ImageProps>()\n\nconst props = useComponentProps({\n component: 'CImage',\n defaultProps: {},\n props: rawProps,\n})\n\nconst knownProps = [\n 'classNames',\n 'className',\n 'style',\n 'styles',\n 'unstyled',\n 'vars',\n 'src',\n 'radius',\n 'fit',\n 'fallbackSrc',\n 'mod',\n 'attributes',\n]\n\nconst getStyles = useStyles<ImageFactory>({\n name: 'Image',\n classes,\n props: { ...props.value, ...attrs } as ImageProps,\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 hasError = ref(!props.value.src)\n\nwatch(\n () => props.value.src,\n (newSrc) => {\n hasError.value = !newSrc\n }\n)\n\nconst currentSrc = computed(() => {\n if (hasError.value && props.value.fallbackSrc) {\n return props.value.fallbackSrc\n }\n return props.value.src\n})\n\nconst handleError = (event: Event) => {\n emits('error', event)\n hasError.value = true\n}\n\nconst modList = computed(() => {\n if (hasError.value && props.value.fallbackSrc) {\n return ['fallback']\n }\n return []\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAeA,MAAM,QAAQ;EAId,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,YAAY,UAAwB;GACxC,MAAM;GACN,SAAA;GACA,OAAO;IAAE,GAAG,MAAM;IAAO,GAAG;GAAM;GAClC,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,WAAW,IAAI,CAAC,MAAM,MAAM,GAAG;EAErC,YACQ,MAAM,MAAM,MACjB,WAAW;GACV,SAAS,QAAQ,CAAC;EACpB,CACF;EAEA,MAAM,aAAa,eAAe;GAChC,IAAI,SAAS,SAAS,MAAM,MAAM,aAChC,OAAO,MAAM,MAAM;GAErB,OAAO,MAAM,MAAM;EACrB,CAAC;EAED,MAAM,eAAe,UAAiB;GACpC,MAAM,SAAS,KAAK;GACpB,SAAS,QAAQ;EACnB;EAEA,MAAM,UAAU,eAAe;GAC7B,IAAI,SAAS,SAAS,MAAM,MAAM,aAChC,OAAO,CAAC,UAAU;GAEpB,OAAO,CAAC;EACV,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;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA3GC,YAAiG,OAAA,SAAjG,WAAiG;EAA1F,KAAI;EAAQ,KAAI;IAAc,OAAA,aAAW;EAAG,KAAK,OAAA;EAAa,SAAO,OAAA"}
@@ -0,0 +1,7 @@
1
+ "use client";
2
+ //#region packages/@cck-ui/core/src/components/image/image.module.css
3
+ var image_module_default = { "root": "m_273f9a14" };
4
+ //#endregion
5
+ export { image_module_default as default };
6
+
7
+ //# sourceMappingURL=image.module.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"image.module.mjs","names":[],"sources":["../../../src/components/image/image.module.css"],"sourcesContent":[".root {\n display: block;\n object-fit: var(--image-object-fit, cover);\n width: 100%;\n border-radius: var(--image-radius, 0);\n}\n"],"mappings":";;AAAA,IAAA,uBAAe,EAAC,QAAO,aAAY"}
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ import { getRadius } 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/image/image.utils.ts
5
+ const varsResolver = createVarsResolver((_, { radius, fit }) => ({ root: {
6
+ "--image-object-fit": fit,
7
+ "--image-radius": radius === void 0 ? void 0 : getRadius(radius)
8
+ } }));
9
+ //#endregion
10
+ export { varsResolver };
11
+
12
+ //# sourceMappingURL=image.utils.mjs.map