@oneclick.dev/cms-core-modules 0.0.111 → 0.0.113
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{Components-DXbx0RLV.js → Components-6gTTI_u-.js} +1 -1
- package/dist/{Components-C83O-xlF.mjs → Components-iU3ZaJm5.mjs} +32 -32
- package/dist/{ContentEditor-pZPfo0qN.mjs → ContentEditor-C5yNNLeV.mjs} +8385 -7934
- package/dist/{ContentEditor-tYkh4vRV.js → ContentEditor-MctMvN7D.js} +51 -51
- package/dist/{GlobalStyling-C9VthHWK.mjs → GlobalStyling-Bp2PiOWt.mjs} +648 -502
- package/dist/GlobalStyling-fRjfDDeO.js +25 -0
- package/dist/TableView-CVfkyj1k.js +4 -0
- package/dist/{TableView-Bf1fdJrD.mjs → TableView-zDx0IegJ.mjs} +1938 -2001
- package/dist/cms-core-modules.css +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.mjs +4 -4
- package/dist/src/contentManager/components/content-editor/tiptap-extensions/Icon.d.ts +15 -0
- package/dist/src/contentManager/components/content-editor/tiptap-extensions/Icon.vue.d.ts +92 -0
- package/dist/src/contentManager/components/content-editor/tiptap-extensions/helpers/iconOptions.d.ts +22 -0
- package/dist/src/contentManager/components/content-editor/tiptap-menus/element-editor-views/IconMenu.vue.d.ts +16 -0
- package/dist/src/contentManager/components/content-editor/tiptap-menus/element-editor-views/index.d.ts +17 -0
- package/dist/src/table/components/date-range-filter/DateRangeSettingsDialog.vue.d.ts +0 -9
- package/package.json +2 -2
- package/dist/GlobalStyling-CnSlXkZc.js +0 -25
- package/dist/TableView-DNcXyIMu.js +0 -4
package/dist/index.mjs
CHANGED
|
@@ -54,7 +54,7 @@ const I = "data:image/webp;base64,UklGRg5VAABXRUJQVlA4WAoAAAAMAAAA4wAA4wAAVlA4IJ
|
|
|
54
54
|
default: !1
|
|
55
55
|
}
|
|
56
56
|
}), l = [
|
|
57
|
-
{ path: "", component: () => import("./TableView-
|
|
57
|
+
{ path: "", component: () => import("./TableView-zDx0IegJ.mjs") }
|
|
58
58
|
], p = [], rA = {
|
|
59
59
|
component: () => import("./index-Bkq58CeQ.mjs"),
|
|
60
60
|
metadata: C,
|
|
@@ -557,9 +557,9 @@ const I = "data:image/webp;base64,UklGRg5VAABXRUJQVlA4WAoAAAAMAAAA4wAA4wAAVlA4IJ
|
|
|
557
557
|
{ path: "", component: () => import("./Overview-lWAyyenp.mjs") },
|
|
558
558
|
{ path: "/collections", component: () => import("./Overview-lWAyyenp.mjs") },
|
|
559
559
|
{ path: "/collections/:collectionId", component: () => import("./Entries-BdhUyJR5.mjs") },
|
|
560
|
-
{ path: "/collections/:collectionId/:entryId", component: () => import("./ContentEditor-
|
|
561
|
-
{ path: "/components", component: () => import("./Components-
|
|
562
|
-
{ path: "/global-styling", component: () => import("./GlobalStyling-
|
|
560
|
+
{ path: "/collections/:collectionId/:entryId", component: () => import("./ContentEditor-C5yNNLeV.mjs") },
|
|
561
|
+
{ path: "/components", component: () => import("./Components-iU3ZaJm5.mjs") },
|
|
562
|
+
{ path: "/global-styling", component: () => import("./GlobalStyling-Bp2PiOWt.mjs") }
|
|
563
563
|
], q = [
|
|
564
564
|
{ key: "create-content", name: "Create content", description: "Team member can create content" },
|
|
565
565
|
{ key: "edit-content", name: "Edit content", description: "Team member can edit content" },
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { Node } from '@tiptap/core';
|
|
2
|
+
declare module '@tiptap/core' {
|
|
3
|
+
interface Commands<ReturnType> {
|
|
4
|
+
icon: {
|
|
5
|
+
setIcon: (attrs?: any) => ReturnType;
|
|
6
|
+
setIconWidth: (size: number) => ReturnType;
|
|
7
|
+
};
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
type Options = {
|
|
11
|
+
HTMLAttributes: Record<string, any>;
|
|
12
|
+
className: string;
|
|
13
|
+
};
|
|
14
|
+
declare const _default: Node<Options, any>;
|
|
15
|
+
export default _default;
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
declare const _default: import('vue').DefineComponent<globalThis.ExtractPropTypes<{
|
|
2
|
+
editor: {
|
|
3
|
+
type: PropType<import('@tiptap/core').NodeViewProps["editor"]>;
|
|
4
|
+
required: true;
|
|
5
|
+
};
|
|
6
|
+
node: {
|
|
7
|
+
type: PropType<import('@tiptap/core').NodeViewProps["node"]>;
|
|
8
|
+
required: true;
|
|
9
|
+
};
|
|
10
|
+
decorations: {
|
|
11
|
+
type: PropType<import('@tiptap/core').NodeViewProps["decorations"]>;
|
|
12
|
+
required: true;
|
|
13
|
+
};
|
|
14
|
+
selected: {
|
|
15
|
+
type: PropType<import('@tiptap/core').NodeViewProps["selected"]>;
|
|
16
|
+
required: true;
|
|
17
|
+
};
|
|
18
|
+
extension: {
|
|
19
|
+
type: PropType<import('@tiptap/core').NodeViewProps["extension"]>;
|
|
20
|
+
required: true;
|
|
21
|
+
};
|
|
22
|
+
getPos: {
|
|
23
|
+
type: PropType<import('@tiptap/core').NodeViewProps["getPos"]>;
|
|
24
|
+
required: true;
|
|
25
|
+
};
|
|
26
|
+
updateAttributes: {
|
|
27
|
+
type: PropType<import('@tiptap/core').NodeViewProps["updateAttributes"]>;
|
|
28
|
+
required: true;
|
|
29
|
+
};
|
|
30
|
+
deleteNode: {
|
|
31
|
+
type: PropType<import('@tiptap/core').NodeViewProps["deleteNode"]>;
|
|
32
|
+
required: true;
|
|
33
|
+
};
|
|
34
|
+
view: {
|
|
35
|
+
type: PropType<import('@tiptap/core').NodeViewProps["view"]>;
|
|
36
|
+
required: true;
|
|
37
|
+
};
|
|
38
|
+
innerDecorations: {
|
|
39
|
+
type: PropType<import('@tiptap/core').NodeViewProps["innerDecorations"]>;
|
|
40
|
+
required: true;
|
|
41
|
+
};
|
|
42
|
+
HTMLAttributes: {
|
|
43
|
+
type: PropType<import('@tiptap/core').NodeViewProps["HTMLAttributes"]>;
|
|
44
|
+
required: true;
|
|
45
|
+
};
|
|
46
|
+
}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<globalThis.ExtractPropTypes<{
|
|
47
|
+
editor: {
|
|
48
|
+
type: PropType<import('@tiptap/core').NodeViewProps["editor"]>;
|
|
49
|
+
required: true;
|
|
50
|
+
};
|
|
51
|
+
node: {
|
|
52
|
+
type: PropType<import('@tiptap/core').NodeViewProps["node"]>;
|
|
53
|
+
required: true;
|
|
54
|
+
};
|
|
55
|
+
decorations: {
|
|
56
|
+
type: PropType<import('@tiptap/core').NodeViewProps["decorations"]>;
|
|
57
|
+
required: true;
|
|
58
|
+
};
|
|
59
|
+
selected: {
|
|
60
|
+
type: PropType<import('@tiptap/core').NodeViewProps["selected"]>;
|
|
61
|
+
required: true;
|
|
62
|
+
};
|
|
63
|
+
extension: {
|
|
64
|
+
type: PropType<import('@tiptap/core').NodeViewProps["extension"]>;
|
|
65
|
+
required: true;
|
|
66
|
+
};
|
|
67
|
+
getPos: {
|
|
68
|
+
type: PropType<import('@tiptap/core').NodeViewProps["getPos"]>;
|
|
69
|
+
required: true;
|
|
70
|
+
};
|
|
71
|
+
updateAttributes: {
|
|
72
|
+
type: PropType<import('@tiptap/core').NodeViewProps["updateAttributes"]>;
|
|
73
|
+
required: true;
|
|
74
|
+
};
|
|
75
|
+
deleteNode: {
|
|
76
|
+
type: PropType<import('@tiptap/core').NodeViewProps["deleteNode"]>;
|
|
77
|
+
required: true;
|
|
78
|
+
};
|
|
79
|
+
view: {
|
|
80
|
+
type: PropType<import('@tiptap/core').NodeViewProps["view"]>;
|
|
81
|
+
required: true;
|
|
82
|
+
};
|
|
83
|
+
innerDecorations: {
|
|
84
|
+
type: PropType<import('@tiptap/core').NodeViewProps["innerDecorations"]>;
|
|
85
|
+
required: true;
|
|
86
|
+
};
|
|
87
|
+
HTMLAttributes: {
|
|
88
|
+
type: PropType<import('@tiptap/core').NodeViewProps["HTMLAttributes"]>;
|
|
89
|
+
required: true;
|
|
90
|
+
};
|
|
91
|
+
}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
92
|
+
export default _default;
|
package/dist/src/contentManager/components/content-editor/tiptap-extensions/helpers/iconOptions.d.ts
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { Component } from 'vue';
|
|
2
|
+
export type ContentIconTheme = 'logos' | 'lucide';
|
|
3
|
+
export type ContentIconOption = {
|
|
4
|
+
theme: ContentIconTheme;
|
|
5
|
+
name: string;
|
|
6
|
+
label: string;
|
|
7
|
+
component: Component;
|
|
8
|
+
searchText: string;
|
|
9
|
+
};
|
|
10
|
+
export declare const DEFAULT_ICON_THEME: ContentIconTheme;
|
|
11
|
+
export declare const DEFAULT_LUCIDE_ICON = "Star";
|
|
12
|
+
export declare const logoIconOptions: ContentIconOption[];
|
|
13
|
+
export declare const iconThemeOptions: readonly [{
|
|
14
|
+
readonly value: "lucide";
|
|
15
|
+
readonly label: "Lucide";
|
|
16
|
+
}, {
|
|
17
|
+
readonly value: "logos";
|
|
18
|
+
readonly label: "Logos";
|
|
19
|
+
}];
|
|
20
|
+
export declare function getIconOptions(theme: ContentIconTheme): ContentIconOption[];
|
|
21
|
+
export declare function findIconOption(theme: ContentIconTheme, name?: string | null): ContentIconOption | null;
|
|
22
|
+
export declare function getIconComponent(theme: ContentIconTheme, name?: string | null): Component | import('vue').FunctionalComponent<import('lucide-vue-next').LucideProps, {}, any, {}>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { Editor } from '@tiptap/vue-3';
|
|
2
|
+
declare const _default: import('vue').DefineComponent<globalThis.ExtractPropTypes<{
|
|
3
|
+
editor: {
|
|
4
|
+
type: typeof Editor;
|
|
5
|
+
required: true;
|
|
6
|
+
};
|
|
7
|
+
}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<globalThis.ExtractPropTypes<{
|
|
8
|
+
editor: {
|
|
9
|
+
type: typeof Editor;
|
|
10
|
+
required: true;
|
|
11
|
+
};
|
|
12
|
+
}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
|
|
13
|
+
iconQueryInput: HTMLInputElement;
|
|
14
|
+
customColorInput: HTMLInputElement;
|
|
15
|
+
}, HTMLDivElement>;
|
|
16
|
+
export default _default;
|
|
@@ -82,6 +82,23 @@ declare const _default: readonly [{
|
|
|
82
82
|
required: true;
|
|
83
83
|
};
|
|
84
84
|
}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
|
|
85
|
+
}, {
|
|
86
|
+
readonly name: "Icon";
|
|
87
|
+
readonly type: "icon";
|
|
88
|
+
readonly settingsView: import('vue').DefineComponent<globalThis.ExtractPropTypes<{
|
|
89
|
+
editor: {
|
|
90
|
+
type: typeof import('@tiptap/vue-3').Editor;
|
|
91
|
+
required: true;
|
|
92
|
+
};
|
|
93
|
+
}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<globalThis.ExtractPropTypes<{
|
|
94
|
+
editor: {
|
|
95
|
+
type: typeof import('@tiptap/vue-3').Editor;
|
|
96
|
+
required: true;
|
|
97
|
+
};
|
|
98
|
+
}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
|
|
99
|
+
iconQueryInput: HTMLInputElement;
|
|
100
|
+
customColorInput: HTMLInputElement;
|
|
101
|
+
}, HTMLDivElement>;
|
|
85
102
|
}, {
|
|
86
103
|
readonly name: "Map";
|
|
87
104
|
readonly type: "map";
|
|
@@ -1,8 +1,4 @@
|
|
|
1
1
|
declare const _default: import('vue').DefineComponent<globalThis.ExtractPropTypes<{
|
|
2
|
-
savedField: {
|
|
3
|
-
type: StringConstructor;
|
|
4
|
-
default: string;
|
|
5
|
-
};
|
|
6
2
|
savedDefaultDate: {
|
|
7
3
|
type: StringConstructor;
|
|
8
4
|
default: string;
|
|
@@ -10,10 +6,6 @@ declare const _default: import('vue').DefineComponent<globalThis.ExtractPropType
|
|
|
10
6
|
}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
11
7
|
saved: (...args: any[]) => void;
|
|
12
8
|
}, string, import('vue').PublicProps, Readonly<globalThis.ExtractPropTypes<{
|
|
13
|
-
savedField: {
|
|
14
|
-
type: StringConstructor;
|
|
15
|
-
default: string;
|
|
16
|
-
};
|
|
17
9
|
savedDefaultDate: {
|
|
18
10
|
type: StringConstructor;
|
|
19
11
|
default: string;
|
|
@@ -21,7 +13,6 @@ declare const _default: import('vue').DefineComponent<globalThis.ExtractPropType
|
|
|
21
13
|
}>> & Readonly<{
|
|
22
14
|
onSaved?: ((...args: any[]) => any) | undefined;
|
|
23
15
|
}>, {
|
|
24
|
-
savedField: string;
|
|
25
16
|
savedDefaultDate: string;
|
|
26
17
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
27
18
|
export default _default;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oneclick.dev/cms-core-modules",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.113",
|
|
4
4
|
"main": "dist/index.cjs.js",
|
|
5
5
|
"module": "dist/index.mjs",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"peerDependencies": {
|
|
29
29
|
"@formkit/drag-and-drop": "^0.5.3",
|
|
30
30
|
"@internationalized/date": "^3.8.0",
|
|
31
|
-
"@oneclick.dev/cms-kit": "0.0.
|
|
31
|
+
"@oneclick.dev/cms-kit": "0.0.131",
|
|
32
32
|
"@tanstack/vue-table": "^8.21.3",
|
|
33
33
|
"@vee-validate/zod": "^4.15.0",
|
|
34
34
|
"@vue-flow/core": "^1.48.1",
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),U=require("@oneclick.dev/cms-kit"),m=require("lucide-vue-next"),h={class:"grid py-4"},A={class:"grid grid-cols-2 gap-2 mb-6"},R={class:"relative"},L={class:"grid grid-cols-3 gap-2 mb-6"},_={class:"relative"},I={class:"relative"},M={class:"relative"},O={class:"grid grid-cols-1 gap-2 mb-6"},G={class:"relative"},J={class:"flex items-center space-x-2"},P={class:"flex items-center space-x-2"},H={class:"grid grid-cols-2 gap-2 mb-6"},j={key:0},q={class:"relative"},K={key:1},Q={class:"relative"},W={key:0,class:"bg-muted px-4 py-2 rounded-md text-sm"},X=e.defineComponent({__name:"SectionStyleDialog",props:{buttons:{type:Array,default:()=>[]}},emits:["add","edit","delete"],setup(S,{expose:F,emit:g}){const{confirm:b}=U.useConfirmation(),V=g,x=e.ref(!1),v=e.ref("create"),i=e.ref(null),d=e.ref(!1),t=e.reactive({name:"",rendering:"class",className:"",componentName:"",styles:{backgroundColor:"#FFFFFF",titleColor:"#000000",textColor:"#000000"}}),T=f=>{f?(v.value="edit",i.value=f.id,d.value=f.id==="DEFAULT",t.name=f.name||"",t.rendering=f.rendering||"class",t.className=f.className||"",t.componentName=f.componentName||"",t.styles.backgroundColor=f.styles.backgroundColor||"#FFFFFF",t.styles.titleColor=f.styles.titleColor||"#000000",t.styles.textColor=f.styles.textColor||"#000000"):(v.value="create",i.value=null,d.value=!1,t.name="",t.rendering="class",t.className="",t.componentName="",t.styles.backgroundColor="#FFFFFF",t.styles.titleColor="#000000",t.styles.textColor="#000000"),x.value=!0},B=()=>{V("add",t),x.value=!1},w=()=>{d.value&&(t.name="Default"),V("edit",{id:i.value,...t}),x.value=!1},D=async()=>{if(d.value)return;await b("Are you sure you want to delete this theme? This action cannot be undone.","Delete Theme","Delete")&&(V("delete",i.value),x.value=!1)},$=()=>{t.styles.backgroundColor="#FFFFFF",t.styles.titleColor="#000000",t.styles.textColor="#000000"};return F({openDialog:T}),(f,r)=>{const a=e.resolveComponent("DialogTitle"),o=e.resolveComponent("DialogDescription"),z=e.resolveComponent("DialogHeader"),k=e.resolveComponent("Label"),N=e.resolveComponent("Input"),p=e.resolveComponent("RadioGroupItem"),C=e.resolveComponent("RadioGroup"),E=e.resolveComponent("Button"),s=e.resolveComponent("DialogFooter"),l=e.resolveComponent("DialogScrollContent"),u=e.resolveComponent("Dialog");return e.openBlock(),e.createBlock(u,{open:x.value,"onUpdate:open":r[10]||(r[10]=c=>x.value=c)},{default:e.withCtx(()=>[e.createVNode(l,{class:"sm:max-w-2xl"},{default:e.withCtx(()=>[e.createVNode(z,null,{default:e.withCtx(()=>[e.createVNode(a,null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.value==="create"?"Add New Section Style":"Edit Section Style"),1)]),_:1}),e.createVNode(o,null,{default:e.withCtx(()=>[...r[11]||(r[11]=[e.createTextVNode(" These settings change how this section looks in the editor. To style your live site, add matching CSS or use a custom component. ",-1)])]),_:1})]),_:1}),e.createElementVNode("div",h,[e.createElementVNode("div",A,[e.createElementVNode("div",null,[e.createVNode(k,{class:"mb-2",for:"collection-theme-dialog-theme-name"},{default:e.withCtx(()=>[...r[12]||(r[12]=[e.createTextVNode("Display name",-1)])]),_:1}),e.createElementVNode("div",R,[e.createVNode(N,{modelValue:t.name,"onUpdate:modelValue":r[0]||(r[0]=c=>t.name=c),id:"collection-theme-dialog-theme-name",disabled:d.value},null,8,["modelValue","disabled"])])])]),r[21]||(r[21]=e.createElementVNode("h2",{class:"font-semibold mb-4"},"Style Settings",-1)),e.createElementVNode("div",L,[e.createElementVNode("div",null,[e.createVNode(k,{class:"mb-2",for:"collection-theme-dialog-background-color"},{default:e.withCtx(()=>[...r[13]||(r[13]=[e.createTextVNode("Background color",-1)])]),_:1}),e.createElementVNode("div",_,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":r[1]||(r[1]=c=>t.styles.backgroundColor=c),type:"color",label:"Primary Color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.backgroundColor]]),e.createVNode(N,{modelValue:t.styles.backgroundColor,"onUpdate:modelValue":r[2]||(r[2]=c=>t.styles.backgroundColor=c),class:"pl-12",id:"collection-theme-dialog-background-color"},null,8,["modelValue"])])]),e.createElementVNode("div",null,[e.createVNode(k,{class:"mb-2",for:"collection-theme-dialog-title-color"},{default:e.withCtx(()=>[...r[14]||(r[14]=[e.createTextVNode("Heading color",-1)])]),_:1}),e.createElementVNode("div",I,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":r[3]||(r[3]=c=>t.styles.titleColor=c),type:"color",label:"Primary Color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.titleColor]]),e.createVNode(N,{modelValue:t.styles.titleColor,"onUpdate:modelValue":r[4]||(r[4]=c=>t.styles.titleColor=c),class:"pl-12",id:"collection-theme-dialog-title-color"},null,8,["modelValue"])])]),e.createElementVNode("div",null,[e.createVNode(k,{class:"mb-2",for:"collection-theme-dialog-text-color"},{default:e.withCtx(()=>[...r[15]||(r[15]=[e.createTextVNode("Body text color",-1)])]),_:1}),e.createElementVNode("div",M,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":r[5]||(r[5]=c=>t.styles.textColor=c),type:"color",label:"Primary Color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.textColor]]),e.createVNode(N,{modelValue:t.styles.textColor,"onUpdate:modelValue":r[6]||(r[6]=c=>t.styles.textColor=c),class:"pl-12",id:"collection-theme-dialog-text-color"},null,8,["modelValue"])])])]),r[22]||(r[22]=e.createElementVNode("h2",{class:"font-semibold mb-4"},"Rendering Method",-1)),e.createElementVNode("div",O,[e.createElementVNode("div",null,[e.createElementVNode("div",G,[e.createVNode(k,{class:"mb-4 text-muted-foreground"},{default:e.withCtx(()=>[...r[16]||(r[16]=[e.createTextVNode("Choose how this section should be styled on your site:",-1)])]),_:1}),e.createVNode(C,{modelValue:t.rendering,"onUpdate:modelValue":r[7]||(r[7]=c=>t.rendering=c),"default-value":"class"},{default:e.withCtx(()=>[e.createElementVNode("div",J,[e.createVNode(p,{id:"collection-theme-dialog-render-class",value:"class"}),e.createVNode(k,{for:"collection-theme-dialog-render-class"},{default:e.withCtx(()=>[...r[17]||(r[17]=[e.createTextVNode("Use a CSS class",-1)])]),_:1})]),e.createElementVNode("div",P,[e.createVNode(p,{id:"collection-theme-dialog-render-component",value:"component"}),e.createVNode(k,{for:"collection-theme-dialog-render-component"},{default:e.withCtx(()=>[...r[18]||(r[18]=[e.createTextVNode("Custom component",-1)])]),_:1})])]),_:1},8,["modelValue"])])])]),e.createElementVNode("div",H,[t.rendering==="class"?(e.openBlock(),e.createElementBlock("div",j,[e.createVNode(k,{class:"mb-2",for:"collection-theme-dialog-class-name"},{default:e.withCtx(()=>[...r[19]||(r[19]=[e.createTextVNode("Class name",-1)])]),_:1}),e.createElementVNode("div",q,[e.createVNode(N,{modelValue:t.className,"onUpdate:modelValue":r[8]||(r[8]=c=>t.className=c),id:"collection-theme-dialog-class-name"},null,8,["modelValue"])])])):(e.openBlock(),e.createElementBlock("div",K,[e.createVNode(k,{class:"mb-2",for:"collection-theme-dialog-component-name"},{default:e.withCtx(()=>[...r[20]||(r[20]=[e.createTextVNode("Component name",-1)])]),_:1}),e.createElementVNode("div",Q,[e.createVNode(N,{modelValue:t.componentName,"onUpdate:modelValue":r[9]||(r[9]=c=>t.componentName=c),id:"collection-theme-dialog-component-name"},null,8,["modelValue"])])]))]),t.rendering==="class"?(e.openBlock(),e.createElementBlock("pre",W,"."+e.toDisplayString(t.className)+` {
|
|
2
|
-
background-color: `+e.toDisplayString(t.styles.backgroundColor)+`;
|
|
3
|
-
color: `+e.toDisplayString(t.styles.textColor)+`;
|
|
4
|
-
|
|
5
|
-
h1, h2, h3, h4, h5, h6 {
|
|
6
|
-
color: `+e.toDisplayString(t.styles.titleColor)+`;
|
|
7
|
-
}
|
|
8
|
-
}
|
|
9
|
-
`,1)):e.createCommentVNode("",!0)]),e.createVNode(s,null,{default:e.withCtx(()=>[v.value==="edit"&&!d.value?(e.openBlock(),e.createBlock(E,{key:0,variant:"destructive",class:"mr-auto",onClick:D},{default:e.withCtx(()=>[...r[23]||(r[23]=[e.createTextVNode(" Delete Style ",-1)])]),_:1})):e.createCommentVNode("",!0),v.value==="edit"&&d.value?(e.openBlock(),e.createBlock(E,{key:1,variant:"outline",class:"mr-auto",onClick:$},{default:e.withCtx(()=>[...r[24]||(r[24]=[e.createTextVNode(" Reset to Default ",-1)])]),_:1})):e.createCommentVNode("",!0),v.value==="create"?(e.openBlock(),e.createBlock(E,{key:2,type:"submit",onClick:B},{default:e.withCtx(()=>[...r[25]||(r[25]=[e.createTextVNode(" Add Style ",-1)])]),_:1})):(e.openBlock(),e.createBlock(E,{key:3,type:"submit",onClick:w},{default:e.withCtx(()=>[...r[26]||(r[26]=[e.createTextVNode(" Save Changes ",-1)])]),_:1}))]),_:1})]),_:1})]),_:1},8,["open"])}}}),Y={class:"grid py-4"},Z={class:"grid grid-cols-2 gap-2 mb-6"},ee={class:"relative"},te={class:"grid grid-cols-3 gap-2 mb-6"},oe={class:"relative"},le={class:"relative"},se={class:"relative"},ne={class:"grid grid-cols-1 gap-2 mb-6"},re={class:"relative"},ae={class:"flex items-center space-x-2"},de={class:"flex items-center space-x-2"},ie={class:"grid grid-cols-2 gap-2 mb-6"},ce={key:0},ue={class:"relative"},me={key:1},pe={class:"relative"},ye={key:0,class:"bg-muted px-4 py-2 rounded-md text-sm"},xe=e.defineComponent({__name:"ButtonStyleDialog",props:{defaultBackground:{type:String,default:"#FFFFFF"}},emits:["add","edit","delete"],setup(S,{expose:F,emit:g}){const{confirm:b}=U.useConfirmation(),V=g,x=e.ref(!1),v=e.ref("create"),i=e.ref(null),d=e.ref(!1),t=e.reactive({name:"",rendering:"class",className:"",componentName:"",styles:{backgroundColor:"#FFFFFF",textColor:"#000000",borderColor:"#000000",buttonRoundness:"none",buttonStyle:"default"}}),T=a=>{a?(v.value="edit",i.value=a.id,d.value=a.id==="DEFAULT",t.name=a.name||"",t.rendering=a.rendering||"class",t.className=a.className||"",t.componentName=a.componentName||"",t.styles.backgroundColor=a.styles.backgroundColor||"#FFFFFF",t.styles.textColor=a.styles.textColor||"#000000",t.styles.borderColor=a.styles.borderColor||"#000000",t.styles.buttonRoundness=a.styles.buttonRoundness||"none",t.styles.buttonStyle=a.styles.buttonStyle||"default"):(v.value="create",i.value=null,d.value=!1,t.name="",t.rendering="class",t.className="",t.componentName="",t.styles.backgroundColor="#FFFFFF",t.styles.textColor="#000000",t.styles.borderColor="#000000",t.styles.buttonRoundness="none",t.styles.buttonStyle="default"),x.value=!0},B=()=>{V("add",t),x.value=!1},w=()=>{d.value&&(t.name="Default"),V("edit",{id:i.value,...t}),x.value=!1},D=async()=>{if(d.value)return;await b("Are you sure you want to delete this theme? This action cannot be undone.","Delete Theme","Delete")&&(V("delete",i.value),x.value=!1)},$=()=>{t.styles.backgroundColor="#FFFFFF",t.styles.textColor="#000000",t.styles.borderColor="#000000",t.styles.buttonRoundness="none",t.styles.buttonStyle="default"},f=a=>{switch(a){case"none":return 0;case"small":return 8;case"medium":return 12;case"pill":return 99;default:return 0}},r=e.computed(()=>{let a="."+t.className+` {
|
|
10
|
-
`;return a+=` background-color: ${t.styles.backgroundColor};
|
|
11
|
-
`,a+=` color: ${t.styles.textColor};
|
|
12
|
-
`,t.styles.buttonStyle==="outline"?a+=` border: 1px solid ${t.styles.borderColor};
|
|
13
|
-
`:t.styles.buttonStyle==="shadow"?a+=` box-shadow: 0 3px 6px #ccc;
|
|
14
|
-
`:t.styles.buttonStyle==="retro"&&(a+=` box-shadow: inset 0 0 0 2px ${t.styles.borderColor}, 2px 2px 0 ${t.styles.borderColor};
|
|
15
|
-
`),t.styles.buttonRoundness!=="none"&&(a+=` border-radius: ${f(t.styles.buttonRoundness)}px;
|
|
16
|
-
`),a+=`}
|
|
17
|
-
`,a});return F({openDialog:T}),(a,o)=>{const z=e.resolveComponent("DialogTitle"),k=e.resolveComponent("DialogDescription"),N=e.resolveComponent("DialogHeader"),p=e.resolveComponent("Label"),C=e.resolveComponent("Input"),E=e.resolveComponent("RadioGroupItem"),s=e.resolveComponent("RadioGroup"),l=e.resolveComponent("Button"),u=e.resolveComponent("DialogFooter"),c=e.resolveComponent("DialogScrollContent"),y=e.resolveComponent("Dialog");return e.openBlock(),e.createBlock(y,{open:x.value,"onUpdate:open":o[18]||(o[18]=n=>x.value=n)},{default:e.withCtx(()=>[e.createVNode(c,{class:"sm:max-w-2xl"},{default:e.withCtx(()=>[e.createVNode(N,null,{default:e.withCtx(()=>[e.createVNode(z,null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.value==="create"?"Add New Button Style":"Edit Button Style"),1)]),_:1}),e.createVNode(k,null,{default:e.withCtx(()=>[...o[19]||(o[19]=[e.createTextVNode(" These settings change how this section looks in the editor. To style your live site, add matching CSS or use a custom component. ",-1)])]),_:1})]),_:1}),e.createElementVNode("div",Y,[e.createElementVNode("div",Z,[e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-theme-name"},{default:e.withCtx(()=>[...o[20]||(o[20]=[e.createTextVNode("Display name",-1)])]),_:1}),e.createElementVNode("div",ee,[e.createVNode(C,{modelValue:t.name,"onUpdate:modelValue":o[0]||(o[0]=n=>t.name=n),id:"collection-theme-dialog-theme-name",disabled:d.value},null,8,["modelValue","disabled"])])])]),o[38]||(o[38]=e.createElementVNode("h2",{class:"font-semibold mb-4"},"Style Settings",-1)),e.createElementVNode("div",te,[e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-background-color"},{default:e.withCtx(()=>[...o[21]||(o[21]=[e.createTextVNode("Background color",-1)])]),_:1}),e.createElementVNode("div",oe,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[1]||(o[1]=n=>t.styles.backgroundColor=n),type:"color",label:"Primary Color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.backgroundColor]]),e.createVNode(C,{modelValue:t.styles.backgroundColor,"onUpdate:modelValue":o[2]||(o[2]=n=>t.styles.backgroundColor=n),class:"pl-12",id:"collection-theme-dialog-background-color"},null,8,["modelValue"])])]),e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-text-color"},{default:e.withCtx(()=>[...o[22]||(o[22]=[e.createTextVNode("Text color",-1)])]),_:1}),e.createElementVNode("div",le,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[3]||(o[3]=n=>t.styles.textColor=n),type:"color",label:"Primary Color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.textColor]]),e.createVNode(C,{modelValue:t.styles.textColor,"onUpdate:modelValue":o[4]||(o[4]=n=>t.styles.textColor=n),class:"pl-12",id:"collection-theme-dialog-text-color"},null,8,["modelValue"])])]),e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-border-color"},{default:e.withCtx(()=>[...o[23]||(o[23]=[e.createTextVNode("Border color",-1)])]),_:1}),e.createElementVNode("div",se,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[5]||(o[5]=n=>t.styles.borderColor=n),type:"color",label:"Primary Color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.borderColor]]),e.createVNode(C,{modelValue:t.styles.borderColor,"onUpdate:modelValue":o[6]||(o[6]=n=>t.styles.borderColor=n),class:"pl-12",id:"collection-theme-dialog-border-color"},null,8,["modelValue"])])])]),e.createElementVNode("div",{style:e.normalizeStyle(`--button-background-color: ${t.styles.backgroundColor}; --button-text-color: ${t.styles.textColor}`)},[e.createVNode(p,{class:"mb-4"},{default:e.withCtx(()=>[...o[24]||(o[24]=[e.createTextVNode("Shape",-1)])]),_:1}),e.createElementVNode("div",{class:"grid grid-cols-4 gap-4 mb-6 p-2 rounded",style:e.normalizeStyle({backgroundColor:S.defaultBackground})},[e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[7]||(o[7]=n=>t.styles.buttonRoundness="none")},[o[25]||(o[25]=e.createElementVNode("div",{class:"text-center px-8 py-2 bg-[var(--button-background-color)] text-[var(--button-text-color)]"},"Button",-1)),t.styles.buttonRoundness!=="none"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[8]||(o[8]=n=>t.styles.buttonRoundness="small")},[o[26]||(o[26]=e.createElementVNode("div",{class:"text-center px-8 py-2 bg-[var(--button-background-color)] text-[var(--button-text-color)] rounded-[8px]"},"Button",-1)),t.styles.buttonRoundness!=="small"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[9]||(o[9]=n=>t.styles.buttonRoundness="medium")},[o[27]||(o[27]=e.createElementVNode("div",{class:"text-center px-8 py-2 bg-[var(--button-background-color)] text-[var(--button-text-color)] rounded-[12px]"},"Button",-1)),t.styles.buttonRoundness!=="medium"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[10]||(o[10]=n=>t.styles.buttonRoundness="pill")},[o[28]||(o[28]=e.createElementVNode("div",{class:"text-center px-8 py-2 bg-[var(--button-background-color)] text-[var(--button-text-color)] rounded-[99px]"},"Button",-1)),t.styles.buttonRoundness!=="pill"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))])],4),e.createVNode(p,{class:"mb-4"},{default:e.withCtx(()=>[...o[29]||(o[29]=[e.createTextVNode("Style",-1)])]),_:1}),e.createElementVNode("div",{class:"grid grid-cols-4 gap-4 mb-6 p-2 rounded",style:e.normalizeStyle(`--button-border-radius: ${f(t.styles.buttonRoundness)}px; --button-border-color: ${t.styles.borderColor}; background-color: ${S.defaultBackground}`)},[e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[11]||(o[11]=n=>t.styles.buttonStyle="default")},[o[30]||(o[30]=e.createElementVNode("div",{class:"text-center px-8 py-2 bg-[var(--button-background-color)] text-[var(--button-text-color)] rounded-[var(--button-border-radius)]"},"Button",-1)),t.styles.buttonStyle!=="default"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[12]||(o[12]=n=>t.styles.buttonStyle="outline")},[o[31]||(o[31]=e.createElementVNode("div",{class:"text-center px-8 py-2 bg-[var(--button-background-color)] text-[var(--button-text-color)] rounded-[var(--button-border-radius)] border border-[var(--button-border-color)]"}," Button ",-1)),t.styles.buttonStyle!=="outline"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[13]||(o[13]=n=>t.styles.buttonStyle="shadow")},[o[32]||(o[32]=e.createElementVNode("div",{class:"text-center px-8 py-2 bg-[var(--button-background-color)] text-[var(--button-text-color)] rounded-[var(--button-border-radius)]",style:{"box-shadow":"0 3px 6px #ccc"}}," Button ",-1)),t.styles.buttonStyle!=="shadow"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[14]||(o[14]=n=>t.styles.buttonStyle="retro")},[e.createElementVNode("div",{class:"text-center px-8 py-2 bg-[var(--button-background-color)] text-[var(--button-text-color)] rounded-[var(--button-border-radius)]",style:e.normalizeStyle(`box-shadow: inset 0 0 0 2px ${t.styles.borderColor}, 2px 2px 0 ${t.styles.borderColor};`)}," Button ",4),t.styles.buttonStyle!=="retro"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))])],4)],4),o[39]||(o[39]=e.createElementVNode("h2",{class:"font-semibold mb-4"},"Rendering Method",-1)),e.createElementVNode("div",ne,[e.createElementVNode("div",null,[e.createElementVNode("div",re,[e.createVNode(p,{class:"mb-4 text-muted-foreground"},{default:e.withCtx(()=>[...o[33]||(o[33]=[e.createTextVNode("Choose how this section should be styled on your site:",-1)])]),_:1}),e.createVNode(s,{modelValue:t.rendering,"onUpdate:modelValue":o[15]||(o[15]=n=>t.rendering=n),"default-value":"class"},{default:e.withCtx(()=>[e.createElementVNode("div",ae,[e.createVNode(E,{id:"collection-theme-dialog-render-class",value:"class"}),e.createVNode(p,{for:"collection-theme-dialog-render-class"},{default:e.withCtx(()=>[...o[34]||(o[34]=[e.createTextVNode("Use a CSS class",-1)])]),_:1})]),e.createElementVNode("div",de,[e.createVNode(E,{id:"collection-theme-dialog-render-component",value:"component"}),e.createVNode(p,{for:"collection-theme-dialog-render-component"},{default:e.withCtx(()=>[...o[35]||(o[35]=[e.createTextVNode("Custom component",-1)])]),_:1})])]),_:1},8,["modelValue"])])])]),e.createElementVNode("div",ie,[t.rendering==="class"?(e.openBlock(),e.createElementBlock("div",ce,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-class-name"},{default:e.withCtx(()=>[...o[36]||(o[36]=[e.createTextVNode("Class name",-1)])]),_:1}),e.createElementVNode("div",ue,[e.createVNode(C,{modelValue:t.className,"onUpdate:modelValue":o[16]||(o[16]=n=>t.className=n),id:"collection-theme-dialog-class-name"},null,8,["modelValue"])])])):(e.openBlock(),e.createElementBlock("div",me,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-component-name"},{default:e.withCtx(()=>[...o[37]||(o[37]=[e.createTextVNode("Component name",-1)])]),_:1}),e.createElementVNode("div",pe,[e.createVNode(C,{modelValue:t.componentName,"onUpdate:modelValue":o[17]||(o[17]=n=>t.componentName=n),id:"collection-theme-dialog-component-name"},null,8,["modelValue"])])]))]),t.rendering==="class"?(e.openBlock(),e.createElementBlock("pre",ye,e.toDisplayString(r.value),1)):e.createCommentVNode("",!0)]),e.createVNode(u,null,{default:e.withCtx(()=>[v.value==="edit"&&!d.value?(e.openBlock(),e.createBlock(l,{key:0,variant:"destructive",class:"mr-auto",onClick:D},{default:e.withCtx(()=>[...o[40]||(o[40]=[e.createTextVNode(" Delete Style ",-1)])]),_:1})):e.createCommentVNode("",!0),v.value==="edit"&&d.value?(e.openBlock(),e.createBlock(l,{key:1,variant:"outline",class:"mr-auto",onClick:$},{default:e.withCtx(()=>[...o[41]||(o[41]=[e.createTextVNode(" Reset to Default ",-1)])]),_:1})):e.createCommentVNode("",!0),v.value==="create"?(e.openBlock(),e.createBlock(l,{key:2,type:"submit",onClick:B},{default:e.withCtx(()=>[...o[42]||(o[42]=[e.createTextVNode(" Add Style ",-1)])]),_:1})):(e.openBlock(),e.createBlock(l,{key:3,type:"submit",onClick:w},{default:e.withCtx(()=>[...o[43]||(o[43]=[e.createTextVNode(" Save Changes ",-1)])]),_:1}))]),_:1})]),_:1})]),_:1},8,["open"])}}}),ve={class:"grid py-4"},fe={class:"grid grid-cols-2 gap-2 mb-6"},ge={class:"relative"},be={class:"grid grid-cols-4 gap-2 mb-6"},Ce={class:"relative"},Ve={class:"relative"},ke={class:"relative"},Ne={class:"relative"},Ee={class:"grid grid-cols-1 gap-2 mb-6"},Be={class:"relative"},Te={class:"flex items-center space-x-2"},we={class:"flex items-center space-x-2"},De={class:"grid grid-cols-2 gap-2 mb-6"},Se={key:0},Fe={class:"relative"},$e={key:1},ze={class:"relative"},Ue={key:0,class:"bg-muted px-4 py-2 rounded-md text-sm"},he=e.defineComponent({__name:"CardStyleDialog",props:{defaultBackground:{type:String,default:"#FFFFFF"}},emits:["add","edit","delete"],setup(S,{expose:F,emit:g}){const{confirm:b}=U.useConfirmation(),V=g,x=e.ref(!1),v=e.ref("create"),i=e.ref(null),d=e.ref(!1),t=e.reactive({name:"",rendering:"class",className:"",componentName:"",styles:{backgroundColor:"#FFFFFF",titleColor:"#000000",textColor:"#000000",borderColor:"#000000",roundness:"none",style:"default"}}),T=a=>{a?(v.value="edit",i.value=a.id,d.value=a.id==="DEFAULT",t.name=a.name||"",t.rendering=a.rendering||"class",t.className=a.className||"",t.componentName=a.componentName||"",t.styles.backgroundColor=a.styles.backgroundColor||"#FFFFFF",t.styles.titleColor=a.styles.titleColor||"#000000",t.styles.textColor=a.styles.textColor||"#000000",t.styles.borderColor=a.styles.borderColor||"#000000",t.styles.roundness=a.styles.roundness||"none",t.styles.style=a.styles.style||"default"):(v.value="create",i.value=null,d.value=!1,t.name="",t.rendering="class",t.className="",t.componentName="",t.styles.backgroundColor="#FFFFFF",t.styles.titleColor="#000000",t.styles.textColor="#000000",t.styles.borderColor="#000000",t.styles.roundness="none",t.styles.style="default"),x.value=!0},B=()=>{V("add",t),x.value=!1},w=()=>{d.value&&(t.name="Default"),V("edit",{id:i.value,...t}),x.value=!1},D=async()=>{if(d.value)return;await b("Are you sure you want to delete this theme? This action cannot be undone.","Delete Theme","Delete")&&(V("delete",i.value),x.value=!1)},$=()=>{t.styles.backgroundColor="#FFFFFF",t.styles.titleColor="#000000",t.styles.textColor="#000000",t.styles.borderColor="#000000",t.styles.roundness="none",t.styles.style="default"},f=a=>{switch(a){case"none":return 0;case"small":return 8;case"medium":return 12;default:return 0}},r=e.computed(()=>{let a="."+t.className+` {
|
|
18
|
-
`;return a+=` background-color: ${t.styles.backgroundColor};
|
|
19
|
-
`,a+=` color: ${t.styles.textColor};
|
|
20
|
-
`,t.styles.style==="outline"?a+=` border: 1px solid ${t.styles.borderColor};
|
|
21
|
-
`:t.styles.style==="shadow"?a+=` box-shadow: 0 3px 6px #ccc;
|
|
22
|
-
`:t.styles.style==="retro"&&(a+=` box-shadow: inset 0 0 0 2px ${t.styles.borderColor}, 2px 2px 0 ${t.styles.borderColor};
|
|
23
|
-
`),t.styles.roundness!=="none"&&(a+=` border-radius: ${f(t.styles.roundness)}px;
|
|
24
|
-
`),a+=`}
|
|
25
|
-
`,a});return F({openDialog:T}),(a,o)=>{const z=e.resolveComponent("DialogTitle"),k=e.resolveComponent("DialogDescription"),N=e.resolveComponent("DialogHeader"),p=e.resolveComponent("Label"),C=e.resolveComponent("Input"),E=e.resolveComponent("RadioGroupItem"),s=e.resolveComponent("RadioGroup"),l=e.resolveComponent("Button"),u=e.resolveComponent("DialogFooter"),c=e.resolveComponent("DialogScrollContent"),y=e.resolveComponent("Dialog");return e.openBlock(),e.createBlock(y,{open:x.value,"onUpdate:open":o[19]||(o[19]=n=>x.value=n)},{default:e.withCtx(()=>[e.createVNode(c,{class:"sm:max-w-2xl"},{default:e.withCtx(()=>[e.createVNode(N,null,{default:e.withCtx(()=>[e.createVNode(z,null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.value==="create"?"Add New Card Style":"Edit Card Style"),1)]),_:1}),e.createVNode(k,null,{default:e.withCtx(()=>[...o[20]||(o[20]=[e.createTextVNode(" These settings change how this section looks in the editor. To style your live site, add matching CSS or use a custom component. ",-1)])]),_:1})]),_:1}),e.createElementVNode("div",ve,[e.createElementVNode("div",fe,[e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-theme-name"},{default:e.withCtx(()=>[...o[21]||(o[21]=[e.createTextVNode("Display name",-1)])]),_:1}),e.createElementVNode("div",ge,[e.createVNode(C,{modelValue:t.name,"onUpdate:modelValue":o[0]||(o[0]=n=>t.name=n),id:"collection-theme-dialog-theme-name",disabled:d.value},null,8,["modelValue","disabled"])])])]),o[40]||(o[40]=e.createElementVNode("h2",{class:"font-semibold mb-4"},"Style Settings",-1)),e.createElementVNode("div",be,[e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-background-color"},{default:e.withCtx(()=>[...o[22]||(o[22]=[e.createTextVNode("Background color",-1)])]),_:1}),e.createElementVNode("div",Ce,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[1]||(o[1]=n=>t.styles.backgroundColor=n),type:"color",label:"Background color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.backgroundColor]]),e.createVNode(C,{modelValue:t.styles.backgroundColor,"onUpdate:modelValue":o[2]||(o[2]=n=>t.styles.backgroundColor=n),class:"pl-12",id:"collection-theme-dialog-background-color"},null,8,["modelValue"])])]),e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-title-color"},{default:e.withCtx(()=>[...o[23]||(o[23]=[e.createTextVNode("Heading color",-1)])]),_:1}),e.createElementVNode("div",Ve,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[3]||(o[3]=n=>t.styles.titleColor=n),type:"color",label:"Heading color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.titleColor]]),e.createVNode(C,{modelValue:t.styles.titleColor,"onUpdate:modelValue":o[4]||(o[4]=n=>t.styles.titleColor=n),class:"pl-12",id:"collection-theme-dialog-title-color"},null,8,["modelValue"])])]),e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-text-color"},{default:e.withCtx(()=>[...o[24]||(o[24]=[e.createTextVNode("Text color",-1)])]),_:1}),e.createElementVNode("div",ke,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[5]||(o[5]=n=>t.styles.textColor=n),type:"color",label:"Text color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.textColor]]),e.createVNode(C,{modelValue:t.styles.textColor,"onUpdate:modelValue":o[6]||(o[6]=n=>t.styles.textColor=n),class:"pl-12",id:"collection-theme-dialog-text-color"},null,8,["modelValue"])])]),e.createElementVNode("div",null,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-border-color"},{default:e.withCtx(()=>[...o[25]||(o[25]=[e.createTextVNode("Border color",-1)])]),_:1}),e.createElementVNode("div",Ne,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[7]||(o[7]=n=>t.styles.borderColor=n),type:"color",label:"Border color",class:"absolute top-0.5 left-1 size-8"},null,512),[[e.vModelText,t.styles.borderColor]]),e.createVNode(C,{modelValue:t.styles.borderColor,"onUpdate:modelValue":o[8]||(o[8]=n=>t.styles.borderColor=n),class:"pl-12",id:"collection-theme-dialog-border-color"},null,8,["modelValue"])])])]),e.createElementVNode("div",{style:e.normalizeStyle(`--card-background-color: ${t.styles.backgroundColor}; --card-title-color: ${t.styles.titleColor}; --card-text-color: ${t.styles.textColor}`)},[e.createVNode(p,{class:"mb-4"},{default:e.withCtx(()=>[...o[26]||(o[26]=[e.createTextVNode("Shape",-1)])]),_:1}),e.createElementVNode("div",{class:"grid grid-cols-3 gap-4 mb-6 p-2 rounded",style:e.normalizeStyle({backgroundColor:S.defaultBackground})},[e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[9]||(o[9]=n=>t.styles.roundness="none")},[o[27]||(o[27]=e.createElementVNode("div",{class:"text-center px-8 py-4 bg-[var(--card-background-color)]"},[e.createElementVNode("strong",{class:"text-2xl text-[var(--card-title-color)]"},"Card"),e.createElementVNode("p",{class:"text-[var(--card-text-color)]"},"Lorem ipsum dolor sit amet.")],-1)),t.styles.roundness!=="none"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[10]||(o[10]=n=>t.styles.roundness="small")},[o[28]||(o[28]=e.createElementVNode("div",{class:"text-center px-8 py-4 bg-[var(--card-background-color)] rounded-[8px]"},[e.createElementVNode("strong",{class:"text-2xl text-[var(--card-title-color)]"},"Card"),e.createElementVNode("p",{class:"text-[var(--card-text-color)]"},"Lorem ipsum dolor sit amet.")],-1)),t.styles.roundness!=="small"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[11]||(o[11]=n=>t.styles.roundness="medium")},[o[29]||(o[29]=e.createElementVNode("div",{class:"text-center px-8 py-4 bg-[var(--card-background-color)] rounded-[12px]"},[e.createElementVNode("strong",{class:"text-2xl text-[var(--card-title-color)]"},"Card"),e.createElementVNode("p",{class:"text-[var(--card-text-color)]"},"Lorem ipsum dolor sit amet.")],-1)),t.styles.roundness!=="medium"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))])],4),e.createVNode(p,{class:"mb-4"},{default:e.withCtx(()=>[...o[30]||(o[30]=[e.createTextVNode("Style",-1)])]),_:1}),e.createElementVNode("div",{class:"grid grid-cols-4 gap-4 mb-6 p-2 rounded",style:e.normalizeStyle(`--card-border-radius: ${f(t.styles.roundness)}px; --card-border-color: ${t.styles.borderColor}; background-color: ${S.defaultBackground}`)},[e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[12]||(o[12]=n=>t.styles.style="default")},[o[31]||(o[31]=e.createElementVNode("div",{class:"text-center px-8 py-4 bg-[var(--card-background-color)] rounded-[var(--card-border-radius)]"},[e.createElementVNode("strong",{class:"text-2xl text-[var(--card-title-color)]"},"Card"),e.createElementVNode("p",{class:"text-[var(--card-text-color)]"},"Lorem ipsum dolor sit amet.")],-1)),t.styles.style!=="default"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[13]||(o[13]=n=>t.styles.style="outline")},[o[32]||(o[32]=e.createElementVNode("div",{class:"text-center px-8 py-4 bg-[var(--card-background-color)] rounded-[var(--card-border-radius)] border border-[var(--card-border-color)]"},[e.createElementVNode("strong",{class:"text-2xl text-[var(--card-title-color)]"},"Card"),e.createElementVNode("p",{class:"text-[var(--card-text-color)]"},"Lorem ipsum dolor sit amet.")],-1)),t.styles.style!=="outline"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[14]||(o[14]=n=>t.styles.style="shadow")},[o[33]||(o[33]=e.createElementVNode("div",{class:"text-center px-8 py-4 bg-[var(--card-background-color)] rounded-[var(--card-border-radius)]",style:{"box-shadow":"0 3px 6px #ccc"}},[e.createElementVNode("strong",{class:"text-2xl text-[var(--card-title-color)]"},"Card"),e.createElementVNode("p",{class:"text-[var(--card-text-color)]"},"Lorem ipsum dolor sit amet.")],-1)),t.styles.style!=="shadow"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))]),e.createElementVNode("div",{class:"flex flex-col gap-2 items-center cursor-pointer",onClick:o[15]||(o[15]=n=>t.styles.style="retro")},[e.createElementVNode("div",{class:"text-center px-8 py-4 bg-[var(--card-background-color)] rounded-[var(--card-border-radius)]",style:e.normalizeStyle(`box-shadow: inset 0 0 0 2px ${t.styles.borderColor}, 2px 2px 0 ${t.styles.borderColor};`)},[...o[34]||(o[34]=[e.createElementVNode("strong",{class:"text-2xl text-[var(--card-title-color)]"},"Card",-1),e.createElementVNode("p",{class:"text-[var(--card-text-color)]"},"Lorem ipsum dolor sit amet.",-1)])],4),t.styles.style!=="retro"?(e.openBlock(),e.createBlock(e.unref(m.Circle),{key:0,class:"size-4 text-black/30"})):(e.openBlock(),e.createBlock(e.unref(m.CircleCheckBig),{key:1,class:"size-4 text-black"}))])],4)],4),o[41]||(o[41]=e.createElementVNode("h2",{class:"font-semibold mb-4"},"Rendering Method",-1)),e.createElementVNode("div",Ee,[e.createElementVNode("div",null,[e.createElementVNode("div",Be,[e.createVNode(p,{class:"mb-4 text-muted-foreground"},{default:e.withCtx(()=>[...o[35]||(o[35]=[e.createTextVNode("Choose how this section should be styled on your site:",-1)])]),_:1}),e.createVNode(s,{modelValue:t.rendering,"onUpdate:modelValue":o[16]||(o[16]=n=>t.rendering=n),"default-value":"class"},{default:e.withCtx(()=>[e.createElementVNode("div",Te,[e.createVNode(E,{id:"collection-theme-dialog-render-class",value:"class"}),e.createVNode(p,{for:"collection-theme-dialog-render-class"},{default:e.withCtx(()=>[...o[36]||(o[36]=[e.createTextVNode("Use a CSS class",-1)])]),_:1})]),e.createElementVNode("div",we,[e.createVNode(E,{id:"collection-theme-dialog-render-component",value:"component"}),e.createVNode(p,{for:"collection-theme-dialog-render-component"},{default:e.withCtx(()=>[...o[37]||(o[37]=[e.createTextVNode("Custom component",-1)])]),_:1})])]),_:1},8,["modelValue"])])])]),e.createElementVNode("div",De,[t.rendering==="class"?(e.openBlock(),e.createElementBlock("div",Se,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-class-name"},{default:e.withCtx(()=>[...o[38]||(o[38]=[e.createTextVNode("Class name",-1)])]),_:1}),e.createElementVNode("div",Fe,[e.createVNode(C,{modelValue:t.className,"onUpdate:modelValue":o[17]||(o[17]=n=>t.className=n),id:"collection-theme-dialog-class-name"},null,8,["modelValue"])])])):(e.openBlock(),e.createElementBlock("div",$e,[e.createVNode(p,{class:"mb-2",for:"collection-theme-dialog-component-name"},{default:e.withCtx(()=>[...o[39]||(o[39]=[e.createTextVNode("Component name",-1)])]),_:1}),e.createElementVNode("div",ze,[e.createVNode(C,{modelValue:t.componentName,"onUpdate:modelValue":o[18]||(o[18]=n=>t.componentName=n),id:"collection-theme-dialog-component-name"},null,8,["modelValue"])])]))]),t.rendering==="class"?(e.openBlock(),e.createElementBlock("pre",Ue,e.toDisplayString(r.value),1)):e.createCommentVNode("",!0)]),e.createVNode(u,null,{default:e.withCtx(()=>[v.value==="edit"&&!d.value?(e.openBlock(),e.createBlock(l,{key:0,variant:"destructive",class:"mr-auto",onClick:D},{default:e.withCtx(()=>[...o[42]||(o[42]=[e.createTextVNode(" Delete Style ",-1)])]),_:1})):e.createCommentVNode("",!0),v.value==="edit"&&d.value?(e.openBlock(),e.createBlock(l,{key:1,variant:"outline",class:"mr-auto",onClick:$},{default:e.withCtx(()=>[...o[43]||(o[43]=[e.createTextVNode(" Reset to Default ",-1)])]),_:1})):e.createCommentVNode("",!0),v.value==="create"?(e.openBlock(),e.createBlock(l,{key:2,type:"submit",onClick:B},{default:e.withCtx(()=>[...o[44]||(o[44]=[e.createTextVNode(" Add Style ",-1)])]),_:1})):(e.openBlock(),e.createBlock(l,{key:3,type:"submit",onClick:w},{default:e.withCtx(()=>[...o[45]||(o[45]=[e.createTextVNode(" Save Changes ",-1)])]),_:1}))]),_:1})]),_:1})]),_:1},8,["open"])}}}),Ae={class:"w-full"},Re={class:"flex items-center justify-between gap-4 w-full my-4"},Le={key:0,class:"flex gap-4 flex-wrap mb-8"},_e=["onClick"],Ie={class:"text-muted-foreground group-hover/item:text-white transition-colors duration-300"},Me={key:1,class:"flex gap-4 flex-wrap mb-8"},Oe={key:2,class:"flex gap-4 flex-wrap mb-8"},Ge=["onClick"],Je={class:"text-muted-foreground group-hover/item:text-white transition-colors duration-300"},Pe={key:3,class:"flex gap-4 flex-wrap mb-8"},He={key:4,class:"flex gap-4 flex-wrap mb-8"},je=["onClick"],qe={class:"text-muted-foreground group-hover/item:text-white transition-colors duration-300"},Ke={key:5,class:"flex gap-4 flex-wrap mb-8"},Qe=e.defineComponent({__name:"GlobalStyling",setup(S){const{navigateTo:F}=U.useModuleRoute(),{getModuleData:g,setModuleData:b}=U.useModuleStorage();U.useModuleBreadcrumbs(()=>[{text:"Global Styling"}]);const V=e.ref(""),x=e.ref(""),v=e.ref(""),i=e.ref(null),d=e.ref(null),t=e.ref(null),T=e.computed(()=>i.value===null?null:i.value&&i.value.find(s=>s.id==="DEFAULT")?i.value:[{id:"DEFAULT",name:"Default",className:"",styles:{backgroundColor:"#FFFFFF",textColor:"#000000"}},...i.value]),B=e.computed(()=>T.value?.find(s=>s.id==="DEFAULT")?.styles.backgroundColor??"#FFFFFF"),w=e.computed(()=>d.value===null?null:d.value&&d.value.find(s=>s.id==="DEFAULT")?d.value:[{id:"DEFAULT",name:"Default",className:"",styles:{backgroundColor:"#FFFFFF",textColor:"#000000"}},...d.value]),D=e.computed(()=>t.value===null?null:t.value&&t.value.find(s=>s.id==="DEFAULT")?t.value:[{id:"DEFAULT",name:"Default",className:"",styles:{backgroundColor:"#FFFFFF",textColor:"#000000"}},...t.value]);async function $(s){let l=JSON.parse(JSON.stringify(s)),u=crypto.randomUUID();l.id=u,i.value.push(l),i.value=await g("sectionThemes")||[],i.value.push(l),b("sectionThemes",i.value)}async function f(s){let l=JSON.parse(JSON.stringify(s)),u=i.value.findIndex(c=>c.id===l.id);u!==-1?i.value[u]=l:l.id==="DEFAULT"&&(Array.isArray(i.value)||(i.value=[]),i.value=[{id:"DEFAULT",name:"Default",styles:l.styles},...i.value]),i.value=await g("sectionThemes")||[],u=i.value.findIndex(c=>c.id===l.id),u!==-1?(i.value[u]=l,b("sectionThemes",i.value)):l.id==="DEFAULT"&&(Array.isArray(i.value)||(i.value=[]),i.value=[{id:"DEFAULT",name:"Default",styles:l.styles},...i.value],b("sectionThemes",i.value))}async function r(s){i.value=i.value.filter(l=>l.id!==s),i.value=await g("sectionThemes")||[],i.value=i.value.filter(l=>l.id!==s),b("sectionThemes",i.value)}async function a(s){let l=JSON.parse(JSON.stringify(s)),u=crypto.randomUUID();l.id=u,d.value.push(l),d.value=await g("buttonThemes")||[],d.value.push(l),b("buttonThemes",d.value)}async function o(s){let l=JSON.parse(JSON.stringify(s)),u=d.value.findIndex(c=>c.id===l.id);u!==-1?d.value[u]=l:l.id==="DEFAULT"&&(Array.isArray(d.value)||(d.value=[]),d.value=[{id:"DEFAULT",name:"Default",styles:l.styles},...d.value]),d.value=await g("buttonThemes")||[],u=d.value.findIndex(c=>c.id===l.id),u!==-1?(d.value[u]=l,b("buttonThemes",d.value)):l.id==="DEFAULT"&&(Array.isArray(d.value)||(d.value=[]),d.value=[{id:"DEFAULT",name:"Default",styles:l.styles},...d.value],b("buttonThemes",d.value))}async function z(s){d.value=d.value.filter(l=>l.id!==s),d.value=await g("buttonThemes")||[],d.value=d.value.filter(l=>l.id!==s),b("buttonThemes",d.value)}const k=function(s){let l={};if(l.backgroundColor=s.styles.backgroundColor,l.color=s.styles.textColor,s.styles.buttonStyle==="outline"?l.border=`1px solid ${s.styles.borderColor}`:s.styles.buttonStyle==="shadow"?l.boxShadow="0 3px 6px #ccc":s.styles.buttonStyle==="retro"&&(l.boxShadow=`inset 0 0 0 2px ${s.styles.borderColor}, 2px 2px 0 ${s.styles.borderColor}`),s.styles.buttonRoundness!=="none"){let u=0;s.styles.buttonRoundness==="small"?u=4:s.styles.buttonRoundness==="medium"?u=8:s.styles.buttonRoundness==="pill"&&(u=9999),l.borderRadius=`${u}px`}return l};async function N(s){let l=JSON.parse(JSON.stringify(s)),u=crypto.randomUUID();l.id=u,t.value.push(l),t.value=await g("cardThemes")||[],t.value.push(l),b("cardThemes",t.value)}async function p(s){let l=JSON.parse(JSON.stringify(s)),u=t.value.findIndex(c=>c.id===l.id);u!==-1?t.value[u]=l:l.id==="DEFAULT"&&(Array.isArray(t.value)||(t.value=[]),t.value=[{id:"DEFAULT",name:"Default",styles:l.styles},...t.value]),t.value=await g("cardThemes")||[],u=t.value.findIndex(c=>c.id===l.id),u!==-1?(t.value[u]=l,b("cardThemes",t.value)):l.id==="DEFAULT"&&(Array.isArray(t.value)||(t.value=[]),t.value=[{id:"DEFAULT",name:"Default",styles:l.styles},...t.value],b("cardThemes",t.value))}async function C(s){t.value=t.value.filter(l=>l.id!==s),t.value=await g("cardThemes")||[],t.value=t.value.filter(l=>l.id!==s),b("cardThemes",t.value)}const E=function(s){let l={};if(l.backgroundColor=s.styles.backgroundColor,l.color=s.styles.textColor,s.styles.style==="outline"?l.border=`1px solid ${s.styles.borderColor}`:s.styles.style==="shadow"?l.boxShadow="0 3px 6px #ccc":s.styles.style==="retro"&&(l.boxShadow=`inset 0 0 0 2px ${s.styles.borderColor}, 2px 2px 0 ${s.styles.borderColor}`),s.styles.roundness!=="none"){let u=0;s.styles.roundness==="small"?u=4:s.styles.roundness==="medium"&&(u=8),l.borderRadius=`${u}px`}return l};return e.onMounted(()=>{g("sectionThemes").then(s=>{i.value=s||[]}),g("buttonThemes").then(s=>{d.value=s||[]}),g("cardThemes").then(s=>{t.value=s||[]})}),(s,l)=>{const u=e.resolveComponent("Button"),c=e.resolveComponent("Skeleton");return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",Ae,[e.createElementVNode("div",Re,[e.createVNode(u,{onClick:l[0]||(l[0]=y=>e.unref(F)("/")),variant:"link",class:"!pl-0"},{default:e.withCtx(()=>[e.createVNode(e.unref(m.ChevronLeft),{class:"size-4"}),l[4]||(l[4]=e.createTextVNode(" Collections ",-1))]),_:1})]),l[10]||(l[10]=e.createElementVNode("h1",{class:"text-3xl mb-8"},"Global Styling",-1)),l[11]||(l[11]=e.createElementVNode("h3",{class:"text-2xl mb-2"},"Section Variants",-1)),l[12]||(l[12]=e.createElementVNode("p",{class:"mb-6 max-w-3xl text-muted-foreground"}," Set up the default design variants for your sections. These styles will be available across all collections by default, but you can choose to disable them within individual collections if needed. ",-1)),T.value!==null?(e.openBlock(),e.createElementBlock("div",Le,[e.createElementVNode("div",{class:"group/item flex flex-col gap-2 items-center",onClick:l[1]||(l[1]=y=>V.value.openDialog())},[e.createVNode(u,{variant:"outline",class:"size-44 border-dotted",tabindex:"-1"},{default:e.withCtx(()=>[e.createVNode(e.unref(m.Plus),{class:"size-14"})]),_:1}),l[5]||(l[5]=e.createElementVNode("p",{class:"text-muted-foreground group-hover/item:text-white transition-colors duration-300"},"New Style",-1))]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(T.value,y=>(e.openBlock(),e.createElementBlock("div",{class:"group/item flex flex-col gap-2 text-black items-center cursor-pointer hover:brightness-105 transition-all duration-300",key:y.id,onClick:n=>V.value.openDialog(y)},[e.createElementVNode("div",{class:"flex flex-col items-start rounded-md p-4 size-44",style:e.normalizeStyle({backgroundColor:y.styles.backgroundColor,border:"1px solid #E5E7EB"})},[e.createElementVNode("strong",{class:"text-2xl",style:e.normalizeStyle({color:y.styles.titleColor})},"Title",4),e.createElementVNode("p",{class:"mb-1",style:e.normalizeStyle({color:y.styles.textColor})},[...l[6]||(l[6]=[e.createTextVNode("Lorem ipsum dolor",-1),e.createElementVNode("br",null,null,-1),e.createTextVNode("sit amet.",-1)])],4),y.className?(e.openBlock(),e.createElementBlock("p",{key:0,class:"px-3 py-1.5 rounded-[99px]",style:e.normalizeStyle({backgroundColor:y.styles.textColor,color:y.styles.backgroundColor})},"."+e.toDisplayString(y.className),5)):e.createCommentVNode("",!0)],4),e.createElementVNode("p",Ie,e.toDisplayString(y.name),1)],8,_e))),128))])):(e.openBlock(),e.createElementBlock("div",Me,[e.createVNode(c,{class:"size-44 rounded-md"}),e.createVNode(c,{class:"size-44 rounded-md"})])),l[13]||(l[13]=e.createElementVNode("h3",{class:"text-2xl mb-2"},"Button Variants",-1)),l[14]||(l[14]=e.createElementVNode("p",{class:"mb-6 max-w-3xl text-muted-foreground"}," Define your standard button styles here. Collections can inherit these defaults or customize their own variants for more tailored experiences. ",-1)),w.value!==null?(e.openBlock(),e.createElementBlock("div",Oe,[e.createElementVNode("div",{class:"group/item flex flex-col gap-2 items-center",onClick:l[2]||(l[2]=y=>x.value.openDialog())},[e.createVNode(u,{variant:"outline",class:"size-44 border-dotted",tabindex:"-1"},{default:e.withCtx(()=>[e.createVNode(e.unref(m.Plus),{class:"size-14"})]),_:1}),l[7]||(l[7]=e.createElementVNode("p",{class:"text-muted-foreground group-hover/item:text-white transition-colors duration-300"},"New Style",-1))]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(w.value,y=>(e.openBlock(),e.createElementBlock("div",{class:"group/item flex flex-col gap-2 text-black items-center cursor-pointer hover:brightness-105 transition-all duration-300",key:y.id,onClick:n=>x.value.openDialog(y)},[e.createElementVNode("div",{class:"flex flex-col items-center justify-center rounded-md p-4 size-44",style:e.normalizeStyle({backgroundColor:B.value})},[e.createElementVNode("div",{style:e.normalizeStyle(k(y)),class:"px-4 py-2"}," Button ",4)],4),e.createElementVNode("p",Je,e.toDisplayString(y.name),1)],8,Ge))),128))])):(e.openBlock(),e.createElementBlock("div",Pe,[e.createVNode(c,{class:"size-44 rounded-md"}),e.createVNode(c,{class:"size-44 rounded-md"})])),l[15]||(l[15]=e.createElementVNode("h3",{class:"text-2xl mb-2"},"Card Variants",-1)),l[16]||(l[16]=e.createElementVNode("p",{class:"mb-6 max-w-3xl text-muted-foreground"}," Define your standard card styles here. Collections can inherit these defaults or customize their own variants for more tailored experiences. ",-1)),D.value!==null?(e.openBlock(),e.createElementBlock("div",He,[e.createElementVNode("div",{class:"group/item flex flex-col gap-2 items-center",onClick:l[3]||(l[3]=y=>v.value.openDialog())},[e.createVNode(u,{variant:"outline",class:"size-44 border-dotted",tabindex:"-1"},{default:e.withCtx(()=>[e.createVNode(e.unref(m.Plus),{class:"size-14"})]),_:1}),l[8]||(l[8]=e.createElementVNode("p",{class:"text-muted-foreground group-hover/item:text-white transition-colors duration-300"},"New Style",-1))]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(D.value,y=>(e.openBlock(),e.createElementBlock("div",{class:"group/item flex flex-col gap-2 text-black items-center cursor-pointer hover:brightness-105 transition-all duration-300",key:y.id,onClick:n=>v.value.openDialog(y)},[e.createElementVNode("div",{class:"flex flex-col items-center justify-center rounded-md p-4 size-44",style:e.normalizeStyle({backgroundColor:B.value})},[e.createElementVNode("div",{style:e.normalizeStyle(E(y)),class:"p-4"},[e.createElementVNode("strong",{class:"text-2xl",style:e.normalizeStyle({color:y.styles.titleColor})},"Card",4),l[9]||(l[9]=e.createElementVNode("p",null,"Lorem ipsum dolor sit amet.",-1))],4)],4),e.createElementVNode("p",qe,e.toDisplayString(y.name),1)],8,je))),128))])):(e.openBlock(),e.createElementBlock("div",Ke,[e.createVNode(c,{class:"size-44 rounded-md"}),e.createVNode(c,{class:"size-44 rounded-md"})]))]),e.createVNode(X,{ref_key:"sectionStyleDialog",ref:V,onAdd:$,onEdit:f,onDelete:r},null,512),e.createVNode(xe,{ref_key:"buttonStyleDialog",ref:x,defaultBackground:B.value,onAdd:a,onEdit:o,onDelete:z},null,8,["defaultBackground"]),e.createVNode(he,{ref_key:"cardStyleDialog",ref:v,defaultBackground:B.value,onAdd:N,onEdit:p,onDelete:C},null,8,["defaultBackground"])],64)}}});exports.default=Qe;
|