@threadlabs/looma 0.5.1 → 0.6.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/components/shared/overlay.js +3 -0
- package/components/ui-button/ui-button.html +27 -14
- package/components/ui-callout/ui-callout.html +1 -1
- package/components/ui-checkbox/ui-checkbox.html +1 -1
- package/components/ui-cluster/ui-cluster.html +6 -6
- package/components/ui-combobox/ui-combobox.html +35 -27
- package/components/ui-container/ui-container.html +4 -4
- package/components/ui-context-menu/ui-context-menu.html +2 -2
- package/components/ui-dialog/ui-dialog.html +21 -8
- package/components/ui-disclosure/ui-disclosure.html +19 -4
- package/components/ui-editable/ui-editable.html +6 -6
- package/components/ui-editor-insert-table-grid/ui-editor-insert-table-grid.html +21 -21
- package/components/ui-editor-mention-menu/ui-editor-mention-menu.html +26 -26
- package/components/ui-editor-slash-menu/ui-editor-slash-menu.html +39 -39
- package/components/ui-editor-table-context-menu/ui-editor-table-context-menu.html +26 -22
- package/components/ui-editor-table-overlay/ui-editor-table-overlay.html +68 -52
- package/components/ui-editor-table-toolbar/ui-editor-table-toolbar.html +42 -38
- package/components/ui-editor-toolbar/ui-editor-toolbar.html +9 -9
- package/components/ui-floating-action-button/ui-floating-action-button.html +16 -22
- package/components/ui-form-field/ui-form-field.html +18 -7
- package/components/ui-grid/ui-grid.html +6 -6
- package/components/ui-icon/ui-icon.html +5 -1
- package/components/ui-icon-button/ui-icon-button.html +68 -34
- package/components/ui-input/ui-input.html +2 -2
- package/components/ui-menu/ui-menu.html +15 -4
- package/components/ui-menu-item/ui-menu-item.html +5 -5
- package/components/ui-popover/ui-popover.html +3 -3
- package/components/ui-popover/ui-popover.js +10 -2
- package/components/ui-reel/ui-reel.html +6 -6
- package/components/ui-search-result-row/ui-search-result-row.html +9 -9
- package/components/ui-search-shell/ui-search-shell.html +10 -3
- package/components/ui-search-shell/ui-search-shell.js +9 -0
- package/components/ui-select/ui-select.html +2 -2
- package/components/ui-sidebar/ui-sidebar.html +11 -11
- package/components/ui-stack/ui-stack.html +6 -6
- package/components/ui-switcher/ui-switcher.html +6 -6
- package/components/ui-tabs/ui-tabs.html +19 -5
- package/components/ui-textarea/ui-textarea.html +2 -2
- package/components/ui-toast-region/ui-toast-region.html +3 -3
- package/components/ui-tooltip/ui-tooltip.html +1 -1
- package/components/ui-top-bar/ui-top-bar.html +5 -5
- package/components/ui-tree/ui-tree.html +7 -0
- package/components/ui-tree-item/ui-tree-item.html +20 -7
- package/dist/index.d.ts +1 -1
- package/dist/index.js +2 -2
- package/package.json +2 -2
- package/styles/ui-affordance-scope.css +1 -1
- package/styles/ui-avatar-group.css +1 -1
- package/styles/ui-avatar.css +1 -1
- package/styles/ui-badge.css +1 -1
- package/styles/ui-button.css +25 -15
- package/styles/ui-callout.css +2 -2
- package/styles/ui-checkbox.css +2 -2
- package/styles/ui-cluster.css +7 -7
- package/styles/ui-combobox.css +24 -24
- package/styles/ui-container.css +5 -5
- package/styles/ui-context-menu.css +3 -3
- package/styles/ui-dialog.css +26 -9
- package/styles/ui-disclosure.css +23 -7
- package/styles/ui-editable.css +7 -7
- package/styles/ui-editor-insert-table-grid.css +21 -21
- package/styles/ui-editor-mention-menu.css +26 -26
- package/styles/ui-editor-slash-menu.css +40 -40
- package/styles/ui-editor-table-context-menu.css +21 -21
- package/styles/ui-editor-table-overlay.css +49 -49
- package/styles/ui-editor-table-toolbar.css +35 -35
- package/styles/ui-editor-toolbar.css +10 -10
- package/styles/ui-floating-action-button.css +17 -23
- package/styles/ui-form-field.css +24 -10
- package/styles/ui-grid.css +7 -7
- package/styles/ui-icon-button.css +74 -35
- package/styles/ui-icon.css +1 -1
- package/styles/ui-input.css +3 -3
- package/styles/ui-menu-item.css +6 -6
- package/styles/ui-menu.css +19 -7
- package/styles/ui-popover.css +4 -4
- package/styles/ui-radio-group.css +1 -1
- package/styles/ui-radio.css +1 -1
- package/styles/ui-reel.css +7 -7
- package/styles/ui-search-result-row.css +10 -10
- package/styles/ui-search-shell.css +14 -5
- package/styles/ui-select.css +3 -3
- package/styles/ui-separator.css +1 -1
- package/styles/ui-sidebar.css +12 -12
- package/styles/ui-stack.css +7 -7
- package/styles/ui-switch.css +1 -1
- package/styles/ui-switcher.css +7 -7
- package/styles/ui-tabs.css +21 -7
- package/styles/ui-textarea.css +3 -3
- package/styles/ui-toast-region.css +3 -3
- package/styles/ui-tooltip.css +2 -2
- package/styles/ui-top-bar.css +6 -6
- package/styles/ui-tree-item.css +30 -9
- package/styles/ui-tree.css +8 -2
- package/theme-dark.css +42 -103
- package/theme-high-contrast.css +18 -22
- package/theme-light.css +15 -41
- package/tokens.css +149 -201
- package/vanilla/UiAffordanceScope.d.ts +1 -1
- package/vanilla/UiAffordanceScope.js +2 -2
- package/vanilla/UiAvatar.d.ts +1 -1
- package/vanilla/UiAvatar.js +2 -2
- package/vanilla/UiAvatarGroup.d.ts +1 -1
- package/vanilla/UiAvatarGroup.js +2 -2
- package/vanilla/UiBadge.d.ts +1 -1
- package/vanilla/UiBadge.js +2 -2
- package/vanilla/UiButton.d.ts +3 -1
- package/vanilla/UiButton.js +3 -3
- package/vanilla/UiCallout.d.ts +1 -1
- package/vanilla/UiCallout.js +2 -2
- package/vanilla/UiCheckbox.d.ts +1 -1
- package/vanilla/UiCheckbox.js +2 -2
- package/vanilla/UiCluster.d.ts +1 -1
- package/vanilla/UiCluster.js +2 -2
- package/vanilla/UiCombobox.d.ts +1 -1
- package/vanilla/UiCombobox.js +3 -3
- package/vanilla/UiContainer.d.ts +1 -1
- package/vanilla/UiContainer.js +2 -2
- package/vanilla/UiContextMenu.d.ts +1 -1
- package/vanilla/UiContextMenu.js +2 -2
- package/vanilla/UiDialog.d.ts +1 -1
- package/vanilla/UiDialog.js +2 -2
- package/vanilla/UiDisclosure.d.ts +2 -1
- package/vanilla/UiDisclosure.js +3 -3
- package/vanilla/UiEditable.d.ts +1 -1
- package/vanilla/UiEditable.js +2 -2
- package/vanilla/UiEditorInsertTableGrid.d.ts +1 -1
- package/vanilla/UiEditorInsertTableGrid.js +3 -3
- package/vanilla/UiEditorMentionMenu.d.ts +1 -1
- package/vanilla/UiEditorMentionMenu.js +3 -3
- package/vanilla/UiEditorSlashMenu.d.ts +1 -1
- package/vanilla/UiEditorSlashMenu.js +2 -2
- package/vanilla/UiEditorTableContextMenu.d.ts +1 -1
- package/vanilla/UiEditorTableContextMenu.js +3 -3
- package/vanilla/UiEditorTableOverlay.d.ts +1 -1
- package/vanilla/UiEditorTableOverlay.js +3 -3
- package/vanilla/UiEditorTableToolbar.d.ts +1 -1
- package/vanilla/UiEditorTableToolbar.js +3 -3
- package/vanilla/UiEditorToolbar.d.ts +1 -1
- package/vanilla/UiEditorToolbar.js +2 -2
- package/vanilla/UiFloatingActionButton.d.ts +1 -1
- package/vanilla/UiFloatingActionButton.js +2 -2
- package/vanilla/UiFormField.d.ts +1 -1
- package/vanilla/UiFormField.js +15 -6
- package/vanilla/UiGrid.d.ts +1 -1
- package/vanilla/UiGrid.js +2 -2
- package/vanilla/UiIcon.d.ts +1 -1
- package/vanilla/UiIcon.js +3 -3
- package/vanilla/UiIconButton.d.ts +1 -1
- package/vanilla/UiIconButton.js +2 -2
- package/vanilla/UiInput.d.ts +1 -1
- package/vanilla/UiInput.js +2 -2
- package/vanilla/UiMenu.d.ts +2 -1
- package/vanilla/UiMenu.js +3 -3
- package/vanilla/UiMenuItem.d.ts +1 -1
- package/vanilla/UiMenuItem.js +2 -2
- package/vanilla/UiPopover.d.ts +1 -1
- package/vanilla/UiPopover.js +2 -2
- package/vanilla/UiRadio.d.ts +1 -1
- package/vanilla/UiRadio.js +2 -2
- package/vanilla/UiRadioGroup.d.ts +1 -1
- package/vanilla/UiRadioGroup.js +2 -2
- package/vanilla/UiReel.d.ts +1 -1
- package/vanilla/UiReel.js +2 -2
- package/vanilla/UiSearchResultRow.d.ts +1 -1
- package/vanilla/UiSearchResultRow.js +2 -2
- package/vanilla/UiSearchShell.d.ts +1 -1
- package/vanilla/UiSearchShell.js +2 -2
- package/vanilla/UiSelect.d.ts +1 -1
- package/vanilla/UiSelect.js +2 -2
- package/vanilla/UiSeparator.d.ts +1 -1
- package/vanilla/UiSeparator.js +2 -2
- package/vanilla/UiSidebar.d.ts +1 -1
- package/vanilla/UiSidebar.js +2 -2
- package/vanilla/UiStack.d.ts +1 -1
- package/vanilla/UiStack.js +2 -2
- package/vanilla/UiSwitch.d.ts +1 -1
- package/vanilla/UiSwitch.js +2 -2
- package/vanilla/UiSwitcher.d.ts +1 -1
- package/vanilla/UiSwitcher.js +2 -2
- package/vanilla/UiTabs.d.ts +2 -1
- package/vanilla/UiTabs.js +3 -3
- package/vanilla/UiTextarea.d.ts +1 -1
- package/vanilla/UiTextarea.js +2 -2
- package/vanilla/UiToastRegion.d.ts +1 -1
- package/vanilla/UiToastRegion.js +3 -3
- package/vanilla/UiTooltip.d.ts +1 -1
- package/vanilla/UiTooltip.js +2 -2
- package/vanilla/UiTopBar.d.ts +1 -1
- package/vanilla/UiTopBar.js +1 -1
- package/vanilla/UiTree.d.ts +2 -1
- package/vanilla/UiTree.js +3 -3
- package/vanilla/UiTreeItem.d.ts +1 -1
- package/vanilla/UiTreeItem.js +2 -2
- package/vue/UiAffordanceScope.d.ts +2 -2
- package/vue/UiAffordanceScope.vue +92 -73
- package/vue/UiAvatar.d.ts +7 -7
- package/vue/UiAvatar.vue +145 -105
- package/vue/UiAvatarGroup.d.ts +4 -4
- package/vue/UiAvatarGroup.vue +134 -118
- package/vue/UiBadge.d.ts +4 -4
- package/vue/UiBadge.vue +113 -114
- package/vue/UiButton.d.ts +10 -6
- package/vue/UiButton.vue +295 -248
- package/vue/UiCallout.d.ts +2 -2
- package/vue/UiCallout.vue +154 -87
- package/vue/UiCheckbox.d.ts +14 -10
- package/vue/UiCheckbox.vue +228 -162
- package/vue/UiCluster.d.ts +2 -2
- package/vue/UiCluster.vue +53 -60
- package/vue/UiCombobox.d.ts +36 -32
- package/vue/UiCombobox.vue +1005 -416
- package/vue/UiContainer.d.ts +2 -2
- package/vue/UiContainer.vue +48 -51
- package/vue/UiContextMenu.d.ts +6 -4
- package/vue/UiContextMenu.vue +205 -116
- package/vue/UiDialog.d.ts +11 -9
- package/vue/UiDialog.vue +287 -212
- package/vue/UiDisclosure.d.ts +10 -6
- package/vue/UiDisclosure.vue +265 -159
- package/vue/UiEditable.d.ts +16 -12
- package/vue/UiEditable.vue +325 -205
- package/vue/UiEditorInsertTableGrid.d.ts +8 -8
- package/vue/UiEditorInsertTableGrid.vue +216 -157
- package/vue/UiEditorMentionMenu.d.ts +9 -9
- package/vue/UiEditorMentionMenu.vue +265 -222
- package/vue/UiEditorSlashMenu.d.ts +7 -7
- package/vue/UiEditorSlashMenu.vue +286 -240
- package/vue/UiEditorTableContextMenu.d.ts +5 -5
- package/vue/UiEditorTableContextMenu.vue +306 -193
- package/vue/UiEditorTableOverlay.d.ts +2 -2
- package/vue/UiEditorTableOverlay.vue +600 -369
- package/vue/UiEditorTableToolbar.d.ts +7 -7
- package/vue/UiEditorTableToolbar.vue +443 -268
- package/vue/UiEditorToolbar.d.ts +2 -2
- package/vue/UiEditorToolbar.vue +134 -121
- package/vue/UiFloatingActionButton.d.ts +6 -6
- package/vue/UiFloatingActionButton.vue +95 -99
- package/vue/UiFormField.d.ts +6 -6
- package/vue/UiFormField.vue +112 -80
- package/vue/UiGrid.d.ts +2 -2
- package/vue/UiGrid.vue +51 -57
- package/vue/UiIcon.d.ts +2 -2
- package/vue/UiIcon.vue +118 -89
- package/vue/UiIconButton.d.ts +11 -11
- package/vue/UiIconButton.vue +287 -217
- package/vue/UiInput.d.ts +9 -9
- package/vue/UiInput.vue +153 -127
- package/vue/UiMenu.d.ts +10 -6
- package/vue/UiMenu.vue +227 -143
- package/vue/UiMenuItem.d.ts +4 -4
- package/vue/UiMenuItem.vue +53 -46
- package/vue/UiPopover.d.ts +8 -6
- package/vue/UiPopover.vue +197 -137
- package/vue/UiRadio.d.ts +14 -10
- package/vue/UiRadio.vue +183 -117
- package/vue/UiRadioGroup.d.ts +14 -12
- package/vue/UiRadioGroup.vue +172 -111
- package/vue/UiReel.d.ts +3 -3
- package/vue/UiReel.vue +77 -77
- package/vue/UiSearchResultRow.d.ts +4 -4
- package/vue/UiSearchResultRow.vue +121 -115
- package/vue/UiSearchShell.d.ts +10 -8
- package/vue/UiSearchShell.vue +245 -176
- package/vue/UiSelect.d.ts +9 -9
- package/vue/UiSelect.vue +162 -134
- package/vue/UiSeparator.d.ts +2 -2
- package/vue/UiSeparator.vue +22 -27
- package/vue/UiSidebar.d.ts +20 -18
- package/vue/UiSidebar.vue +307 -224
- package/vue/UiStack.d.ts +3 -3
- package/vue/UiStack.vue +64 -70
- package/vue/UiSwitch.d.ts +12 -8
- package/vue/UiSwitch.vue +218 -150
- package/vue/UiSwitcher.d.ts +3 -3
- package/vue/UiSwitcher.vue +73 -75
- package/vue/UiTabs.d.ts +12 -8
- package/vue/UiTabs.vue +268 -210
- package/vue/UiTextarea.d.ts +11 -11
- package/vue/UiTextarea.vue +155 -128
- package/vue/UiToastRegion.d.ts +10 -8
- package/vue/UiToastRegion.vue +261 -198
- package/vue/UiTooltip.d.ts +14 -12
- package/vue/UiTooltip.vue +241 -177
- package/vue/UiTopBar.vue +51 -42
- package/vue/UiTree.d.ts +10 -6
- package/vue/UiTree.vue +180 -70
- package/vue/UiTreeItem.d.ts +24 -22
- package/vue/UiTreeItem.vue +464 -339
- package/vue/chunks/UiAffordanceScope.js +9 -16
- package/vue/chunks/UiAvatar.js +23 -29
- package/vue/chunks/UiAvatarGroup.js +16 -39
- package/vue/chunks/UiBadge.js +3 -12
- package/vue/chunks/UiButton.js +15 -18
- package/vue/chunks/UiCallout.js +8 -17
- package/vue/chunks/UiCheckbox.js +37 -40
- package/vue/chunks/UiCluster.js +3 -12
- package/vue/chunks/UiCombobox.js +224 -266
- package/vue/chunks/UiContainer.js +3 -12
- package/vue/chunks/UiContextMenu.js +39 -34
- package/vue/chunks/UiDialog.js +36 -39
- package/vue/chunks/UiDisclosure.js +44 -48
- package/vue/chunks/UiEditable.js +55 -57
- package/vue/chunks/UiEditorInsertTableGrid.js +55 -73
- package/vue/chunks/UiEditorMentionMenu.js +40 -81
- package/vue/chunks/UiEditorSlashMenu.js +28 -52
- package/vue/chunks/UiEditorTableContextMenu.js +32 -56
- package/vue/chunks/UiEditorTableOverlay.js +58 -82
- package/vue/chunks/UiEditorTableToolbar.js +61 -85
- package/vue/chunks/UiEditorToolbar.js +4 -13
- package/vue/chunks/UiFloatingActionButton.js +7 -21
- package/vue/chunks/UiFormField.js +15 -12
- package/vue/chunks/UiGrid.js +3 -12
- package/vue/chunks/UiIcon.js +20 -43
- package/vue/chunks/UiIconButton.js +16 -28
- package/vue/chunks/UiInput.js +20 -25
- package/vue/chunks/UiMenu.js +30 -33
- package/vue/chunks/UiMenuItem.js +4 -10
- package/vue/chunks/UiPopover.js +28 -29
- package/vue/chunks/UiRadio.js +36 -39
- package/vue/chunks/UiRadioGroup.js +30 -34
- package/vue/chunks/UiReel.js +6 -15
- package/vue/chunks/UiSearchResultRow.js +6 -19
- package/vue/chunks/UiSearchShell.js +25 -28
- package/vue/chunks/UiSelect.js +20 -23
- package/vue/chunks/UiSeparator.js +2 -8
- package/vue/chunks/UiSidebar.js +39 -44
- package/vue/chunks/UiStack.js +6 -15
- package/vue/chunks/UiSwitch.js +35 -38
- package/vue/chunks/UiSwitcher.js +6 -15
- package/vue/chunks/UiTabs.js +52 -85
- package/vue/chunks/UiTextarea.js +21 -26
- package/vue/chunks/UiToastRegion.js +38 -72
- package/vue/chunks/UiTooltip.js +34 -35
- package/vue/chunks/UiTopBar.js +1 -1
- package/vue/chunks/UiTree.js +27 -16
- package/vue/chunks/UiTreeItem.js +85 -102
- package/vue/components.css +4027 -3800
- package/vue/editor/LoomaEditor.d.ts +11 -0
- package/vue/editor/index.js +9 -0
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageComponentLifecycle } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
|
|
3
3
|
import * as controller from "../components/ui-editor-table-context-menu/ui-editor-table-context-menu.js";
|
|
4
4
|
import "../styles/ui-editor-table-context-menu.css";
|
|
5
5
|
|
|
6
|
-
const definition = {...{"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":[{"kind":"literal","name":"role","value":"menu"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"text","value":"Cell background"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"swatches"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell background"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"swatch-button"},{"kind":"attribute","name":"selected","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]},"target":"class"},{"kind":"literal","name":"role","value":"menuitemradio"},{"kind":"attribute","name":"aria-checked","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]}},{"kind":"attribute","name":"data-action","expression":"swatch.action","expressionPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch"},{"kind":"attribute","name":"default","expression":"not swatch.color","expressionPlan":{"source":"not swatch.color","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"}},"dependencies":["swatch.color"]},"target":"class"},{"kind":"attribute","name":"--ui-editor-table-context-swatch","expression":"swatch.color","expressionPlan":{"source":"swatch.color","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"},"dependencies":["swatch.color"]},"target":"style"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch-label"},{"kind":"directive","name":"value","expression":"swatch.label","expressionPlan":{"source":"swatch.label","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"label"},"dependencies":["swatch.label"]}}],"children":[]}],"flow":{"kind":"each","item":"swatch","list":"swatches","listPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]},"key":"swatch.action","keyPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}}]}],"flow":{"kind":"if","test":"swatches","testPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]}}},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"literal","name":"role","value":"presentation"},{"kind":"directive","name":"value","expression":"section.heading","expressionPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"menuitem"},{"kind":"attribute","name":"danger","expression":"item.danger","expressionPlan":{"source":"item.danger","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"danger"},"dependencies":["item.danger"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"section.items","listPlan":{"source":"section.items","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"items"},"dependencies":["section.items"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}]}],"flow":{"kind":"each","item":"section","list":"sections","listPlan":{"source":"sections","ast":{"kind":"id","name":"sections"},"dependencies":["sections"]},"key":"section.heading","keyPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}}]},"declarations":[{"kind":"state","name":"swatches","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"sections","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: align-left | align-center | align-right | background-none | background-gray | background-yellow | background-blue | background-green | background-red | add-row-before | add-row-after | add-column-before | add-column-after | clear-cells | merge-cells | split-cell | delete-row | delete-column | delete-table })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
|
|
6
|
+
const definition = {...{"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":[{"kind":"literal","name":"role","value":"menu"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"text","value":"Cell background"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"swatches"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell background"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"swatch-button"},{"kind":"attribute","name":"selected","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]},"target":"class"},{"kind":"literal","name":"role","value":"menuitemradio"},{"kind":"attribute","name":"aria-checked","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]}},{"kind":"attribute","name":"data-action","expression":"swatch.action","expressionPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch"},{"kind":"attribute","name":"default","expression":"not swatch.color","expressionPlan":{"source":"not swatch.color","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"}},"dependencies":["swatch.color"]},"target":"class"},{"kind":"attribute","name":"--ui-editor-table-context-swatch","expression":"swatch.color","expressionPlan":{"source":"swatch.color","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"},"dependencies":["swatch.color"]},"target":"style"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch-label"},{"kind":"directive","name":"value","expression":"swatch.label","expressionPlan":{"source":"swatch.label","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"label"},"dependencies":["swatch.label"]}}],"children":[]}],"flow":{"kind":"each","item":"swatch","list":"swatches","listPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]},"key":"swatch.action","keyPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}}]}],"flow":{"kind":"if","test":"swatches","testPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]}}},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"literal","name":"role","value":"presentation"},{"kind":"directive","name":"value","expression":"section.heading","expressionPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"menuitem"},{"kind":"attribute","name":"danger","expression":"item.danger","expressionPlan":{"source":"item.danger","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"danger"},"dependencies":["item.danger"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"section.items","listPlan":{"source":"section.items","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"items"},"dependencies":["section.items"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}]}],"flow":{"kind":"each","item":"section","list":"sections","listPlan":{"source":"sections","ast":{"kind":"id","name":"sections"},"dependencies":["sections"]},"key":"section.heading","keyPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}}]},"declarations":[{"kind":"state","name":"swatches","type":"list(object({ action: string, label: string, color: string, selected: boolean })) | null","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"sections","type":"list(object({ heading: string, items: list(object({ action: string, label: string, icon: string, danger: boolean })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: align-left | align-center | align-right | background-none | background-gray | background-yellow | background-blue | background-green | background-red | add-row-before | add-row-after | add-column-before | add-column-after | clear-cells | merge-cells | split-cell | delete-row | delete-column | delete-table })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
|
|
7
7
|
|
|
8
8
|
export function createUiEditorTableContextMenu(options = {}) {
|
|
9
9
|
const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
2
|
export interface UiEditorTableOverlayEventMap {
|
|
3
3
|
action: CustomEvent<{ readonly action: "add-row-before" | "add-row-after" | "add-column-before" | "add-column-after"; readonly boundaryIndex: number } | { readonly action: "select-row" | "select-column"; readonly rowIndex: number; readonly columnIndex: number } | { readonly action: "open-cell-menu"; readonly rowIndex: number; readonly columnIndex: number; readonly anchor: { readonly left: number; readonly top: number; readonly right: number; readonly bottom: number } }>;
|
|
4
4
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageComponentLifecycle } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
|
|
3
3
|
import * as controller from "../components/ui-editor-table-overlay/ui-editor-table-overlay.js";
|
|
4
4
|
import "../styles/ui-editor-table-overlay.css";
|
|
5
5
|
|
|
6
|
-
const definition = {...{"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":[{"kind":"literal","name":"aria-label","value":"Table controls"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"rows"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control row"},{"kind":"attribute","name":"active","expression":"control.key = activeKey","expressionPlan":{"source":"control.key = activeKey","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"right":{"kind":"id","name":"activeKey"}},"dependencies":["activeKey","control.key"]},"target":"class"},{"kind":"attribute","name":"top","expression":"control.offset","expressionPlan":{"source":"control.offset","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"offset"},"dependencies":["control.offset"]},"target":"style"},{"kind":"attribute","name":"data-control-key","expression":"control.key","expressionPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"data-ui-guide","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"handle"},{"kind":"attribute","name":"data-ui-affordance","expression":"control.affordance","expressionPlan":{"source":"control.affordance","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"affordance"},"dependencies":["control.affordance"]}},{"kind":"attribute","name":"data-action","expression":"control.action","expressionPlan":{"source":"control.action","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"action"},"dependencies":["control.action"]}},{"kind":"attribute","name":"data-boundary-index","expression":"control.index","expressionPlan":{"source":"control.index","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"index"},"dependencies":["control.index"]}},{"kind":"attribute","name":"aria-label","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"plus"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"tooltip"},{"kind":"literal","name":"role","value":"tooltip"},{"kind":"directive","name":"value","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[]}]}],"flow":{"kind":"each","item":"control","list":"rows","listPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]},"key":"control.key","keyPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"cols"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control col"},{"kind":"attribute","name":"active","expression":"control.key = activeKey","expressionPlan":{"source":"control.key = activeKey","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"right":{"kind":"id","name":"activeKey"}},"dependencies":["activeKey","control.key"]},"target":"class"},{"kind":"attribute","name":"left","expression":"control.offset","expressionPlan":{"source":"control.offset","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"offset"},"dependencies":["control.offset"]},"target":"style"},{"kind":"attribute","name":"data-control-key","expression":"control.key","expressionPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"data-ui-guide","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"handle"},{"kind":"attribute","name":"data-ui-affordance","expression":"control.affordance","expressionPlan":{"source":"control.affordance","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"affordance"},"dependencies":["control.affordance"]}},{"kind":"attribute","name":"data-action","expression":"control.action","expressionPlan":{"source":"control.action","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"action"},"dependencies":["control.action"]}},{"kind":"attribute","name":"data-boundary-index","expression":"control.index","expressionPlan":{"source":"control.index","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"index"},"dependencies":["control.index"]}},{"kind":"attribute","name":"aria-label","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"plus"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"tooltip"},{"kind":"literal","name":"role","value":"tooltip"},{"kind":"directive","name":"value","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[]}]}],"flow":{"kind":"each","item":"control","list":"cols","listPlan":{"source":"cols","ast":{"kind":"id","name":"cols"},"dependencies":["cols"]},"key":"control.key","keyPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}}]},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"selector row"},{"kind":"attribute","name":"top","expression":"hovered.rowOffset","expressionPlan":{"source":"hovered.rowOffset","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowOffset"},"dependencies":["hovered.rowOffset"]},"target":"style"},{"kind":"literal","name":"data-action","value":"select-row"},{"kind":"attribute","name":"data-row-index","expression":"hovered.rowIndex","expressionPlan":{"source":"hovered.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowIndex"},"dependencies":["hovered.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"hovered.columnIndex","expressionPlan":{"source":"hovered.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnIndex"},"dependencies":["hovered.columnIndex"]}},{"kind":"literal","name":"title","value":"Select row"},{"kind":"literal","name":"aria-label","value":"Select row"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"glyph"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"grip-vertical"}],"children":[]}]}]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"selector column"},{"kind":"attribute","name":"left","expression":"hovered.columnOffset","expressionPlan":{"source":"hovered.columnOffset","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnOffset"},"dependencies":["hovered.columnOffset"]},"target":"style"},{"kind":"literal","name":"data-action","value":"select-column"},{"kind":"attribute","name":"data-row-index","expression":"hovered.rowIndex","expressionPlan":{"source":"hovered.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowIndex"},"dependencies":["hovered.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"hovered.columnIndex","expressionPlan":{"source":"hovered.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnIndex"},"dependencies":["hovered.columnIndex"]}},{"kind":"literal","name":"title","value":"Select column"},{"kind":"literal","name":"aria-label","value":"Select column"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"glyph"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"grip-horizontal"}],"children":[]}]}]}],"flow":{"kind":"if","test":"hovered","testPlan":{"source":"hovered","ast":{"kind":"id","name":"hovered"},"dependencies":["hovered"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"cell-menu"},{"kind":"attribute","name":"left","expression":"active.menuLeft","expressionPlan":{"source":"active.menuLeft","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"menuLeft"},"dependencies":["active.menuLeft"]},"target":"style"},{"kind":"attribute","name":"top","expression":"active.menuTop","expressionPlan":{"source":"active.menuTop","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"menuTop"},"dependencies":["active.menuTop"]},"target":"style"},{"kind":"literal","name":"data-action","value":"open-cell-menu"},{"kind":"attribute","name":"data-row-index","expression":"active.rowIndex","expressionPlan":{"source":"active.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"rowIndex"},"dependencies":["active.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"active.columnIndex","expressionPlan":{"source":"active.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"columnIndex"},"dependencies":["active.columnIndex"]}},{"kind":"literal","name":"title","value":"Cell actions"},{"kind":"literal","name":"aria-label","value":"Cell actions"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"chevron-down"}],"children":[]}],"flow":{"kind":"if","test":"active","testPlan":{"source":"active","ast":{"kind":"id","name":"active"},"dependencies":["active"]}}}]},"declarations":[{"kind":"state","name":"rows","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"cols","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"hovered","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"activeKey","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: add-row-before | add-row-after | add-column-before | add-column-after, boundaryIndex: integer }) | object({ action: select-row | select-column, rowIndex: integer, columnIndex: integer }) | object({ action: open-cell-menu, 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:""};
|
|
6
|
+
const definition = {...{"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":[{"kind":"literal","name":"aria-label","value":"Table controls"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"rows"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control row"},{"kind":"attribute","name":"active","expression":"control.key = activeKey","expressionPlan":{"source":"control.key = activeKey","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"right":{"kind":"id","name":"activeKey"}},"dependencies":["activeKey","control.key"]},"target":"class"},{"kind":"attribute","name":"top","expression":"control.offset","expressionPlan":{"source":"control.offset","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"offset"},"dependencies":["control.offset"]},"target":"style"},{"kind":"attribute","name":"data-control-key","expression":"control.key","expressionPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"data-ui-guide","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"handle"},{"kind":"attribute","name":"data-ui-affordance","expression":"control.affordance","expressionPlan":{"source":"control.affordance","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"affordance"},"dependencies":["control.affordance"]}},{"kind":"attribute","name":"data-action","expression":"control.action","expressionPlan":{"source":"control.action","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"action"},"dependencies":["control.action"]}},{"kind":"attribute","name":"data-boundary-index","expression":"control.index","expressionPlan":{"source":"control.index","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"index"},"dependencies":["control.index"]}},{"kind":"attribute","name":"aria-label","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"plus"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"tooltip"},{"kind":"literal","name":"role","value":"tooltip"},{"kind":"directive","name":"value","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[]}]}],"flow":{"kind":"each","item":"control","list":"rows","listPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]},"key":"control.key","keyPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"cols"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control col"},{"kind":"attribute","name":"active","expression":"control.key = activeKey","expressionPlan":{"source":"control.key = activeKey","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"right":{"kind":"id","name":"activeKey"}},"dependencies":["activeKey","control.key"]},"target":"class"},{"kind":"attribute","name":"left","expression":"control.offset","expressionPlan":{"source":"control.offset","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"offset"},"dependencies":["control.offset"]},"target":"style"},{"kind":"attribute","name":"data-control-key","expression":"control.key","expressionPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"data-ui-guide","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"handle"},{"kind":"attribute","name":"data-ui-affordance","expression":"control.affordance","expressionPlan":{"source":"control.affordance","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"affordance"},"dependencies":["control.affordance"]}},{"kind":"attribute","name":"data-action","expression":"control.action","expressionPlan":{"source":"control.action","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"action"},"dependencies":["control.action"]}},{"kind":"attribute","name":"data-boundary-index","expression":"control.index","expressionPlan":{"source":"control.index","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"index"},"dependencies":["control.index"]}},{"kind":"attribute","name":"aria-label","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"plus"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"tooltip"},{"kind":"literal","name":"role","value":"tooltip"},{"kind":"directive","name":"value","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[]}]}],"flow":{"kind":"each","item":"control","list":"cols","listPlan":{"source":"cols","ast":{"kind":"id","name":"cols"},"dependencies":["cols"]},"key":"control.key","keyPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}}]},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"selector row"},{"kind":"attribute","name":"top","expression":"hovered.rowOffset","expressionPlan":{"source":"hovered.rowOffset","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowOffset"},"dependencies":["hovered.rowOffset"]},"target":"style"},{"kind":"literal","name":"data-action","value":"select-row"},{"kind":"attribute","name":"data-row-index","expression":"hovered.rowIndex","expressionPlan":{"source":"hovered.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowIndex"},"dependencies":["hovered.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"hovered.columnIndex","expressionPlan":{"source":"hovered.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnIndex"},"dependencies":["hovered.columnIndex"]}},{"kind":"literal","name":"title","value":"Select row"},{"kind":"literal","name":"aria-label","value":"Select row"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"glyph"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"grip-vertical"}],"children":[]}]}]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"selector column"},{"kind":"attribute","name":"left","expression":"hovered.columnOffset","expressionPlan":{"source":"hovered.columnOffset","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnOffset"},"dependencies":["hovered.columnOffset"]},"target":"style"},{"kind":"literal","name":"data-action","value":"select-column"},{"kind":"attribute","name":"data-row-index","expression":"hovered.rowIndex","expressionPlan":{"source":"hovered.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowIndex"},"dependencies":["hovered.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"hovered.columnIndex","expressionPlan":{"source":"hovered.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnIndex"},"dependencies":["hovered.columnIndex"]}},{"kind":"literal","name":"title","value":"Select column"},{"kind":"literal","name":"aria-label","value":"Select column"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"glyph"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"grip-horizontal"}],"children":[]}]}]}],"flow":{"kind":"if","test":"hovered","testPlan":{"source":"hovered","ast":{"kind":"id","name":"hovered"},"dependencies":["hovered"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"cell-menu"},{"kind":"attribute","name":"left","expression":"active.menuLeft","expressionPlan":{"source":"active.menuLeft","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"menuLeft"},"dependencies":["active.menuLeft"]},"target":"style"},{"kind":"attribute","name":"top","expression":"active.menuTop","expressionPlan":{"source":"active.menuTop","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"menuTop"},"dependencies":["active.menuTop"]},"target":"style"},{"kind":"literal","name":"data-action","value":"open-cell-menu"},{"kind":"attribute","name":"data-row-index","expression":"active.rowIndex","expressionPlan":{"source":"active.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"rowIndex"},"dependencies":["active.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"active.columnIndex","expressionPlan":{"source":"active.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"columnIndex"},"dependencies":["active.columnIndex"]}},{"kind":"literal","name":"title","value":"Cell actions"},{"kind":"literal","name":"aria-label","value":"Cell actions"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"chevron-down"}],"children":[]}],"flow":{"kind":"if","test":"active","testPlan":{"source":"active","ast":{"kind":"id","name":"active"},"dependencies":["active"]}}}]},"declarations":[{"kind":"state","name":"rows","type":"list(object({ key: string, index: integer, offset: string, affordance: insert-row | insert-column, action: add-row-before | add-row-after | add-column-before | add-column-after, label: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"cols","type":"list(object({ key: string, index: integer, offset: string, affordance: insert-row | insert-column, action: add-row-before | add-row-after | add-column-before | add-column-after, label: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"hovered","type":"object({ left: number, top: number, width: number, height: number, rowIndex: integer, columnIndex: integer, rowOffset: string, columnOffset: string }) | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"active","type":"object({ left: number, top: number, width: number, height: number, rowIndex: integer, columnIndex: integer, menuLeft: string, menuTop: string }) | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"activeKey","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: add-row-before | add-row-after | add-column-before | add-column-after, boundaryIndex: integer }) | object({ action: select-row | select-column, rowIndex: integer, columnIndex: integer }) | object({ action: open-cell-menu, 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:""};
|
|
7
7
|
|
|
8
8
|
export function createUiEditorTableOverlay(options = {}) {
|
|
9
9
|
const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
2
|
export interface UiEditorTableToolbarEventMap {
|
|
3
3
|
action: CustomEvent<{ readonly action: "align-left" | "align-center" | "align-right" | "background-none" | "background-gray" | "background-yellow" | "background-blue" | "background-green" | "background-red" | "add-row-before" | "add-row-after" | "add-column-before" | "add-column-after" | "clear-cells" | "merge-cells" | "split-cell" | "delete-row" | "delete-column" | "delete-table" }>;
|
|
4
4
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageComponentLifecycle } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
|
|
3
3
|
import * as controller from "../components/ui-editor-table-toolbar/ui-editor-table-toolbar.js";
|
|
4
4
|
import "../styles/ui-editor-table-toolbar.css";
|
|
5
5
|
|
|
6
|
-
const definition = {...{"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":[{"kind":"literal","name":"role","value":"toolbar"},{"kind":"literal","name":"aria-label","value":"Table actions"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell alignment"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"icon-button"},{"kind":"attribute","name":"active","expression":"item.active","expressionPlan":{"source":"item.active","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"active"},"dependencies":["item.active"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}},{"kind":"attribute","name":"aria-label","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}},{"kind":"attribute","name":"title","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}},{"kind":"attribute","name":"aria-pressed","expression":"item.active","expressionPlan":{"source":"item.active","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"active"},"dependencies":["item.active"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"alignments","listPlan":{"source":"alignments","ast":{"kind":"id","name":"alignments"},"dependencies":["alignments"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"if","test":"alignments","testPlan":{"source":"alignments","ast":{"kind":"id","name":"alignments"},"dependencies":["alignments"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[],"flow":{"kind":"if","test":"alignments and structure","testPlan":{"source":"alignments and structure","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"alignments"},"right":{"kind":"id","name":"structure"}},"dependencies":["alignments","structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Table structure"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"structure","listPlan":{"source":"structure","ast":{"kind":"id","name":"structure"},"dependencies":["structure"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"if","test":"structure","testPlan":{"source":"structure","ast":{"kind":"id","name":"structure"},"dependencies":["structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[],"flow":{"kind":"if","test":"(alignments or structure) and hasOverflow","testPlan":{"source":"(alignments or structure) and hasOverflow","ast":{"kind":"binary","op":"and","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"alignments"},"right":{"kind":"id","name":"structure"}},"right":{"kind":"id","name":"hasOverflow"}},"dependencies":["alignments","hasOverflow","structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"overflow"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"more"},{"kind":"literal","name":"data-action","value":"toggle-overflow"},{"kind":"literal","name":"aria-haspopup","value":"menu"},{"kind":"attribute","name":"aria-expanded","expression":"overflowOpen","expressionPlan":{"source":"overflowOpen","ast":{"kind":"id","name":"overflowOpen"},"dependencies":["overflowOpen"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"table"}],"children":[]},{"kind":"element","name":"span","attributes":[],"children":[{"kind":"text","value":"Table options"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"chevron"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"chevron-down"}],"children":[]}]}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu"},{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-label","value":"More table actions"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-heading"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"text","value":"Background"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"swatches"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell background"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"swatch-button"},{"kind":"attribute","name":"selected","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]},"target":"class"},{"kind":"literal","name":"role","value":"menuitemradio"},{"kind":"attribute","name":"aria-checked","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]}},{"kind":"attribute","name":"data-action","expression":"swatch.action","expressionPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch"},{"kind":"attribute","name":"default","expression":"not swatch.color","expressionPlan":{"source":"not swatch.color","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"}},"dependencies":["swatch.color"]},"target":"class"},{"kind":"attribute","name":"--ui-editor-table-toolbar-swatch","expression":"swatch.color","expressionPlan":{"source":"swatch.color","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"},"dependencies":["swatch.color"]},"target":"style"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"swatch.label","expressionPlan":{"source":"swatch.label","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"label"},"dependencies":["swatch.label"]}}],"children":[]}],"flow":{"kind":"each","item":"swatch","list":"swatches","listPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]},"key":"swatch.action","keyPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}}]}],"flow":{"kind":"if","test":"swatches","testPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-section divided"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-heading"},{"kind":"literal","name":"role","value":"presentation"},{"kind":"directive","name":"value","expression":"section.heading","expressionPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"menuitem"},{"kind":"attribute","name":"danger","expression":"item.danger","expressionPlan":{"source":"item.danger","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"danger"},"dependencies":["item.danger"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"section.items","listPlan":{"source":"section.items","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"items"},"dependencies":["section.items"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"each","item":"section","list":"sections","listPlan":{"source":"sections","ast":{"kind":"id","name":"sections"},"dependencies":["sections"]},"key":"section.heading","keyPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}}],"flow":{"kind":"if","test":"overflowOpen","testPlan":{"source":"overflowOpen","ast":{"kind":"id","name":"overflowOpen"},"dependencies":["overflowOpen"]}}}],"flow":{"kind":"if","test":"hasOverflow","testPlan":{"source":"hasOverflow","ast":{"kind":"id","name":"hasOverflow"},"dependencies":["hasOverflow"]}}}]},"declarations":[{"kind":"state","name":"alignments","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"structure","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"swatches","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"sections","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"hasOverflow","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"overflowOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: align-left | align-center | align-right | background-none | background-gray | background-yellow | background-blue | background-green | background-red | add-row-before | add-row-after | add-column-before | add-column-after | clear-cells | merge-cells | split-cell | delete-row | delete-column | delete-table })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
|
|
6
|
+
const definition = {...{"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":[{"kind":"literal","name":"role","value":"toolbar"},{"kind":"literal","name":"aria-label","value":"Table actions"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell alignment"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"icon-button"},{"kind":"attribute","name":"active","expression":"item.active","expressionPlan":{"source":"item.active","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"active"},"dependencies":["item.active"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}},{"kind":"attribute","name":"aria-label","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}},{"kind":"attribute","name":"title","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}},{"kind":"attribute","name":"aria-pressed","expression":"item.active","expressionPlan":{"source":"item.active","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"active"},"dependencies":["item.active"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"alignments","listPlan":{"source":"alignments","ast":{"kind":"id","name":"alignments"},"dependencies":["alignments"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"if","test":"alignments","testPlan":{"source":"alignments","ast":{"kind":"id","name":"alignments"},"dependencies":["alignments"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[],"flow":{"kind":"if","test":"alignments and structure","testPlan":{"source":"alignments and structure","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"alignments"},"right":{"kind":"id","name":"structure"}},"dependencies":["alignments","structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Table structure"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"structure","listPlan":{"source":"structure","ast":{"kind":"id","name":"structure"},"dependencies":["structure"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"if","test":"structure","testPlan":{"source":"structure","ast":{"kind":"id","name":"structure"},"dependencies":["structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[],"flow":{"kind":"if","test":"(alignments or structure) and hasOverflow","testPlan":{"source":"(alignments or structure) and hasOverflow","ast":{"kind":"binary","op":"and","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"alignments"},"right":{"kind":"id","name":"structure"}},"right":{"kind":"id","name":"hasOverflow"}},"dependencies":["alignments","hasOverflow","structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"overflow"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"more"},{"kind":"literal","name":"data-action","value":"toggle-overflow"},{"kind":"literal","name":"aria-haspopup","value":"menu"},{"kind":"attribute","name":"aria-expanded","expression":"overflowOpen","expressionPlan":{"source":"overflowOpen","ast":{"kind":"id","name":"overflowOpen"},"dependencies":["overflowOpen"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"table"}],"children":[]},{"kind":"element","name":"span","attributes":[],"children":[{"kind":"text","value":"Table options"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"chevron"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"chevron-down"}],"children":[]}]}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu"},{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-label","value":"More table actions"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-heading"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"text","value":"Background"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"swatches"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell background"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"swatch-button"},{"kind":"attribute","name":"selected","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]},"target":"class"},{"kind":"literal","name":"role","value":"menuitemradio"},{"kind":"attribute","name":"aria-checked","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]}},{"kind":"attribute","name":"data-action","expression":"swatch.action","expressionPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch"},{"kind":"attribute","name":"default","expression":"not swatch.color","expressionPlan":{"source":"not swatch.color","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"}},"dependencies":["swatch.color"]},"target":"class"},{"kind":"attribute","name":"--ui-editor-table-toolbar-swatch","expression":"swatch.color","expressionPlan":{"source":"swatch.color","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"},"dependencies":["swatch.color"]},"target":"style"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"swatch.label","expressionPlan":{"source":"swatch.label","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"label"},"dependencies":["swatch.label"]}}],"children":[]}],"flow":{"kind":"each","item":"swatch","list":"swatches","listPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]},"key":"swatch.action","keyPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}}]}],"flow":{"kind":"if","test":"swatches","testPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-section divided"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-heading"},{"kind":"literal","name":"role","value":"presentation"},{"kind":"directive","name":"value","expression":"section.heading","expressionPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"menuitem"},{"kind":"attribute","name":"danger","expression":"item.danger","expressionPlan":{"source":"item.danger","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"danger"},"dependencies":["item.danger"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"section.items","listPlan":{"source":"section.items","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"items"},"dependencies":["section.items"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"each","item":"section","list":"sections","listPlan":{"source":"sections","ast":{"kind":"id","name":"sections"},"dependencies":["sections"]},"key":"section.heading","keyPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}}],"flow":{"kind":"if","test":"overflowOpen","testPlan":{"source":"overflowOpen","ast":{"kind":"id","name":"overflowOpen"},"dependencies":["overflowOpen"]}}}],"flow":{"kind":"if","test":"hasOverflow","testPlan":{"source":"hasOverflow","ast":{"kind":"id","name":"hasOverflow"},"dependencies":["hasOverflow"]}}}]},"declarations":[{"kind":"state","name":"alignments","type":"list(object({ action: align-left | align-center | align-right, label: string, active: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"structure","type":"list(object({ action: add-row-after | add-column-after, label: string, icon: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"swatches","type":"list(object({ action: string, label: string, color: string, selected: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"sections","type":"list(object({ heading: string, items: list(object({ action: string, label: string, icon: string, danger: boolean })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"hasOverflow","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"overflowOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: align-left | align-center | align-right | background-none | background-gray | background-yellow | background-blue | background-green | background-red | add-row-before | add-row-after | add-column-before | add-column-after | clear-cells | merge-cells | split-cell | delete-row | delete-column | delete-table })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
|
|
7
7
|
|
|
8
8
|
export function createUiEditorTableToolbar(options = {}) {
|
|
9
9
|
const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageGeneratedProps } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageGeneratedProps } from "@nextwebwg/html-next/generated-runtime";
|
|
3
3
|
import "../styles/ui-editor-toolbar.css";
|
|
4
4
|
|
|
5
5
|
export function createUiEditorToolbar(options = {}) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
2
|
export interface UiFloatingActionButtonEventMap {
|
|
3
3
|
}
|
|
4
4
|
export interface UiFloatingActionButtonElement extends HTMLButtonElement {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageComponentLifecycle } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
|
|
3
3
|
import "../styles/ui-floating-action-button.css";
|
|
4
4
|
|
|
5
5
|
const definition = {...{"contract":{"tag":"ui-floating-action-button","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"default":""},"mobileOnly":{"type":"boolean","required":false,"target":{"attribute":"mobileonly"},"default":false}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"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:""};
|
package/vanilla/UiFormField.d.ts
CHANGED
package/vanilla/UiFormField.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageComponentLifecycle } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
|
|
3
3
|
import * as controller from "../components/ui-form-field/ui-form-field.js";
|
|
4
4
|
import "../styles/ui-form-field.css";
|
|
5
5
|
|
|
6
|
-
const definition = {...{"contract":{"tag":"ui-form-field","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"invalid"},"default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"default":false}}},"template":{"kind":"element","name":"div","attributes":[],"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:""};
|
|
6
|
+
const definition = {...{"contract":{"tag":"ui-form-field","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"invalid"},"default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"default":false}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot","fallback":[],"name":"label"}]},{"kind":"slot"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"help"}],"children":[{"kind":"slot","fallback":[],"name":"help"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"error"}],"children":[{"kind":"slot","fallback":[],"name":"error"}]}]},"declarations":[],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
|
|
7
7
|
|
|
8
8
|
export function createUiFormField(options = {}) {
|
|
9
9
|
const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
|
|
@@ -14,14 +14,17 @@ export function createUiFormField(options = {}) {
|
|
|
14
14
|
element.setAttribute(name, value === true ? "" : String(value));
|
|
15
15
|
}
|
|
16
16
|
element.setAttribute("data-component", "ui-form-field");
|
|
17
|
+
const element0 = document.createElement("div");
|
|
18
|
+
element0.setAttribute("class", "label");
|
|
17
19
|
if (slots["label"] ?? [].length > 0) {
|
|
18
20
|
for (const child of slots["label"] ?? []) {
|
|
19
21
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
20
22
|
projected.push([node, "label"]);
|
|
21
|
-
|
|
23
|
+
element0.append(node);
|
|
22
24
|
}
|
|
23
25
|
} else {
|
|
24
26
|
}
|
|
27
|
+
element.append(element0);
|
|
25
28
|
if (children.length > 0) {
|
|
26
29
|
for (const child of children) {
|
|
27
30
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
@@ -30,22 +33,28 @@ export function createUiFormField(options = {}) {
|
|
|
30
33
|
}
|
|
31
34
|
} else {
|
|
32
35
|
}
|
|
36
|
+
const element1 = document.createElement("div");
|
|
37
|
+
element1.setAttribute("class", "help");
|
|
33
38
|
if (slots["help"] ?? [].length > 0) {
|
|
34
39
|
for (const child of slots["help"] ?? []) {
|
|
35
40
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
36
41
|
projected.push([node, "help"]);
|
|
37
|
-
|
|
42
|
+
element1.append(node);
|
|
38
43
|
}
|
|
39
44
|
} else {
|
|
40
45
|
}
|
|
46
|
+
element.append(element1);
|
|
47
|
+
const element2 = document.createElement("div");
|
|
48
|
+
element2.setAttribute("class", "error");
|
|
41
49
|
if (slots["error"] ?? [].length > 0) {
|
|
42
50
|
for (const child of slots["error"] ?? []) {
|
|
43
51
|
const node = typeof child === "string" ? document.createTextNode(child) : child;
|
|
44
52
|
projected.push([node, "error"]);
|
|
45
|
-
|
|
53
|
+
element2.append(node);
|
|
46
54
|
}
|
|
47
55
|
} else {
|
|
48
56
|
}
|
|
57
|
+
element.append(element2);
|
|
49
58
|
manageComponentLifecycle(element, definition, { props: componentProps, projected,
|
|
50
59
|
controller,
|
|
51
60
|
});
|
package/vanilla/UiGrid.d.ts
CHANGED
package/vanilla/UiGrid.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageGeneratedProps } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageGeneratedProps } from "@nextwebwg/html-next/generated-runtime";
|
|
3
3
|
import "../styles/ui-grid.css";
|
|
4
4
|
|
|
5
5
|
export function createUiGrid(options = {}) {
|
package/vanilla/UiIcon.d.ts
CHANGED
package/vanilla/UiIcon.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageComponentLifecycle } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
|
|
3
3
|
import * as controller from "../components/ui-icon/ui-icon.js";
|
|
4
4
|
import "../styles/ui-icon.css";
|
|
5
5
|
|
|
6
|
-
const definition = {...{"contract":{"tag":"ui-icon","props":{"name":{"type":"string","required":false,"target":{"attribute":"name"},"default":""}}},"template":{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"svg","attributes":[{"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"},{"kind":"literal","name":"focusable","value":"false"}],"children":[{"kind":"element","name":"g","attributes":[],"children":[{"kind":"element","name":"path","attributes":[{"kind":"attribute","name":"d","expression":"shape.d","expressionPlan":{"source":"shape.d","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"d"},"dependencies":["shape.d"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'path'","testPlan":{"source":"shape.tag = 'path'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"path"}},"dependencies":["shape.tag"]}}},{"kind":"element","name":"circle","attributes":[{"kind":"attribute","name":"cx","expression":"shape.cx","expressionPlan":{"source":"shape.cx","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"cx"},"dependencies":["shape.cx"]}},{"kind":"attribute","name":"cy","expression":"shape.cy","expressionPlan":{"source":"shape.cy","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"cy"},"dependencies":["shape.cy"]}},{"kind":"attribute","name":"r","expression":"shape.r","expressionPlan":{"source":"shape.r","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"r"},"dependencies":["shape.r"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'circle'","testPlan":{"source":"shape.tag = 'circle'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"circle"}},"dependencies":["shape.tag"]}}},{"kind":"element","name":"rect","attributes":[{"kind":"attribute","name":"x","expression":"shape.x","expressionPlan":{"source":"shape.x","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"x"},"dependencies":["shape.x"]}},{"kind":"attribute","name":"y","expression":"shape.y","expressionPlan":{"source":"shape.y","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"y"},"dependencies":["shape.y"]}},{"kind":"attribute","name":"width","expression":"shape.width","expressionPlan":{"source":"shape.width","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"width"},"dependencies":["shape.width"]}},{"kind":"attribute","name":"height","expression":"shape.height","expressionPlan":{"source":"shape.height","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"height"},"dependencies":["shape.height"]}},{"kind":"attribute","name":"rx","expression":"shape.rx","expressionPlan":{"source":"shape.rx","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"rx"},"dependencies":["shape.rx"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'rect'","testPlan":{"source":"shape.tag = 'rect'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"rect"}},"dependencies":["shape.tag"]}}}],"flow":{"kind":"each","item":"shape","list":"shapes","listPlan":{"source":"shapes","ast":{"kind":"id","name":"shapes"},"dependencies":["shapes"]}}}]}]},"declarations":[{"kind":"state","name":"shapes","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}}],"root":{"kind":"native","element":"span","choices":["span"]}},source:{file:import.meta.url},css:""};
|
|
6
|
+
const definition = {...{"contract":{"tag":"ui-icon","props":{"name":{"type":"string","required":false,"target":{"attribute":"name"},"default":""}}},"template":{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"svg","attributes":[{"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"},{"kind":"literal","name":"focusable","value":"false"}],"children":[{"kind":"element","name":"g","attributes":[],"children":[{"kind":"element","name":"path","attributes":[{"kind":"attribute","name":"d","expression":"shape.d","expressionPlan":{"source":"shape.d","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"d"},"dependencies":["shape.d"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'path'","testPlan":{"source":"shape.tag = 'path'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"path"}},"dependencies":["shape.tag"]}}},{"kind":"element","name":"circle","attributes":[{"kind":"attribute","name":"cx","expression":"shape.cx","expressionPlan":{"source":"shape.cx","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"cx"},"dependencies":["shape.cx"]}},{"kind":"attribute","name":"cy","expression":"shape.cy","expressionPlan":{"source":"shape.cy","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"cy"},"dependencies":["shape.cy"]}},{"kind":"attribute","name":"r","expression":"shape.r","expressionPlan":{"source":"shape.r","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"r"},"dependencies":["shape.r"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'circle'","testPlan":{"source":"shape.tag = 'circle'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"circle"}},"dependencies":["shape.tag"]}}},{"kind":"element","name":"rect","attributes":[{"kind":"attribute","name":"x","expression":"shape.x","expressionPlan":{"source":"shape.x","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"x"},"dependencies":["shape.x"]}},{"kind":"attribute","name":"y","expression":"shape.y","expressionPlan":{"source":"shape.y","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"y"},"dependencies":["shape.y"]}},{"kind":"attribute","name":"width","expression":"shape.width","expressionPlan":{"source":"shape.width","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"width"},"dependencies":["shape.width"]}},{"kind":"attribute","name":"height","expression":"shape.height","expressionPlan":{"source":"shape.height","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"height"},"dependencies":["shape.height"]}},{"kind":"attribute","name":"rx","expression":"shape.rx","expressionPlan":{"source":"shape.rx","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"rx"},"dependencies":["shape.rx"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'rect'","testPlan":{"source":"shape.tag = 'rect'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"rect"}},"dependencies":["shape.tag"]}}}],"flow":{"kind":"each","item":"shape","list":"shapes","listPlan":{"source":"shapes","ast":{"kind":"id","name":"shapes"},"dependencies":["shapes"]}}}]}]},"declarations":[{"kind":"state","name":"shapes","type":"list(object({ tag: path | circle | rect, d?: string, cx?: string, cy?: string, r?: string, x?: string, y?: string, width?: string, height?: string, rx?: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}}],"root":{"kind":"native","element":"span","choices":["span"]}},source:{file:import.meta.url},css:""};
|
|
7
7
|
|
|
8
8
|
export function createUiIcon(options = {}) {
|
|
9
9
|
const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
|
package/vanilla/UiIconButton.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// Generated by HTML Next 1.0.0-alpha.
|
|
2
|
-
import { manageComponentLifecycle } from "@nextwebwg/
|
|
1
|
+
// Generated by HTML Next 1.0.0-alpha.2 for Vanilla DOM. Do not edit.
|
|
2
|
+
import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
|
|
3
3
|
import * as controller from "../components/ui-icon-button/ui-icon-button.js";
|
|
4
4
|
import "../styles/ui-icon-button.css";
|
|
5
5
|
|