@plitzi/sdk-elements 0.33.1 → 0.34.0

package/dist/elements/advanced/Reference/index.d.ts

@@ -2,57 +2,58 @@ declare const Reference: {
     (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Reference').ReferenceProps>): import("react").JSX.Element;
     displayName: string;
 } & {
-    type: string;
-    content: {
-        attributes: {
-            referenceType: string;
-            referenceId: string;
-            referenceContainer: string;
+    readonly type: "reference";
+    readonly content: {
+        readonly attributes: {
+            readonly referenceType: "element";
+            readonly referenceId: "";
+            readonly referenceContainer: "";
         };
-        definition: {
-            label: string;
-            type: string;
-            description: string;
-            items: never[];
-            bindings: {};
-            styleSelectors: {
-                base: string;
+        readonly definition: {
+            readonly label: "Reference";
+            readonly type: "reference";
+            readonly description: "Reuses another element or template by id, rendering it in place.";
+            readonly items: readonly [];
+            readonly bindings: {};
+            readonly styleSelectors: {
+                readonly base: "";
             };
-            initialState: {
-                visibility: boolean;
+            readonly initialState: {
+                readonly visibility: true;
             };
         };
-        builder: {
-            canDelete: boolean;
-            canSelect: boolean;
-            canDragDrop: boolean;
-            canMove: boolean;
-            canTemplate: boolean;
-            itemsAllowed: never[];
-            itemsNotAllowed: never[];
+        readonly builder: {
+            readonly canDelete: true;
+            readonly canSelect: true;
+            readonly canDragDrop: true;
+            readonly canMove: true;
+            readonly canTemplate: true;
+            readonly itemsAllowed: readonly [];
+            readonly itemsNotAllowed: readonly [];
         };
-        market: {
-            category: string;
-            owner: string;
-            verified: boolean;
-            license: string;
-            website: string;
-            backgroundColor: string;
-            icon: string;
+        readonly market: {
+            readonly category: "advanced";
+            readonly owner: "Plitzi";
+            readonly verified: true;
+            readonly license: "MIT";
+            readonly website: "https://plitzi.com";
+            readonly backgroundColor: "#4422ee";
+            readonly icon: "fa-solid fa-asterisk";
         };
-        defaultStyle: {
-            name: string;
-            displayMode: string;
-            style: {
-                base: {
-                    default: {
-                        'min-width': string;
-                        'min-height': string;
-                    };
+        readonly defaultStyle: {
+            readonly name: "Reference Element";
+            readonly displayMode: "desktop";
+            readonly style: {
+                readonly base: {
+                    readonly default: {};
                 };
             };
         };
-        settings: {};
+        readonly settings: {};
     };
-};
+} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    referenceId: string;
+    referenceType: import('@plitzi/sdk-shared').ElementLayoutType;
+    referenceContainer: string;
+}>>;
 export default Reference;

package/dist/elements/advanced/Reference/index.mjs

@@ -1,50 +1,6 @@
-import e from "./Reference.mjs";
+import e from "./declaration.mjs";
+import t from "./Reference.mjs";
 //#region src/elements/advanced/Reference/index.ts
-var t = Object.assign(e, {
-	type: "reference",
-	content: {
-		attributes: {
-			referenceType: "element",
-			referenceId: "",
-			referenceContainer: ""
-		},
-		definition: {
-			label: "Reference",
-			type: "reference",
-			description: "",
-			items: [],
-			bindings: {},
-			styleSelectors: { base: "" },
-			initialState: { visibility: !0 }
-		},
-		builder: {
-			canDelete: !0,
-			canSelect: !0,
-			canDragDrop: !0,
-			canMove: !0,
-			canTemplate: !0,
-			itemsAllowed: [],
-			itemsNotAllowed: []
-		},
-		market: {
-			category: "advanced",
-			owner: "Plitzi",
-			verified: !0,
-			license: "MIT",
-			website: "https://plitzi.com",
-			backgroundColor: "#4422ee",
-			icon: "fa-solid fa-asterisk"
-		},
-		defaultStyle: {
-			name: "Reference Element",
-			displayMode: "desktop",
-			style: { base: { default: {
-				"min-width": "50px",
-				"min-height": "50px"
-			} } }
-		},
-		settings: {}
-	}
-});
+var n = Object.assign(t, e);
 //#endregion
-export { t as default };
+export { n as default };

package/dist/elements/basic/Button/Button.mjs

@@ -1,15 +1,15 @@
-import e from "../../../Element/hooks/useElement.mjs";
-import { RootElement as t } from "../../../Element/RootElement.mjs";
-import n from "../../../Element/hocs/withElement.mjs";
+import e from "../../../Element/hocs/withElement.mjs";
+import t from "../../../Element/hooks/useElement.mjs";
+import { RootElement as n } from "../../../Element/RootElement.mjs";
 import { useMemo as r } from "react";
 import i from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
 import { jsxs as a } from "react/jsx-runtime";
 import o from "clsx";
 //#region src/elements/basic/Button/Button.tsx
-var s = ({ ref: n, className: s = "", children: c, contentPlacement: l = "after", content: u = "Button", subType: d = "button", disabled: f = !1 }) => {
-	let { definition: { label: p } } = e(), { settings: { previewMode: m } } = i(), h = r(() => typeof u == "string" ? u : p, [u, p]);
-	return /* @__PURE__ */ a(t, {
-		ref: n,
+var s = ({ ref: e, className: s = "", children: c, contentPlacement: l = "after", content: u = "Button", subType: d = "button", disabled: f = !1 }) => {
+	let { definition: { label: p } } = t(), { settings: { previewMode: m } } = i(), h = r(() => typeof u == "string" ? u : p, [u, p]);
+	return /* @__PURE__ */ a(n, {
+		ref: e,
 		tag: "button",
 		type: m ? d : "button",
 		className: o("plitzi-component__button", s, { "container--empty--skip": !m && !c && u }),
@@ -21,6 +21,6 @@ var s = ({ ref: n, className: s = "", children: c, contentPlacement: l = "after"
 			l === "after" && u
 		]
 	});
-}, c = n(s);
+}, c = e(s);
 //#endregion
 export { s as Button, c as default };

package/dist/elements/basic/Button/declaration.d.ts

@@ -0,0 +1,127 @@
+import { ButtonProps } from './Button';
+import { AuthorableAttributes } from '@plitzi/sdk-shared/authoring/declare';
+/** What this element can be authored with — its component's own props, minus what the runtime supplies. */
+export type ButtonAttributes = AuthorableAttributes<ButtonProps>;
+declare const declaration: {
+    readonly type: "button";
+    readonly content: {
+        readonly attributes: {
+            readonly contentPlacement: "after";
+            readonly content: "Button";
+            readonly subType: "button";
+            readonly disabled: false;
+        };
+        readonly definition: {
+            readonly label: "Button";
+            readonly type: "button";
+            readonly description: string;
+            readonly items: readonly [];
+            readonly bindings: {};
+            readonly styleSelectors: {
+                readonly base: "";
+            };
+            readonly initialState: {
+                readonly visibility: true;
+            };
+        };
+        readonly builder: {
+            readonly canDelete: true;
+            readonly canSelect: true;
+            readonly canDragDrop: true;
+            readonly canMove: true;
+            readonly canTemplate: true;
+            readonly itemsAllowed: readonly [];
+            readonly itemsNotAllowed: readonly [];
+        };
+        readonly market: {
+            readonly category: "basic";
+            readonly owner: "Plitzi";
+            readonly verified: true;
+            readonly license: "MIT";
+            readonly website: "https://plitzi.com";
+            readonly backgroundColor: "#4422ee";
+            readonly icon: "fa-solid fa-stop";
+        };
+        readonly defaultStyle: {
+            readonly name: "Button";
+            readonly displayMode: "desktop";
+            readonly style: {
+                readonly base: {
+                    readonly default: {};
+                };
+            };
+            readonly subTypes: {
+                readonly button: {
+                    readonly name: "Default Button";
+                    readonly displayMode: "desktop";
+                    readonly style: {
+                        readonly base: {
+                            readonly default: {
+                                readonly 'padding-top': "6px";
+                                readonly 'padding-left': "12px";
+                                readonly 'padding-right': "12px";
+                                readonly 'padding-bottom': "6px";
+                                readonly cursor: "pointer";
+                                readonly 'font-size': "16px";
+                                readonly 'line-height': "24px";
+                                readonly 'border-top-left-radius': "4px";
+                                readonly 'border-top-right-radius': "4px";
+                                readonly 'border-bottom-left-radius': "4px";
+                                readonly 'border-bottom-right-radius': "4px";
+                            };
+                        };
+                    };
+                };
+                readonly reset: {
+                    readonly name: "Reset Button";
+                    readonly displayMode: "desktop";
+                    readonly style: {
+                        readonly base: {
+                            readonly default: {
+                                readonly 'padding-top': "6px";
+                                readonly 'padding-left': "12px";
+                                readonly 'padding-right': "12px";
+                                readonly 'padding-bottom': "6px";
+                                readonly cursor: "pointer";
+                                readonly 'font-size': "16px";
+                                readonly 'line-height': "24px";
+                                readonly 'border-top-left-radius': "4px";
+                                readonly 'border-top-right-radius': "4px";
+                                readonly 'border-bottom-left-radius': "4px";
+                                readonly 'border-bottom-right-radius': "4px";
+                            };
+                        };
+                    };
+                };
+                readonly submit: {
+                    readonly name: "Submit Button";
+                    readonly displayMode: "desktop";
+                    readonly style: {
+                        readonly base: {
+                            readonly default: {
+                                readonly 'padding-top': "6px";
+                                readonly 'padding-left': "12px";
+                                readonly 'padding-right': "12px";
+                                readonly 'padding-bottom': "6px";
+                                readonly cursor: "pointer";
+                                readonly 'font-size': "16px";
+                                readonly 'line-height': "24px";
+                                readonly 'border-top-left-radius': "4px";
+                                readonly 'border-top-right-radius': "4px";
+                                readonly 'border-bottom-left-radius': "4px";
+                                readonly 'border-bottom-right-radius': "4px";
+                            };
+                        };
+                    };
+                };
+            };
+        };
+        readonly settings: {};
+    };
+} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    content?: string | undefined;
+    disabled?: boolean | undefined;
+    subType?: "button" | "submit" | "reset" | undefined;
+    contentPlacement?: "before" | "after" | undefined;
+}>>;
+export default declaration;

package/dist/elements/basic/Button/declaration.mjs

@@ -0,0 +1,101 @@
+import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
+//#region src/elements/basic/Button/declaration.ts
+var t = e()({
+	type: "button",
+	content: {
+		attributes: {
+			contentPlacement: "after",
+			content: "Button",
+			subType: "button",
+			disabled: !1
+		},
+		definition: {
+			label: "Button",
+			type: "button",
+			description: "A clickable button. On its own it only renders; wire an interaction flow (trigger onClick → callbacks) to make it DO something.",
+			items: [],
+			bindings: {},
+			styleSelectors: { base: "" },
+			initialState: { visibility: !0 }
+		},
+		builder: {
+			canDelete: !0,
+			canSelect: !0,
+			canDragDrop: !0,
+			canMove: !0,
+			canTemplate: !0,
+			itemsAllowed: [],
+			itemsNotAllowed: []
+		},
+		market: {
+			category: "basic",
+			owner: "Plitzi",
+			verified: !0,
+			license: "MIT",
+			website: "https://plitzi.com",
+			backgroundColor: "#4422ee",
+			icon: "fa-solid fa-stop"
+		},
+		defaultStyle: {
+			name: "Button",
+			displayMode: "desktop",
+			style: { base: { default: {} } },
+			subTypes: {
+				button: {
+					name: "Default Button",
+					displayMode: "desktop",
+					style: { base: { default: {
+						"padding-top": "6px",
+						"padding-left": "12px",
+						"padding-right": "12px",
+						"padding-bottom": "6px",
+						cursor: "pointer",
+						"font-size": "16px",
+						"line-height": "24px",
+						"border-top-left-radius": "4px",
+						"border-top-right-radius": "4px",
+						"border-bottom-left-radius": "4px",
+						"border-bottom-right-radius": "4px"
+					} } }
+				},
+				reset: {
+					name: "Reset Button",
+					displayMode: "desktop",
+					style: { base: { default: {
+						"padding-top": "6px",
+						"padding-left": "12px",
+						"padding-right": "12px",
+						"padding-bottom": "6px",
+						cursor: "pointer",
+						"font-size": "16px",
+						"line-height": "24px",
+						"border-top-left-radius": "4px",
+						"border-top-right-radius": "4px",
+						"border-bottom-left-radius": "4px",
+						"border-bottom-right-radius": "4px"
+					} } }
+				},
+				submit: {
+					name: "Submit Button",
+					displayMode: "desktop",
+					style: { base: { default: {
+						"padding-top": "6px",
+						"padding-left": "12px",
+						"padding-right": "12px",
+						"padding-bottom": "6px",
+						cursor: "pointer",
+						"font-size": "16px",
+						"line-height": "24px",
+						"border-top-left-radius": "4px",
+						"border-top-right-radius": "4px",
+						"border-bottom-left-radius": "4px",
+						"border-bottom-right-radius": "4px"
+					} } }
+				}
+			}
+		},
+		settings: {}
+	}
+});
+//#endregion
+export { t as default };

package/dist/elements/basic/Button/index.d.ts

@@ -2,125 +2,125 @@ declare const Button: {
     (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Button').ButtonProps>): import("react").JSX.Element;
     displayName: string;
 } & {
-    type: string;
-    content: {
-        attributes: {
-            contentPlacement: string;
-            content: string;
-            subType: string;
-            disabled: boolean;
+    readonly type: "button";
+    readonly content: {
+        readonly attributes: {
+            readonly contentPlacement: "after";
+            readonly content: "Button";
+            readonly subType: "button";
+            readonly disabled: false;
         };
-        definition: {
-            label: string;
-            type: string;
-            items: never[];
-            bindings: {};
-            styleSelectors: {
-                base: string;
+        readonly definition: {
+            readonly label: "Button";
+            readonly type: "button";
+            readonly description: string;
+            readonly items: readonly [];
+            readonly bindings: {};
+            readonly styleSelectors: {
+                readonly base: "";
             };
-            initialState: {
-                visibility: boolean;
+            readonly initialState: {
+                readonly visibility: true;
             };
         };
-        builder: {
-            canDelete: boolean;
-            canSelect: boolean;
-            canDragDrop: boolean;
-            canMove: boolean;
-            canTemplate: boolean;
-            itemsAllowed: never[];
-            itemsNotAllowed: never[];
+        readonly builder: {
+            readonly canDelete: true;
+            readonly canSelect: true;
+            readonly canDragDrop: true;
+            readonly canMove: true;
+            readonly canTemplate: true;
+            readonly itemsAllowed: readonly [];
+            readonly itemsNotAllowed: readonly [];
         };
-        market: {
-            category: string;
-            owner: string;
-            verified: boolean;
-            license: string;
-            website: string;
-            backgroundColor: string;
-            icon: string;
+        readonly market: {
+            readonly category: "basic";
+            readonly owner: "Plitzi";
+            readonly verified: true;
+            readonly license: "MIT";
+            readonly website: "https://plitzi.com";
+            readonly backgroundColor: "#4422ee";
+            readonly icon: "fa-solid fa-stop";
         };
-        defaultStyle: {
-            name: string;
-            displayMode: string;
-            style: {
-                base: {
-                    default: {};
+        readonly defaultStyle: {
+            readonly name: "Button";
+            readonly displayMode: "desktop";
+            readonly style: {
+                readonly base: {
+                    readonly default: {};
                 };
             };
-            subTypes: {
-                button: {
-                    name: string;
-                    displayMode: string;
-                    style: {
-                        base: {
-                            default: {
-                                'min-height': string;
-                                'min-width': string;
-                                'padding-top': string;
-                                'padding-left': string;
-                                'padding-right': string;
-                                'padding-bottom': string;
-                                cursor: string;
-                                'font-size': string;
-                                'line-height': string;
-                                'border-top-left-radius': string;
-                                'border-top-right-radius': string;
-                                'border-bottom-left-radius': string;
-                                'border-bottom-right-radius': string;
+            readonly subTypes: {
+                readonly button: {
+                    readonly name: "Default Button";
+                    readonly displayMode: "desktop";
+                    readonly style: {
+                        readonly base: {
+                            readonly default: {
+                                readonly 'padding-top': "6px";
+                                readonly 'padding-left': "12px";
+                                readonly 'padding-right': "12px";
+                                readonly 'padding-bottom': "6px";
+                                readonly cursor: "pointer";
+                                readonly 'font-size': "16px";
+                                readonly 'line-height': "24px";
+                                readonly 'border-top-left-radius': "4px";
+                                readonly 'border-top-right-radius': "4px";
+                                readonly 'border-bottom-left-radius': "4px";
+                                readonly 'border-bottom-right-radius': "4px";
                             };
                         };
                     };
                 };
-                reset: {
-                    name: string;
-                    displayMode: string;
-                    style: {
-                        base: {
-                            default: {
-                                'min-height': string;
-                                'min-width': string;
-                                'padding-top': string;
-                                'padding-left': string;
-                                'padding-right': string;
-                                'padding-bottom': string;
-                                cursor: string;
-                                'font-size': string;
-                                'line-height': string;
-                                'border-top-left-radius': string;
-                                'border-top-right-radius': string;
-                                'border-bottom-left-radius': string;
-                                'border-bottom-right-radius': string;
+                readonly reset: {
+                    readonly name: "Reset Button";
+                    readonly displayMode: "desktop";
+                    readonly style: {
+                        readonly base: {
+                            readonly default: {
+                                readonly 'padding-top': "6px";
+                                readonly 'padding-left': "12px";
+                                readonly 'padding-right': "12px";
+                                readonly 'padding-bottom': "6px";
+                                readonly cursor: "pointer";
+                                readonly 'font-size': "16px";
+                                readonly 'line-height': "24px";
+                                readonly 'border-top-left-radius': "4px";
+                                readonly 'border-top-right-radius': "4px";
+                                readonly 'border-bottom-left-radius': "4px";
+                                readonly 'border-bottom-right-radius': "4px";
                             };
                         };
                     };
                 };
-                submit: {
-                    name: string;
-                    displayMode: string;
-                    style: {
-                        base: {
-                            default: {
-                                'min-height': string;
-                                'min-width': string;
-                                'padding-top': string;
-                                'padding-left': string;
-                                'padding-right': string;
-                                'padding-bottom': string;
-                                cursor: string;
-                                'font-size': string;
-                                'line-height': string;
-                                'border-top-left-radius': string;
-                                'border-top-right-radius': string;
-                                'border-bottom-left-radius': string;
-                                'border-bottom-right-radius': string;
+                readonly submit: {
+                    readonly name: "Submit Button";
+                    readonly displayMode: "desktop";
+                    readonly style: {
+                        readonly base: {
+                            readonly default: {
+                                readonly 'padding-top': "6px";
+                                readonly 'padding-left': "12px";
+                                readonly 'padding-right': "12px";
+                                readonly 'padding-bottom': "6px";
+                                readonly cursor: "pointer";
+                                readonly 'font-size': "16px";
+                                readonly 'line-height': "24px";
+                                readonly 'border-top-left-radius': "4px";
+                                readonly 'border-top-right-radius': "4px";
+                                readonly 'border-bottom-left-radius': "4px";
+                                readonly 'border-bottom-right-radius': "4px";
                             };
                         };
                     };
                 };
             };
         };
-        settings: {};
+        readonly settings: {};
     };
-};
+} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    content?: string | undefined;
+    disabled?: boolean | undefined;
+    subType?: "button" | "submit" | "reset" | undefined;
+    contentPlacement?: "before" | "after" | undefined;
+}>>;
 export default Button;