@threadlabs/looma 0.3.0 → 0.4.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.
package/svelte/index.js DELETED
@@ -1,1881 +0,0 @@
1
- // src/index.ts
2
- import "@threadlabs/looma/core";
3
- import "@threadlabs/looma/layout";
4
- import "@threadlabs/looma/editor/ui";
5
-
6
- // src/generated/vanilla/UiAffordanceScope.js
7
- import { attachLoomaComponent } from "@threadlabs/looma/core/declarative";
8
- var definition = { ...{ "contract": { "tag": "ui-affordance-scope", "props": { "nearRadius": { "type": "number", "required": false, "target": { "attribute": "nearradius" }, "default": 16 } } }, "template": { "kind": "element", "name": "span", "attributes": [], "children": [{ "kind": "slot" }] }, "declarations": [], "root": { "kind": "native", "element": "span", "choices": ["span"] } }, source: { file: import.meta.url }, css: "" };
9
- function createUiAffordanceScope(options = {}) {
10
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
11
- const element = document.createElement("span");
12
- for (const [name, value] of Object.entries(attributes)) {
13
- if (value === null || value === void 0 || value === false) continue;
14
- element.setAttribute(name, value === true ? "" : String(value));
15
- }
16
- element.setAttribute("data-component", "ui-affordance-scope");
17
- element.setAttribute("data-component-root", "ui-affordance-scope");
18
- if (children.length > 0) {
19
- for (const child of children) element.append(child);
20
- } else {
21
- }
22
- attachLoomaComponent(element, definition, "ui-affordance-scope", componentProps);
23
- return element;
24
- }
25
-
26
- // src/generated/vanilla/UiAvatarGroup.js
27
- import { attachLoomaComponent as attachLoomaComponent2 } from "@threadlabs/looma/core/declarative";
28
- var definition2 = { ...{ "contract": { "tag": "ui-avatar-group", "props": { "label": { "type": "string", "required": false, "target": { "attribute": "aria-label" }, "default": "People" }, "max": { "type": "number", "required": false, "target": { "attribute": "max" }, "default": 5 } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "group" }, { "kind": "attribute", "name": "aria-label", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [{ "kind": "slot" }] }, "declarations": [{ "kind": "state", "name": "overflowCount", "expression": { "source": "0", "ast": { "kind": "literal", "value": 0 }, "dependencies": [] } }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
29
- function createUiAvatarGroup(options = {}) {
30
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
31
- const element = document.createElement("div");
32
- for (const [name, value] of Object.entries(attributes)) {
33
- if (value === null || value === void 0 || value === false) continue;
34
- element.setAttribute(name, value === true ? "" : String(value));
35
- }
36
- element.setAttribute("role", "group");
37
- const value0 = componentProps["label"] === void 0 ? "People" : componentProps["label"];
38
- if (value0 === null || value0 === void 0) element.removeAttribute("aria-label");
39
- else element.setAttribute("aria-label", String(value0));
40
- element.setAttribute("data-component", "ui-avatar-group");
41
- element.setAttribute("data-component-root", "ui-avatar-group");
42
- if (children.length > 0) {
43
- for (const child of children) element.append(child);
44
- } else {
45
- }
46
- attachLoomaComponent2(element, definition2, "ui-avatar-group", componentProps);
47
- return element;
48
- }
49
-
50
- // src/generated/vanilla/UiAvatar.js
51
- import { attachLoomaComponent as attachLoomaComponent3 } from "@threadlabs/looma/core/declarative";
52
- var definition3 = { ...{ "contract": { "tag": "ui-avatar", "props": { "alt": { "type": "string", "required": false, "target": { "attribute": "alt" }, "default": "" }, "fallback": { "type": "string", "required": false, "target": { "attribute": "fallback" }, "default": "" }, "name": { "type": "string", "required": false, "target": { "attribute": "name" }, "default": "" }, "src": { "type": "string", "required": false, "target": { "attribute": "src" }, "default": "" } } }, "template": { "kind": "element", "name": "span", "attributes": [{ "kind": "attribute", "name": "data-has-image", "expression": "hasImage", "expressionPlan": { "source": "hasImage", "ast": { "kind": "id", "name": "hasImage" }, "dependencies": ["hasImage"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "avatar" }], "children": [{ "kind": "slot" }, { "kind": "element", "name": "img", "attributes": [{ "kind": "literal", "name": "class", "value": "avatar__managed-image" }, { "kind": "attribute", "name": "src", "expression": "src", "expressionPlan": { "source": "src", "ast": { "kind": "id", "name": "src" }, "dependencies": ["src"] } }, { "kind": "literal", "name": "alt", "value": "" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "fallback" }], "children": [] }] }] }, "declarations": [{ "kind": "state", "name": "hasImage", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasAuthoredImage", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }], "root": { "kind": "native", "element": "span", "choices": ["span"] } }, source: { file: import.meta.url }, css: "" };
53
- function createUiAvatar(options = {}) {
54
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
55
- const element = document.createElement("span");
56
- for (const [name, value] of Object.entries(attributes)) {
57
- if (value === null || value === void 0 || value === false) continue;
58
- element.setAttribute(name, value === true ? "" : String(value));
59
- }
60
- element.setAttribute("data-component", "ui-avatar");
61
- element.setAttribute("data-component-root", "ui-avatar");
62
- const element0 = document.createElement("div");
63
- element0.setAttribute("class", "avatar");
64
- element0.setAttribute("data-component", "ui-avatar");
65
- if (children.length > 0) {
66
- for (const child of children) element0.append(child);
67
- } else {
68
- }
69
- const element1 = document.createElement("img");
70
- element1.setAttribute("class", "avatar__managed-image");
71
- const value0 = componentProps["src"] === void 0 ? "" : componentProps["src"];
72
- if (value0 === null || value0 === void 0) element1.removeAttribute("src");
73
- else element1.setAttribute("src", String(value0));
74
- element1.setAttribute("alt", "");
75
- element1.setAttribute("aria-hidden", "true");
76
- element1.setAttribute("data-component", "ui-avatar");
77
- element0.append(element1);
78
- const element2 = document.createElement("span");
79
- element2.setAttribute("class", "fallback");
80
- element2.setAttribute("data-component", "ui-avatar");
81
- element0.append(element2);
82
- element.append(element0);
83
- attachLoomaComponent3(element, definition3, "ui-avatar", componentProps);
84
- return element;
85
- }
86
-
87
- // src/generated/vanilla/UiBadge.js
88
- import { manageGeneratedProps } from "@threadlabs/looma/core/declarative-generated";
89
- function createUiBadge(options = {}) {
90
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
91
- const prop0 = componentProps["tone"] === void 0 ? "neutral" : componentProps["tone"];
92
- const prop1 = componentProps["variant"] === void 0 ? "subtle" : componentProps["variant"];
93
- const element = document.createElement("span");
94
- for (const [name, value] of Object.entries(attributes)) {
95
- if (value === null || value === void 0 || value === false) continue;
96
- element.setAttribute(name, value === true ? "" : String(value));
97
- }
98
- const value0 = prop1;
99
- if (value0 === null || value0 === void 0) element.removeAttribute("data-variant");
100
- else element.setAttribute("data-variant", String(value0));
101
- const value1 = prop0;
102
- if (value1 === null || value1 === void 0) element.removeAttribute("data-tone");
103
- else element.setAttribute("data-tone", String(value1));
104
- element.setAttribute("data-component", "ui-badge");
105
- element.setAttribute("data-component-root", "ui-badge");
106
- const element0 = document.createElement("span");
107
- element0.setAttribute("class", "badge__surface");
108
- element0.setAttribute("data-component", "ui-badge");
109
- if (children.length > 0) {
110
- for (const child of children) element0.append(child);
111
- } else {
112
- }
113
- element.append(element0);
114
- manageGeneratedProps(element, [
115
- { name: "tone", attribute: "data-tone", value: componentProps["tone"], default: "neutral", bound: true, type: ["neutral", "accent", "info", "success", "warning", "danger"], required: false },
116
- { name: "variant", attribute: "data-variant", value: componentProps["variant"], default: "subtle", bound: true, type: ["solid", "subtle"], required: false }
117
- ]);
118
- return element;
119
- }
120
-
121
- // src/generated/vanilla/UiButton.js
122
- import { attachLoomaComponent as attachLoomaComponent4 } from "@threadlabs/looma/core/declarative";
123
- var definition4 = { ...{ "contract": { "tag": "ui-button", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "size": { "type": { "enum": ["sm", "md", "lg"] }, "required": false, "target": { "attribute": "data-size" }, "default": "md" }, "variant": { "type": { "enum": ["outline", "solid", "danger", "ghost", "link"] }, "required": false, "target": { "attribute": "data-variant" }, "default": "outline" } } }, "template": { "kind": "element", "name": "button", "attributes": [{ "kind": "attribute", "name": "data-size", "expression": "size", "expressionPlan": { "source": "size", "ast": { "kind": "id", "name": "size" }, "dependencies": ["size"] } }, { "kind": "attribute", "name": "data-variant", "expression": "variant", "expressionPlan": { "source": "variant", "ast": { "kind": "id", "name": "variant" }, "dependencies": ["variant"] } }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "slot" }] }, "declarations": [], "root": { "kind": "native", "element": "button", "choices": ["button"] } }, source: { file: import.meta.url }, css: "" };
124
- function createUiButton(options = {}) {
125
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
126
- const element = document.createElement("button");
127
- for (const [name, value] of Object.entries(attributes)) {
128
- if (value === null || value === void 0 || value === false) continue;
129
- element.setAttribute(name, value === true ? "" : String(value));
130
- }
131
- const value0 = componentProps["size"] === void 0 ? "md" : componentProps["size"];
132
- if (value0 === null || value0 === void 0) element.removeAttribute("data-size");
133
- else element.setAttribute("data-size", String(value0));
134
- const value1 = componentProps["variant"] === void 0 ? "outline" : componentProps["variant"];
135
- if (value1 === null || value1 === void 0) element.removeAttribute("data-variant");
136
- else element.setAttribute("data-variant", String(value1));
137
- const value2 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
138
- if (value2 === true) element.setAttribute("disabled", "");
139
- else element.removeAttribute("disabled");
140
- element.setAttribute("data-component", "ui-button");
141
- element.setAttribute("data-component-root", "ui-button");
142
- if (children.length > 0) {
143
- for (const child of children) element.append(child);
144
- } else {
145
- }
146
- attachLoomaComponent4(element, definition4, "ui-button", componentProps);
147
- return element;
148
- }
149
-
150
- // src/generated/vanilla/UiCallout.js
151
- import { attachLoomaComponent as attachLoomaComponent5 } from "@threadlabs/looma/core/declarative";
152
- var definition5 = { ...{ "contract": { "tag": "ui-callout", "props": { "tone": { "type": { "enum": ["info", "note", "warning", "success", "danger"] }, "required": false, "target": { "attribute": "data-tone" }, "default": "info" } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "note" }, { "kind": "attribute", "name": "data-tone", "expression": "tone", "expressionPlan": { "source": "tone", "ast": { "kind": "id", "name": "tone" }, "dependencies": ["tone"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "callout__surface" }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "icon" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "content" }], "children": [{ "kind": "slot" }] }] }] }, "declarations": [], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
153
- function createUiCallout(options = {}) {
154
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
155
- const element = document.createElement("div");
156
- for (const [name, value] of Object.entries(attributes)) {
157
- if (value === null || value === void 0 || value === false) continue;
158
- element.setAttribute(name, value === true ? "" : String(value));
159
- }
160
- element.setAttribute("role", "note");
161
- const value0 = componentProps["tone"] === void 0 ? "info" : componentProps["tone"];
162
- if (value0 === null || value0 === void 0) element.removeAttribute("data-tone");
163
- else element.setAttribute("data-tone", String(value0));
164
- element.setAttribute("data-component", "ui-callout");
165
- element.setAttribute("data-component-root", "ui-callout");
166
- const element0 = document.createElement("div");
167
- element0.setAttribute("class", "callout__surface");
168
- element0.setAttribute("data-component", "ui-callout");
169
- const element1 = document.createElement("span");
170
- element1.setAttribute("class", "icon");
171
- element1.setAttribute("aria-hidden", "true");
172
- element1.setAttribute("data-component", "ui-callout");
173
- element0.append(element1);
174
- const element2 = document.createElement("div");
175
- element2.setAttribute("class", "content");
176
- element2.setAttribute("data-component", "ui-callout");
177
- if (children.length > 0) {
178
- for (const child of children) element2.append(child);
179
- } else {
180
- }
181
- element0.append(element2);
182
- element.append(element0);
183
- attachLoomaComponent5(element, definition5, "ui-callout", componentProps);
184
- return element;
185
- }
186
-
187
- // src/generated/vanilla/UiCheckbox.js
188
- import { attachLoomaComponent as attachLoomaComponent6 } from "@threadlabs/looma/core/declarative";
189
- var definition6 = { ...{ "contract": { "tag": "ui-checkbox", "props": { "checked": { "type": "boolean", "required": false, "target": { "attribute": "checked" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "data-disabled" }, "default": false }, "indeterminate": { "type": "boolean", "required": false, "target": { "attribute": "indeterminate" }, "default": false }, "required": { "type": "boolean", "required": false, "target": { "attribute": "required" }, "default": false }, "value": { "type": "string", "required": false, "target": { "attribute": "value" }, "default": "on" } } }, "template": { "kind": "element", "name": "span", "attributes": [{ "kind": "attribute", "name": "data-disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "label", "attributes": [{ "kind": "literal", "name": "class", "value": "control" }], "children": [{ "kind": "element", "name": "input", "attributes": [{ "kind": "literal", "name": "type", "value": "checkbox" }, { "kind": "attribute", "name": "checked", "expression": "internalChecked", "expressionPlan": { "source": "internalChecked", "ast": { "kind": "id", "name": "internalChecked" }, "dependencies": ["internalChecked"] } }, { "kind": "attribute", "name": "required", "expression": "required", "expressionPlan": { "source": "required", "ast": { "kind": "id", "name": "required" }, "dependencies": ["required"] } }, { "kind": "attribute", "name": "value", "expression": "value", "expressionPlan": { "source": "value", "ast": { "kind": "id", "name": "value" }, "dependencies": ["value"] } }], "children": [] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "label" }], "children": [{ "kind": "slot" }] }] }] }, "declarations": [{ "kind": "state", "name": "internalChecked", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "change", "type": "object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "span", "choices": ["span"] } }, source: { file: import.meta.url }, css: "" };
190
- function createUiCheckbox(options = {}) {
191
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
192
- const element = document.createElement("span");
193
- for (const [name, value] of Object.entries(attributes)) {
194
- if (value === null || value === void 0 || value === false) continue;
195
- element.setAttribute(name, value === true ? "" : String(value));
196
- }
197
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
198
- if (value0 === true) element.setAttribute("data-disabled", "");
199
- else element.removeAttribute("data-disabled");
200
- element.setAttribute("data-component", "ui-checkbox");
201
- element.setAttribute("data-component-root", "ui-checkbox");
202
- const element0 = document.createElement("label");
203
- element0.setAttribute("class", "control");
204
- element0.setAttribute("data-component", "ui-checkbox");
205
- const element1 = document.createElement("input");
206
- element1.setAttribute("type", "checkbox");
207
- const value1 = componentProps["required"] === void 0 ? false : componentProps["required"];
208
- if (value1 === true) element1.setAttribute("required", "");
209
- else element1.removeAttribute("required");
210
- const value2 = componentProps["value"] === void 0 ? "on" : componentProps["value"];
211
- if (value2 === null || value2 === void 0) element1.removeAttribute("value");
212
- else element1.setAttribute("value", String(value2));
213
- element1.setAttribute("data-component", "ui-checkbox");
214
- element0.append(element1);
215
- const element2 = document.createElement("span");
216
- element2.setAttribute("class", "label");
217
- element2.setAttribute("data-component", "ui-checkbox");
218
- if (children.length > 0) {
219
- for (const child of children) element2.append(child);
220
- } else {
221
- }
222
- element0.append(element2);
223
- element.append(element0);
224
- attachLoomaComponent6(element, definition6, "ui-checkbox", componentProps);
225
- return element;
226
- }
227
-
228
- // src/generated/vanilla/UiCombobox.js
229
- import { attachLoomaComponent as attachLoomaComponent7 } from "@threadlabs/looma/core/declarative";
230
- var definition7 = { ...{ "contract": { "tag": "ui-combobox", "props": { "allowCreate": { "type": "boolean", "required": false, "target": { "attribute": "allowcreate" }, "default": false }, "allowFreeText": { "type": "boolean", "required": false, "target": { "attribute": "allowfreetext" }, "default": false }, "clearable": { "type": "boolean", "required": false, "target": { "attribute": "clearable" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "disclosure": { "type": "boolean", "required": false, "target": { "attribute": "disclosure" }, "default": false }, "help": { "type": "string", "required": false, "target": { "attribute": "help" }, "default": "" }, "items": { "type": { "kind": "list", "item": { "kind": "object", "fields": [{ "name": "id", "type": { "kind": "terminal", "name": "string" }, "optional": false }, { "name": "value", "type": { "kind": "terminal", "name": "string" }, "optional": false }, { "name": "label", "type": { "kind": "terminal", "name": "string" }, "optional": false }, { "name": "group", "type": { "kind": "terminal", "name": "string" }, "optional": true }, { "name": "disabled", "type": { "kind": "terminal", "name": "boolean" }, "optional": true }], "open": false } }, "required": false, "target": { "attribute": "items" } }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "" }, "labelVisibility": { "type": { "enum": ["visible", "sr-only"] }, "required": false, "target": { "attribute": "labelvisibility" }, "default": "visible" }, "multiple": { "type": "boolean", "required": false, "target": { "attribute": "multiple" }, "default": false }, "name": { "type": "string", "required": false, "target": { "attribute": "name" }, "default": "" }, "placeholder": { "type": "string", "required": false, "target": { "attribute": "placeholder" }, "default": "" }, "query": { "type": "string", "required": false, "target": { "attribute": "query" } }, "readonly": { "type": "boolean", "required": false, "target": { "attribute": "readonly" }, "default": false }, "required": { "type": "boolean", "required": false, "target": { "attribute": "required" }, "default": false }, "size": { "type": { "enum": ["sm", "md"] }, "required": false, "target": { "attribute": "data-size" }, "default": "md" }, "tokenSeparators": { "type": { "kind": "list", "item": { "kind": "terminal", "name": "string" } }, "required": false, "target": { "attribute": "tokenseparators" } }, "value": { "type": { "kind": "union", "members": [{ "kind": "terminal", "name": "string" }, { "kind": "terminal", "name": "null" }] }, "required": false, "target": { "attribute": "value" } } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "attribute", "name": "data-size", "expression": "size", "expressionPlan": { "source": "size", "ast": { "kind": "id", "name": "size" }, "dependencies": ["size"] } }], "children": [{ "kind": "element", "name": "label", "attributes": [{ "kind": "literal", "name": "for", "value": "input" }, { "kind": "literal", "name": "part", "value": "label" }], "children": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "field" }, { "kind": "literal", "name": "part", "value": "field" }], "children": [{ "kind": "slot", "fallback": [], "name": "start" }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "items" }, { "kind": "literal", "name": "role", "value": "group" }], "children": [], "flow": { "kind": "if", "test": "multiple", "testPlan": { "source": "multiple", "ast": { "kind": "id", "name": "multiple" }, "dependencies": ["multiple"] } } }, { "kind": "element", "name": "input", "attributes": [{ "kind": "literal", "name": "id", "value": "input" }, { "kind": "literal", "name": "role", "value": "combobox" }, { "kind": "literal", "name": "aria-autocomplete", "value": "list" }, { "kind": "literal", "name": "aria-controls", "value": "listbox" }, { "kind": "attribute", "name": "value", "expression": "display", "expressionPlan": { "source": "display", "ast": { "kind": "id", "name": "display" }, "dependencies": ["display"] } }, { "kind": "attribute", "name": "placeholder", "expression": "placeholder", "expressionPlan": { "source": "placeholder", "ast": { "kind": "id", "name": "placeholder" }, "dependencies": ["placeholder"] } }, { "kind": "attribute", "name": "name", "expression": "name", "expressionPlan": { "source": "name", "ast": { "kind": "id", "name": "name" }, "dependencies": ["name"] } }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }, { "kind": "attribute", "name": "readonly", "expression": "readonly", "expressionPlan": { "source": "readonly", "ast": { "kind": "id", "name": "readonly" }, "dependencies": ["readonly"] } }, { "kind": "attribute", "name": "required", "expression": "required", "expressionPlan": { "source": "required", "ast": { "kind": "id", "name": "required" }, "dependencies": ["required"] } }, { "kind": "literal", "name": "autocomplete", "value": "off" }, { "kind": "literal", "name": "part", "value": "input" }], "children": [] }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "type", "value": "button" }, { "kind": "literal", "name": "part", "value": "affordance" }], "children": [{ "kind": "element", "name": "svg", "attributes": [{ "kind": "literal", "name": "class", "value": "affordance-icon" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }, { "kind": "literal", "name": "viewBox", "value": "0 0 24 24" }, { "kind": "literal", "name": "fill", "value": "none" }, { "kind": "literal", "name": "stroke", "value": "currentColor" }, { "kind": "literal", "name": "stroke-width", "value": "2" }, { "kind": "literal", "name": "stroke-linecap", "value": "round" }], "children": [{ "kind": "element", "name": "path", "attributes": [{ "kind": "literal", "name": "d", "value": "M7 7l10 10M17 7 7 17" }], "children": [] }] }], "flow": { "kind": "if", "test": "clearable", "testPlan": { "source": "clearable", "ast": { "kind": "id", "name": "clearable" }, "dependencies": ["clearable"] } } }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "id", "value": "help" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "literal", "name": "part", "value": "affordance" }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [{ "kind": "text", "value": "?" }] }], "flow": { "kind": "if", "test": "help", "testPlan": { "source": "help", "ast": { "kind": "id", "name": "help" }, "dependencies": ["help"] } } }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "type", "value": "button" }, { "kind": "literal", "name": "part", "value": "affordance" }, { "kind": "literal", "name": "aria-controls", "value": "listbox" }], "children": [{ "kind": "element", "name": "svg", "attributes": [{ "kind": "literal", "name": "class", "value": "affordance-icon" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }, { "kind": "literal", "name": "viewBox", "value": "0 0 24 24" }, { "kind": "literal", "name": "fill", "value": "none" }, { "kind": "literal", "name": "stroke", "value": "currentColor" }, { "kind": "literal", "name": "stroke-width", "value": "2.25" }, { "kind": "literal", "name": "stroke-linecap", "value": "round" }, { "kind": "literal", "name": "stroke-linejoin", "value": "round" }], "children": [{ "kind": "element", "name": "path", "attributes": [{ "kind": "literal", "name": "d", "value": "m6 9 6 6 6-6" }], "children": [] }] }], "flow": { "kind": "if", "test": "disclosure", "testPlan": { "source": "disclosure", "ast": { "kind": "id", "name": "disclosure" }, "dependencies": ["disclosure"] } } }] }, { "kind": "element", "name": "ui-tooltip", "attributes": [{ "kind": "literal", "name": "id", "value": "help-text" }, { "kind": "literal", "name": "for", "value": "help" }], "children": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "help", "expressionPlan": { "source": "help", "ast": { "kind": "id", "name": "help" }, "dependencies": ["help"] } }], "children": [] }], "flow": { "kind": "if", "test": "help", "testPlan": { "source": "help", "ast": { "kind": "id", "name": "help" }, "dependencies": ["help"] } } }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "popup" }, { "kind": "literal", "name": "part", "value": "popup" }, { "kind": "attribute", "name": "hidden", "expression": "not expanded", "expressionPlan": { "source": "not expanded", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "expanded" } }, "dependencies": ["expanded"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "id", "value": "listbox" }, { "kind": "literal", "name": "role", "value": "listbox" }], "children": [] }, { "kind": "slot", "fallback": [], "name": "footer" }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "id", "value": "validation" }, { "kind": "literal", "name": "class", "value": "message" }, { "kind": "literal", "name": "part", "value": "validation" }, { "kind": "attribute", "name": "hidden", "expression": "not validation.issues.length", "expressionPlan": { "source": "not validation.issues.length", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "member", "object": { "kind": "member", "object": { "kind": "id", "name": "validation" }, "key": "issues" }, "key": "length" } }, "dependencies": ["validation.issues.length"] } }], "children": [] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "sr-only" }, { "kind": "literal", "name": "role", "value": "status" }, { "kind": "literal", "name": "aria-live", "value": "polite" }, { "kind": "literal", "name": "aria-atomic", "value": "true" }], "children": [] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "authored-options" }, { "kind": "literal", "name": "hidden", "value": "" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [{ "kind": "slot" }] }] }, "declarations": [{ "kind": "state", "name": "raw", "expression": { "source": "''", "ast": { "kind": "literal", "value": "" }, "dependencies": [] } }, { "kind": "state", "name": "display", "expression": { "source": "''", "ast": { "kind": "literal", "value": "" }, "dependencies": [] } }, { "kind": "state", "name": "selected", "expression": { "source": "null", "ast": { "kind": "literal", "value": null }, "dependencies": [] } }, { "kind": "state", "name": "expanded", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "rows", "expression": { "source": "[]", "ast": { "kind": "array", "items": [] }, "dependencies": [] } }, { "kind": "state", "name": "active", "expression": { "source": "-1", "ast": { "kind": "unary", "op": "-", "operand": { "kind": "literal", "value": 1 } }, "dependencies": [] } }, { "kind": "state", "name": "loading", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "helpOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "lookupError", "expression": { "source": "''", "ast": { "kind": "literal", "value": "" }, "dependencies": [] } }, { "kind": "state", "name": "validation", "expression": { "source": "{ status: 'pristine', touched: false, dirty: false, issues: [] }", "ast": { "kind": "object", "pairs": [{ "key": "status", "value": { "kind": "literal", "value": "pristine" } }, { "key": "touched", "value": { "kind": "literal", "value": false } }, { "key": "dirty", "value": { "kind": "literal", "value": false } }, { "key": "issues", "value": { "kind": "array", "items": [] } }] }, "dependencies": [] } }, { "kind": "event", "name": "query-change", "type": "object({ query: string, display: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "value-change", "type": "object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic }) | list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean }))", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "free-entry", "type": "object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "create-entry", "type": "object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "validation-change", "type": "object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string, path?: list(unknown), severity?: error | warning })), output?: unknown })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "options-change", "type": "list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean }))", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "add-item", "type": "object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }), index: integer, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "remove-item", "type": "object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }), index: integer, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "create-item", "type": "object({ query: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "method", "name": "validate", "exportName": "validate", "returns": "promise(unknown)" }, { "kind": "method", "name": "focusInput", "exportName": "focusInput", "returns": "promise(undefined)" }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
231
- function createUiCombobox(options = {}) {
232
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
233
- const element = document.createElement("div");
234
- for (const [name, value] of Object.entries(attributes)) {
235
- if (value === null || value === void 0 || value === false) continue;
236
- element.setAttribute(name, value === true ? "" : String(value));
237
- }
238
- const value0 = componentProps["size"] === void 0 ? "md" : componentProps["size"];
239
- if (value0 === null || value0 === void 0) element.removeAttribute("data-size");
240
- else element.setAttribute("data-size", String(value0));
241
- element.setAttribute("data-component", "ui-combobox");
242
- element.setAttribute("data-component-root", "ui-combobox");
243
- const element0 = document.createElement("label");
244
- element0.setAttribute("for", "input");
245
- element0.setAttribute("part", "label");
246
- element0.setAttribute("data-component", "ui-combobox");
247
- const element1 = document.createElement("template");
248
- element1.setAttribute("data-component", "ui-combobox");
249
- element0.append(element1);
250
- element.append(element0);
251
- const element2 = document.createElement("div");
252
- element2.setAttribute("class", "field");
253
- element2.setAttribute("part", "field");
254
- element2.setAttribute("data-component", "ui-combobox");
255
- if (slots["start"] ?? [].length > 0) {
256
- for (const child of slots["start"] ?? []) element2.append(child);
257
- } else {
258
- }
259
- const element3 = document.createElement("div");
260
- element3.setAttribute("class", "items");
261
- element3.setAttribute("role", "group");
262
- element3.setAttribute("data-component", "ui-combobox");
263
- element2.append(element3);
264
- const element4 = document.createElement("input");
265
- element4.setAttribute("id", "input");
266
- element4.setAttribute("role", "combobox");
267
- element4.setAttribute("aria-autocomplete", "list");
268
- element4.setAttribute("aria-controls", "listbox");
269
- const value1 = componentProps["placeholder"] === void 0 ? "" : componentProps["placeholder"];
270
- if (value1 === null || value1 === void 0) element4.removeAttribute("placeholder");
271
- else element4.setAttribute("placeholder", String(value1));
272
- const value2 = componentProps["name"] === void 0 ? "" : componentProps["name"];
273
- if (value2 === null || value2 === void 0) element4.removeAttribute("name");
274
- else element4.setAttribute("name", String(value2));
275
- const value3 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
276
- if (value3 === true) element4.setAttribute("disabled", "");
277
- else element4.removeAttribute("disabled");
278
- const value4 = componentProps["readonly"] === void 0 ? false : componentProps["readonly"];
279
- if (value4 === true) element4.setAttribute("readonly", "");
280
- else element4.removeAttribute("readonly");
281
- const value5 = componentProps["required"] === void 0 ? false : componentProps["required"];
282
- if (value5 === true) element4.setAttribute("required", "");
283
- else element4.removeAttribute("required");
284
- element4.setAttribute("autocomplete", "off");
285
- element4.setAttribute("part", "input");
286
- element4.setAttribute("data-component", "ui-combobox");
287
- element2.append(element4);
288
- const element5 = document.createElement("button");
289
- element5.setAttribute("type", "button");
290
- element5.setAttribute("part", "affordance");
291
- element5.setAttribute("data-component", "ui-combobox");
292
- const element6 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
293
- element6.setAttribute("class", "affordance-icon");
294
- element6.setAttribute("aria-hidden", "true");
295
- element6.setAttribute("viewBox", "0 0 24 24");
296
- element6.setAttribute("fill", "none");
297
- element6.setAttribute("stroke", "currentColor");
298
- element6.setAttribute("stroke-width", "2");
299
- element6.setAttribute("stroke-linecap", "round");
300
- element6.setAttribute("data-component", "ui-combobox");
301
- const element7 = document.createElementNS("http://www.w3.org/2000/svg", "path");
302
- element7.setAttribute("d", "M7 7l10 10M17 7 7 17");
303
- element7.setAttribute("data-component", "ui-combobox");
304
- element6.append(element7);
305
- element5.append(element6);
306
- element2.append(element5);
307
- const element8 = document.createElement("button");
308
- element8.setAttribute("id", "help");
309
- element8.setAttribute("type", "button");
310
- element8.setAttribute("part", "affordance");
311
- const value6 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
312
- if (value6 === true) element8.setAttribute("disabled", "");
313
- else element8.removeAttribute("disabled");
314
- element8.setAttribute("data-component", "ui-combobox");
315
- const element9 = document.createElement("span");
316
- element9.setAttribute("aria-hidden", "true");
317
- element9.setAttribute("data-component", "ui-combobox");
318
- element9.append("?");
319
- element8.append(element9);
320
- element2.append(element8);
321
- const element10 = document.createElement("button");
322
- element10.setAttribute("type", "button");
323
- element10.setAttribute("part", "affordance");
324
- element10.setAttribute("aria-controls", "listbox");
325
- element10.setAttribute("data-component", "ui-combobox");
326
- const element11 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
327
- element11.setAttribute("class", "affordance-icon");
328
- element11.setAttribute("aria-hidden", "true");
329
- element11.setAttribute("viewBox", "0 0 24 24");
330
- element11.setAttribute("fill", "none");
331
- element11.setAttribute("stroke", "currentColor");
332
- element11.setAttribute("stroke-width", "2.25");
333
- element11.setAttribute("stroke-linecap", "round");
334
- element11.setAttribute("stroke-linejoin", "round");
335
- element11.setAttribute("data-component", "ui-combobox");
336
- const element12 = document.createElementNS("http://www.w3.org/2000/svg", "path");
337
- element12.setAttribute("d", "m6 9 6 6 6-6");
338
- element12.setAttribute("data-component", "ui-combobox");
339
- element11.append(element12);
340
- element10.append(element11);
341
- element2.append(element10);
342
- element.append(element2);
343
- const element13 = document.createElement("ui-tooltip");
344
- element13.setAttribute("id", "help-text");
345
- element13.setAttribute("for", "help");
346
- element13.setAttribute("data-component", "ui-combobox");
347
- const element14 = document.createElement("template");
348
- element14.setAttribute("data-component", "ui-combobox");
349
- element13.append(element14);
350
- element.append(element13);
351
- const element15 = document.createElement("div");
352
- element15.setAttribute("class", "popup");
353
- element15.setAttribute("part", "popup");
354
- element15.setAttribute("data-component", "ui-combobox");
355
- const element16 = document.createElement("div");
356
- element16.setAttribute("id", "listbox");
357
- element16.setAttribute("role", "listbox");
358
- element16.setAttribute("data-component", "ui-combobox");
359
- element15.append(element16);
360
- if (slots["footer"] ?? [].length > 0) {
361
- for (const child of slots["footer"] ?? []) element15.append(child);
362
- } else {
363
- }
364
- element.append(element15);
365
- const element17 = document.createElement("div");
366
- element17.setAttribute("id", "validation");
367
- element17.setAttribute("class", "message");
368
- element17.setAttribute("part", "validation");
369
- element17.setAttribute("data-component", "ui-combobox");
370
- element.append(element17);
371
- const element18 = document.createElement("div");
372
- element18.setAttribute("class", "sr-only");
373
- element18.setAttribute("role", "status");
374
- element18.setAttribute("aria-live", "polite");
375
- element18.setAttribute("aria-atomic", "true");
376
- element18.setAttribute("data-component", "ui-combobox");
377
- element.append(element18);
378
- const element19 = document.createElement("div");
379
- element19.setAttribute("class", "authored-options");
380
- element19.setAttribute("hidden", "");
381
- element19.setAttribute("aria-hidden", "true");
382
- element19.setAttribute("data-component", "ui-combobox");
383
- if (children.length > 0) {
384
- for (const child of children) element19.append(child);
385
- } else {
386
- }
387
- element.append(element19);
388
- attachLoomaComponent7(element, definition7, "ui-combobox", componentProps);
389
- return element;
390
- }
391
-
392
- // src/generated/vanilla/UiContextMenu.js
393
- import { attachLoomaComponent as attachLoomaComponent8 } from "@threadlabs/looma/core/declarative";
394
- var definition8 = { ...{ "contract": { "tag": "ui-context-menu", "props": { "for": { "type": "string", "required": false, "target": { "attribute": "for" }, "default": "" }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false } } }, "template": { "kind": "element", "name": "span", "attributes": [{ "kind": "attribute", "name": "data-state-open", "expression": "internalOpen", "expressionPlan": { "source": "internalOpen", "ast": { "kind": "id", "name": "internalOpen" }, "dependencies": ["internalOpen"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "menu" }, { "kind": "attribute", "name": "data-state-open", "expression": "internalOpen", "expressionPlan": { "source": "internalOpen", "ast": { "kind": "id", "name": "internalOpen" }, "dependencies": ["internalOpen"] } }], "children": [{ "kind": "element", "name": "ui-menu", "attributes": [], "children": [{ "kind": "slot" }] }] }] }, "declarations": [{ "kind": "state", "name": "internalOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "focusTrigger", "expression": { "source": "'programmatic'", "ast": { "kind": "literal", "value": "programmatic" }, "dependencies": [] } }, { "kind": "event", "name": "open", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "close", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "select", "type": "object({ value: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "span", "choices": ["span"] } }, source: { file: import.meta.url }, css: "" };
395
- function createUiContextMenu(options = {}) {
396
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
397
- const element = document.createElement("span");
398
- for (const [name, value] of Object.entries(attributes)) {
399
- if (value === null || value === void 0 || value === false) continue;
400
- element.setAttribute(name, value === true ? "" : String(value));
401
- }
402
- element.setAttribute("data-component", "ui-context-menu");
403
- element.setAttribute("data-component-root", "ui-context-menu");
404
- const element0 = document.createElement("div");
405
- element0.setAttribute("class", "menu");
406
- element0.setAttribute("data-component", "ui-context-menu");
407
- const element1 = document.createElement("ui-menu");
408
- element1.setAttribute("data-component", "ui-context-menu");
409
- if (children.length > 0) {
410
- for (const child of children) element1.append(child);
411
- } else {
412
- }
413
- element0.append(element1);
414
- element.append(element0);
415
- attachLoomaComponent8(element, definition8, "ui-context-menu", componentProps);
416
- return element;
417
- }
418
-
419
- // src/generated/vanilla/UiDialog.js
420
- import { attachLoomaComponent as attachLoomaComponent9 } from "@threadlabs/looma/core/declarative";
421
- var definition9 = { ...{ "contract": { "tag": "ui-dialog", "props": { "dismissible": { "type": "boolean", "required": false, "target": { "attribute": "dismissible" }, "default": false }, "for": { "type": "string", "required": false, "target": { "attribute": "for" }, "default": "" }, "label": { "type": "string", "required": false, "target": { "attribute": "label" } }, "modal": { "type": "boolean", "required": false, "target": { "attribute": "modal" }, "default": false }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false } } }, "template": { "kind": "element", "name": "dialog", "attributes": [{ "kind": "attribute", "name": "aria-label", "expression": "accessibleLabel", "expressionPlan": { "source": "accessibleLabel", "ast": { "kind": "id", "name": "accessibleLabel" }, "dependencies": ["accessibleLabel"] } }], "children": [{ "kind": "element", "name": "header", "attributes": [{ "kind": "literal", "name": "class", "value": "dialog__header" }], "children": [{ "kind": "element", "name": "h2", "attributes": [{ "kind": "literal", "name": "class", "value": "dialog__title" }], "children": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [] }], "flow": { "kind": "if", "test": "label", "testPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } } }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "dialog__close" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "literal", "name": "aria-label", "value": "Close" }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "dialog__body" }], "children": [{ "kind": "slot" }] }, { "kind": "element", "name": "footer", "attributes": [{ "kind": "literal", "name": "class", "value": "dialog__footer" }], "children": [{ "kind": "slot", "fallback": [], "name": "actions" }] }] }, "declarations": [{ "kind": "state", "name": "internalOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "accessibleLabel", "expression": { "source": "'Dialog'", "ast": { "kind": "literal", "value": "Dialog" }, "dependencies": [] } }, { "kind": "event", "name": "close", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "dialog", "choices": ["dialog"] } }, source: { file: import.meta.url }, css: "" };
422
- function createUiDialog(options = {}) {
423
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
424
- const element = document.createElement("dialog");
425
- for (const [name, value] of Object.entries(attributes)) {
426
- if (value === null || value === void 0 || value === false) continue;
427
- element.setAttribute(name, value === true ? "" : String(value));
428
- }
429
- element.setAttribute("data-component", "ui-dialog");
430
- element.setAttribute("data-component-root", "ui-dialog");
431
- const element0 = document.createElement("header");
432
- element0.setAttribute("class", "dialog__header");
433
- element0.setAttribute("data-component", "ui-dialog");
434
- const element1 = document.createElement("h2");
435
- element1.setAttribute("class", "dialog__title");
436
- element1.setAttribute("data-component", "ui-dialog");
437
- const element2 = document.createElement("template");
438
- element2.setAttribute("data-component", "ui-dialog");
439
- element1.append(element2);
440
- element0.append(element1);
441
- const element3 = document.createElement("button");
442
- element3.setAttribute("class", "dialog__close");
443
- element3.setAttribute("type", "button");
444
- element3.setAttribute("aria-label", "Close");
445
- element3.setAttribute("data-component", "ui-dialog");
446
- element0.append(element3);
447
- element.append(element0);
448
- const element4 = document.createElement("div");
449
- element4.setAttribute("class", "dialog__body");
450
- element4.setAttribute("data-component", "ui-dialog");
451
- if (children.length > 0) {
452
- for (const child of children) element4.append(child);
453
- } else {
454
- }
455
- element.append(element4);
456
- const element5 = document.createElement("footer");
457
- element5.setAttribute("class", "dialog__footer");
458
- element5.setAttribute("data-component", "ui-dialog");
459
- if (slots["actions"] ?? [].length > 0) {
460
- for (const child of slots["actions"] ?? []) element5.append(child);
461
- } else {
462
- }
463
- element.append(element5);
464
- attachLoomaComponent9(element, definition9, "ui-dialog", componentProps);
465
- return element;
466
- }
467
-
468
- // src/generated/vanilla/UiDisclosure.js
469
- import { attachLoomaComponent as attachLoomaComponent10 } from "@threadlabs/looma/core/declarative";
470
- var definition10 = { ...{ "contract": { "tag": "ui-disclosure", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false }, "summary": { "type": "string", "required": false, "target": { "attribute": "summary" }, "default": "Details" } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [{ "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure__trigger" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "attribute", "name": "aria-controls", "expression": "contentId", "expressionPlan": { "source": "contentId", "ast": { "kind": "id", "name": "contentId" }, "dependencies": ["contentId"] } }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "span", "attributes": [], "children": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "summary", "expressionPlan": { "source": "summary", "ast": { "kind": "id", "name": "summary" }, "dependencies": ["summary"] } }], "children": [] }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure__chevron" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure__panel" }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure__panel-inner" }], "children": [{ "kind": "slot" }] }] }] }, "declarations": [{ "kind": "state", "name": "internalOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "contentId", "expression": { "source": "''", "ast": { "kind": "literal", "value": "" }, "dependencies": [] } }, { "kind": "event", "name": "open", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "close", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
471
- function createUiDisclosure(options = {}) {
472
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
473
- const element = document.createElement("div");
474
- for (const [name, value] of Object.entries(attributes)) {
475
- if (value === null || value === void 0 || value === false) continue;
476
- element.setAttribute(name, value === true ? "" : String(value));
477
- }
478
- element.setAttribute("data-component", "ui-disclosure");
479
- element.setAttribute("data-component-root", "ui-disclosure");
480
- const element0 = document.createElement("button");
481
- element0.setAttribute("class", "disclosure__trigger");
482
- element0.setAttribute("type", "button");
483
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
484
- if (value0 === true) element0.setAttribute("disabled", "");
485
- else element0.removeAttribute("disabled");
486
- element0.setAttribute("data-component", "ui-disclosure");
487
- const element1 = document.createElement("span");
488
- element1.setAttribute("data-component", "ui-disclosure");
489
- const element2 = document.createElement("template");
490
- element2.setAttribute("data-component", "ui-disclosure");
491
- element1.append(element2);
492
- element0.append(element1);
493
- const element3 = document.createElement("span");
494
- element3.setAttribute("class", "disclosure__chevron");
495
- element3.setAttribute("aria-hidden", "true");
496
- element3.setAttribute("data-component", "ui-disclosure");
497
- element0.append(element3);
498
- element.append(element0);
499
- const element4 = document.createElement("div");
500
- element4.setAttribute("class", "disclosure__panel");
501
- element4.setAttribute("data-component", "ui-disclosure");
502
- const element5 = document.createElement("div");
503
- element5.setAttribute("class", "disclosure__panel-inner");
504
- element5.setAttribute("data-component", "ui-disclosure");
505
- if (children.length > 0) {
506
- for (const child of children) element5.append(child);
507
- } else {
508
- }
509
- element4.append(element5);
510
- element.append(element4);
511
- attachLoomaComponent10(element, definition10, "ui-disclosure", componentProps);
512
- return element;
513
- }
514
-
515
- // src/generated/vanilla/UiEditable.js
516
- import { attachLoomaComponent as attachLoomaComponent11 } from "@threadlabs/looma/core/declarative";
517
- var definition11 = { ...{ "contract": { "tag": "ui-editable", "props": { "actions": { "type": "boolean", "required": false, "target": { "attribute": "actions" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "data-disabled" }, "default": false }, "edit": { "type": "boolean", "required": false, "target": { "attribute": "edit" }, "default": false }, "hint": { "type": "string", "required": false, "target": { "attribute": "hint" }, "default": "" }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "Edit value" }, "value": { "type": "string", "required": false, "target": { "attribute": "value" }, "default": "" } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "attribute", "name": "data-state-edit", "expression": "internalEdit", "expressionPlan": { "source": "internalEdit", "ast": { "kind": "id", "name": "internalEdit" }, "dependencies": ["internalEdit"] } }, { "kind": "attribute", "name": "data-disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "editable__field" }], "children": [{ "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "editable__preview" }, { "kind": "literal", "name": "type", "value": "button" }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "editable__text" }], "children": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "internalValue", "expressionPlan": { "source": "internalValue", "ast": { "kind": "id", "name": "internalValue" }, "dependencies": ["internalValue"] } }], "children": [] }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "editable__hint" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "hint", "expressionPlan": { "source": "hint", "ast": { "kind": "id", "name": "hint" }, "dependencies": ["hint"] } }], "children": [] }], "flow": { "kind": "if", "test": "hint", "testPlan": { "source": "hint", "ast": { "kind": "id", "name": "hint" }, "dependencies": ["hint"] } } }] }, { "kind": "element", "name": "input", "attributes": [{ "kind": "literal", "name": "class", "value": "editable__input" }, { "kind": "literal", "name": "type", "value": "text" }, { "kind": "attribute", "name": "value", "expression": "draft", "expressionPlan": { "source": "draft", "ast": { "kind": "id", "name": "draft" }, "dependencies": ["draft"] } }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "editable__actions" }], "children": [{ "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "type", "value": "button" }, { "kind": "literal", "name": "data-action", "value": "save" }], "children": [{ "kind": "text", "value": "Save" }] }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "type", "value": "button" }, { "kind": "literal", "name": "data-action", "value": "cancel" }], "children": [{ "kind": "text", "value": "Cancel" }] }], "flow": { "kind": "if", "test": "actions", "testPlan": { "source": "actions", "ast": { "kind": "id", "name": "actions" }, "dependencies": ["actions"] } } }] }, "declarations": [{ "kind": "state", "name": "internalEdit", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "internalValue", "expression": { "source": "''", "ast": { "kind": "literal", "value": "" }, "dependencies": [] } }, { "kind": "state", "name": "draft", "expression": { "source": "''", "ast": { "kind": "literal", "value": "" }, "dependencies": [] } }, { "kind": "event", "name": "input", "type": "object({ value: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "change", "type": "object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "edit-change", "type": "object({ edit: boolean, reason: activate | commit | cancel | light-dismiss | escape | programmatic, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
518
- function createUiEditable(options = {}) {
519
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
520
- const element = document.createElement("div");
521
- for (const [name, value] of Object.entries(attributes)) {
522
- if (value === null || value === void 0 || value === false) continue;
523
- element.setAttribute(name, value === true ? "" : String(value));
524
- }
525
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
526
- if (value0 === true) element.setAttribute("data-disabled", "");
527
- else element.removeAttribute("data-disabled");
528
- element.setAttribute("data-component", "ui-editable");
529
- element.setAttribute("data-component-root", "ui-editable");
530
- const element0 = document.createElement("div");
531
- element0.setAttribute("class", "editable__field");
532
- element0.setAttribute("data-component", "ui-editable");
533
- const element1 = document.createElement("button");
534
- element1.setAttribute("class", "editable__preview");
535
- element1.setAttribute("type", "button");
536
- element1.setAttribute("data-component", "ui-editable");
537
- const element2 = document.createElement("span");
538
- element2.setAttribute("class", "editable__text");
539
- element2.setAttribute("data-component", "ui-editable");
540
- const element3 = document.createElement("template");
541
- element3.setAttribute("data-component", "ui-editable");
542
- element2.append(element3);
543
- element1.append(element2);
544
- const element4 = document.createElement("span");
545
- element4.setAttribute("class", "editable__hint");
546
- element4.setAttribute("aria-hidden", "true");
547
- element4.setAttribute("data-component", "ui-editable");
548
- const element5 = document.createElement("template");
549
- element5.setAttribute("data-component", "ui-editable");
550
- element4.append(element5);
551
- element1.append(element4);
552
- element0.append(element1);
553
- const element6 = document.createElement("input");
554
- element6.setAttribute("class", "editable__input");
555
- element6.setAttribute("type", "text");
556
- element6.setAttribute("data-component", "ui-editable");
557
- element0.append(element6);
558
- element.append(element0);
559
- const element7 = document.createElement("div");
560
- element7.setAttribute("class", "editable__actions");
561
- element7.setAttribute("data-component", "ui-editable");
562
- const element8 = document.createElement("button");
563
- element8.setAttribute("type", "button");
564
- element8.setAttribute("data-action", "save");
565
- element8.setAttribute("data-component", "ui-editable");
566
- element8.append("Save");
567
- element7.append(element8);
568
- const element9 = document.createElement("button");
569
- element9.setAttribute("type", "button");
570
- element9.setAttribute("data-action", "cancel");
571
- element9.setAttribute("data-component", "ui-editable");
572
- element9.append("Cancel");
573
- element7.append(element9);
574
- element.append(element7);
575
- attachLoomaComponent11(element, definition11, "ui-editable", componentProps);
576
- return element;
577
- }
578
-
579
- // src/generated/vanilla/UiFormField.js
580
- import { attachLoomaComponent as attachLoomaComponent12 } from "@threadlabs/looma/core/declarative";
581
- var definition12 = { ...{ "contract": { "tag": "ui-form-field", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "data-disabled" }, "default": false }, "invalid": { "type": "boolean", "required": false, "target": { "attribute": "data-invalid" }, "default": false }, "required": { "type": "boolean", "required": false, "target": { "attribute": "data-required" }, "default": false } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "attribute", "name": "data-invalid", "expression": "invalid", "expressionPlan": { "source": "invalid", "ast": { "kind": "id", "name": "invalid" }, "dependencies": ["invalid"] } }, { "kind": "attribute", "name": "data-disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }, { "kind": "attribute", "name": "data-required", "expression": "required", "expressionPlan": { "source": "required", "ast": { "kind": "id", "name": "required" }, "dependencies": ["required"] } }], "children": [{ "kind": "slot", "fallback": [], "name": "label" }, { "kind": "slot" }, { "kind": "slot", "fallback": [], "name": "help" }, { "kind": "slot", "fallback": [], "name": "error" }] }, "declarations": [], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
582
- function createUiFormField(options = {}) {
583
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
584
- const element = document.createElement("div");
585
- for (const [name, value] of Object.entries(attributes)) {
586
- if (value === null || value === void 0 || value === false) continue;
587
- element.setAttribute(name, value === true ? "" : String(value));
588
- }
589
- const value0 = componentProps["invalid"] === void 0 ? false : componentProps["invalid"];
590
- if (value0 === true) element.setAttribute("data-invalid", "");
591
- else element.removeAttribute("data-invalid");
592
- const value1 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
593
- if (value1 === true) element.setAttribute("data-disabled", "");
594
- else element.removeAttribute("data-disabled");
595
- const value2 = componentProps["required"] === void 0 ? false : componentProps["required"];
596
- if (value2 === true) element.setAttribute("data-required", "");
597
- else element.removeAttribute("data-required");
598
- element.setAttribute("data-component", "ui-form-field");
599
- element.setAttribute("data-component-root", "ui-form-field");
600
- if (slots["label"] ?? [].length > 0) {
601
- for (const child of slots["label"] ?? []) element.append(child);
602
- } else {
603
- }
604
- if (children.length > 0) {
605
- for (const child of children) element.append(child);
606
- } else {
607
- }
608
- if (slots["help"] ?? [].length > 0) {
609
- for (const child of slots["help"] ?? []) element.append(child);
610
- } else {
611
- }
612
- if (slots["error"] ?? [].length > 0) {
613
- for (const child of slots["error"] ?? []) element.append(child);
614
- } else {
615
- }
616
- attachLoomaComponent12(element, definition12, "ui-form-field", componentProps);
617
- return element;
618
- }
619
-
620
- // src/generated/vanilla/UiIconButton.js
621
- import { attachLoomaComponent as attachLoomaComponent13 } from "@threadlabs/looma/core/declarative";
622
- var definition13 = { ...{ "contract": { "tag": "ui-icon-button", "props": { "anticipatory": { "type": "boolean", "required": false, "target": { "attribute": "anticipatory" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "label": { "type": "string", "required": false, "target": { "attribute": "aria-label" }, "default": "" }, "round": { "type": "boolean", "required": false, "target": { "attribute": "data-round" }, "default": false }, "size": { "type": { "enum": ["sm", "md", "lg"] }, "required": false, "target": { "attribute": "size" }, "default": "md" }, "variant": { "type": { "enum": ["ghost", "outline", "solid"] }, "required": false, "target": { "attribute": "variant" }, "default": "ghost" } } }, "template": { "kind": "element", "name": "button", "attributes": [{ "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }, { "kind": "attribute", "name": "data-round", "expression": "round", "expressionPlan": { "source": "round", "ast": { "kind": "id", "name": "round" }, "dependencies": ["round"] } }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "attribute", "name": "aria-label", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [{ "kind": "slot" }] }, "declarations": [], "root": { "kind": "native", "element": "button", "choices": ["button"] } }, source: { file: import.meta.url }, css: "" };
623
- function createUiIconButton(options = {}) {
624
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
625
- const element = document.createElement("button");
626
- for (const [name, value] of Object.entries(attributes)) {
627
- if (value === null || value === void 0 || value === false) continue;
628
- element.setAttribute(name, value === true ? "" : String(value));
629
- }
630
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
631
- if (value0 === true) element.setAttribute("disabled", "");
632
- else element.removeAttribute("disabled");
633
- const value1 = componentProps["round"] === void 0 ? false : componentProps["round"];
634
- if (value1 === true) element.setAttribute("data-round", "");
635
- else element.removeAttribute("data-round");
636
- element.setAttribute("type", "button");
637
- const value2 = componentProps["label"] === void 0 ? "" : componentProps["label"];
638
- if (value2 === null || value2 === void 0) element.removeAttribute("aria-label");
639
- else element.setAttribute("aria-label", String(value2));
640
- element.setAttribute("data-component", "ui-icon-button");
641
- element.setAttribute("data-component-root", "ui-icon-button");
642
- if (children.length > 0) {
643
- for (const child of children) element.append(child);
644
- } else {
645
- }
646
- attachLoomaComponent13(element, definition13, "ui-icon-button", componentProps);
647
- return element;
648
- }
649
-
650
- // src/generated/vanilla/UiInput.js
651
- import { attachLoomaComponent as attachLoomaComponent14 } from "@threadlabs/looma/core/declarative";
652
- var definition14 = { ...{ "contract": { "tag": "ui-input", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "invalid": { "type": "boolean", "required": false, "target": { "attribute": "invalid" }, "default": false }, "readonly": { "type": "boolean", "required": false, "target": { "attribute": "readonly" }, "default": false }, "required": { "type": "boolean", "required": false, "target": { "attribute": "required" }, "default": false }, "value": { "type": "string", "required": false, "target": { "attribute": "value" } } } }, "template": { "kind": "element", "name": "input", "attributes": [{ "kind": "attribute", "name": "value", "expression": "value", "expressionPlan": { "source": "value", "ast": { "kind": "id", "name": "value" }, "dependencies": ["value"] } }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }, { "kind": "attribute", "name": "readonly", "expression": "readonly", "expressionPlan": { "source": "readonly", "ast": { "kind": "id", "name": "readonly" }, "dependencies": ["readonly"] } }, { "kind": "attribute", "name": "required", "expression": "required", "expressionPlan": { "source": "required", "ast": { "kind": "id", "name": "required" }, "dependencies": ["required"] } }], "children": [] }, "declarations": [], "root": { "kind": "native", "element": "input", "choices": ["input"] } }, source: { file: import.meta.url }, css: "" };
653
- function createUiInput(options = {}) {
654
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
655
- const element = document.createElement("input");
656
- for (const [name, value] of Object.entries(attributes)) {
657
- if (value === null || value === void 0 || value === false) continue;
658
- element.setAttribute(name, value === true ? "" : String(value));
659
- }
660
- const value0 = componentProps["value"] === void 0 ? void 0 : componentProps["value"];
661
- if (value0 === null || value0 === void 0) element.removeAttribute("value");
662
- else element.setAttribute("value", String(value0));
663
- const value1 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
664
- if (value1 === true) element.setAttribute("disabled", "");
665
- else element.removeAttribute("disabled");
666
- const value2 = componentProps["readonly"] === void 0 ? false : componentProps["readonly"];
667
- if (value2 === true) element.setAttribute("readonly", "");
668
- else element.removeAttribute("readonly");
669
- const value3 = componentProps["required"] === void 0 ? false : componentProps["required"];
670
- if (value3 === true) element.setAttribute("required", "");
671
- else element.removeAttribute("required");
672
- element.setAttribute("data-component", "ui-input");
673
- element.setAttribute("data-component-root", "ui-input");
674
- attachLoomaComponent14(element, definition14, "ui-input", componentProps);
675
- return element;
676
- }
677
-
678
- // src/generated/vanilla/UiMenuItem.js
679
- import { manageGeneratedProps as manageGeneratedProps2 } from "@threadlabs/looma/core/declarative-generated";
680
- function createUiMenuItem(options = {}) {
681
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
682
- const prop0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
683
- const prop1 = componentProps["value"] === void 0 ? "" : componentProps["value"];
684
- const element = document.createElement("div");
685
- for (const [name, value] of Object.entries(attributes)) {
686
- if (value === null || value === void 0 || value === false) continue;
687
- element.setAttribute(name, value === true ? "" : String(value));
688
- }
689
- element.setAttribute("role", "menuitem");
690
- const value0 = prop1;
691
- if (value0 === null || value0 === void 0) element.removeAttribute("data-value");
692
- else element.setAttribute("data-value", String(value0));
693
- element.setAttribute("data-component", "ui-menu-item");
694
- element.setAttribute("data-component-root", "ui-menu-item");
695
- const element0 = document.createElement("span");
696
- element0.setAttribute("class", "menu-item__surface");
697
- element0.setAttribute("data-component", "ui-menu-item");
698
- if (children.length > 0) {
699
- for (const child of children) element0.append(child);
700
- } else {
701
- }
702
- element.append(element0);
703
- manageGeneratedProps2(element, [
704
- { name: "disabled", attribute: "data-disabled", value: componentProps["disabled"], default: false, type: "boolean", required: false },
705
- { name: "value", attribute: "data-value", value: componentProps["value"], default: "", bound: true, type: "string", required: false }
706
- ]);
707
- return element;
708
- }
709
-
710
- // src/generated/vanilla/UiMenu.js
711
- import { attachLoomaComponent as attachLoomaComponent15 } from "@threadlabs/looma/core/declarative";
712
- var definition15 = { ...{ "contract": { "tag": "ui-menu", "props": { "for": { "type": "string", "required": false, "target": { "attribute": "for" }, "default": "" }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false }, "placement": { "type": "string", "required": false, "target": { "attribute": "placement" }, "default": "bottom-start" } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "menu" }, { "kind": "literal", "name": "aria-orientation", "value": "vertical" }, { "kind": "attribute", "name": "data-state-open", "expression": "internalOpen", "expressionPlan": { "source": "internalOpen", "ast": { "kind": "id", "name": "internalOpen" }, "dependencies": ["internalOpen"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "menu__surface" }], "children": [{ "kind": "slot" }] }] }, "declarations": [{ "kind": "state", "name": "internalOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "select", "type": "object({ value: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "open", "type": "object({ open: boolean, reason: action | programmatic, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "close", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
713
- function createUiMenu(options = {}) {
714
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
715
- const element = document.createElement("div");
716
- for (const [name, value] of Object.entries(attributes)) {
717
- if (value === null || value === void 0 || value === false) continue;
718
- element.setAttribute(name, value === true ? "" : String(value));
719
- }
720
- element.setAttribute("role", "menu");
721
- element.setAttribute("aria-orientation", "vertical");
722
- element.setAttribute("data-component", "ui-menu");
723
- element.setAttribute("data-component-root", "ui-menu");
724
- const element0 = document.createElement("div");
725
- element0.setAttribute("class", "menu__surface");
726
- element0.setAttribute("data-component", "ui-menu");
727
- if (children.length > 0) {
728
- for (const child of children) element0.append(child);
729
- } else {
730
- }
731
- element.append(element0);
732
- attachLoomaComponent15(element, definition15, "ui-menu", componentProps);
733
- return element;
734
- }
735
-
736
- // src/generated/vanilla/UiPopover.js
737
- import { attachLoomaComponent as attachLoomaComponent16 } from "@threadlabs/looma/core/declarative";
738
- var definition16 = { ...{ "contract": { "tag": "ui-popover", "props": { "for": { "type": "string", "required": false, "target": { "attribute": "for" }, "default": "" }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false }, "placement": { "type": "string", "required": false, "target": { "attribute": "placement" }, "default": "bottom-start" } } }, "template": { "kind": "element", "name": "span", "attributes": [{ "kind": "attribute", "name": "data-state-open", "expression": "internalOpen", "expressionPlan": { "source": "internalOpen", "ast": { "kind": "id", "name": "internalOpen" }, "dependencies": ["internalOpen"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "popover__surface" }], "children": [{ "kind": "slot" }] }] }, "declarations": [{ "kind": "state", "name": "internalOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "open", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "close", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "span", "choices": ["span"] } }, source: { file: import.meta.url }, css: "" };
739
- function createUiPopover(options = {}) {
740
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
741
- const element = document.createElement("span");
742
- for (const [name, value] of Object.entries(attributes)) {
743
- if (value === null || value === void 0 || value === false) continue;
744
- element.setAttribute(name, value === true ? "" : String(value));
745
- }
746
- element.setAttribute("data-component", "ui-popover");
747
- element.setAttribute("data-component-root", "ui-popover");
748
- const element0 = document.createElement("div");
749
- element0.setAttribute("class", "popover__surface");
750
- element0.setAttribute("data-component", "ui-popover");
751
- if (children.length > 0) {
752
- for (const child of children) element0.append(child);
753
- } else {
754
- }
755
- element.append(element0);
756
- attachLoomaComponent16(element, definition16, "ui-popover", componentProps);
757
- return element;
758
- }
759
-
760
- // src/generated/vanilla/UiRadioGroup.js
761
- import { attachLoomaComponent as attachLoomaComponent17 } from "@threadlabs/looma/core/declarative";
762
- var definition17 = { ...{ "contract": { "tag": "ui-radio-group", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "data-disabled" }, "default": false }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "Options" }, "name": { "type": "string", "required": false, "target": { "attribute": "name" }, "default": "" }, "orientation": { "type": { "enum": ["horizontal", "vertical"] }, "required": false, "target": { "attribute": "data-orientation" }, "default": "horizontal" }, "required": { "type": "boolean", "required": false, "target": { "attribute": "required" }, "default": false }, "value": { "type": "string", "required": false, "target": { "attribute": "value" }, "default": "" } } }, "template": { "kind": "element", "name": "fieldset", "attributes": [{ "kind": "literal", "name": "role", "value": "radiogroup" }, { "kind": "attribute", "name": "data-orientation", "expression": "orientation", "expressionPlan": { "source": "orientation", "ast": { "kind": "id", "name": "orientation" }, "dependencies": ["orientation"] } }, { "kind": "attribute", "name": "data-disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "legend", "attributes": [], "children": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [] }] }, { "kind": "slot" }] }, "declarations": [{ "kind": "state", "name": "internalValue", "expression": { "source": "''", "ast": { "kind": "literal", "value": "" }, "dependencies": [] } }, { "kind": "event", "name": "select", "type": "object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "change", "type": "object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "fieldset", "choices": ["fieldset"] } }, source: { file: import.meta.url }, css: "" };
763
- function createUiRadioGroup(options = {}) {
764
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
765
- const element = document.createElement("fieldset");
766
- for (const [name, value] of Object.entries(attributes)) {
767
- if (value === null || value === void 0 || value === false) continue;
768
- element.setAttribute(name, value === true ? "" : String(value));
769
- }
770
- element.setAttribute("role", "radiogroup");
771
- const value0 = componentProps["orientation"] === void 0 ? "horizontal" : componentProps["orientation"];
772
- if (value0 === null || value0 === void 0) element.removeAttribute("data-orientation");
773
- else element.setAttribute("data-orientation", String(value0));
774
- const value1 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
775
- if (value1 === true) element.setAttribute("data-disabled", "");
776
- else element.removeAttribute("data-disabled");
777
- element.setAttribute("data-component", "ui-radio-group");
778
- element.setAttribute("data-component-root", "ui-radio-group");
779
- const element0 = document.createElement("legend");
780
- element0.setAttribute("data-component", "ui-radio-group");
781
- const element1 = document.createElement("template");
782
- element1.setAttribute("data-component", "ui-radio-group");
783
- element0.append(element1);
784
- element.append(element0);
785
- if (children.length > 0) {
786
- for (const child of children) element.append(child);
787
- } else {
788
- }
789
- attachLoomaComponent17(element, definition17, "ui-radio-group", componentProps);
790
- return element;
791
- }
792
-
793
- // src/generated/vanilla/UiRadio.js
794
- import { attachLoomaComponent as attachLoomaComponent18 } from "@threadlabs/looma/core/declarative";
795
- var definition18 = { ...{ "contract": { "tag": "ui-radio", "props": { "checked": { "type": "boolean", "required": false, "target": { "attribute": "checked" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "data-disabled" }, "default": false }, "name": { "type": "string", "required": false, "target": { "attribute": "name" }, "default": "" }, "required": { "type": "boolean", "required": false, "target": { "attribute": "required" }, "default": false }, "value": { "type": "string", "required": false, "target": { "attribute": "value" }, "default": "on" } } }, "template": { "kind": "element", "name": "span", "attributes": [{ "kind": "attribute", "name": "data-disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "label", "attributes": [{ "kind": "literal", "name": "class", "value": "control" }], "children": [{ "kind": "element", "name": "input", "attributes": [{ "kind": "literal", "name": "type", "value": "radio" }, { "kind": "attribute", "name": "checked", "expression": "internalChecked", "expressionPlan": { "source": "internalChecked", "ast": { "kind": "id", "name": "internalChecked" }, "dependencies": ["internalChecked"] } }, { "kind": "attribute", "name": "name", "expression": "name", "expressionPlan": { "source": "name", "ast": { "kind": "id", "name": "name" }, "dependencies": ["name"] } }, { "kind": "attribute", "name": "required", "expression": "required", "expressionPlan": { "source": "required", "ast": { "kind": "id", "name": "required" }, "dependencies": ["required"] } }, { "kind": "attribute", "name": "value", "expression": "value", "expressionPlan": { "source": "value", "ast": { "kind": "id", "name": "value" }, "dependencies": ["value"] } }], "children": [] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "label" }], "children": [{ "kind": "slot" }] }] }] }, "declarations": [{ "kind": "state", "name": "internalChecked", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "change", "type": "object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "span", "choices": ["span"] } }, source: { file: import.meta.url }, css: "" };
796
- function createUiRadio(options = {}) {
797
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
798
- const element = document.createElement("span");
799
- for (const [name, value] of Object.entries(attributes)) {
800
- if (value === null || value === void 0 || value === false) continue;
801
- element.setAttribute(name, value === true ? "" : String(value));
802
- }
803
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
804
- if (value0 === true) element.setAttribute("data-disabled", "");
805
- else element.removeAttribute("data-disabled");
806
- element.setAttribute("data-component", "ui-radio");
807
- element.setAttribute("data-component-root", "ui-radio");
808
- const element0 = document.createElement("label");
809
- element0.setAttribute("class", "control");
810
- element0.setAttribute("data-component", "ui-radio");
811
- const element1 = document.createElement("input");
812
- element1.setAttribute("type", "radio");
813
- const value1 = componentProps["name"] === void 0 ? "" : componentProps["name"];
814
- if (value1 === null || value1 === void 0) element1.removeAttribute("name");
815
- else element1.setAttribute("name", String(value1));
816
- const value2 = componentProps["required"] === void 0 ? false : componentProps["required"];
817
- if (value2 === true) element1.setAttribute("required", "");
818
- else element1.removeAttribute("required");
819
- const value3 = componentProps["value"] === void 0 ? "on" : componentProps["value"];
820
- if (value3 === null || value3 === void 0) element1.removeAttribute("value");
821
- else element1.setAttribute("value", String(value3));
822
- element1.setAttribute("data-component", "ui-radio");
823
- element0.append(element1);
824
- const element2 = document.createElement("span");
825
- element2.setAttribute("class", "label");
826
- element2.setAttribute("data-component", "ui-radio");
827
- if (children.length > 0) {
828
- for (const child of children) element2.append(child);
829
- } else {
830
- }
831
- element0.append(element2);
832
- element.append(element0);
833
- attachLoomaComponent18(element, definition18, "ui-radio", componentProps);
834
- return element;
835
- }
836
-
837
- // src/generated/vanilla/UiSearchResultRow.js
838
- import { attachLoomaComponent as attachLoomaComponent19 } from "@threadlabs/looma/core/declarative";
839
- var definition19 = { ...{ "contract": { "tag": "ui-search-result-row", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "selected": { "type": "boolean", "required": false, "target": { "attribute": "data-selected" }, "default": false } } }, "template": { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "search-result-row" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }, { "kind": "attribute", "name": "data-selected", "expression": "selected", "expressionPlan": { "source": "selected", "ast": { "kind": "id", "name": "selected" }, "dependencies": ["selected"] } }, { "kind": "literal", "name": "part", "value": "button" }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "search-result-row__leading" }, { "kind": "literal", "name": "part", "value": "leading" }, { "kind": "attribute", "name": "hidden", "expression": "not hasLeading", "expressionPlan": { "source": "not hasLeading", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "hasLeading" } }, "dependencies": ["hasLeading"] } }], "children": [{ "kind": "slot", "fallback": [], "name": "leading" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "search-result-row__content" }, { "kind": "literal", "name": "part", "value": "content" }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "search-result-row__title" }, { "kind": "literal", "name": "part", "value": "title" }], "children": [{ "kind": "slot", "fallback": [], "name": "title" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "search-result-row__meta" }, { "kind": "literal", "name": "part", "value": "meta" }, { "kind": "attribute", "name": "hidden", "expression": "not hasMeta", "expressionPlan": { "source": "not hasMeta", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "hasMeta" } }, "dependencies": ["hasMeta"] } }], "children": [{ "kind": "slot", "fallback": [], "name": "meta" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "search-result-row__excerpt" }, { "kind": "literal", "name": "part", "value": "excerpt" }, { "kind": "attribute", "name": "hidden", "expression": "not hasExcerpt", "expressionPlan": { "source": "not hasExcerpt", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "hasExcerpt" } }, "dependencies": ["hasExcerpt"] } }], "children": [{ "kind": "slot", "fallback": [], "name": "excerpt" }] }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "search-result-row__trailing" }, { "kind": "literal", "name": "part", "value": "trailing" }, { "kind": "attribute", "name": "hidden", "expression": "not hasTrailing", "expressionPlan": { "source": "not hasTrailing", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "hasTrailing" } }, "dependencies": ["hasTrailing"] } }], "children": [{ "kind": "slot", "fallback": [], "name": "trailing" }] }] }, "declarations": [{ "kind": "state", "name": "hasLeading", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasMeta", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasExcerpt", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasTrailing", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }], "root": { "kind": "native", "element": "button", "choices": ["button"] } }, source: { file: import.meta.url }, css: "" };
840
- function createUiSearchResultRow(options = {}) {
841
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
842
- const element = document.createElement("button");
843
- for (const [name, value] of Object.entries(attributes)) {
844
- if (value === null || value === void 0 || value === false) continue;
845
- element.setAttribute(name, value === true ? "" : String(value));
846
- }
847
- element.setAttribute("class", "search-result-row");
848
- element.setAttribute("type", "button");
849
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
850
- if (value0 === true) element.setAttribute("disabled", "");
851
- else element.removeAttribute("disabled");
852
- const value1 = componentProps["selected"] === void 0 ? false : componentProps["selected"];
853
- if (value1 === true) element.setAttribute("data-selected", "");
854
- else element.removeAttribute("data-selected");
855
- element.setAttribute("part", "button");
856
- element.setAttribute("data-component", "ui-search-result-row");
857
- element.setAttribute("data-component-root", "ui-search-result-row");
858
- const element0 = document.createElement("span");
859
- element0.setAttribute("class", "search-result-row__leading");
860
- element0.setAttribute("part", "leading");
861
- element0.setAttribute("data-component", "ui-search-result-row");
862
- if (slots["leading"] ?? [].length > 0) {
863
- for (const child of slots["leading"] ?? []) element0.append(child);
864
- } else {
865
- }
866
- element.append(element0);
867
- const element1 = document.createElement("span");
868
- element1.setAttribute("class", "search-result-row__content");
869
- element1.setAttribute("part", "content");
870
- element1.setAttribute("data-component", "ui-search-result-row");
871
- const element2 = document.createElement("span");
872
- element2.setAttribute("class", "search-result-row__title");
873
- element2.setAttribute("part", "title");
874
- element2.setAttribute("data-component", "ui-search-result-row");
875
- if (slots["title"] ?? [].length > 0) {
876
- for (const child of slots["title"] ?? []) element2.append(child);
877
- } else {
878
- }
879
- element1.append(element2);
880
- const element3 = document.createElement("span");
881
- element3.setAttribute("class", "search-result-row__meta");
882
- element3.setAttribute("part", "meta");
883
- element3.setAttribute("data-component", "ui-search-result-row");
884
- if (slots["meta"] ?? [].length > 0) {
885
- for (const child of slots["meta"] ?? []) element3.append(child);
886
- } else {
887
- }
888
- element1.append(element3);
889
- const element4 = document.createElement("span");
890
- element4.setAttribute("class", "search-result-row__excerpt");
891
- element4.setAttribute("part", "excerpt");
892
- element4.setAttribute("data-component", "ui-search-result-row");
893
- if (slots["excerpt"] ?? [].length > 0) {
894
- for (const child of slots["excerpt"] ?? []) element4.append(child);
895
- } else {
896
- }
897
- element1.append(element4);
898
- element.append(element1);
899
- const element5 = document.createElement("span");
900
- element5.setAttribute("class", "search-result-row__trailing");
901
- element5.setAttribute("part", "trailing");
902
- element5.setAttribute("data-component", "ui-search-result-row");
903
- if (slots["trailing"] ?? [].length > 0) {
904
- for (const child of slots["trailing"] ?? []) element5.append(child);
905
- } else {
906
- }
907
- element.append(element5);
908
- attachLoomaComponent19(element, definition19, "ui-search-result-row", componentProps);
909
- return element;
910
- }
911
-
912
- // src/generated/vanilla/UiSearchShell.js
913
- import { attachLoomaComponent as attachLoomaComponent20 } from "@threadlabs/looma/core/declarative";
914
- var definition20 = { ...{ "contract": { "tag": "ui-search-shell", "props": { "dismissible": { "type": "boolean", "required": false, "target": { "attribute": "dismissible" }, "default": false }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "Search" }, "modal": { "type": "boolean", "required": false, "target": { "attribute": "modal" }, "default": false }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [{ "kind": "element", "name": "dialog", "attributes": [{ "kind": "literal", "name": "class", "value": "search-shell" }, { "kind": "literal", "name": "part", "value": "base" }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "search-shell__panel" }, { "kind": "literal", "name": "part", "value": "panel" }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "search-shell__search" }, { "kind": "literal", "name": "part", "value": "search" }], "children": [{ "kind": "slot", "fallback": [], "name": "search" }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "search-shell__status" }, { "kind": "literal", "name": "part", "value": "status" }], "children": [{ "kind": "slot", "fallback": [], "name": "status" }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "search-shell__body" }, { "kind": "literal", "name": "part", "value": "body" }], "children": [{ "kind": "slot", "fallback": [], "name": "body" }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "search-shell__footer" }, { "kind": "literal", "name": "part", "value": "footer" }], "children": [{ "kind": "slot", "fallback": [], "name": "footer" }] }] }] }] }, "declarations": [{ "kind": "state", "name": "internalOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "close", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
915
- function createUiSearchShell(options = {}) {
916
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
917
- const element = document.createElement("div");
918
- for (const [name, value] of Object.entries(attributes)) {
919
- if (value === null || value === void 0 || value === false) continue;
920
- element.setAttribute(name, value === true ? "" : String(value));
921
- }
922
- element.setAttribute("data-component", "ui-search-shell");
923
- element.setAttribute("data-component-root", "ui-search-shell");
924
- const element0 = document.createElement("dialog");
925
- element0.setAttribute("class", "search-shell");
926
- element0.setAttribute("part", "base");
927
- element0.setAttribute("data-component", "ui-search-shell");
928
- const element1 = document.createElement("div");
929
- element1.setAttribute("class", "search-shell__panel");
930
- element1.setAttribute("part", "panel");
931
- element1.setAttribute("data-component", "ui-search-shell");
932
- const element2 = document.createElement("div");
933
- element2.setAttribute("class", "search-shell__search");
934
- element2.setAttribute("part", "search");
935
- element2.setAttribute("data-component", "ui-search-shell");
936
- if (slots["search"] ?? [].length > 0) {
937
- for (const child of slots["search"] ?? []) element2.append(child);
938
- } else {
939
- }
940
- element1.append(element2);
941
- const element3 = document.createElement("div");
942
- element3.setAttribute("class", "search-shell__status");
943
- element3.setAttribute("part", "status");
944
- element3.setAttribute("data-component", "ui-search-shell");
945
- if (slots["status"] ?? [].length > 0) {
946
- for (const child of slots["status"] ?? []) element3.append(child);
947
- } else {
948
- }
949
- element1.append(element3);
950
- const element4 = document.createElement("div");
951
- element4.setAttribute("class", "search-shell__body");
952
- element4.setAttribute("part", "body");
953
- element4.setAttribute("data-component", "ui-search-shell");
954
- if (slots["body"] ?? [].length > 0) {
955
- for (const child of slots["body"] ?? []) element4.append(child);
956
- } else {
957
- }
958
- element1.append(element4);
959
- const element5 = document.createElement("div");
960
- element5.setAttribute("class", "search-shell__footer");
961
- element5.setAttribute("part", "footer");
962
- element5.setAttribute("data-component", "ui-search-shell");
963
- if (slots["footer"] ?? [].length > 0) {
964
- for (const child of slots["footer"] ?? []) element5.append(child);
965
- } else {
966
- }
967
- element1.append(element5);
968
- element0.append(element1);
969
- element.append(element0);
970
- attachLoomaComponent20(element, definition20, "ui-search-shell", componentProps);
971
- return element;
972
- }
973
-
974
- // src/generated/vanilla/UiSelect.js
975
- import { attachLoomaComponent as attachLoomaComponent21 } from "@threadlabs/looma/core/declarative";
976
- var definition21 = { ...{ "contract": { "tag": "ui-select", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "invalid": { "type": "boolean", "required": false, "target": { "attribute": "invalid" }, "default": false }, "multiple": { "type": "boolean", "required": false, "target": { "attribute": "multiple" }, "default": false }, "required": { "type": "boolean", "required": false, "target": { "attribute": "required" }, "default": false }, "value": { "type": "string", "required": false, "target": { "attribute": "value" } } } }, "template": { "kind": "element", "name": "select", "attributes": [{ "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }, { "kind": "attribute", "name": "required", "expression": "required", "expressionPlan": { "source": "required", "ast": { "kind": "id", "name": "required" }, "dependencies": ["required"] } }, { "kind": "attribute", "name": "multiple", "expression": "multiple", "expressionPlan": { "source": "multiple", "ast": { "kind": "id", "name": "multiple" }, "dependencies": ["multiple"] } }], "children": [] }, "declarations": [], "root": { "kind": "native", "element": "select", "choices": ["select"] } }, source: { file: import.meta.url }, css: "" };
977
- function createUiSelect(options = {}) {
978
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
979
- const element = document.createElement("select");
980
- for (const [name, value] of Object.entries(attributes)) {
981
- if (value === null || value === void 0 || value === false) continue;
982
- element.setAttribute(name, value === true ? "" : String(value));
983
- }
984
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
985
- if (value0 === true) element.setAttribute("disabled", "");
986
- else element.removeAttribute("disabled");
987
- const value1 = componentProps["required"] === void 0 ? false : componentProps["required"];
988
- if (value1 === true) element.setAttribute("required", "");
989
- else element.removeAttribute("required");
990
- const value2 = componentProps["multiple"] === void 0 ? false : componentProps["multiple"];
991
- if (value2 === true) element.setAttribute("multiple", "");
992
- else element.removeAttribute("multiple");
993
- element.setAttribute("data-component", "ui-select");
994
- element.setAttribute("data-component-root", "ui-select");
995
- attachLoomaComponent21(element, definition21, "ui-select", componentProps);
996
- return element;
997
- }
998
-
999
- // src/generated/vanilla/UiSwitch.js
1000
- import { attachLoomaComponent as attachLoomaComponent22 } from "@threadlabs/looma/core/declarative";
1001
- var definition22 = { ...{ "contract": { "tag": "ui-switch", "props": { "checked": { "type": "boolean", "required": false, "target": { "attribute": "checked" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "data-disabled" }, "default": false }, "required": { "type": "boolean", "required": false, "target": { "attribute": "required" }, "default": false }, "value": { "type": "string", "required": false, "target": { "attribute": "value" }, "default": "on" } } }, "template": { "kind": "element", "name": "span", "attributes": [{ "kind": "attribute", "name": "data-disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "label", "attributes": [{ "kind": "literal", "name": "class", "value": "control" }], "children": [{ "kind": "element", "name": "input", "attributes": [{ "kind": "literal", "name": "type", "value": "checkbox" }, { "kind": "literal", "name": "role", "value": "switch" }, { "kind": "attribute", "name": "checked", "expression": "internalChecked", "expressionPlan": { "source": "internalChecked", "ast": { "kind": "id", "name": "internalChecked" }, "dependencies": ["internalChecked"] } }, { "kind": "attribute", "name": "required", "expression": "required", "expressionPlan": { "source": "required", "ast": { "kind": "id", "name": "required" }, "dependencies": ["required"] } }, { "kind": "attribute", "name": "value", "expression": "value", "expressionPlan": { "source": "value", "ast": { "kind": "id", "name": "value" }, "dependencies": ["value"] } }], "children": [] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "label" }], "children": [{ "kind": "slot" }] }] }] }, "declarations": [{ "kind": "state", "name": "internalChecked", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "change", "type": "object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "span", "choices": ["span"] } }, source: { file: import.meta.url }, css: "" };
1002
- function createUiSwitch(options = {}) {
1003
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1004
- const element = document.createElement("span");
1005
- for (const [name, value] of Object.entries(attributes)) {
1006
- if (value === null || value === void 0 || value === false) continue;
1007
- element.setAttribute(name, value === true ? "" : String(value));
1008
- }
1009
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
1010
- if (value0 === true) element.setAttribute("data-disabled", "");
1011
- else element.removeAttribute("data-disabled");
1012
- element.setAttribute("data-component", "ui-switch");
1013
- element.setAttribute("data-component-root", "ui-switch");
1014
- const element0 = document.createElement("label");
1015
- element0.setAttribute("class", "control");
1016
- element0.setAttribute("data-component", "ui-switch");
1017
- const element1 = document.createElement("input");
1018
- element1.setAttribute("type", "checkbox");
1019
- element1.setAttribute("role", "switch");
1020
- const value1 = componentProps["required"] === void 0 ? false : componentProps["required"];
1021
- if (value1 === true) element1.setAttribute("required", "");
1022
- else element1.removeAttribute("required");
1023
- const value2 = componentProps["value"] === void 0 ? "on" : componentProps["value"];
1024
- if (value2 === null || value2 === void 0) element1.removeAttribute("value");
1025
- else element1.setAttribute("value", String(value2));
1026
- element1.setAttribute("data-component", "ui-switch");
1027
- element0.append(element1);
1028
- const element2 = document.createElement("span");
1029
- element2.setAttribute("class", "label");
1030
- element2.setAttribute("data-component", "ui-switch");
1031
- if (children.length > 0) {
1032
- for (const child of children) element2.append(child);
1033
- } else {
1034
- }
1035
- element0.append(element2);
1036
- element.append(element0);
1037
- attachLoomaComponent22(element, definition22, "ui-switch", componentProps);
1038
- return element;
1039
- }
1040
-
1041
- // src/generated/vanilla/UiTabs.js
1042
- import { attachLoomaComponent as attachLoomaComponent23 } from "@threadlabs/looma/core/declarative";
1043
- var definition23 = { ...{ "contract": { "tag": "ui-tabs", "props": { "label": { "type": "string", "required": false, "target": { "attribute": "aria-label" }, "default": "Tabs" }, "orientation": { "type": { "enum": ["horizontal", "vertical"] }, "required": false, "target": { "attribute": "data-orientation" }, "default": "horizontal" }, "stretch": { "type": "boolean", "required": false, "target": { "attribute": "data-stretch" }, "default": false }, "value": { "type": "string", "required": false, "target": { "attribute": "value" }, "default": "" } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "attribute", "name": "data-orientation", "expression": "orientation", "expressionPlan": { "source": "orientation", "ast": { "kind": "id", "name": "orientation" }, "dependencies": ["orientation"] } }, { "kind": "attribute", "name": "data-stretch", "expression": "stretch", "expressionPlan": { "source": "stretch", "ast": { "kind": "id", "name": "stretch" }, "dependencies": ["stretch"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "tabs__list" }, { "kind": "literal", "name": "role", "value": "tablist" }, { "kind": "attribute", "name": "aria-label", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "tabs__panels" }], "children": [{ "kind": "slot" }] }] }, "declarations": [{ "kind": "state", "name": "internalValue", "expression": { "source": "''", "ast": { "kind": "literal", "value": "" }, "dependencies": [] } }, { "kind": "event", "name": "select", "type": "object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1044
- function createUiTabs(options = {}) {
1045
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1046
- const element = document.createElement("div");
1047
- for (const [name, value] of Object.entries(attributes)) {
1048
- if (value === null || value === void 0 || value === false) continue;
1049
- element.setAttribute(name, value === true ? "" : String(value));
1050
- }
1051
- const value0 = componentProps["orientation"] === void 0 ? "horizontal" : componentProps["orientation"];
1052
- if (value0 === null || value0 === void 0) element.removeAttribute("data-orientation");
1053
- else element.setAttribute("data-orientation", String(value0));
1054
- const value1 = componentProps["stretch"] === void 0 ? false : componentProps["stretch"];
1055
- if (value1 === true) element.setAttribute("data-stretch", "");
1056
- else element.removeAttribute("data-stretch");
1057
- element.setAttribute("data-component", "ui-tabs");
1058
- element.setAttribute("data-component-root", "ui-tabs");
1059
- const element0 = document.createElement("div");
1060
- element0.setAttribute("class", "tabs__list");
1061
- element0.setAttribute("role", "tablist");
1062
- const value2 = componentProps["label"] === void 0 ? "Tabs" : componentProps["label"];
1063
- if (value2 === null || value2 === void 0) element0.removeAttribute("aria-label");
1064
- else element0.setAttribute("aria-label", String(value2));
1065
- element0.setAttribute("data-component", "ui-tabs");
1066
- element.append(element0);
1067
- const element1 = document.createElement("div");
1068
- element1.setAttribute("class", "tabs__panels");
1069
- element1.setAttribute("data-component", "ui-tabs");
1070
- if (children.length > 0) {
1071
- for (const child of children) element1.append(child);
1072
- } else {
1073
- }
1074
- element.append(element1);
1075
- attachLoomaComponent23(element, definition23, "ui-tabs", componentProps);
1076
- return element;
1077
- }
1078
-
1079
- // src/generated/vanilla/UiTextarea.js
1080
- import { attachLoomaComponent as attachLoomaComponent24 } from "@threadlabs/looma/core/declarative";
1081
- var definition24 = { ...{ "contract": { "tag": "ui-textarea", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "invalid": { "type": "boolean", "required": false, "target": { "attribute": "invalid" }, "default": false }, "readonly": { "type": "boolean", "required": false, "target": { "attribute": "readonly" }, "default": false }, "required": { "type": "boolean", "required": false, "target": { "attribute": "required" }, "default": false }, "rows": { "type": { "kind": "terminal", "name": "integer" }, "required": false, "target": { "attribute": "rows" }, "default": 4 }, "value": { "type": "string", "required": false, "target": { "attribute": "value" } } } }, "template": { "kind": "element", "name": "textarea", "attributes": [{ "kind": "attribute", "name": "value", "expression": "value", "expressionPlan": { "source": "value", "ast": { "kind": "id", "name": "value" }, "dependencies": ["value"] } }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }, { "kind": "attribute", "name": "readonly", "expression": "readonly", "expressionPlan": { "source": "readonly", "ast": { "kind": "id", "name": "readonly" }, "dependencies": ["readonly"] } }, { "kind": "attribute", "name": "required", "expression": "required", "expressionPlan": { "source": "required", "ast": { "kind": "id", "name": "required" }, "dependencies": ["required"] } }, { "kind": "attribute", "name": "rows", "expression": "rows", "expressionPlan": { "source": "rows", "ast": { "kind": "id", "name": "rows" }, "dependencies": ["rows"] } }], "children": [] }, "declarations": [], "root": { "kind": "native", "element": "textarea", "choices": ["textarea"] } }, source: { file: import.meta.url }, css: "" };
1082
- function createUiTextarea(options = {}) {
1083
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1084
- const element = document.createElement("textarea");
1085
- for (const [name, value] of Object.entries(attributes)) {
1086
- if (value === null || value === void 0 || value === false) continue;
1087
- element.setAttribute(name, value === true ? "" : String(value));
1088
- }
1089
- const value0 = componentProps["value"] === void 0 ? void 0 : componentProps["value"];
1090
- if (value0 === null || value0 === void 0) element.removeAttribute("value");
1091
- else element.setAttribute("value", String(value0));
1092
- const value1 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
1093
- if (value1 === true) element.setAttribute("disabled", "");
1094
- else element.removeAttribute("disabled");
1095
- const value2 = componentProps["readonly"] === void 0 ? false : componentProps["readonly"];
1096
- if (value2 === true) element.setAttribute("readonly", "");
1097
- else element.removeAttribute("readonly");
1098
- const value3 = componentProps["required"] === void 0 ? false : componentProps["required"];
1099
- if (value3 === true) element.setAttribute("required", "");
1100
- else element.removeAttribute("required");
1101
- const value4 = componentProps["rows"] === void 0 ? 4 : componentProps["rows"];
1102
- if (value4 === null || value4 === void 0) element.removeAttribute("rows");
1103
- else element.setAttribute("rows", String(value4));
1104
- element.setAttribute("data-component", "ui-textarea");
1105
- element.setAttribute("data-component-root", "ui-textarea");
1106
- attachLoomaComponent24(element, definition24, "ui-textarea", componentProps);
1107
- return element;
1108
- }
1109
-
1110
- // src/generated/vanilla/UiToastRegion.js
1111
- import { attachLoomaComponent as attachLoomaComponent25 } from "@threadlabs/looma/core/declarative";
1112
- var definition25 = { ...{ "contract": { "tag": "ui-toast-region", "props": { "auto": { "type": "boolean", "required": false, "target": { "attribute": "auto" }, "default": false }, "duration": { "type": "number", "required": false, "target": { "attribute": "duration" }, "default": 5e3 }, "message": { "type": "string", "required": false, "target": { "attribute": "message" }, "default": "Notification" }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "region" }, { "kind": "literal", "name": "aria-label", "value": "Notifications" }, { "kind": "literal", "name": "aria-live", "value": "polite" }, { "kind": "attribute", "name": "data-state-open", "expression": "internalOpen", "expressionPlan": { "source": "internalOpen", "ast": { "kind": "id", "name": "internalOpen" }, "dependencies": ["internalOpen"] } }], "children": [{ "kind": "slot" }] }, "declarations": [{ "kind": "state", "name": "internalOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "close", "type": "object({ open: boolean, reason: action | timeout | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "dismiss", "type": "object({ id: string, reason: action | timeout, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "method", "name": "show", "exportName": "show", "returns": "promise(string)" }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1113
- function createUiToastRegion(options = {}) {
1114
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1115
- const element = document.createElement("div");
1116
- for (const [name, value] of Object.entries(attributes)) {
1117
- if (value === null || value === void 0 || value === false) continue;
1118
- element.setAttribute(name, value === true ? "" : String(value));
1119
- }
1120
- element.setAttribute("role", "region");
1121
- element.setAttribute("aria-label", "Notifications");
1122
- element.setAttribute("aria-live", "polite");
1123
- element.setAttribute("data-component", "ui-toast-region");
1124
- element.setAttribute("data-component-root", "ui-toast-region");
1125
- if (children.length > 0) {
1126
- for (const child of children) element.append(child);
1127
- } else {
1128
- }
1129
- attachLoomaComponent25(element, definition25, "ui-toast-region", componentProps);
1130
- return element;
1131
- }
1132
-
1133
- // src/generated/vanilla/UiTooltip.js
1134
- import { attachLoomaComponent as attachLoomaComponent26 } from "@threadlabs/looma/core/declarative";
1135
- var definition26 = { ...{ "contract": { "tag": "ui-tooltip", "props": { "for": { "type": "string", "required": false, "target": { "attribute": "for" }, "default": "" }, "hideDelay": { "type": "number", "required": false, "target": { "attribute": "hidedelay" }, "default": 100 }, "inverse": { "type": "boolean", "required": false, "target": { "attribute": "data-inverse" }, "default": false }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false }, "placement": { "type": "string", "required": false, "target": { "attribute": "placement" }, "default": "top-start" }, "showDelay": { "type": "number", "required": false, "target": { "attribute": "showdelay" }, "default": 500 } } }, "template": { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "role", "value": "tooltip" }, { "kind": "attribute", "name": "hidden", "expression": "not internalOpen", "expressionPlan": { "source": "not internalOpen", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "internalOpen" } }, "dependencies": ["internalOpen"] } }, { "kind": "attribute", "name": "data-state-open", "expression": "internalOpen", "expressionPlan": { "source": "internalOpen", "ast": { "kind": "id", "name": "internalOpen" }, "dependencies": ["internalOpen"] } }, { "kind": "attribute", "name": "data-inverse", "expression": "inverse", "expressionPlan": { "source": "inverse", "ast": { "kind": "id", "name": "inverse" }, "dependencies": ["inverse"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "tooltip__surface" }], "children": [{ "kind": "slot" }] }] }, "declarations": [{ "kind": "state", "name": "internalOpen", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "open", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "close", "type": "object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "span", "choices": ["span"] } }, source: { file: import.meta.url }, css: "" };
1136
- function createUiTooltip(options = {}) {
1137
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1138
- const element = document.createElement("span");
1139
- for (const [name, value] of Object.entries(attributes)) {
1140
- if (value === null || value === void 0 || value === false) continue;
1141
- element.setAttribute(name, value === true ? "" : String(value));
1142
- }
1143
- element.setAttribute("role", "tooltip");
1144
- const value0 = componentProps["inverse"] === void 0 ? false : componentProps["inverse"];
1145
- if (value0 === true) element.setAttribute("data-inverse", "");
1146
- else element.removeAttribute("data-inverse");
1147
- element.setAttribute("data-component", "ui-tooltip");
1148
- element.setAttribute("data-component-root", "ui-tooltip");
1149
- const element0 = document.createElement("div");
1150
- element0.setAttribute("class", "tooltip__surface");
1151
- element0.setAttribute("data-component", "ui-tooltip");
1152
- if (children.length > 0) {
1153
- for (const child of children) element0.append(child);
1154
- } else {
1155
- }
1156
- element.append(element0);
1157
- attachLoomaComponent26(element, definition26, "ui-tooltip", componentProps);
1158
- return element;
1159
- }
1160
-
1161
- // src/generated/vanilla/UiTopBar.js
1162
- import { attachLoomaComponent as attachLoomaComponent27 } from "@threadlabs/looma/core/declarative";
1163
- var definition27 = { ...{ "contract": { "tag": "ui-top-bar", "props": {} }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [{ "kind": "element", "name": "header", "attributes": [{ "kind": "literal", "name": "class", "value": "top-bar" }, { "kind": "literal", "name": "part", "value": "base" }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "top-bar__leading" }, { "kind": "attribute", "name": "hidden", "expression": "not hasLeading", "expressionPlan": { "source": "not hasLeading", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "hasLeading" } }, "dependencies": ["hasLeading"] } }], "children": [{ "kind": "slot", "fallback": [], "name": "leading" }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "top-bar__title" }], "children": [{ "kind": "slot" }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "top-bar__search" }, { "kind": "attribute", "name": "hidden", "expression": "not hasSearch", "expressionPlan": { "source": "not hasSearch", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "hasSearch" } }, "dependencies": ["hasSearch"] } }], "children": [{ "kind": "slot", "fallback": [], "name": "search" }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "top-bar__actions" }, { "kind": "attribute", "name": "hidden", "expression": "not hasActions", "expressionPlan": { "source": "not hasActions", "ast": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "hasActions" } }, "dependencies": ["hasActions"] } }], "children": [{ "kind": "slot", "fallback": [], "name": "actions" }] }] }] }, "declarations": [{ "kind": "state", "name": "hasLeading", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasSearch", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasActions", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1164
- function createUiTopBar(options = {}) {
1165
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1166
- const element = document.createElement("div");
1167
- for (const [name, value] of Object.entries(attributes)) {
1168
- if (value === null || value === void 0 || value === false) continue;
1169
- element.setAttribute(name, value === true ? "" : String(value));
1170
- }
1171
- element.setAttribute("data-component", "ui-top-bar");
1172
- element.setAttribute("data-component-root", "ui-top-bar");
1173
- const element0 = document.createElement("header");
1174
- element0.setAttribute("class", "top-bar");
1175
- element0.setAttribute("part", "base");
1176
- element0.setAttribute("data-component", "ui-top-bar");
1177
- const element1 = document.createElement("div");
1178
- element1.setAttribute("class", "top-bar__leading");
1179
- element1.setAttribute("data-component", "ui-top-bar");
1180
- if (slots["leading"] ?? [].length > 0) {
1181
- for (const child of slots["leading"] ?? []) element1.append(child);
1182
- } else {
1183
- }
1184
- element0.append(element1);
1185
- const element2 = document.createElement("div");
1186
- element2.setAttribute("class", "top-bar__title");
1187
- element2.setAttribute("data-component", "ui-top-bar");
1188
- if (children.length > 0) {
1189
- for (const child of children) element2.append(child);
1190
- } else {
1191
- }
1192
- element0.append(element2);
1193
- const element3 = document.createElement("div");
1194
- element3.setAttribute("class", "top-bar__search");
1195
- element3.setAttribute("data-component", "ui-top-bar");
1196
- if (slots["search"] ?? [].length > 0) {
1197
- for (const child of slots["search"] ?? []) element3.append(child);
1198
- } else {
1199
- }
1200
- element0.append(element3);
1201
- const element4 = document.createElement("div");
1202
- element4.setAttribute("class", "top-bar__actions");
1203
- element4.setAttribute("data-component", "ui-top-bar");
1204
- if (slots["actions"] ?? [].length > 0) {
1205
- for (const child of slots["actions"] ?? []) element4.append(child);
1206
- } else {
1207
- }
1208
- element0.append(element4);
1209
- element.append(element0);
1210
- attachLoomaComponent27(element, definition27, "ui-top-bar", componentProps);
1211
- return element;
1212
- }
1213
-
1214
- // src/generated/vanilla/UiTreeItem.js
1215
- import { attachLoomaComponent as attachLoomaComponent28 } from "@threadlabs/looma/core/declarative";
1216
- var definition28 = { ...{ "contract": { "tag": "ui-tree-item", "props": { "accepts": { "type": "string", "required": false, "target": { "attribute": "data-accepts" }, "default": "" }, "container": { "type": "boolean", "required": false, "target": { "attribute": "container" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "dragType": { "type": "string", "required": false, "target": { "attribute": "dragtype" }, "default": "item" }, "dropDepth": { "type": "number", "required": false, "target": { "attribute": "dropdepth" } }, "dropScope": { "type": "string", "required": false, "target": { "attribute": "data-drop-scope" }, "default": "" }, "expanded": { "type": "boolean", "required": false, "target": { "attribute": "expanded" }, "default": false }, "itemId": { "type": "string", "required": false, "target": { "attribute": "itemid" }, "default": "" }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "" }, "selected": { "type": "boolean", "required": false, "target": { "attribute": "selected" }, "default": false }, "sortable": { "type": "boolean", "required": false, "target": { "attribute": "sortable" }, "default": false }, "subtreeDepth": { "type": "number", "required": false, "target": { "attribute": "subtreedepth" } } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "treeitem" }, { "kind": "attribute", "name": "data-drop-scope", "expression": "dropScope", "expressionPlan": { "source": "dropScope", "ast": { "kind": "id", "name": "dropScope" }, "dependencies": ["dropScope"] } }, { "kind": "attribute", "name": "data-accepts", "expression": "accepts", "expressionPlan": { "source": "accepts", "ast": { "kind": "id", "name": "accepts" }, "dependencies": ["accepts"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "row" }, { "kind": "literal", "name": "part", "value": "row" }], "children": [{ "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "drag-handle" }, { "kind": "literal", "name": "part", "value": "drag-handle" }, { "kind": "literal", "name": "type", "value": "button" }], "children": [{ "kind": "element", "name": "svg", "attributes": [{ "kind": "literal", "name": "aria-hidden", "value": "true" }, { "kind": "literal", "name": "focusable", "value": "false" }, { "kind": "literal", "name": "viewBox", "value": "0 0 24 24" }, { "kind": "literal", "name": "fill", "value": "none" }, { "kind": "literal", "name": "stroke", "value": "currentColor" }, { "kind": "literal", "name": "stroke-width", "value": "2" }, { "kind": "literal", "name": "stroke-linecap", "value": "round" }, { "kind": "literal", "name": "stroke-linejoin", "value": "round" }], "children": [{ "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }] }], "flow": { "kind": "if", "test": "sortable and not disabled", "testPlan": { "source": "sortable and not disabled", "ast": { "kind": "binary", "op": "and", "left": { "kind": "id", "name": "sortable" }, "right": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "disabled" } } }, "dependencies": ["disabled", "sortable"] } } }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure" }, { "kind": "literal", "name": "part", "value": "disclosure" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure-icon" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "leading" }, { "kind": "literal", "name": "part", "value": "leading" }], "children": [{ "kind": "slot", "fallback": [], "name": "leading" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "label" }, { "kind": "literal", "name": "part", "value": "label" }], "children": [] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "actions" }, { "kind": "literal", "name": "part", "value": "actions" }], "children": [{ "kind": "slot", "fallback": [], "name": "actions" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator row-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "children" }, { "kind": "literal", "name": "part", "value": "children" }, { "kind": "literal", "name": "role", "value": "group" }], "children": [{ "kind": "slot" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator subtree-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, "declarations": [{ "kind": "state", "name": "internalExpanded", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "structuralLevel", "expression": { "source": "1", "ast": { "kind": "literal", "value": 1 }, "dependencies": [] } }, { "kind": "state", "name": "tabStop", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasChildren", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "expand", "type": "object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })", "bubbles": false, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1217
- function createUiTreeItem(options = {}) {
1218
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1219
- const element = document.createElement("div");
1220
- for (const [name, value] of Object.entries(attributes)) {
1221
- if (value === null || value === void 0 || value === false) continue;
1222
- element.setAttribute(name, value === true ? "" : String(value));
1223
- }
1224
- element.setAttribute("role", "treeitem");
1225
- const value0 = componentProps["dropScope"] === void 0 ? "" : componentProps["dropScope"];
1226
- if (value0 === null || value0 === void 0) element.removeAttribute("data-drop-scope");
1227
- else element.setAttribute("data-drop-scope", String(value0));
1228
- const value1 = componentProps["accepts"] === void 0 ? "" : componentProps["accepts"];
1229
- if (value1 === null || value1 === void 0) element.removeAttribute("data-accepts");
1230
- else element.setAttribute("data-accepts", String(value1));
1231
- element.setAttribute("data-component", "ui-tree-item");
1232
- element.setAttribute("data-component-root", "ui-tree-item");
1233
- const element0 = document.createElement("div");
1234
- element0.setAttribute("class", "row");
1235
- element0.setAttribute("part", "row");
1236
- element0.setAttribute("data-component", "ui-tree-item");
1237
- const element1 = document.createElement("button");
1238
- element1.setAttribute("class", "drag-handle");
1239
- element1.setAttribute("part", "drag-handle");
1240
- element1.setAttribute("type", "button");
1241
- element1.setAttribute("data-component", "ui-tree-item");
1242
- const element2 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
1243
- element2.setAttribute("aria-hidden", "true");
1244
- element2.setAttribute("focusable", "false");
1245
- element2.setAttribute("viewBox", "0 0 24 24");
1246
- element2.setAttribute("fill", "none");
1247
- element2.setAttribute("stroke", "currentColor");
1248
- element2.setAttribute("stroke-width", "2");
1249
- element2.setAttribute("stroke-linecap", "round");
1250
- element2.setAttribute("stroke-linejoin", "round");
1251
- element2.setAttribute("data-component", "ui-tree-item");
1252
- const element3 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1253
- element3.setAttribute("cx", "9");
1254
- element3.setAttribute("cy", "12");
1255
- element3.setAttribute("r", "1");
1256
- element3.setAttribute("data-component", "ui-tree-item");
1257
- element2.append(element3);
1258
- const element4 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1259
- element4.setAttribute("cx", "9");
1260
- element4.setAttribute("cy", "5");
1261
- element4.setAttribute("r", "1");
1262
- element4.setAttribute("data-component", "ui-tree-item");
1263
- element2.append(element4);
1264
- const element5 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1265
- element5.setAttribute("cx", "9");
1266
- element5.setAttribute("cy", "19");
1267
- element5.setAttribute("r", "1");
1268
- element5.setAttribute("data-component", "ui-tree-item");
1269
- element2.append(element5);
1270
- const element6 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1271
- element6.setAttribute("cx", "15");
1272
- element6.setAttribute("cy", "12");
1273
- element6.setAttribute("r", "1");
1274
- element6.setAttribute("data-component", "ui-tree-item");
1275
- element2.append(element6);
1276
- const element7 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1277
- element7.setAttribute("cx", "15");
1278
- element7.setAttribute("cy", "5");
1279
- element7.setAttribute("r", "1");
1280
- element7.setAttribute("data-component", "ui-tree-item");
1281
- element2.append(element7);
1282
- const element8 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1283
- element8.setAttribute("cx", "15");
1284
- element8.setAttribute("cy", "19");
1285
- element8.setAttribute("r", "1");
1286
- element8.setAttribute("data-component", "ui-tree-item");
1287
- element2.append(element8);
1288
- element1.append(element2);
1289
- element0.append(element1);
1290
- const element9 = document.createElement("button");
1291
- element9.setAttribute("class", "disclosure");
1292
- element9.setAttribute("part", "disclosure");
1293
- element9.setAttribute("type", "button");
1294
- const value2 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
1295
- if (value2 === true) element9.setAttribute("disabled", "");
1296
- else element9.removeAttribute("disabled");
1297
- element9.setAttribute("data-component", "ui-tree-item");
1298
- const element10 = document.createElement("span");
1299
- element10.setAttribute("class", "disclosure-icon");
1300
- element10.setAttribute("aria-hidden", "true");
1301
- element10.setAttribute("data-component", "ui-tree-item");
1302
- element9.append(element10);
1303
- element0.append(element9);
1304
- const element11 = document.createElement("span");
1305
- element11.setAttribute("class", "leading");
1306
- element11.setAttribute("part", "leading");
1307
- element11.setAttribute("data-component", "ui-tree-item");
1308
- if (slots["leading"] ?? [].length > 0) {
1309
- for (const child of slots["leading"] ?? []) element11.append(child);
1310
- } else {
1311
- }
1312
- element0.append(element11);
1313
- const element12 = document.createElement("span");
1314
- element12.setAttribute("class", "label");
1315
- element12.setAttribute("part", "label");
1316
- element12.setAttribute("data-component", "ui-tree-item");
1317
- element0.append(element12);
1318
- const element13 = document.createElement("span");
1319
- element13.setAttribute("class", "actions");
1320
- element13.setAttribute("part", "actions");
1321
- element13.setAttribute("data-component", "ui-tree-item");
1322
- if (slots["actions"] ?? [].length > 0) {
1323
- for (const child of slots["actions"] ?? []) element13.append(child);
1324
- } else {
1325
- }
1326
- element0.append(element13);
1327
- const element14 = document.createElement("span");
1328
- element14.setAttribute("class", "drop-indicator row-drop-indicator");
1329
- element14.setAttribute("part", "drop-indicator");
1330
- element14.setAttribute("aria-hidden", "true");
1331
- element14.setAttribute("data-component", "ui-tree-item");
1332
- element0.append(element14);
1333
- element.append(element0);
1334
- const element15 = document.createElement("div");
1335
- element15.setAttribute("class", "children");
1336
- element15.setAttribute("part", "children");
1337
- element15.setAttribute("role", "group");
1338
- element15.setAttribute("data-component", "ui-tree-item");
1339
- if (children.length > 0) {
1340
- for (const child of children) element15.append(child);
1341
- } else {
1342
- }
1343
- element.append(element15);
1344
- const element16 = document.createElement("span");
1345
- element16.setAttribute("class", "drop-indicator subtree-drop-indicator");
1346
- element16.setAttribute("part", "drop-indicator");
1347
- element16.setAttribute("aria-hidden", "true");
1348
- element16.setAttribute("data-component", "ui-tree-item");
1349
- element.append(element16);
1350
- attachLoomaComponent28(element, definition28, "ui-tree-item", componentProps);
1351
- return element;
1352
- }
1353
-
1354
- // src/generated/vanilla/UiTree.js
1355
- import { attachLoomaComponent as attachLoomaComponent29 } from "@threadlabs/looma/core/declarative";
1356
- var definition29 = { ...{ "contract": { "tag": "ui-tree", "props": { "hoverExpandDelay": { "type": "number", "required": false, "target": { "attribute": "hoverexpanddelay" }, "default": 700 }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "Tree" }, "maxDepth": { "type": "number", "required": false, "target": { "attribute": "maxdepth" }, "default": 0 } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "tree" }], "children": [{ "kind": "slot" }] }, "declarations": [{ "kind": "event", "name": "reorder", "type": "object({ sourceId: string, targetId: string, position: before | inside | after, sourceType: string, targetType: string, sourceScope: string, targetScope: string, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "reorder-rejected", "type": "object({ sourceId: string, targetId: string, position: before | inside | after, reason: max-depth, maxDepth: integer, resultingDepth: integer, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1357
- function createUiTree(options = {}) {
1358
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1359
- const element = document.createElement("div");
1360
- for (const [name, value] of Object.entries(attributes)) {
1361
- if (value === null || value === void 0 || value === false) continue;
1362
- element.setAttribute(name, value === true ? "" : String(value));
1363
- }
1364
- element.setAttribute("role", "tree");
1365
- element.setAttribute("data-component", "ui-tree");
1366
- element.setAttribute("data-component-root", "ui-tree");
1367
- if (children.length > 0) {
1368
- for (const child of children) element.append(child);
1369
- } else {
1370
- }
1371
- attachLoomaComponent29(element, definition29, "ui-tree", componentProps);
1372
- return element;
1373
- }
1374
-
1375
- // src/generated/vanilla/UiCluster.js
1376
- import { manageGeneratedProps as manageGeneratedProps3 } from "@threadlabs/looma/core/declarative-generated";
1377
- function createUiCluster(options = {}) {
1378
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1379
- const prop0 = componentProps["align"] === void 0 ? void 0 : componentProps["align"];
1380
- const prop1 = componentProps["gap"] === void 0 ? void 0 : componentProps["gap"];
1381
- const element = document.createElement("div");
1382
- for (const [name, value] of Object.entries(attributes)) {
1383
- if (value === null || value === void 0 || value === false) continue;
1384
- element.setAttribute(name, value === true ? "" : String(value));
1385
- }
1386
- element.setAttribute("data-component", "ui-cluster");
1387
- element.setAttribute("data-component-root", "ui-cluster");
1388
- if (children.length > 0) {
1389
- for (const child of children) element.append(child);
1390
- } else {
1391
- }
1392
- manageGeneratedProps3(element, [
1393
- { name: "align", attribute: "data-align", value: componentProps["align"], type: ["start", "center", "end", "stretch"], required: false },
1394
- { name: "gap", attribute: "data-gap", value: componentProps["gap"], type: ["xs", "s", "m", "l", "xl"], required: false }
1395
- ]);
1396
- return element;
1397
- }
1398
-
1399
- // src/generated/vanilla/UiContainer.js
1400
- import { manageGeneratedProps as manageGeneratedProps4 } from "@threadlabs/looma/core/declarative-generated";
1401
- function createUiContainer(options = {}) {
1402
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1403
- const prop0 = componentProps["gutters"] === void 0 ? void 0 : componentProps["gutters"];
1404
- const prop1 = componentProps["measure"] === void 0 ? void 0 : componentProps["measure"];
1405
- const element = document.createElement("div");
1406
- for (const [name, value] of Object.entries(attributes)) {
1407
- if (value === null || value === void 0 || value === false) continue;
1408
- element.setAttribute(name, value === true ? "" : String(value));
1409
- }
1410
- element.setAttribute("data-component", "ui-container");
1411
- element.setAttribute("data-component-root", "ui-container");
1412
- if (children.length > 0) {
1413
- for (const child of children) element.append(child);
1414
- } else {
1415
- }
1416
- manageGeneratedProps4(element, [
1417
- { name: "gutters", attribute: "data-gutters", value: componentProps["gutters"], type: ["s", "m", "l"], required: false },
1418
- { name: "measure", attribute: "data-measure", value: componentProps["measure"], type: ["narrow", "wide"], required: false }
1419
- ]);
1420
- return element;
1421
- }
1422
-
1423
- // src/generated/vanilla/UiGrid.js
1424
- import { manageGeneratedProps as manageGeneratedProps5 } from "@threadlabs/looma/core/declarative-generated";
1425
- function createUiGrid(options = {}) {
1426
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1427
- const prop0 = componentProps["gap"] === void 0 ? void 0 : componentProps["gap"];
1428
- const prop1 = componentProps["min"] === void 0 ? void 0 : componentProps["min"];
1429
- const element = document.createElement("div");
1430
- for (const [name, value] of Object.entries(attributes)) {
1431
- if (value === null || value === void 0 || value === false) continue;
1432
- element.setAttribute(name, value === true ? "" : String(value));
1433
- }
1434
- element.setAttribute("data-component", "ui-grid");
1435
- element.setAttribute("data-component-root", "ui-grid");
1436
- if (children.length > 0) {
1437
- for (const child of children) element.append(child);
1438
- } else {
1439
- }
1440
- manageGeneratedProps5(element, [
1441
- { name: "gap", attribute: "data-gap", value: componentProps["gap"], type: ["xs", "s", "m", "l", "xl"], required: false },
1442
- { name: "min", attribute: "data-min", value: componentProps["min"], type: ["sm", "md", "lg"], required: false }
1443
- ]);
1444
- return element;
1445
- }
1446
-
1447
- // src/generated/vanilla/UiReel.js
1448
- import { attachLoomaComponent as attachLoomaComponent30 } from "@threadlabs/looma/core/declarative";
1449
- var definition30 = { ...{ "contract": { "tag": "ui-reel", "props": { "gap": { "type": { "enum": ["xs", "s", "m", "l", "xl"] }, "required": false, "target": { "attribute": "gap" } }, "itemWidth": { "type": { "enum": ["sm", "md", "lg"] }, "required": false, "target": { "attribute": "itemwidth" } }, "snap": { "type": { "enum": ["start", "center"] }, "required": false, "target": { "attribute": "snap" } } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [{ "kind": "slot" }] }, "declarations": [], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1450
- function createUiReel(options = {}) {
1451
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1452
- const element = document.createElement("div");
1453
- for (const [name, value] of Object.entries(attributes)) {
1454
- if (value === null || value === void 0 || value === false) continue;
1455
- element.setAttribute(name, value === true ? "" : String(value));
1456
- }
1457
- element.setAttribute("data-component", "ui-reel");
1458
- element.setAttribute("data-component-root", "ui-reel");
1459
- if (children.length > 0) {
1460
- for (const child of children) element.append(child);
1461
- } else {
1462
- }
1463
- attachLoomaComponent30(element, definition30, "ui-reel", componentProps);
1464
- return element;
1465
- }
1466
-
1467
- // src/generated/vanilla/UiSeparator.js
1468
- import { attachLoomaComponent as attachLoomaComponent31 } from "@threadlabs/looma/core/declarative";
1469
- var definition31 = { ...{ "contract": { "tag": "ui-separator", "props": { "orientation": { "type": { "enum": ["horizontal", "vertical"] }, "required": false, "target": { "attribute": "orientation" }, "default": "horizontal" } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [{ "kind": "slot" }] }, "declarations": [], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1470
- function createUiSeparator(options = {}) {
1471
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1472
- const element = document.createElement("div");
1473
- for (const [name, value] of Object.entries(attributes)) {
1474
- if (value === null || value === void 0 || value === false) continue;
1475
- element.setAttribute(name, value === true ? "" : String(value));
1476
- }
1477
- element.setAttribute("data-component", "ui-separator");
1478
- element.setAttribute("data-component-root", "ui-separator");
1479
- if (children.length > 0) {
1480
- for (const child of children) element.append(child);
1481
- } else {
1482
- }
1483
- attachLoomaComponent31(element, definition31, "ui-separator", componentProps);
1484
- return element;
1485
- }
1486
-
1487
- // src/generated/vanilla/UiSidebar.js
1488
- import { attachLoomaComponent as attachLoomaComponent32 } from "@threadlabs/looma/core/declarative";
1489
- var definition32 = { ...{ "contract": { "tag": "ui-sidebar", "props": { "breakpoint": { "type": { "enum": ["sm", "md", "lg"] }, "required": false, "target": { "attribute": "breakpoint" }, "default": "md" }, "collapsed": { "type": "boolean", "required": false, "target": { "attribute": "collapsed" }, "default": false }, "maxWidth": { "type": "number", "required": false, "target": { "attribute": "maxwidth" }, "default": 480 }, "minWidth": { "type": "number", "required": false, "target": { "attribute": "minwidth" }, "default": 200 }, "resizable": { "type": "boolean", "required": false, "target": { "attribute": "resizable" }, "default": false }, "resizeLabel": { "type": "string", "required": false, "target": { "attribute": "resizelabel" }, "default": "Resize sidebar" }, "resizeStep": { "type": "number", "required": false, "target": { "attribute": "resizestep" }, "default": 16 }, "side": { "type": { "enum": ["start", "end"] }, "required": false, "target": { "attribute": "side" }, "default": "start" }, "width": { "type": "number", "required": false, "target": { "attribute": "width" }, "default": 0 } } }, "template": { "kind": "element", "name": "aside", "attributes": [{ "kind": "attribute", "name": "data-state-collapsed", "expression": "internalCollapsed", "expressionPlan": { "source": "internalCollapsed", "ast": { "kind": "id", "name": "internalCollapsed" }, "dependencies": ["internalCollapsed"] } }, { "kind": "attribute", "name": "data-state-drawer", "expression": "drawer", "expressionPlan": { "source": "drawer", "ast": { "kind": "id", "name": "drawer" }, "dependencies": ["drawer"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "sidebar__content" }], "children": [{ "kind": "slot" }] }] }, "declarations": [{ "kind": "state", "name": "internalCollapsed", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "drawer", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "resize", "type": "object({ width: number, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "toggle", "type": "object({ open: boolean, mode: docked | drawer, trigger: keyboard | pointer | programmatic })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "aside", "choices": ["aside"] } }, source: { file: import.meta.url }, css: "" };
1490
- function createUiSidebar(options = {}) {
1491
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1492
- const element = document.createElement("aside");
1493
- for (const [name, value] of Object.entries(attributes)) {
1494
- if (value === null || value === void 0 || value === false) continue;
1495
- element.setAttribute(name, value === true ? "" : String(value));
1496
- }
1497
- element.setAttribute("data-component", "ui-sidebar");
1498
- element.setAttribute("data-component-root", "ui-sidebar");
1499
- const element0 = document.createElement("div");
1500
- element0.setAttribute("class", "sidebar__content");
1501
- element0.setAttribute("data-component", "ui-sidebar");
1502
- if (children.length > 0) {
1503
- for (const child of children) element0.append(child);
1504
- } else {
1505
- }
1506
- element.append(element0);
1507
- attachLoomaComponent32(element, definition32, "ui-sidebar", componentProps);
1508
- return element;
1509
- }
1510
-
1511
- // src/generated/vanilla/UiStack.js
1512
- import { manageGeneratedProps as manageGeneratedProps6 } from "@threadlabs/looma/core/declarative-generated";
1513
- function createUiStack(options = {}) {
1514
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1515
- const prop0 = componentProps["align"] === void 0 ? void 0 : componentProps["align"];
1516
- const prop1 = componentProps["gap"] === void 0 ? void 0 : componentProps["gap"];
1517
- const prop2 = componentProps["justify"] === void 0 ? void 0 : componentProps["justify"];
1518
- const element = document.createElement("div");
1519
- for (const [name, value] of Object.entries(attributes)) {
1520
- if (value === null || value === void 0 || value === false) continue;
1521
- element.setAttribute(name, value === true ? "" : String(value));
1522
- }
1523
- element.setAttribute("data-component", "ui-stack");
1524
- element.setAttribute("data-component-root", "ui-stack");
1525
- if (children.length > 0) {
1526
- for (const child of children) element.append(child);
1527
- } else {
1528
- }
1529
- manageGeneratedProps6(element, [
1530
- { name: "align", attribute: "data-align", value: componentProps["align"], type: ["start", "center", "end", "stretch"], required: false },
1531
- { name: "gap", attribute: "data-gap", value: componentProps["gap"], type: ["xs", "s", "m", "l", "xl"], required: false },
1532
- { name: "justify", attribute: "data-justify", value: componentProps["justify"], type: ["start", "center", "end", "between"], required: false }
1533
- ]);
1534
- return element;
1535
- }
1536
-
1537
- // src/generated/vanilla/UiSwitcher.js
1538
- import { manageGeneratedProps as manageGeneratedProps7 } from "@threadlabs/looma/core/declarative-generated";
1539
- function createUiSwitcher(options = {}) {
1540
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1541
- const prop0 = componentProps["align"] === void 0 ? void 0 : componentProps["align"];
1542
- const prop1 = componentProps["gap"] === void 0 ? void 0 : componentProps["gap"];
1543
- const prop2 = componentProps["threshold"] === void 0 ? void 0 : componentProps["threshold"];
1544
- const element = document.createElement("div");
1545
- for (const [name, value] of Object.entries(attributes)) {
1546
- if (value === null || value === void 0 || value === false) continue;
1547
- element.setAttribute(name, value === true ? "" : String(value));
1548
- }
1549
- element.setAttribute("data-component", "ui-switcher");
1550
- element.setAttribute("data-component-root", "ui-switcher");
1551
- if (children.length > 0) {
1552
- for (const child of children) element.append(child);
1553
- } else {
1554
- }
1555
- manageGeneratedProps7(element, [
1556
- { name: "align", attribute: "data-align", value: componentProps["align"], type: ["start", "center", "end", "stretch"], required: false },
1557
- { name: "gap", attribute: "data-gap", value: componentProps["gap"], type: ["xs", "s", "m", "l", "xl"], required: false },
1558
- { name: "threshold", attribute: "data-threshold", value: componentProps["threshold"], type: ["xs", "sm", "md", "lg"], required: false }
1559
- ]);
1560
- return element;
1561
- }
1562
-
1563
- // src/generated/vanilla/UiEditorInsertTableGrid.js
1564
- import { attachLoomaComponent as attachLoomaComponent33 } from "@threadlabs/looma/core/declarative";
1565
- var definition33 = { ...{ "contract": { "tag": "ui-editor-insert-table-grid", "props": { "headerRow": { "type": "boolean", "required": false, "target": { "attribute": "headerrow" }, "default": false }, "maxCols": { "type": { "kind": "terminal", "name": "integer" }, "required": false, "target": { "attribute": "maxcols" }, "default": 8 }, "maxRows": { "type": { "kind": "terminal", "name": "integer" }, "required": false, "target": { "attribute": "maxrows" }, "default": 8 }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [] }, "declarations": [{ "kind": "event", "name": "insert", "type": "object({ rows: integer, cols: integer, withHeaderRow: boolean })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1566
- function createUiEditorInsertTableGrid(options = {}) {
1567
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1568
- const element = document.createElement("div");
1569
- for (const [name, value] of Object.entries(attributes)) {
1570
- if (value === null || value === void 0 || value === false) continue;
1571
- element.setAttribute(name, value === true ? "" : String(value));
1572
- }
1573
- element.setAttribute("data-component", "ui-editor-insert-table-grid");
1574
- element.setAttribute("data-component-root", "ui-editor-insert-table-grid");
1575
- attachLoomaComponent33(element, definition33, "ui-editor-insert-table-grid", componentProps);
1576
- return element;
1577
- }
1578
-
1579
- // src/generated/vanilla/UiEditorMentionMenu.js
1580
- import { attachLoomaComponent as attachLoomaComponent34 } from "@threadlabs/looma/core/declarative";
1581
- var definition34 = { ...{ "contract": { "tag": "ui-editor-mention-menu", "props": { "anchorRect": { "type": { "kind": "union", "members": [{ "kind": "object", "fields": [{ "name": "left", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "top", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "right", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "bottom", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "x", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "y", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "width", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "height", "type": { "kind": "terminal", "name": "number" }, "optional": true }], "open": false }, { "kind": "terminal", "name": "null" }] }, "required": false, "target": { "attribute": "anchorrect" } }, "items": { "type": { "kind": "list", "item": { "kind": "object", "fields": [{ "name": "id", "type": { "kind": "terminal", "name": "string" }, "optional": false }, { "name": "label", "type": { "kind": "terminal", "name": "string" }, "optional": false }, { "name": "detail", "type": { "kind": "terminal", "name": "string" }, "optional": true }, { "name": "initials", "type": { "kind": "terminal", "name": "string" }, "optional": true }], "open": false } }, "required": false, "target": { "attribute": "items" } }, "loading": { "type": "boolean", "required": false, "target": { "attribute": "loading" }, "default": false }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false }, "query": { "type": "string", "required": false, "target": { "attribute": "query" }, "default": "" }, "selectedIndex": { "type": { "kind": "terminal", "name": "integer" }, "required": false, "target": { "attribute": "selectedindex" }, "default": 0 } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [] }, "declarations": [{ "kind": "event", "name": "highlight", "type": "object({ index: integer })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "select", "type": "object({ index: integer })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1582
- function createUiEditorMentionMenu(options = {}) {
1583
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1584
- const element = document.createElement("div");
1585
- for (const [name, value] of Object.entries(attributes)) {
1586
- if (value === null || value === void 0 || value === false) continue;
1587
- element.setAttribute(name, value === true ? "" : String(value));
1588
- }
1589
- element.setAttribute("data-component", "ui-editor-mention-menu");
1590
- element.setAttribute("data-component-root", "ui-editor-mention-menu");
1591
- attachLoomaComponent34(element, definition34, "ui-editor-mention-menu", componentProps);
1592
- return element;
1593
- }
1594
-
1595
- // src/generated/vanilla/UiEditorSlashMenu.js
1596
- import { attachLoomaComponent as attachLoomaComponent35 } from "@threadlabs/looma/core/declarative";
1597
- var definition35 = { ...{ "contract": { "tag": "ui-editor-slash-menu", "props": { "anchorRect": { "type": { "kind": "union", "members": [{ "kind": "object", "fields": [{ "name": "left", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "top", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "right", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "bottom", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "x", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "y", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "width", "type": { "kind": "terminal", "name": "number" }, "optional": true }, { "name": "height", "type": { "kind": "terminal", "name": "number" }, "optional": true }], "open": false }, { "kind": "terminal", "name": "null" }] }, "required": false, "target": { "attribute": "anchorrect" } }, "items": { "type": { "kind": "list", "item": { "kind": "object", "fields": [{ "name": "title", "type": { "kind": "terminal", "name": "string" }, "optional": false }, { "name": "description", "type": { "kind": "terminal", "name": "string" }, "optional": false }, { "name": "icon", "type": { "kind": "terminal", "name": "string" }, "optional": false }], "open": false } }, "required": false, "target": { "attribute": "items" } }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false }, "query": { "type": "string", "required": false, "target": { "attribute": "query" }, "default": "" }, "selectedIndex": { "type": { "kind": "terminal", "name": "integer" }, "required": false, "target": { "attribute": "selectedindex" }, "default": 0 } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [] }, "declarations": [{ "kind": "event", "name": "highlight", "type": "object({ index: integer })", "bubbles": true, "composed": true, "cancelable": false }, { "kind": "event", "name": "select", "type": "object({ index: integer })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1598
- function createUiEditorSlashMenu(options = {}) {
1599
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1600
- const element = document.createElement("div");
1601
- for (const [name, value] of Object.entries(attributes)) {
1602
- if (value === null || value === void 0 || value === false) continue;
1603
- element.setAttribute(name, value === true ? "" : String(value));
1604
- }
1605
- element.setAttribute("data-component", "ui-editor-slash-menu");
1606
- element.setAttribute("data-component-root", "ui-editor-slash-menu");
1607
- attachLoomaComponent35(element, definition35, "ui-editor-slash-menu", componentProps);
1608
- return element;
1609
- }
1610
-
1611
- // src/generated/vanilla/UiEditorTableContextMenu.js
1612
- import { attachLoomaComponent as attachLoomaComponent36 } from "@threadlabs/looma/core/declarative";
1613
- var definition36 = { ...{ "contract": { "tag": "ui-editor-table-context-menu", "props": { "actions": { "type": { "kind": "list", "item": { "kind": "union", "members": [{ "kind": "keyword", "value": "align-left" }, { "kind": "keyword", "value": "align-center" }, { "kind": "keyword", "value": "align-right" }, { "kind": "keyword", "value": "background-none" }, { "kind": "keyword", "value": "background-gray" }, { "kind": "keyword", "value": "background-yellow" }, { "kind": "keyword", "value": "background-blue" }, { "kind": "keyword", "value": "background-green" }, { "kind": "keyword", "value": "background-red" }, { "kind": "keyword", "value": "add-row-before" }, { "kind": "keyword", "value": "add-row-after" }, { "kind": "keyword", "value": "add-column-before" }, { "kind": "keyword", "value": "add-column-after" }, { "kind": "keyword", "value": "clear-cells" }, { "kind": "keyword", "value": "merge-cells" }, { "kind": "keyword", "value": "split-cell" }, { "kind": "keyword", "value": "delete-row" }, { "kind": "keyword", "value": "delete-column" }, { "kind": "keyword", "value": "delete-table" }] } }, "required": false, "target": { "attribute": "actions" } }, "cellBackground": { "type": "string", "required": false, "target": { "attribute": "cellbackground" }, "default": "" }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [] }, "declarations": [{ "kind": "event", "name": "action", "type": "object({ action: string })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1614
- function createUiEditorTableContextMenu(options = {}) {
1615
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1616
- const element = document.createElement("div");
1617
- for (const [name, value] of Object.entries(attributes)) {
1618
- if (value === null || value === void 0 || value === false) continue;
1619
- element.setAttribute(name, value === true ? "" : String(value));
1620
- }
1621
- element.setAttribute("data-component", "ui-editor-table-context-menu");
1622
- element.setAttribute("data-component-root", "ui-editor-table-context-menu");
1623
- attachLoomaComponent36(element, definition36, "ui-editor-table-context-menu", componentProps);
1624
- return element;
1625
- }
1626
-
1627
- // src/generated/vanilla/UiEditorTableOverlay.js
1628
- import { attachLoomaComponent as attachLoomaComponent37 } from "@threadlabs/looma/core/declarative";
1629
- var definition37 = { ...{ "contract": { "tag": "ui-editor-table-overlay", "props": { "geometry": { "type": { "kind": "union", "members": [{ "kind": "object", "fields": [{ "name": "rowBoundaries", "type": { "kind": "list", "item": { "kind": "terminal", "name": "number" } }, "optional": false }, { "name": "columnBoundaries", "type": { "kind": "list", "item": { "kind": "terminal", "name": "number" } }, "optional": false }, { "name": "activeCell", "type": { "kind": "union", "members": [{ "kind": "object", "fields": [{ "name": "left", "type": { "kind": "terminal", "name": "number" }, "optional": false }, { "name": "top", "type": { "kind": "terminal", "name": "number" }, "optional": false }, { "name": "width", "type": { "kind": "terminal", "name": "number" }, "optional": false }, { "name": "height", "type": { "kind": "terminal", "name": "number" }, "optional": false }, { "name": "rowIndex", "type": { "kind": "terminal", "name": "integer" }, "optional": false }, { "name": "columnIndex", "type": { "kind": "terminal", "name": "integer" }, "optional": false }], "open": false }, { "kind": "terminal", "name": "null" }] }, "optional": false }, { "name": "hoveredCell", "type": { "kind": "union", "members": [{ "kind": "object", "fields": [{ "name": "left", "type": { "kind": "terminal", "name": "number" }, "optional": false }, { "name": "top", "type": { "kind": "terminal", "name": "number" }, "optional": false }, { "name": "width", "type": { "kind": "terminal", "name": "number" }, "optional": false }, { "name": "height", "type": { "kind": "terminal", "name": "number" }, "optional": false }, { "name": "rowIndex", "type": { "kind": "terminal", "name": "integer" }, "optional": false }, { "name": "columnIndex", "type": { "kind": "terminal", "name": "integer" }, "optional": false }], "open": false }, { "kind": "terminal", "name": "null" }] }, "optional": true }], "open": false }, { "kind": "terminal", "name": "null" }] }, "required": false, "target": { "attribute": "geometry" } }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [] }, "declarations": [{ "kind": "event", "name": "action", "type": "object({ action: string, boundaryIndex?: integer, rowIndex?: integer, columnIndex?: integer, anchor?: object({ left: number, top: number, right: number, bottom: number }) })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1630
- function createUiEditorTableOverlay(options = {}) {
1631
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1632
- const element = document.createElement("div");
1633
- for (const [name, value] of Object.entries(attributes)) {
1634
- if (value === null || value === void 0 || value === false) continue;
1635
- element.setAttribute(name, value === true ? "" : String(value));
1636
- }
1637
- element.setAttribute("data-component", "ui-editor-table-overlay");
1638
- element.setAttribute("data-component-root", "ui-editor-table-overlay");
1639
- attachLoomaComponent37(element, definition37, "ui-editor-table-overlay", componentProps);
1640
- return element;
1641
- }
1642
-
1643
- // src/generated/vanilla/UiEditorTableToolbar.js
1644
- import { attachLoomaComponent as attachLoomaComponent38 } from "@threadlabs/looma/core/declarative";
1645
- var definition38 = { ...{ "contract": { "tag": "ui-editor-table-toolbar", "props": { "actions": { "type": { "kind": "list", "item": { "kind": "union", "members": [{ "kind": "keyword", "value": "align-left" }, { "kind": "keyword", "value": "align-center" }, { "kind": "keyword", "value": "align-right" }, { "kind": "keyword", "value": "background-none" }, { "kind": "keyword", "value": "background-gray" }, { "kind": "keyword", "value": "background-yellow" }, { "kind": "keyword", "value": "background-blue" }, { "kind": "keyword", "value": "background-green" }, { "kind": "keyword", "value": "background-red" }, { "kind": "keyword", "value": "add-row-before" }, { "kind": "keyword", "value": "add-row-after" }, { "kind": "keyword", "value": "add-column-before" }, { "kind": "keyword", "value": "add-column-after" }, { "kind": "keyword", "value": "clear-cells" }, { "kind": "keyword", "value": "merge-cells" }, { "kind": "keyword", "value": "split-cell" }, { "kind": "keyword", "value": "delete-row" }, { "kind": "keyword", "value": "delete-column" }, { "kind": "keyword", "value": "delete-table" }] } }, "required": false, "target": { "attribute": "actions" } }, "cellAlignment": { "type": { "enum": ["left", "center", "right"] }, "required": false, "target": { "attribute": "cellalignment" }, "default": "left" }, "cellBackground": { "type": "string", "required": false, "target": { "attribute": "cellbackground" }, "default": "" }, "open": { "type": "boolean", "required": false, "target": { "attribute": "open" }, "default": false } } }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [] }, "declarations": [{ "kind": "event", "name": "action", "type": "object({ action: string })", "bubbles": true, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1646
- function createUiEditorTableToolbar(options = {}) {
1647
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1648
- const element = document.createElement("div");
1649
- for (const [name, value] of Object.entries(attributes)) {
1650
- if (value === null || value === void 0 || value === false) continue;
1651
- element.setAttribute(name, value === true ? "" : String(value));
1652
- }
1653
- element.setAttribute("data-component", "ui-editor-table-toolbar");
1654
- element.setAttribute("data-component-root", "ui-editor-table-toolbar");
1655
- attachLoomaComponent38(element, definition38, "ui-editor-table-toolbar", componentProps);
1656
- return element;
1657
- }
1658
-
1659
- // src/generated/vanilla/UiEditorToolbar.js
1660
- import { attachLoomaComponent as attachLoomaComponent39 } from "@threadlabs/looma/core/declarative";
1661
- var definition39 = { ...{ "contract": { "tag": "ui-editor-toolbar", "props": {} }, "template": { "kind": "element", "name": "div", "attributes": [], "children": [{ "kind": "slot" }] }, "declarations": [], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
1662
- function createUiEditorToolbar(options = {}) {
1663
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1664
- const element = document.createElement("div");
1665
- for (const [name, value] of Object.entries(attributes)) {
1666
- if (value === null || value === void 0 || value === false) continue;
1667
- element.setAttribute(name, value === true ? "" : String(value));
1668
- }
1669
- element.setAttribute("data-component", "ui-editor-toolbar");
1670
- element.setAttribute("data-component-root", "ui-editor-toolbar");
1671
- if (children.length > 0) {
1672
- for (const child of children) element.append(child);
1673
- } else {
1674
- }
1675
- attachLoomaComponent39(element, definition39, "ui-editor-toolbar", componentProps);
1676
- return element;
1677
- }
1678
-
1679
- // src/generated/vanilla/index.js
1680
- var factoryByTag = Object.freeze({
1681
- "ui-affordance-scope": createUiAffordanceScope,
1682
- "ui-avatar-group": createUiAvatarGroup,
1683
- "ui-avatar": createUiAvatar,
1684
- "ui-badge": createUiBadge,
1685
- "ui-button": createUiButton,
1686
- "ui-callout": createUiCallout,
1687
- "ui-checkbox": createUiCheckbox,
1688
- "ui-combobox": createUiCombobox,
1689
- "ui-context-menu": createUiContextMenu,
1690
- "ui-dialog": createUiDialog,
1691
- "ui-disclosure": createUiDisclosure,
1692
- "ui-editable": createUiEditable,
1693
- "ui-form-field": createUiFormField,
1694
- "ui-icon-button": createUiIconButton,
1695
- "ui-input": createUiInput,
1696
- "ui-menu-item": createUiMenuItem,
1697
- "ui-menu": createUiMenu,
1698
- "ui-popover": createUiPopover,
1699
- "ui-radio-group": createUiRadioGroup,
1700
- "ui-radio": createUiRadio,
1701
- "ui-search-result-row": createUiSearchResultRow,
1702
- "ui-search-shell": createUiSearchShell,
1703
- "ui-select": createUiSelect,
1704
- "ui-switch": createUiSwitch,
1705
- "ui-tabs": createUiTabs,
1706
- "ui-textarea": createUiTextarea,
1707
- "ui-toast-region": createUiToastRegion,
1708
- "ui-tooltip": createUiTooltip,
1709
- "ui-top-bar": createUiTopBar,
1710
- "ui-tree-item": createUiTreeItem,
1711
- "ui-tree": createUiTree,
1712
- "ui-cluster": createUiCluster,
1713
- "ui-container": createUiContainer,
1714
- "ui-grid": createUiGrid,
1715
- "ui-reel": createUiReel,
1716
- "ui-separator": createUiSeparator,
1717
- "ui-sidebar": createUiSidebar,
1718
- "ui-stack": createUiStack,
1719
- "ui-switcher": createUiSwitcher,
1720
- "ui-editor-insert-table-grid": createUiEditorInsertTableGrid,
1721
- "ui-editor-mention-menu": createUiEditorMentionMenu,
1722
- "ui-editor-slash-menu": createUiEditorSlashMenu,
1723
- "ui-editor-table-context-menu": createUiEditorTableContextMenu,
1724
- "ui-editor-table-overlay": createUiEditorTableOverlay,
1725
- "ui-editor-table-toolbar": createUiEditorTableToolbar,
1726
- "ui-editor-toolbar": createUiEditorToolbar
1727
- });
1728
-
1729
- // src/index.ts
1730
- function applyProps(node, props) {
1731
- for (const [name, value] of Object.entries(props)) {
1732
- if (name in node || typeof value === "object") {
1733
- node[name] = value;
1734
- continue;
1735
- }
1736
- if (value === null || value === void 0 || value === false) {
1737
- node.removeAttribute(name);
1738
- } else {
1739
- node.setAttribute(name, value === true ? "" : String(value));
1740
- }
1741
- }
1742
- }
1743
- function bindEvents(node, handlers) {
1744
- const listeners = [
1745
- ["open", handlers.onOpen && ((event) => handlers.onOpen?.(event.detail))],
1746
- ["close", handlers.onClose && ((event) => handlers.onClose?.(event.detail))],
1747
- ["select", handlers.onSelect && ((event) => handlers.onSelect?.(event.detail))],
1748
- ["change", handlers.onChange && ((event) => handlers.onChange?.(event.detail))],
1749
- ["dismiss", handlers.onDismiss && ((event) => handlers.onDismiss?.(event.detail))]
1750
- ];
1751
- for (const [eventName, listener] of listeners) if (listener) node.addEventListener(eventName, listener);
1752
- return () => {
1753
- for (const [eventName, listener] of listeners) if (listener) node.removeEventListener(eventName, listener);
1754
- };
1755
- }
1756
- function bindAdapter(node, options = {}) {
1757
- applyProps(node, options.props ?? {});
1758
- let cleanup = bindEvents(node, options);
1759
- return {
1760
- update(updatedOptions = {}) {
1761
- cleanup();
1762
- applyProps(node, updatedOptions.props ?? {});
1763
- cleanup = bindEvents(node, updatedOptions);
1764
- },
1765
- destroy() {
1766
- cleanup();
1767
- }
1768
- };
1769
- }
1770
- function createAdapterElement(tagName, options = {}) {
1771
- const factory = factoryByTag[tagName];
1772
- const factoryOptions = { ...options.props ?? {} };
1773
- if (options.attributes !== void 0) factoryOptions.attributes = options.attributes;
1774
- if (options.children !== void 0) factoryOptions.children = options.children;
1775
- if (options.slots !== void 0) factoryOptions.slots = options.slots;
1776
- const element = factory(factoryOptions);
1777
- bindEvents(element, options);
1778
- return element;
1779
- }
1780
- var ADAPTER_COMPONENT_TAG_MAP = {
1781
- AffordanceScope: "ui-affordance-scope",
1782
- AvatarGroup: "ui-avatar-group",
1783
- Avatar: "ui-avatar",
1784
- Badge: "ui-badge",
1785
- Button: "ui-button",
1786
- Callout: "ui-callout",
1787
- Checkbox: "ui-checkbox",
1788
- Combobox: "ui-combobox",
1789
- ContextMenu: "ui-context-menu",
1790
- Dialog: "ui-dialog",
1791
- Disclosure: "ui-disclosure",
1792
- Editable: "ui-editable",
1793
- FormField: "ui-form-field",
1794
- IconButton: "ui-icon-button",
1795
- Input: "ui-input",
1796
- MenuItem: "ui-menu-item",
1797
- Menu: "ui-menu",
1798
- Popover: "ui-popover",
1799
- RadioGroup: "ui-radio-group",
1800
- Radio: "ui-radio",
1801
- SearchResultRow: "ui-search-result-row",
1802
- SearchShell: "ui-search-shell",
1803
- Select: "ui-select",
1804
- Switch: "ui-switch",
1805
- Tabs: "ui-tabs",
1806
- Textarea: "ui-textarea",
1807
- ToastRegion: "ui-toast-region",
1808
- Tooltip: "ui-tooltip",
1809
- TopBar: "ui-top-bar",
1810
- TreeItem: "ui-tree-item",
1811
- Tree: "ui-tree",
1812
- EditorInsertTableGrid: "ui-editor-insert-table-grid",
1813
- EditorMentionMenu: "ui-editor-mention-menu",
1814
- EditorSlashMenu: "ui-editor-slash-menu",
1815
- EditorTableContextMenu: "ui-editor-table-context-menu",
1816
- EditorTableOverlay: "ui-editor-table-overlay",
1817
- EditorTableToolbar: "ui-editor-table-toolbar",
1818
- EditorToolbar: "ui-editor-toolbar",
1819
- Container: "ui-container",
1820
- Grid: "ui-grid",
1821
- Cluster: "ui-cluster",
1822
- Reel: "ui-reel",
1823
- Separator: "ui-separator",
1824
- Sidebar: "ui-sidebar",
1825
- Stack: "ui-stack",
1826
- Switcher: "ui-switcher"
1827
- };
1828
- var SVELTE_ADAPTER_NOTE = "Native-root adapter: factories and bindAdapter project the framework-neutral Looma declarative contract into Svelte.";
1829
- export {
1830
- ADAPTER_COMPONENT_TAG_MAP,
1831
- SVELTE_ADAPTER_NOTE,
1832
- bindAdapter,
1833
- createAdapterElement,
1834
- createUiAffordanceScope,
1835
- createUiAvatar,
1836
- createUiAvatarGroup,
1837
- createUiBadge,
1838
- createUiButton,
1839
- createUiCallout,
1840
- createUiCheckbox,
1841
- createUiCluster,
1842
- createUiCombobox,
1843
- createUiContainer,
1844
- createUiContextMenu,
1845
- createUiDialog,
1846
- createUiDisclosure,
1847
- createUiEditable,
1848
- createUiEditorInsertTableGrid,
1849
- createUiEditorMentionMenu,
1850
- createUiEditorSlashMenu,
1851
- createUiEditorTableContextMenu,
1852
- createUiEditorTableOverlay,
1853
- createUiEditorTableToolbar,
1854
- createUiEditorToolbar,
1855
- createUiFormField,
1856
- createUiGrid,
1857
- createUiIconButton,
1858
- createUiInput,
1859
- createUiMenu,
1860
- createUiMenuItem,
1861
- createUiPopover,
1862
- createUiRadio,
1863
- createUiRadioGroup,
1864
- createUiReel,
1865
- createUiSearchResultRow,
1866
- createUiSearchShell,
1867
- createUiSelect,
1868
- createUiSeparator,
1869
- createUiSidebar,
1870
- createUiStack,
1871
- createUiSwitch,
1872
- createUiSwitcher,
1873
- createUiTabs,
1874
- createUiTextarea,
1875
- createUiToastRegion,
1876
- createUiTooltip,
1877
- createUiTopBar,
1878
- createUiTree,
1879
- createUiTreeItem,
1880
- factoryByTag
1881
- };