@threadlabs/looma 0.3.1 → 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.
Files changed (5) hide show
  1. package/package.json +1 -21
  2. package/react/index.d.ts +0 -1276
  3. package/react/index.js +0 -1526
  4. package/svelte/index.d.ts +0 -204
  5. package/svelte/index.js +0 -1892
package/svelte/index.js DELETED
@@ -1,1892 +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": [{ "kind": "slot" }] }, "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
- if (children.length > 0) {
996
- for (const child of children) element.append(child);
997
- } else {
998
- }
999
- attachLoomaComponent21(element, definition21, "ui-select", componentProps);
1000
- return element;
1001
- }
1002
-
1003
- // src/generated/vanilla/UiSwitch.js
1004
- import { attachLoomaComponent as attachLoomaComponent22 } from "@threadlabs/looma/core/declarative";
1005
- 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: "" };
1006
- function createUiSwitch(options = {}) {
1007
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1008
- const element = document.createElement("span");
1009
- for (const [name, value] of Object.entries(attributes)) {
1010
- if (value === null || value === void 0 || value === false) continue;
1011
- element.setAttribute(name, value === true ? "" : String(value));
1012
- }
1013
- const value0 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
1014
- if (value0 === true) element.setAttribute("data-disabled", "");
1015
- else element.removeAttribute("data-disabled");
1016
- element.setAttribute("data-component", "ui-switch");
1017
- element.setAttribute("data-component-root", "ui-switch");
1018
- const element0 = document.createElement("label");
1019
- element0.setAttribute("class", "control");
1020
- element0.setAttribute("data-component", "ui-switch");
1021
- const element1 = document.createElement("input");
1022
- element1.setAttribute("type", "checkbox");
1023
- element1.setAttribute("role", "switch");
1024
- const value1 = componentProps["required"] === void 0 ? false : componentProps["required"];
1025
- if (value1 === true) element1.setAttribute("required", "");
1026
- else element1.removeAttribute("required");
1027
- const value2 = componentProps["value"] === void 0 ? "on" : componentProps["value"];
1028
- if (value2 === null || value2 === void 0) element1.removeAttribute("value");
1029
- else element1.setAttribute("value", String(value2));
1030
- element1.setAttribute("data-component", "ui-switch");
1031
- element0.append(element1);
1032
- const element2 = document.createElement("span");
1033
- element2.setAttribute("class", "label");
1034
- element2.setAttribute("data-component", "ui-switch");
1035
- if (children.length > 0) {
1036
- for (const child of children) element2.append(child);
1037
- } else {
1038
- }
1039
- element0.append(element2);
1040
- element.append(element0);
1041
- attachLoomaComponent22(element, definition22, "ui-switch", componentProps);
1042
- return element;
1043
- }
1044
-
1045
- // src/generated/vanilla/UiTabs.js
1046
- import { attachLoomaComponent as attachLoomaComponent23 } from "@threadlabs/looma/core/declarative";
1047
- 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: "" };
1048
- function createUiTabs(options = {}) {
1049
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1050
- const element = document.createElement("div");
1051
- for (const [name, value] of Object.entries(attributes)) {
1052
- if (value === null || value === void 0 || value === false) continue;
1053
- element.setAttribute(name, value === true ? "" : String(value));
1054
- }
1055
- const value0 = componentProps["orientation"] === void 0 ? "horizontal" : componentProps["orientation"];
1056
- if (value0 === null || value0 === void 0) element.removeAttribute("data-orientation");
1057
- else element.setAttribute("data-orientation", String(value0));
1058
- const value1 = componentProps["stretch"] === void 0 ? false : componentProps["stretch"];
1059
- if (value1 === true) element.setAttribute("data-stretch", "");
1060
- else element.removeAttribute("data-stretch");
1061
- element.setAttribute("data-component", "ui-tabs");
1062
- element.setAttribute("data-component-root", "ui-tabs");
1063
- const element0 = document.createElement("div");
1064
- element0.setAttribute("class", "tabs__list");
1065
- element0.setAttribute("role", "tablist");
1066
- const value2 = componentProps["label"] === void 0 ? "Tabs" : componentProps["label"];
1067
- if (value2 === null || value2 === void 0) element0.removeAttribute("aria-label");
1068
- else element0.setAttribute("aria-label", String(value2));
1069
- element0.setAttribute("data-component", "ui-tabs");
1070
- element.append(element0);
1071
- const element1 = document.createElement("div");
1072
- element1.setAttribute("class", "tabs__panels");
1073
- element1.setAttribute("data-component", "ui-tabs");
1074
- if (children.length > 0) {
1075
- for (const child of children) element1.append(child);
1076
- } else {
1077
- }
1078
- element.append(element1);
1079
- attachLoomaComponent23(element, definition23, "ui-tabs", componentProps);
1080
- return element;
1081
- }
1082
-
1083
- // src/generated/vanilla/UiTextarea.js
1084
- import { attachLoomaComponent as attachLoomaComponent24 } from "@threadlabs/looma/core/declarative";
1085
- 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: "" };
1086
- function createUiTextarea(options = {}) {
1087
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1088
- const element = document.createElement("textarea");
1089
- for (const [name, value] of Object.entries(attributes)) {
1090
- if (value === null || value === void 0 || value === false) continue;
1091
- element.setAttribute(name, value === true ? "" : String(value));
1092
- }
1093
- const value0 = componentProps["value"] === void 0 ? void 0 : componentProps["value"];
1094
- if (value0 === null || value0 === void 0) element.removeAttribute("value");
1095
- else element.setAttribute("value", String(value0));
1096
- const value1 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
1097
- if (value1 === true) element.setAttribute("disabled", "");
1098
- else element.removeAttribute("disabled");
1099
- const value2 = componentProps["readonly"] === void 0 ? false : componentProps["readonly"];
1100
- if (value2 === true) element.setAttribute("readonly", "");
1101
- else element.removeAttribute("readonly");
1102
- const value3 = componentProps["required"] === void 0 ? false : componentProps["required"];
1103
- if (value3 === true) element.setAttribute("required", "");
1104
- else element.removeAttribute("required");
1105
- const value4 = componentProps["rows"] === void 0 ? 4 : componentProps["rows"];
1106
- if (value4 === null || value4 === void 0) element.removeAttribute("rows");
1107
- else element.setAttribute("rows", String(value4));
1108
- element.setAttribute("data-component", "ui-textarea");
1109
- element.setAttribute("data-component-root", "ui-textarea");
1110
- attachLoomaComponent24(element, definition24, "ui-textarea", componentProps);
1111
- return element;
1112
- }
1113
-
1114
- // src/generated/vanilla/UiToastRegion.js
1115
- import { attachLoomaComponent as attachLoomaComponent25 } from "@threadlabs/looma/core/declarative";
1116
- 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: "" };
1117
- function createUiToastRegion(options = {}) {
1118
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1119
- const element = document.createElement("div");
1120
- for (const [name, value] of Object.entries(attributes)) {
1121
- if (value === null || value === void 0 || value === false) continue;
1122
- element.setAttribute(name, value === true ? "" : String(value));
1123
- }
1124
- element.setAttribute("role", "region");
1125
- element.setAttribute("aria-label", "Notifications");
1126
- element.setAttribute("aria-live", "polite");
1127
- element.setAttribute("data-component", "ui-toast-region");
1128
- element.setAttribute("data-component-root", "ui-toast-region");
1129
- if (children.length > 0) {
1130
- for (const child of children) element.append(child);
1131
- } else {
1132
- }
1133
- attachLoomaComponent25(element, definition25, "ui-toast-region", componentProps);
1134
- return element;
1135
- }
1136
-
1137
- // src/generated/vanilla/UiTooltip.js
1138
- import { attachLoomaComponent as attachLoomaComponent26 } from "@threadlabs/looma/core/declarative";
1139
- 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: "" };
1140
- function createUiTooltip(options = {}) {
1141
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1142
- const element = document.createElement("span");
1143
- for (const [name, value] of Object.entries(attributes)) {
1144
- if (value === null || value === void 0 || value === false) continue;
1145
- element.setAttribute(name, value === true ? "" : String(value));
1146
- }
1147
- element.setAttribute("role", "tooltip");
1148
- const value0 = componentProps["inverse"] === void 0 ? false : componentProps["inverse"];
1149
- if (value0 === true) element.setAttribute("data-inverse", "");
1150
- else element.removeAttribute("data-inverse");
1151
- element.setAttribute("data-component", "ui-tooltip");
1152
- element.setAttribute("data-component-root", "ui-tooltip");
1153
- const element0 = document.createElement("div");
1154
- element0.setAttribute("class", "tooltip__surface");
1155
- element0.setAttribute("data-component", "ui-tooltip");
1156
- if (children.length > 0) {
1157
- for (const child of children) element0.append(child);
1158
- } else {
1159
- }
1160
- element.append(element0);
1161
- attachLoomaComponent26(element, definition26, "ui-tooltip", componentProps);
1162
- return element;
1163
- }
1164
-
1165
- // src/generated/vanilla/UiTopBar.js
1166
- import { attachLoomaComponent as attachLoomaComponent27 } from "@threadlabs/looma/core/declarative";
1167
- 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: "" };
1168
- function createUiTopBar(options = {}) {
1169
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1170
- const element = document.createElement("div");
1171
- for (const [name, value] of Object.entries(attributes)) {
1172
- if (value === null || value === void 0 || value === false) continue;
1173
- element.setAttribute(name, value === true ? "" : String(value));
1174
- }
1175
- element.setAttribute("data-component", "ui-top-bar");
1176
- element.setAttribute("data-component-root", "ui-top-bar");
1177
- const element0 = document.createElement("header");
1178
- element0.setAttribute("class", "top-bar");
1179
- element0.setAttribute("part", "base");
1180
- element0.setAttribute("data-component", "ui-top-bar");
1181
- const element1 = document.createElement("div");
1182
- element1.setAttribute("class", "top-bar__leading");
1183
- element1.setAttribute("data-component", "ui-top-bar");
1184
- if (slots["leading"] ?? [].length > 0) {
1185
- for (const child of slots["leading"] ?? []) element1.append(child);
1186
- } else {
1187
- }
1188
- element0.append(element1);
1189
- const element2 = document.createElement("div");
1190
- element2.setAttribute("class", "top-bar__title");
1191
- element2.setAttribute("data-component", "ui-top-bar");
1192
- if (children.length > 0) {
1193
- for (const child of children) element2.append(child);
1194
- } else {
1195
- }
1196
- element0.append(element2);
1197
- const element3 = document.createElement("div");
1198
- element3.setAttribute("class", "top-bar__search");
1199
- element3.setAttribute("data-component", "ui-top-bar");
1200
- if (slots["search"] ?? [].length > 0) {
1201
- for (const child of slots["search"] ?? []) element3.append(child);
1202
- } else {
1203
- }
1204
- element0.append(element3);
1205
- const element4 = document.createElement("div");
1206
- element4.setAttribute("class", "top-bar__actions");
1207
- element4.setAttribute("data-component", "ui-top-bar");
1208
- if (slots["actions"] ?? [].length > 0) {
1209
- for (const child of slots["actions"] ?? []) element4.append(child);
1210
- } else {
1211
- }
1212
- element0.append(element4);
1213
- element.append(element0);
1214
- attachLoomaComponent27(element, definition27, "ui-top-bar", componentProps);
1215
- return element;
1216
- }
1217
-
1218
- // src/generated/vanilla/UiTreeItem.js
1219
- import { attachLoomaComponent as attachLoomaComponent28 } from "@threadlabs/looma/core/declarative";
1220
- 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": "slot", "fallback": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [] }], "name": "label" }] }, { "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: "" };
1221
- function createUiTreeItem(options = {}) {
1222
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1223
- const element = document.createElement("div");
1224
- for (const [name, value] of Object.entries(attributes)) {
1225
- if (value === null || value === void 0 || value === false) continue;
1226
- element.setAttribute(name, value === true ? "" : String(value));
1227
- }
1228
- element.setAttribute("role", "treeitem");
1229
- const value0 = componentProps["dropScope"] === void 0 ? "" : componentProps["dropScope"];
1230
- if (value0 === null || value0 === void 0) element.removeAttribute("data-drop-scope");
1231
- else element.setAttribute("data-drop-scope", String(value0));
1232
- const value1 = componentProps["accepts"] === void 0 ? "" : componentProps["accepts"];
1233
- if (value1 === null || value1 === void 0) element.removeAttribute("data-accepts");
1234
- else element.setAttribute("data-accepts", String(value1));
1235
- element.setAttribute("data-component", "ui-tree-item");
1236
- element.setAttribute("data-component-root", "ui-tree-item");
1237
- const element0 = document.createElement("div");
1238
- element0.setAttribute("class", "row");
1239
- element0.setAttribute("part", "row");
1240
- element0.setAttribute("data-component", "ui-tree-item");
1241
- const element1 = document.createElement("button");
1242
- element1.setAttribute("class", "drag-handle");
1243
- element1.setAttribute("part", "drag-handle");
1244
- element1.setAttribute("type", "button");
1245
- element1.setAttribute("data-component", "ui-tree-item");
1246
- const element2 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
1247
- element2.setAttribute("aria-hidden", "true");
1248
- element2.setAttribute("focusable", "false");
1249
- element2.setAttribute("viewBox", "0 0 24 24");
1250
- element2.setAttribute("fill", "none");
1251
- element2.setAttribute("stroke", "currentColor");
1252
- element2.setAttribute("stroke-width", "2");
1253
- element2.setAttribute("stroke-linecap", "round");
1254
- element2.setAttribute("stroke-linejoin", "round");
1255
- element2.setAttribute("data-component", "ui-tree-item");
1256
- const element3 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1257
- element3.setAttribute("cx", "9");
1258
- element3.setAttribute("cy", "12");
1259
- element3.setAttribute("r", "1");
1260
- element3.setAttribute("data-component", "ui-tree-item");
1261
- element2.append(element3);
1262
- const element4 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1263
- element4.setAttribute("cx", "9");
1264
- element4.setAttribute("cy", "5");
1265
- element4.setAttribute("r", "1");
1266
- element4.setAttribute("data-component", "ui-tree-item");
1267
- element2.append(element4);
1268
- const element5 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1269
- element5.setAttribute("cx", "9");
1270
- element5.setAttribute("cy", "19");
1271
- element5.setAttribute("r", "1");
1272
- element5.setAttribute("data-component", "ui-tree-item");
1273
- element2.append(element5);
1274
- const element6 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1275
- element6.setAttribute("cx", "15");
1276
- element6.setAttribute("cy", "12");
1277
- element6.setAttribute("r", "1");
1278
- element6.setAttribute("data-component", "ui-tree-item");
1279
- element2.append(element6);
1280
- const element7 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1281
- element7.setAttribute("cx", "15");
1282
- element7.setAttribute("cy", "5");
1283
- element7.setAttribute("r", "1");
1284
- element7.setAttribute("data-component", "ui-tree-item");
1285
- element2.append(element7);
1286
- const element8 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
1287
- element8.setAttribute("cx", "15");
1288
- element8.setAttribute("cy", "19");
1289
- element8.setAttribute("r", "1");
1290
- element8.setAttribute("data-component", "ui-tree-item");
1291
- element2.append(element8);
1292
- element1.append(element2);
1293
- element0.append(element1);
1294
- const element9 = document.createElement("button");
1295
- element9.setAttribute("class", "disclosure");
1296
- element9.setAttribute("part", "disclosure");
1297
- element9.setAttribute("type", "button");
1298
- const value2 = componentProps["disabled"] === void 0 ? false : componentProps["disabled"];
1299
- if (value2 === true) element9.setAttribute("disabled", "");
1300
- else element9.removeAttribute("disabled");
1301
- element9.setAttribute("data-component", "ui-tree-item");
1302
- const element10 = document.createElement("span");
1303
- element10.setAttribute("class", "disclosure-icon");
1304
- element10.setAttribute("aria-hidden", "true");
1305
- element10.setAttribute("data-component", "ui-tree-item");
1306
- element9.append(element10);
1307
- element0.append(element9);
1308
- const element11 = document.createElement("span");
1309
- element11.setAttribute("class", "leading");
1310
- element11.setAttribute("part", "leading");
1311
- element11.setAttribute("data-component", "ui-tree-item");
1312
- if (slots["leading"] ?? [].length > 0) {
1313
- for (const child of slots["leading"] ?? []) element11.append(child);
1314
- } else {
1315
- }
1316
- element0.append(element11);
1317
- const element12 = document.createElement("span");
1318
- element12.setAttribute("class", "label");
1319
- element12.setAttribute("part", "label");
1320
- element12.setAttribute("data-component", "ui-tree-item");
1321
- if (slots["label"] ?? [].length > 0) {
1322
- for (const child of slots["label"] ?? []) element12.append(child);
1323
- } else {
1324
- const element13 = document.createElement("template");
1325
- element13.setAttribute("data-component", "ui-tree-item");
1326
- element12.append(element13);
1327
- }
1328
- element0.append(element12);
1329
- const element14 = document.createElement("span");
1330
- element14.setAttribute("class", "actions");
1331
- element14.setAttribute("part", "actions");
1332
- element14.setAttribute("data-component", "ui-tree-item");
1333
- if (slots["actions"] ?? [].length > 0) {
1334
- for (const child of slots["actions"] ?? []) element14.append(child);
1335
- } else {
1336
- }
1337
- element0.append(element14);
1338
- const element15 = document.createElement("span");
1339
- element15.setAttribute("class", "drop-indicator row-drop-indicator");
1340
- element15.setAttribute("part", "drop-indicator");
1341
- element15.setAttribute("aria-hidden", "true");
1342
- element15.setAttribute("data-component", "ui-tree-item");
1343
- element0.append(element15);
1344
- element.append(element0);
1345
- const element16 = document.createElement("div");
1346
- element16.setAttribute("class", "children");
1347
- element16.setAttribute("part", "children");
1348
- element16.setAttribute("role", "group");
1349
- element16.setAttribute("data-component", "ui-tree-item");
1350
- if (children.length > 0) {
1351
- for (const child of children) element16.append(child);
1352
- } else {
1353
- }
1354
- element.append(element16);
1355
- const element17 = document.createElement("span");
1356
- element17.setAttribute("class", "drop-indicator subtree-drop-indicator");
1357
- element17.setAttribute("part", "drop-indicator");
1358
- element17.setAttribute("aria-hidden", "true");
1359
- element17.setAttribute("data-component", "ui-tree-item");
1360
- element.append(element17);
1361
- attachLoomaComponent28(element, definition28, "ui-tree-item", componentProps);
1362
- return element;
1363
- }
1364
-
1365
- // src/generated/vanilla/UiTree.js
1366
- import { attachLoomaComponent as attachLoomaComponent29 } from "@threadlabs/looma/core/declarative";
1367
- 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: "" };
1368
- function createUiTree(options = {}) {
1369
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1370
- const element = document.createElement("div");
1371
- for (const [name, value] of Object.entries(attributes)) {
1372
- if (value === null || value === void 0 || value === false) continue;
1373
- element.setAttribute(name, value === true ? "" : String(value));
1374
- }
1375
- element.setAttribute("role", "tree");
1376
- element.setAttribute("data-component", "ui-tree");
1377
- element.setAttribute("data-component-root", "ui-tree");
1378
- if (children.length > 0) {
1379
- for (const child of children) element.append(child);
1380
- } else {
1381
- }
1382
- attachLoomaComponent29(element, definition29, "ui-tree", componentProps);
1383
- return element;
1384
- }
1385
-
1386
- // src/generated/vanilla/UiCluster.js
1387
- import { manageGeneratedProps as manageGeneratedProps3 } from "@threadlabs/looma/core/declarative-generated";
1388
- function createUiCluster(options = {}) {
1389
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1390
- const prop0 = componentProps["align"] === void 0 ? void 0 : componentProps["align"];
1391
- const prop1 = componentProps["gap"] === void 0 ? void 0 : componentProps["gap"];
1392
- const element = document.createElement("div");
1393
- for (const [name, value] of Object.entries(attributes)) {
1394
- if (value === null || value === void 0 || value === false) continue;
1395
- element.setAttribute(name, value === true ? "" : String(value));
1396
- }
1397
- element.setAttribute("data-component", "ui-cluster");
1398
- element.setAttribute("data-component-root", "ui-cluster");
1399
- if (children.length > 0) {
1400
- for (const child of children) element.append(child);
1401
- } else {
1402
- }
1403
- manageGeneratedProps3(element, [
1404
- { name: "align", attribute: "data-align", value: componentProps["align"], type: ["start", "center", "end", "stretch"], required: false },
1405
- { name: "gap", attribute: "data-gap", value: componentProps["gap"], type: ["xs", "s", "m", "l", "xl"], required: false }
1406
- ]);
1407
- return element;
1408
- }
1409
-
1410
- // src/generated/vanilla/UiContainer.js
1411
- import { manageGeneratedProps as manageGeneratedProps4 } from "@threadlabs/looma/core/declarative-generated";
1412
- function createUiContainer(options = {}) {
1413
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1414
- const prop0 = componentProps["gutters"] === void 0 ? void 0 : componentProps["gutters"];
1415
- const prop1 = componentProps["measure"] === void 0 ? void 0 : componentProps["measure"];
1416
- const element = document.createElement("div");
1417
- for (const [name, value] of Object.entries(attributes)) {
1418
- if (value === null || value === void 0 || value === false) continue;
1419
- element.setAttribute(name, value === true ? "" : String(value));
1420
- }
1421
- element.setAttribute("data-component", "ui-container");
1422
- element.setAttribute("data-component-root", "ui-container");
1423
- if (children.length > 0) {
1424
- for (const child of children) element.append(child);
1425
- } else {
1426
- }
1427
- manageGeneratedProps4(element, [
1428
- { name: "gutters", attribute: "data-gutters", value: componentProps["gutters"], type: ["s", "m", "l"], required: false },
1429
- { name: "measure", attribute: "data-measure", value: componentProps["measure"], type: ["narrow", "wide"], required: false }
1430
- ]);
1431
- return element;
1432
- }
1433
-
1434
- // src/generated/vanilla/UiGrid.js
1435
- import { manageGeneratedProps as manageGeneratedProps5 } from "@threadlabs/looma/core/declarative-generated";
1436
- function createUiGrid(options = {}) {
1437
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1438
- const prop0 = componentProps["gap"] === void 0 ? void 0 : componentProps["gap"];
1439
- const prop1 = componentProps["min"] === void 0 ? void 0 : componentProps["min"];
1440
- const element = document.createElement("div");
1441
- for (const [name, value] of Object.entries(attributes)) {
1442
- if (value === null || value === void 0 || value === false) continue;
1443
- element.setAttribute(name, value === true ? "" : String(value));
1444
- }
1445
- element.setAttribute("data-component", "ui-grid");
1446
- element.setAttribute("data-component-root", "ui-grid");
1447
- if (children.length > 0) {
1448
- for (const child of children) element.append(child);
1449
- } else {
1450
- }
1451
- manageGeneratedProps5(element, [
1452
- { name: "gap", attribute: "data-gap", value: componentProps["gap"], type: ["xs", "s", "m", "l", "xl"], required: false },
1453
- { name: "min", attribute: "data-min", value: componentProps["min"], type: ["sm", "md", "lg"], required: false }
1454
- ]);
1455
- return element;
1456
- }
1457
-
1458
- // src/generated/vanilla/UiReel.js
1459
- import { attachLoomaComponent as attachLoomaComponent30 } from "@threadlabs/looma/core/declarative";
1460
- 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: "" };
1461
- function createUiReel(options = {}) {
1462
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1463
- const element = document.createElement("div");
1464
- for (const [name, value] of Object.entries(attributes)) {
1465
- if (value === null || value === void 0 || value === false) continue;
1466
- element.setAttribute(name, value === true ? "" : String(value));
1467
- }
1468
- element.setAttribute("data-component", "ui-reel");
1469
- element.setAttribute("data-component-root", "ui-reel");
1470
- if (children.length > 0) {
1471
- for (const child of children) element.append(child);
1472
- } else {
1473
- }
1474
- attachLoomaComponent30(element, definition30, "ui-reel", componentProps);
1475
- return element;
1476
- }
1477
-
1478
- // src/generated/vanilla/UiSeparator.js
1479
- import { attachLoomaComponent as attachLoomaComponent31 } from "@threadlabs/looma/core/declarative";
1480
- 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: "" };
1481
- function createUiSeparator(options = {}) {
1482
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1483
- const element = document.createElement("div");
1484
- for (const [name, value] of Object.entries(attributes)) {
1485
- if (value === null || value === void 0 || value === false) continue;
1486
- element.setAttribute(name, value === true ? "" : String(value));
1487
- }
1488
- element.setAttribute("data-component", "ui-separator");
1489
- element.setAttribute("data-component-root", "ui-separator");
1490
- if (children.length > 0) {
1491
- for (const child of children) element.append(child);
1492
- } else {
1493
- }
1494
- attachLoomaComponent31(element, definition31, "ui-separator", componentProps);
1495
- return element;
1496
- }
1497
-
1498
- // src/generated/vanilla/UiSidebar.js
1499
- import { attachLoomaComponent as attachLoomaComponent32 } from "@threadlabs/looma/core/declarative";
1500
- 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: "" };
1501
- function createUiSidebar(options = {}) {
1502
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1503
- const element = document.createElement("aside");
1504
- for (const [name, value] of Object.entries(attributes)) {
1505
- if (value === null || value === void 0 || value === false) continue;
1506
- element.setAttribute(name, value === true ? "" : String(value));
1507
- }
1508
- element.setAttribute("data-component", "ui-sidebar");
1509
- element.setAttribute("data-component-root", "ui-sidebar");
1510
- const element0 = document.createElement("div");
1511
- element0.setAttribute("class", "sidebar__content");
1512
- element0.setAttribute("data-component", "ui-sidebar");
1513
- if (children.length > 0) {
1514
- for (const child of children) element0.append(child);
1515
- } else {
1516
- }
1517
- element.append(element0);
1518
- attachLoomaComponent32(element, definition32, "ui-sidebar", componentProps);
1519
- return element;
1520
- }
1521
-
1522
- // src/generated/vanilla/UiStack.js
1523
- import { manageGeneratedProps as manageGeneratedProps6 } from "@threadlabs/looma/core/declarative-generated";
1524
- function createUiStack(options = {}) {
1525
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1526
- const prop0 = componentProps["align"] === void 0 ? void 0 : componentProps["align"];
1527
- const prop1 = componentProps["gap"] === void 0 ? void 0 : componentProps["gap"];
1528
- const prop2 = componentProps["justify"] === void 0 ? void 0 : componentProps["justify"];
1529
- const element = document.createElement("div");
1530
- for (const [name, value] of Object.entries(attributes)) {
1531
- if (value === null || value === void 0 || value === false) continue;
1532
- element.setAttribute(name, value === true ? "" : String(value));
1533
- }
1534
- element.setAttribute("data-component", "ui-stack");
1535
- element.setAttribute("data-component-root", "ui-stack");
1536
- if (children.length > 0) {
1537
- for (const child of children) element.append(child);
1538
- } else {
1539
- }
1540
- manageGeneratedProps6(element, [
1541
- { name: "align", attribute: "data-align", value: componentProps["align"], type: ["start", "center", "end", "stretch"], required: false },
1542
- { name: "gap", attribute: "data-gap", value: componentProps["gap"], type: ["xs", "s", "m", "l", "xl"], required: false },
1543
- { name: "justify", attribute: "data-justify", value: componentProps["justify"], type: ["start", "center", "end", "between"], required: false }
1544
- ]);
1545
- return element;
1546
- }
1547
-
1548
- // src/generated/vanilla/UiSwitcher.js
1549
- import { manageGeneratedProps as manageGeneratedProps7 } from "@threadlabs/looma/core/declarative-generated";
1550
- function createUiSwitcher(options = {}) {
1551
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1552
- const prop0 = componentProps["align"] === void 0 ? void 0 : componentProps["align"];
1553
- const prop1 = componentProps["gap"] === void 0 ? void 0 : componentProps["gap"];
1554
- const prop2 = componentProps["threshold"] === void 0 ? void 0 : componentProps["threshold"];
1555
- const element = document.createElement("div");
1556
- for (const [name, value] of Object.entries(attributes)) {
1557
- if (value === null || value === void 0 || value === false) continue;
1558
- element.setAttribute(name, value === true ? "" : String(value));
1559
- }
1560
- element.setAttribute("data-component", "ui-switcher");
1561
- element.setAttribute("data-component-root", "ui-switcher");
1562
- if (children.length > 0) {
1563
- for (const child of children) element.append(child);
1564
- } else {
1565
- }
1566
- manageGeneratedProps7(element, [
1567
- { name: "align", attribute: "data-align", value: componentProps["align"], type: ["start", "center", "end", "stretch"], required: false },
1568
- { name: "gap", attribute: "data-gap", value: componentProps["gap"], type: ["xs", "s", "m", "l", "xl"], required: false },
1569
- { name: "threshold", attribute: "data-threshold", value: componentProps["threshold"], type: ["xs", "sm", "md", "lg"], required: false }
1570
- ]);
1571
- return element;
1572
- }
1573
-
1574
- // src/generated/vanilla/UiEditorInsertTableGrid.js
1575
- import { attachLoomaComponent as attachLoomaComponent33 } from "@threadlabs/looma/core/declarative";
1576
- 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: "" };
1577
- function createUiEditorInsertTableGrid(options = {}) {
1578
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1579
- const element = document.createElement("div");
1580
- for (const [name, value] of Object.entries(attributes)) {
1581
- if (value === null || value === void 0 || value === false) continue;
1582
- element.setAttribute(name, value === true ? "" : String(value));
1583
- }
1584
- element.setAttribute("data-component", "ui-editor-insert-table-grid");
1585
- element.setAttribute("data-component-root", "ui-editor-insert-table-grid");
1586
- attachLoomaComponent33(element, definition33, "ui-editor-insert-table-grid", componentProps);
1587
- return element;
1588
- }
1589
-
1590
- // src/generated/vanilla/UiEditorMentionMenu.js
1591
- import { attachLoomaComponent as attachLoomaComponent34 } from "@threadlabs/looma/core/declarative";
1592
- 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: "" };
1593
- function createUiEditorMentionMenu(options = {}) {
1594
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1595
- const element = document.createElement("div");
1596
- for (const [name, value] of Object.entries(attributes)) {
1597
- if (value === null || value === void 0 || value === false) continue;
1598
- element.setAttribute(name, value === true ? "" : String(value));
1599
- }
1600
- element.setAttribute("data-component", "ui-editor-mention-menu");
1601
- element.setAttribute("data-component-root", "ui-editor-mention-menu");
1602
- attachLoomaComponent34(element, definition34, "ui-editor-mention-menu", componentProps);
1603
- return element;
1604
- }
1605
-
1606
- // src/generated/vanilla/UiEditorSlashMenu.js
1607
- import { attachLoomaComponent as attachLoomaComponent35 } from "@threadlabs/looma/core/declarative";
1608
- 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: "" };
1609
- function createUiEditorSlashMenu(options = {}) {
1610
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1611
- const element = document.createElement("div");
1612
- for (const [name, value] of Object.entries(attributes)) {
1613
- if (value === null || value === void 0 || value === false) continue;
1614
- element.setAttribute(name, value === true ? "" : String(value));
1615
- }
1616
- element.setAttribute("data-component", "ui-editor-slash-menu");
1617
- element.setAttribute("data-component-root", "ui-editor-slash-menu");
1618
- attachLoomaComponent35(element, definition35, "ui-editor-slash-menu", componentProps);
1619
- return element;
1620
- }
1621
-
1622
- // src/generated/vanilla/UiEditorTableContextMenu.js
1623
- import { attachLoomaComponent as attachLoomaComponent36 } from "@threadlabs/looma/core/declarative";
1624
- 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: "" };
1625
- function createUiEditorTableContextMenu(options = {}) {
1626
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1627
- const element = document.createElement("div");
1628
- for (const [name, value] of Object.entries(attributes)) {
1629
- if (value === null || value === void 0 || value === false) continue;
1630
- element.setAttribute(name, value === true ? "" : String(value));
1631
- }
1632
- element.setAttribute("data-component", "ui-editor-table-context-menu");
1633
- element.setAttribute("data-component-root", "ui-editor-table-context-menu");
1634
- attachLoomaComponent36(element, definition36, "ui-editor-table-context-menu", componentProps);
1635
- return element;
1636
- }
1637
-
1638
- // src/generated/vanilla/UiEditorTableOverlay.js
1639
- import { attachLoomaComponent as attachLoomaComponent37 } from "@threadlabs/looma/core/declarative";
1640
- 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: "" };
1641
- function createUiEditorTableOverlay(options = {}) {
1642
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1643
- const element = document.createElement("div");
1644
- for (const [name, value] of Object.entries(attributes)) {
1645
- if (value === null || value === void 0 || value === false) continue;
1646
- element.setAttribute(name, value === true ? "" : String(value));
1647
- }
1648
- element.setAttribute("data-component", "ui-editor-table-overlay");
1649
- element.setAttribute("data-component-root", "ui-editor-table-overlay");
1650
- attachLoomaComponent37(element, definition37, "ui-editor-table-overlay", componentProps);
1651
- return element;
1652
- }
1653
-
1654
- // src/generated/vanilla/UiEditorTableToolbar.js
1655
- import { attachLoomaComponent as attachLoomaComponent38 } from "@threadlabs/looma/core/declarative";
1656
- 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: "" };
1657
- function createUiEditorTableToolbar(options = {}) {
1658
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1659
- const element = document.createElement("div");
1660
- for (const [name, value] of Object.entries(attributes)) {
1661
- if (value === null || value === void 0 || value === false) continue;
1662
- element.setAttribute(name, value === true ? "" : String(value));
1663
- }
1664
- element.setAttribute("data-component", "ui-editor-table-toolbar");
1665
- element.setAttribute("data-component-root", "ui-editor-table-toolbar");
1666
- attachLoomaComponent38(element, definition38, "ui-editor-table-toolbar", componentProps);
1667
- return element;
1668
- }
1669
-
1670
- // src/generated/vanilla/UiEditorToolbar.js
1671
- import { attachLoomaComponent as attachLoomaComponent39 } from "@threadlabs/looma/core/declarative";
1672
- 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: "" };
1673
- function createUiEditorToolbar(options = {}) {
1674
- const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
1675
- const element = document.createElement("div");
1676
- for (const [name, value] of Object.entries(attributes)) {
1677
- if (value === null || value === void 0 || value === false) continue;
1678
- element.setAttribute(name, value === true ? "" : String(value));
1679
- }
1680
- element.setAttribute("data-component", "ui-editor-toolbar");
1681
- element.setAttribute("data-component-root", "ui-editor-toolbar");
1682
- if (children.length > 0) {
1683
- for (const child of children) element.append(child);
1684
- } else {
1685
- }
1686
- attachLoomaComponent39(element, definition39, "ui-editor-toolbar", componentProps);
1687
- return element;
1688
- }
1689
-
1690
- // src/generated/vanilla/index.js
1691
- var factoryByTag = Object.freeze({
1692
- "ui-affordance-scope": createUiAffordanceScope,
1693
- "ui-avatar-group": createUiAvatarGroup,
1694
- "ui-avatar": createUiAvatar,
1695
- "ui-badge": createUiBadge,
1696
- "ui-button": createUiButton,
1697
- "ui-callout": createUiCallout,
1698
- "ui-checkbox": createUiCheckbox,
1699
- "ui-combobox": createUiCombobox,
1700
- "ui-context-menu": createUiContextMenu,
1701
- "ui-dialog": createUiDialog,
1702
- "ui-disclosure": createUiDisclosure,
1703
- "ui-editable": createUiEditable,
1704
- "ui-form-field": createUiFormField,
1705
- "ui-icon-button": createUiIconButton,
1706
- "ui-input": createUiInput,
1707
- "ui-menu-item": createUiMenuItem,
1708
- "ui-menu": createUiMenu,
1709
- "ui-popover": createUiPopover,
1710
- "ui-radio-group": createUiRadioGroup,
1711
- "ui-radio": createUiRadio,
1712
- "ui-search-result-row": createUiSearchResultRow,
1713
- "ui-search-shell": createUiSearchShell,
1714
- "ui-select": createUiSelect,
1715
- "ui-switch": createUiSwitch,
1716
- "ui-tabs": createUiTabs,
1717
- "ui-textarea": createUiTextarea,
1718
- "ui-toast-region": createUiToastRegion,
1719
- "ui-tooltip": createUiTooltip,
1720
- "ui-top-bar": createUiTopBar,
1721
- "ui-tree-item": createUiTreeItem,
1722
- "ui-tree": createUiTree,
1723
- "ui-cluster": createUiCluster,
1724
- "ui-container": createUiContainer,
1725
- "ui-grid": createUiGrid,
1726
- "ui-reel": createUiReel,
1727
- "ui-separator": createUiSeparator,
1728
- "ui-sidebar": createUiSidebar,
1729
- "ui-stack": createUiStack,
1730
- "ui-switcher": createUiSwitcher,
1731
- "ui-editor-insert-table-grid": createUiEditorInsertTableGrid,
1732
- "ui-editor-mention-menu": createUiEditorMentionMenu,
1733
- "ui-editor-slash-menu": createUiEditorSlashMenu,
1734
- "ui-editor-table-context-menu": createUiEditorTableContextMenu,
1735
- "ui-editor-table-overlay": createUiEditorTableOverlay,
1736
- "ui-editor-table-toolbar": createUiEditorTableToolbar,
1737
- "ui-editor-toolbar": createUiEditorToolbar
1738
- });
1739
-
1740
- // src/index.ts
1741
- function applyProps(node, props) {
1742
- for (const [name, value] of Object.entries(props)) {
1743
- if (name in node || typeof value === "object") {
1744
- node[name] = value;
1745
- continue;
1746
- }
1747
- if (value === null || value === void 0 || value === false) {
1748
- node.removeAttribute(name);
1749
- } else {
1750
- node.setAttribute(name, value === true ? "" : String(value));
1751
- }
1752
- }
1753
- }
1754
- function bindEvents(node, handlers) {
1755
- const listeners = [
1756
- ["open", handlers.onOpen && ((event) => handlers.onOpen?.(event.detail))],
1757
- ["close", handlers.onClose && ((event) => handlers.onClose?.(event.detail))],
1758
- ["select", handlers.onSelect && ((event) => handlers.onSelect?.(event.detail))],
1759
- ["change", handlers.onChange && ((event) => handlers.onChange?.(event.detail))],
1760
- ["dismiss", handlers.onDismiss && ((event) => handlers.onDismiss?.(event.detail))]
1761
- ];
1762
- for (const [eventName, listener] of listeners) if (listener) node.addEventListener(eventName, listener);
1763
- return () => {
1764
- for (const [eventName, listener] of listeners) if (listener) node.removeEventListener(eventName, listener);
1765
- };
1766
- }
1767
- function bindAdapter(node, options = {}) {
1768
- applyProps(node, options.props ?? {});
1769
- let cleanup = bindEvents(node, options);
1770
- return {
1771
- update(updatedOptions = {}) {
1772
- cleanup();
1773
- applyProps(node, updatedOptions.props ?? {});
1774
- cleanup = bindEvents(node, updatedOptions);
1775
- },
1776
- destroy() {
1777
- cleanup();
1778
- }
1779
- };
1780
- }
1781
- function createAdapterElement(tagName, options = {}) {
1782
- const factory = factoryByTag[tagName];
1783
- const factoryOptions = { ...options.props ?? {} };
1784
- if (options.attributes !== void 0) factoryOptions.attributes = options.attributes;
1785
- if (options.children !== void 0) factoryOptions.children = options.children;
1786
- if (options.slots !== void 0) factoryOptions.slots = options.slots;
1787
- const element = factory(factoryOptions);
1788
- bindEvents(element, options);
1789
- return element;
1790
- }
1791
- var ADAPTER_COMPONENT_TAG_MAP = {
1792
- AffordanceScope: "ui-affordance-scope",
1793
- AvatarGroup: "ui-avatar-group",
1794
- Avatar: "ui-avatar",
1795
- Badge: "ui-badge",
1796
- Button: "ui-button",
1797
- Callout: "ui-callout",
1798
- Checkbox: "ui-checkbox",
1799
- Combobox: "ui-combobox",
1800
- ContextMenu: "ui-context-menu",
1801
- Dialog: "ui-dialog",
1802
- Disclosure: "ui-disclosure",
1803
- Editable: "ui-editable",
1804
- FormField: "ui-form-field",
1805
- IconButton: "ui-icon-button",
1806
- Input: "ui-input",
1807
- MenuItem: "ui-menu-item",
1808
- Menu: "ui-menu",
1809
- Popover: "ui-popover",
1810
- RadioGroup: "ui-radio-group",
1811
- Radio: "ui-radio",
1812
- SearchResultRow: "ui-search-result-row",
1813
- SearchShell: "ui-search-shell",
1814
- Select: "ui-select",
1815
- Switch: "ui-switch",
1816
- Tabs: "ui-tabs",
1817
- Textarea: "ui-textarea",
1818
- ToastRegion: "ui-toast-region",
1819
- Tooltip: "ui-tooltip",
1820
- TopBar: "ui-top-bar",
1821
- TreeItem: "ui-tree-item",
1822
- Tree: "ui-tree",
1823
- EditorInsertTableGrid: "ui-editor-insert-table-grid",
1824
- EditorMentionMenu: "ui-editor-mention-menu",
1825
- EditorSlashMenu: "ui-editor-slash-menu",
1826
- EditorTableContextMenu: "ui-editor-table-context-menu",
1827
- EditorTableOverlay: "ui-editor-table-overlay",
1828
- EditorTableToolbar: "ui-editor-table-toolbar",
1829
- EditorToolbar: "ui-editor-toolbar",
1830
- Container: "ui-container",
1831
- Grid: "ui-grid",
1832
- Cluster: "ui-cluster",
1833
- Reel: "ui-reel",
1834
- Separator: "ui-separator",
1835
- Sidebar: "ui-sidebar",
1836
- Stack: "ui-stack",
1837
- Switcher: "ui-switcher"
1838
- };
1839
- var SVELTE_ADAPTER_NOTE = "Native-root adapter: factories and bindAdapter project the framework-neutral Looma declarative contract into Svelte.";
1840
- export {
1841
- ADAPTER_COMPONENT_TAG_MAP,
1842
- SVELTE_ADAPTER_NOTE,
1843
- bindAdapter,
1844
- createAdapterElement,
1845
- createUiAffordanceScope,
1846
- createUiAvatar,
1847
- createUiAvatarGroup,
1848
- createUiBadge,
1849
- createUiButton,
1850
- createUiCallout,
1851
- createUiCheckbox,
1852
- createUiCluster,
1853
- createUiCombobox,
1854
- createUiContainer,
1855
- createUiContextMenu,
1856
- createUiDialog,
1857
- createUiDisclosure,
1858
- createUiEditable,
1859
- createUiEditorInsertTableGrid,
1860
- createUiEditorMentionMenu,
1861
- createUiEditorSlashMenu,
1862
- createUiEditorTableContextMenu,
1863
- createUiEditorTableOverlay,
1864
- createUiEditorTableToolbar,
1865
- createUiEditorToolbar,
1866
- createUiFormField,
1867
- createUiGrid,
1868
- createUiIconButton,
1869
- createUiInput,
1870
- createUiMenu,
1871
- createUiMenuItem,
1872
- createUiPopover,
1873
- createUiRadio,
1874
- createUiRadioGroup,
1875
- createUiReel,
1876
- createUiSearchResultRow,
1877
- createUiSearchShell,
1878
- createUiSelect,
1879
- createUiSeparator,
1880
- createUiSidebar,
1881
- createUiStack,
1882
- createUiSwitch,
1883
- createUiSwitcher,
1884
- createUiTabs,
1885
- createUiTextarea,
1886
- createUiToastRegion,
1887
- createUiTooltip,
1888
- createUiTopBar,
1889
- createUiTree,
1890
- createUiTreeItem,
1891
- factoryByTag
1892
- };