@threadlabs/looma 0.3.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2821,7 +2821,6 @@ function controller28(host) {
2821
2821
  const disclosure = element.querySelector('[part="disclosure"]');
2822
2822
  const children = element.querySelector('[part="children"]');
2823
2823
  const dragHandle = element.querySelector('[part="drag-handle"]');
2824
- const label = element.querySelector('[part="label"]');
2825
2824
  const childItems = () => Array.from(children?.children ?? []).filter((child) => child.matches?.('[data-component-root~="ui-tree-item"]'));
2826
2825
  let lastExternalExpanded = Boolean(host.state.expanded);
2827
2826
  host.state.internalExpanded = lastExternalExpanded;
@@ -2860,7 +2859,6 @@ function controller28(host) {
2860
2859
  else element.removeAttribute("aria-expanded");
2861
2860
  element.tabIndex = disabled3 || !host.state.tabStop ? -1 : 0;
2862
2861
  element.style.setProperty("--ui-tree-item-depth", String(level - 1));
2863
- if (label && label.textContent !== name) label.textContent = name;
2864
2862
  if (children) children.hidden = !expanded;
2865
2863
  if (disclosure) {
2866
2864
  disclosure.hidden = !container;
@@ -5445,7 +5443,7 @@ input[type='radio']:focus-visible {
5445
5443
  { tag: "ui-tree-item", source: `<template component="ui-tree-item" controller="./controllers/ui-tree-item.js" status="early" summary="Migrated Looma ui-tree-item component.">
5446
5444
  <defs>
5447
5445
  <prop name="itemId" type="string" default="">itemId token.</prop>
5448
- <prop name="label" type="string" default="">label token.</prop>
5446
+ <prop name="label" type="string" default="">The item's accessible name, also shown as the row text unless the label slot supplies content.</prop>
5449
5447
  <prop name="dropDepth" type="number">dropDepth token.</prop>
5450
5448
  <prop name="subtreeDepth" type="number">subtreeDepth token.</prop>
5451
5449
  <prop name="container" type="boolean" default="false">container token.</prop>
@@ -5462,7 +5460,7 @@ input[type='radio']:focus-visible {
5462
5460
  <state name="hasChildren" :value="false"></state>
5463
5461
  <event name="expand" bubbles="false" type="object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })"></event>
5464
5462
  </defs>
5465
- <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
5463
+ <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"><slot name="label"><template $value="label"></template></slot></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
5466
5464
  <style>:scope {
5467
5465
  --_tree-indent: 16px;
5468
5466
  --_tree-row-min-height: 32px;
package/dist/index.cjs CHANGED
@@ -2864,7 +2864,6 @@ function controller28(host) {
2864
2864
  const disclosure = element.querySelector('[part="disclosure"]');
2865
2865
  const children = element.querySelector('[part="children"]');
2866
2866
  const dragHandle = element.querySelector('[part="drag-handle"]');
2867
- const label = element.querySelector('[part="label"]');
2868
2867
  const childItems = () => Array.from(children?.children ?? []).filter((child) => child.matches?.('[data-component-root~="ui-tree-item"]'));
2869
2868
  let lastExternalExpanded = Boolean(host.state.expanded);
2870
2869
  host.state.internalExpanded = lastExternalExpanded;
@@ -2903,7 +2902,6 @@ function controller28(host) {
2903
2902
  else element.removeAttribute("aria-expanded");
2904
2903
  element.tabIndex = disabled3 || !host.state.tabStop ? -1 : 0;
2905
2904
  element.style.setProperty("--ui-tree-item-depth", String(level - 1));
2906
- if (label && label.textContent !== name) label.textContent = name;
2907
2905
  if (children) children.hidden = !expanded;
2908
2906
  if (disclosure) {
2909
2907
  disclosure.hidden = !container;
@@ -5488,7 +5486,7 @@ input[type='radio']:focus-visible {
5488
5486
  { tag: "ui-tree-item", source: `<template component="ui-tree-item" controller="./controllers/ui-tree-item.js" status="early" summary="Migrated Looma ui-tree-item component.">
5489
5487
  <defs>
5490
5488
  <prop name="itemId" type="string" default="">itemId token.</prop>
5491
- <prop name="label" type="string" default="">label token.</prop>
5489
+ <prop name="label" type="string" default="">The item's accessible name, also shown as the row text unless the label slot supplies content.</prop>
5492
5490
  <prop name="dropDepth" type="number">dropDepth token.</prop>
5493
5491
  <prop name="subtreeDepth" type="number">subtreeDepth token.</prop>
5494
5492
  <prop name="container" type="boolean" default="false">container token.</prop>
@@ -5505,7 +5503,7 @@ input[type='radio']:focus-visible {
5505
5503
  <state name="hasChildren" :value="false"></state>
5506
5504
  <event name="expand" bubbles="false" type="object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })"></event>
5507
5505
  </defs>
5508
- <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
5506
+ <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"><slot name="label"><template $value="label"></template></slot></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
5509
5507
  <style>:scope {
5510
5508
  --_tree-indent: 16px;
5511
5509
  --_tree-row-min-height: 32px;
package/dist/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  records,
3
3
  styles
4
- } from "./chunk-3NVMCHGR.js";
4
+ } from "./chunk-RWLYVQY6.js";
5
5
  import {
6
6
  attachLoomaComponent,
7
7
  controllerFor,
package/dist/loader.cjs CHANGED
@@ -2842,7 +2842,6 @@ function controller28(host) {
2842
2842
  const disclosure = element.querySelector('[part="disclosure"]');
2843
2843
  const children = element.querySelector('[part="children"]');
2844
2844
  const dragHandle = element.querySelector('[part="drag-handle"]');
2845
- const label = element.querySelector('[part="label"]');
2846
2845
  const childItems = () => Array.from(children?.children ?? []).filter((child) => child.matches?.('[data-component-root~="ui-tree-item"]'));
2847
2846
  let lastExternalExpanded = Boolean(host.state.expanded);
2848
2847
  host.state.internalExpanded = lastExternalExpanded;
@@ -2881,7 +2880,6 @@ function controller28(host) {
2881
2880
  else element.removeAttribute("aria-expanded");
2882
2881
  element.tabIndex = disabled3 || !host.state.tabStop ? -1 : 0;
2883
2882
  element.style.setProperty("--ui-tree-item-depth", String(level - 1));
2884
- if (label && label.textContent !== name) label.textContent = name;
2885
2883
  if (children) children.hidden = !expanded;
2886
2884
  if (disclosure) {
2887
2885
  disclosure.hidden = !container;
@@ -5466,7 +5464,7 @@ input[type='radio']:focus-visible {
5466
5464
  { tag: "ui-tree-item", source: `<template component="ui-tree-item" controller="./controllers/ui-tree-item.js" status="early" summary="Migrated Looma ui-tree-item component.">
5467
5465
  <defs>
5468
5466
  <prop name="itemId" type="string" default="">itemId token.</prop>
5469
- <prop name="label" type="string" default="">label token.</prop>
5467
+ <prop name="label" type="string" default="">The item's accessible name, also shown as the row text unless the label slot supplies content.</prop>
5470
5468
  <prop name="dropDepth" type="number">dropDepth token.</prop>
5471
5469
  <prop name="subtreeDepth" type="number">subtreeDepth token.</prop>
5472
5470
  <prop name="container" type="boolean" default="false">container token.</prop>
@@ -5483,7 +5481,7 @@ input[type='radio']:focus-visible {
5483
5481
  <state name="hasChildren" :value="false"></state>
5484
5482
  <event name="expand" bubbles="false" type="object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })"></event>
5485
5483
  </defs>
5486
- <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
5484
+ <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"><slot name="label"><template $value="label"></template></slot></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
5487
5485
  <style>:scope {
5488
5486
  --_tree-indent: 16px;
5489
5487
  --_tree-row-min-height: 32px;
package/dist/loader.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  records,
3
3
  styles
4
- } from "./chunk-3NVMCHGR.js";
4
+ } from "./chunk-RWLYVQY6.js";
5
5
  import {
6
6
  registerLoomaPackage
7
7
  } from "./chunk-XDNZIKNI.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@threadlabs/looma",
3
- "version": "0.3.0",
3
+ "version": "0.4.0",
4
4
  "type": "module",
5
5
  "description": "Looma declarative components, responsive layout primitives, a complete editor, and supported Vue adapters.",
6
6
  "license": "MIT",
@@ -72,14 +72,6 @@
72
72
  "types": "./vue/editor/index.d.ts",
73
73
  "import": "./vue/editor/index.js"
74
74
  },
75
- "./react": {
76
- "types": "./react/index.d.ts",
77
- "import": "./react/index.js"
78
- },
79
- "./svelte": {
80
- "types": "./svelte/index.d.ts",
81
- "import": "./svelte/index.js"
82
- },
83
75
  "./tokens.css": "./tokens.css",
84
76
  "./theme-light.css": "./theme-light.css",
85
77
  "./theme-dark.css": "./theme-dark.css",
@@ -93,8 +85,6 @@
93
85
  "layout/",
94
86
  "editor/",
95
87
  "vue/",
96
- "react/",
97
- "svelte/",
98
88
  "tokens.css",
99
89
  "theme-light.css",
100
90
  "theme-dark.css",
@@ -111,8 +101,6 @@
111
101
  "./editor/*.js",
112
102
  "./vue/index.js",
113
103
  "./vue/editor/*.js",
114
- "./react/index.js",
115
- "./svelte/index.js",
116
104
  "./*.css"
117
105
  ],
118
106
  "dependencies": {
@@ -123,8 +111,6 @@
123
111
  "@tiptap/core": ">=2 <3",
124
112
  "@tiptap/pm": ">=2 <3",
125
113
  "@tiptap/vue-3": ">=2 <3",
126
- "react": "^19.0.0",
127
- "svelte": "^5.0.0",
128
114
  "vue": "^3.5.0"
129
115
  },
130
116
  "peerDependenciesMeta": {
@@ -137,12 +123,6 @@
137
123
  "@tiptap/vue-3": {
138
124
  "optional": true
139
125
  },
140
- "react": {
141
- "optional": true
142
- },
143
- "svelte": {
144
- "optional": true
145
- },
146
126
  "vue": {
147
127
  "optional": true
148
128
  }