@lavalogic/scoria 0.40.31 → 0.40.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (137) hide show
  1. package/README.md +58 -58
  2. package/dist/Components/AccordionGroup.svelte +28 -28
  3. package/dist/Components/AccordionGroupButton.svelte +60 -60
  4. package/dist/Components/Action.svelte +48 -48
  5. package/dist/Components/AlertModal.svelte +102 -102
  6. package/dist/Components/Base/ContextWrapper.svelte +45 -45
  7. package/dist/Components/Base/Pagination.svelte +135 -135
  8. package/dist/Components/Base/Snippets.svelte +25 -25
  9. package/dist/Components/BigRadioSet.svelte +34 -34
  10. package/dist/Components/Bubble.svelte +38 -38
  11. package/dist/Components/Button.svelte +83 -83
  12. package/dist/Components/Checkbox.svelte +71 -71
  13. package/dist/Components/CollapsibleCard.svelte +59 -59
  14. package/dist/Components/CollapsibleMenuGroup.svelte +43 -43
  15. package/dist/Components/ConditionBuilder/ConditionBuilder.svelte +101 -101
  16. package/dist/Components/Contexts/ContextMenu.svelte +76 -76
  17. package/dist/Components/Contexts/ContextMenuDivider.svelte +15 -15
  18. package/dist/Components/Contexts/ContextMenuOption.svelte +38 -38
  19. package/dist/Components/Contexts/Toast.svelte +71 -71
  20. package/dist/Components/Contexts/ToastContainer.svelte +34 -34
  21. package/dist/Components/Contexts/Tooltip.svelte +32 -32
  22. package/dist/Components/DataMatrixIcon.svelte +37 -37
  23. package/dist/Components/DateInput.svelte +80 -80
  24. package/dist/Components/DatePicker.svelte +86 -86
  25. package/dist/Components/DesktopModal.svelte +65 -65
  26. package/dist/Components/Dial.svelte +35 -35
  27. package/dist/Components/DimensionInput.svelte +95 -95
  28. package/dist/Components/DragMenu/DragMenuHolder.svelte +53 -53
  29. package/dist/Components/DragMenu/DraggableCard.svelte +49 -49
  30. package/dist/Components/FileCard.svelte +18 -18
  31. package/dist/Components/FileUpload.svelte +115 -115
  32. package/dist/Components/GridInput.svelte +123 -123
  33. package/dist/Components/GridInputSet.svelte +21 -21
  34. package/dist/Components/HorizontalTabGroup.svelte +54 -54
  35. package/dist/Components/HorizontalTabGroupButton.svelte +32 -32
  36. package/dist/Components/Icon.svelte +68 -68
  37. package/dist/Components/Icons.d.ts +3 -3
  38. package/dist/Components/Icons.js +11 -11
  39. package/dist/Components/InfoAlert.svelte +32 -32
  40. package/dist/Components/LoadingAnimation.svelte +228 -227
  41. package/dist/Components/LoadingModal.svelte +19 -19
  42. package/dist/Components/LoadingOverlay.svelte +20 -20
  43. package/dist/Components/Modal.svelte +127 -127
  44. package/dist/Components/MultiSelect.svelte +126 -126
  45. package/dist/Components/Nav/Nav.svelte +71 -71
  46. package/dist/Components/Nav/NavServiceMenuList.svelte +37 -37
  47. package/dist/Components/Nav/NavTab.svelte +46 -46
  48. package/dist/Components/Nav/ServiceMenuItem.svelte +62 -62
  49. package/dist/Components/Nav/ServicesNav.svelte +50 -50
  50. package/dist/Components/NumberInput.svelte +98 -98
  51. package/dist/Components/OptionCards.svelte +58 -58
  52. package/dist/Components/PageHeading.svelte +21 -21
  53. package/dist/Components/PasswordInput.svelte +61 -61
  54. package/dist/Components/PopoverButton.svelte +53 -53
  55. package/dist/Components/Portal.svelte +7 -7
  56. package/dist/Components/ProgressBubble.svelte +42 -42
  57. package/dist/Components/QuerySelect.svelte +102 -102
  58. package/dist/Components/ResourceCalendar/ResourceCalendar.svelte +241 -241
  59. package/dist/Components/SidebarPanel.svelte +32 -32
  60. package/dist/Components/SingleSelect.svelte +122 -122
  61. package/dist/Components/StepButton.svelte +48 -48
  62. package/dist/Components/StepForm.svelte +58 -58
  63. package/dist/Components/Switch.svelte +43 -43
  64. package/dist/Components/Table/ARCHITECTURE.md +298 -298
  65. package/dist/Components/Table/Body/Rows/ColumnHighlight.svelte +30 -30
  66. package/dist/Components/Table/Body/Rows/ColumnList.svelte +24 -24
  67. package/dist/Components/Table/Body/Rows/ColumnListRow.svelte +165 -165
  68. package/dist/Components/Table/Body/Rows/Columns/AccessorComponent.svelte +13 -13
  69. package/dist/Components/Table/Body/Rows/Columns/ActionsCell.svelte +120 -120
  70. package/dist/Components/Table/Body/Rows/Columns/BubbleCell.svelte +81 -81
  71. package/dist/Components/Table/Body/Rows/Columns/ExpandCell.svelte +92 -92
  72. package/dist/Components/Table/Body/Rows/Columns/FocusableImmutableCell.svelte +110 -110
  73. package/dist/Components/Table/Body/Rows/Columns/ProgressCell.svelte +54 -54
  74. package/dist/Components/Table/Body/Rows/Columns/TableAction.svelte +35 -35
  75. package/dist/Components/Table/Body/Rows/Columns/TableCheckbox.svelte +64 -64
  76. package/dist/Components/Table/Body/Rows/Columns/TableColumn.svelte +82 -82
  77. package/dist/Components/Table/Body/Rows/Columns/TableDatePicker.svelte +88 -88
  78. package/dist/Components/Table/Body/Rows/Columns/TableNumberInput.svelte +90 -90
  79. package/dist/Components/Table/Body/Rows/Columns/TableQuerySelect.svelte +96 -96
  80. package/dist/Components/Table/Body/Rows/Columns/TableRowSelectionCheckbox.svelte +71 -71
  81. package/dist/Components/Table/Body/Rows/Columns/TableSelect.svelte +124 -124
  82. package/dist/Components/Table/Body/Rows/Columns/TableTextInput.svelte +91 -91
  83. package/dist/Components/Table/Body/Rows/Columns/ValidityCell.svelte +88 -88
  84. package/dist/Components/Table/Body/Rows/TableRow.svelte +127 -127
  85. package/dist/Components/Table/Body/TableBody.svelte +92 -92
  86. package/dist/Components/Table/Headers/HighlightAllHeader.svelte +25 -25
  87. package/dist/Components/Table/Headers/SelectAllHeader.svelte +20 -20
  88. package/dist/Components/Table/Headers/TableHead.svelte +175 -175
  89. package/dist/Components/Table/Misc/ColumnPanel.svelte +32 -32
  90. package/dist/Components/Table/Misc/ColumnPanelModal.svelte +29 -29
  91. package/dist/Components/Table/Misc/FilterInput.svelte +326 -326
  92. package/dist/Components/Table/Misc/FilterPanel.svelte +79 -79
  93. package/dist/Components/Table/Misc/FilterPanelModal.svelte +21 -21
  94. package/dist/Components/Table/Misc/ShareViewModal.svelte +118 -118
  95. package/dist/Components/Table/Misc/SidePanel.svelte +24 -24
  96. package/dist/Components/Table/Misc/TableConfigurationModal.svelte +318 -318
  97. package/dist/Components/Table/Misc/TableFooter.svelte +201 -201
  98. package/dist/Components/Table/Misc/TableHorizontalBar.svelte +112 -112
  99. package/dist/Components/Table/Misc/TableSidebar.svelte +116 -116
  100. package/dist/Components/Table/Misc/TableViewDropdown.svelte +25 -25
  101. package/dist/Components/Table/Misc/ToolboxPanel.svelte +60 -60
  102. package/dist/Components/Table/Misc/ToolboxPanelModal.svelte +63 -63
  103. package/dist/Components/Table/Misc/UpdateViewOptionsModal.svelte +101 -101
  104. package/dist/Components/Table/NestedTable.svelte +29 -29
  105. package/dist/Components/Table/Table.svelte +140 -140
  106. package/dist/Components/Test/TestContextConsumer.svelte +8 -8
  107. package/dist/Components/TextArea.svelte +92 -90
  108. package/dist/Components/TextInput.svelte +128 -117
  109. package/dist/Components/ThreeStateRadio.svelte +101 -101
  110. package/dist/Components/Touch/BoolCard.svelte +27 -27
  111. package/dist/Components/Touch/DateModal.svelte +98 -98
  112. package/dist/Components/Touch/EditCard.svelte +44 -44
  113. package/dist/Components/Touch/InfoCard.svelte +25 -25
  114. package/dist/Components/Touch/InfoTextCard.svelte +22 -22
  115. package/dist/Components/Touch/ModalExplanation.svelte +13 -13
  116. package/dist/Components/Touch/NumberKeyboard.svelte +81 -81
  117. package/dist/Components/Touch/NumberModal.svelte +49 -49
  118. package/dist/Components/Touch/PlusMinusCard.svelte +40 -40
  119. package/dist/Components/Touch/SelectModal.svelte +86 -86
  120. package/dist/Components/Touch/SummaryCard.svelte +74 -74
  121. package/dist/Components/Touch/TextAreaModal.svelte +53 -53
  122. package/dist/Components/Touch/TextModal.svelte +56 -56
  123. package/dist/Components/Touch/TouchCard.svelte +28 -28
  124. package/dist/Components/Touch/TouchModal.svelte +141 -141
  125. package/dist/Components/Touch/UtilityButton.svelte +63 -63
  126. package/dist/Components/VerticalTabGroup.svelte +38 -38
  127. package/dist/Components/VerticalTabGroupButton.svelte +46 -46
  128. package/dist/Helpers/Datamatrix.d.ts +19 -19
  129. package/dist/Helpers/Datamatrix.js +291 -291
  130. package/dist/Types/Examples/ExampleModal.svelte +27 -27
  131. package/dist/paraglide/README.md +1 -1
  132. package/dist/scss/_basics.scss +12 -12
  133. package/dist/scss/_colours.scss +140 -140
  134. package/dist/scss/_motion.scss +57 -57
  135. package/dist/scss/_sizing.scss +85 -85
  136. package/dist/scss/_transitions.scss +8 -8
  137. package/package.json +1 -1
@@ -1,38 +1,38 @@
1
- <svelte:options runes />
2
-
3
- <!--
4
- @component
5
- Application-level wrapper that mounts the global context hosts and
6
- instantiates the contexts they depend on. Mount it once near the root
7
- of a SvelteKit app, in `+layout.svelte` or `+page.svelte`, so that
8
- every descendant can read the contexts via `getContext`.
9
-
10
- ### Hosts mounted
11
-
12
- | Host | Driving context | Notes |
13
- | ---------------- | ---------------------- | -------------------------------------------------- |
14
- | `ContextMenu` | `ContextMenuContext` | Right-click / programmatic menus. |
15
- | `Tooltip` | `TooltipContext` | Hover tooltips driven by Button / Action. |
16
- | `ToastContainer` | `ToastContext` | Queue of toast notifications. |
17
- | `AlertModal` | `AlertContext` | Mounts only when `alertContext.showModal` is true. |
18
-
19
- `UntypedInputContext` is registered alongside the visual hosts. The
20
- wrapper installs a `svelte:window onkeydown` listener that forwards
21
- key events to `untypedListenerContext.handleGlobalKeydown` so barcode
22
- scanners and similar untyped input sources reach the context queue.
23
-
24
- ### Usage
25
-
26
- ```svelte
27
- <script lang="ts">
28
- import { ContextWrapper } from '@lavalogic/scoria';
29
- </script>
30
-
31
- <ContextWrapper>
32
- {@render children()}
33
- </ContextWrapper>
34
- ```
35
- -->
1
+ <svelte:options runes />
2
+
3
+ <!--
4
+ @component
5
+ Application-level wrapper that mounts the global context hosts and
6
+ instantiates the contexts they depend on. Mount it once near the root
7
+ of a SvelteKit app, in `+layout.svelte` or `+page.svelte`, so that
8
+ every descendant can read the contexts via `getContext`.
9
+
10
+ ### Hosts mounted
11
+
12
+ | Host | Driving context | Notes |
13
+ | ---------------- | ---------------------- | -------------------------------------------------- |
14
+ | `ContextMenu` | `ContextMenuContext` | Right-click / programmatic menus. |
15
+ | `Tooltip` | `TooltipContext` | Hover tooltips driven by Button / Action. |
16
+ | `ToastContainer` | `ToastContext` | Queue of toast notifications. |
17
+ | `AlertModal` | `AlertContext` | Mounts only when `alertContext.showModal` is true. |
18
+
19
+ `UntypedInputContext` is registered alongside the visual hosts. The
20
+ wrapper installs a `svelte:window onkeydown` listener that forwards
21
+ key events to `untypedListenerContext.handleGlobalKeydown` so barcode
22
+ scanners and similar untyped input sources reach the context queue.
23
+
24
+ ### Usage
25
+
26
+ ```svelte
27
+ <script lang="ts">
28
+ import { ContextWrapper } from '@lavalogic/scoria';
29
+ </script>
30
+
31
+ <ContextWrapper>
32
+ {@render children()}
33
+ </ContextWrapper>
34
+ ```
35
+ -->
36
36
  <script lang="ts">import { AlertContext } from "../../Contexts/AlertContext.svelte.js";
37
37
  import { ContextMenuContext } from "../../Contexts/ContextMenuContext.svelte.js";
38
38
  import { ToastContext } from "../../Contexts/ToastContext.svelte.js";
@@ -55,13 +55,13 @@ setContext(AlertContext.identifier, alertContext);
55
55
  // svelte-ignore state_referenced_locally
56
56
  const untypedListenerContext = new UntypedInputContext(debug);
57
57
  setContext(UntypedInputContext.identifier, untypedListenerContext);
58
- </script>
59
-
60
- <ContextMenu />
61
- <Tooltip />
62
- <ToastContainer />
63
- {#if alertContext.showModal}
64
- <AlertModal />
65
- {/if}
66
- <svelte:window onkeydown={untypedListenerContext.handleGlobalKeydown} />
67
- {@render children()}
58
+ </script>
59
+
60
+ <ContextMenu />
61
+ <Tooltip />
62
+ <ToastContainer />
63
+ {#if alertContext.showModal}
64
+ <AlertModal />
65
+ {/if}
66
+ <svelte:window onkeydown={untypedListenerContext.handleGlobalKeydown} />
67
+ {@render children()}
@@ -1,27 +1,27 @@
1
- <svelte:options runes />
2
-
3
- <!--
4
- @component
5
- Generic local-collection paginator. Renders a window of items via a
6
- `snippet` plus a control bar with page-number buttons, a jump-to-page
7
- input, and previous/next buttons. The component is generic over
8
- `T extends object` with a `key: keyof T` used as the
9
- `{#each}` key inside the rendered page.
10
-
11
- ### Usage
12
-
13
- ```svelte
14
- <Pagination snippet={itemSnippet} pageSize={20} items={dataWrapper.value} key="id" />
15
- ```
16
-
17
- The `pageButtons` window (up to five numbered buttons) is recomputed
18
- via `$derived`, not via an `$effect`, so the page bar diffs in a
19
- single reactive pass and the keyed `{#each pageButtons as page ...}`
20
- preserves button identity across page changes.
21
- -->
22
- <script
23
- lang="ts"
24
- generics="T extends object"
1
+ <svelte:options runes />
2
+
3
+ <!--
4
+ @component
5
+ Generic local-collection paginator. Renders a window of items via a
6
+ `snippet` plus a control bar with page-number buttons, a jump-to-page
7
+ input, and previous/next buttons. The component is generic over
8
+ `T extends object` with a `key: keyof T` used as the
9
+ `{#each}` key inside the rendered page.
10
+
11
+ ### Usage
12
+
13
+ ```svelte
14
+ <Pagination snippet={itemSnippet} pageSize={20} items={dataWrapper.value} key="id" />
15
+ ```
16
+
17
+ The `pageButtons` window (up to five numbered buttons) is recomputed
18
+ via `$derived`, not via an `$effect`, so the page bar diffs in a
19
+ single reactive pass and the keyed `{#each pageButtons as page ...}`
20
+ preserves button identity across page changes.
21
+ -->
22
+ <script
23
+ lang="ts"
24
+ generics="T extends object"
25
25
  >import { m as i18n } from "../../paraglide/messages.js";
26
26
  import { autoPluralise, generateWeakId } from "../../Helpers/Helpers.svelte.js";
27
27
  import { Colour } from "../../scss/colours.js";
@@ -70,116 +70,116 @@ function getPageWindow(currentIndex, totalPages, windowSize) {
70
70
  return out;
71
71
  }
72
72
  const pageButtons = $derived(getPageWindow(pageIndex, lastPage, 5));
73
- </script>
74
-
75
- <div
76
- class="wrapper"
77
- class:border
78
- style:padding
79
- style:gap
80
- style:height
81
- >
82
- {#each pageItems as item, index (item[key])}
83
- {@render snippet(item, index)}
84
- {/each}
85
- <div class="spread_row bottom_row">
86
- <div class="block">
87
- <span
88
- >{countLabel
89
- ? countLabel(items.length)
90
- : i18n['scoria.text.item_count']({
91
- count: items.length,
92
- noun: autoPluralise(itemName, items.length),
93
- })}</span
94
- >
95
- </div>
96
-
97
- <div class="block records-per-page">
98
- <span>{i18n['scoria.label.records_per_page']()} {pageSize}</span>
99
- </div>
100
-
101
- <div class="spacer"></div>
102
-
103
- <div
104
- class="scrollable"
105
- role="navigation"
106
- aria-label={i18n['scoria.label.pagination']()}
107
- >
108
- <div class="block">
109
- <Icon
110
- name="paper"
111
- colour={Colour['$ui-blue-6']}
112
- />
113
- <span>{i18n['scoria.text.page_count']({ count: lastPage })}</span>
114
- </div>
115
-
116
- <div class="block">
117
- <label for="{_uuid}-jump-to-page"
118
- ><Icon
119
- name="arrow-move-horizontal"
120
- colour={Colour['$ui-blue-6']}
121
- /></label
122
- >
123
-
124
- <label for="{_uuid}-jump-to-page">{i18n['scoria.label.jump_to_page']()}</label>
125
-
126
- <NumberInput
127
- id="{_uuid}-jump-to-page"
128
- value={pageValue}
129
- oninput={onNumberInput}
130
- />
131
- </div>
132
-
133
- <div class="block nopad page-arrow">
134
- <Button
135
- variant={Variant.Toolbar}
136
- disabled={pageIndex === 0}
137
- side={Side.Bottom}
138
- onclick={() => {
139
- pageIndex = Math.max(pageIndex - 1, 0);
140
- }}
141
- size={Size.FillHeight}
142
- iconLeft={{
143
- name: 'left-close',
144
- size: Size.FillHeight,
145
- }}>{i18n['scoria.action.previous_page']()}</Button
146
- >
147
- </div>
148
-
149
- {#each pageButtons as pageNumber (pageNumber)}
150
- <div class="block nopad">
151
- <Button
152
- variant={Variant.Toolbar}
153
- side={Side.Bottom}
154
- size={Size.FillHeight}
155
- toggled={pageIndex + 1 === pageNumber}
156
- label={i18n['scoria.action.go_to_page']({ number: pageNumber })}
157
- onclick={() => {
158
- pageIndex = pageNumber - 1;
159
- }}>{pageNumber}</Button
160
- >
161
- </div>
162
- {/each}
163
-
164
- <div class="block nopad page-arrow">
165
- <Button
166
- variant={Variant.Toolbar}
167
- side={Side.Bottom}
168
- size={Size.FillHeight}
169
- onclick={() => {
170
- pageIndex = Math.min(pageIndex + 1, lastPageIndex);
171
- }}
172
- disabled={pageIndex == lastPageIndex}
173
- iconRight={{
174
- name: 'right-close',
175
- size: Size.FillHeight,
176
- }}>{i18n['scoria.action.next_page']()}</Button
177
- >
178
- </div>
179
- </div>
180
- </div>
181
- </div>
182
-
73
+ </script>
74
+
75
+ <div
76
+ class="wrapper"
77
+ class:border
78
+ style:padding
79
+ style:gap
80
+ style:height
81
+ >
82
+ {#each pageItems as item, index (item[key])}
83
+ {@render snippet(item, index)}
84
+ {/each}
85
+ <div class="spread_row bottom_row">
86
+ <div class="block">
87
+ <span
88
+ >{countLabel
89
+ ? countLabel(items.length)
90
+ : i18n['scoria.text.item_count']({
91
+ count: items.length,
92
+ noun: autoPluralise(itemName, items.length),
93
+ })}</span
94
+ >
95
+ </div>
96
+
97
+ <div class="block records-per-page">
98
+ <span>{i18n['scoria.label.records_per_page']()} {pageSize}</span>
99
+ </div>
100
+
101
+ <div class="spacer"></div>
102
+
103
+ <div
104
+ class="scrollable"
105
+ role="navigation"
106
+ aria-label={i18n['scoria.label.pagination']()}
107
+ >
108
+ <div class="block">
109
+ <Icon
110
+ name="paper"
111
+ colour={Colour['$ui-blue-6']}
112
+ />
113
+ <span>{i18n['scoria.text.page_count']({ count: lastPage })}</span>
114
+ </div>
115
+
116
+ <div class="block">
117
+ <label for="{_uuid}-jump-to-page"
118
+ ><Icon
119
+ name="arrow-move-horizontal"
120
+ colour={Colour['$ui-blue-6']}
121
+ /></label
122
+ >
123
+
124
+ <label for="{_uuid}-jump-to-page">{i18n['scoria.label.jump_to_page']()}</label>
125
+
126
+ <NumberInput
127
+ id="{_uuid}-jump-to-page"
128
+ value={pageValue}
129
+ oninput={onNumberInput}
130
+ />
131
+ </div>
132
+
133
+ <div class="block nopad page-arrow">
134
+ <Button
135
+ variant={Variant.Toolbar}
136
+ disabled={pageIndex === 0}
137
+ side={Side.Bottom}
138
+ onclick={() => {
139
+ pageIndex = Math.max(pageIndex - 1, 0);
140
+ }}
141
+ size={Size.FillHeight}
142
+ iconLeft={{
143
+ name: 'left-close',
144
+ size: Size.FillHeight,
145
+ }}>{i18n['scoria.action.previous_page']()}</Button
146
+ >
147
+ </div>
148
+
149
+ {#each pageButtons as pageNumber (pageNumber)}
150
+ <div class="block nopad">
151
+ <Button
152
+ variant={Variant.Toolbar}
153
+ side={Side.Bottom}
154
+ size={Size.FillHeight}
155
+ toggled={pageIndex + 1 === pageNumber}
156
+ label={i18n['scoria.action.go_to_page']({ number: pageNumber })}
157
+ onclick={() => {
158
+ pageIndex = pageNumber - 1;
159
+ }}>{pageNumber}</Button
160
+ >
161
+ </div>
162
+ {/each}
163
+
164
+ <div class="block nopad page-arrow">
165
+ <Button
166
+ variant={Variant.Toolbar}
167
+ side={Side.Bottom}
168
+ size={Size.FillHeight}
169
+ onclick={() => {
170
+ pageIndex = Math.min(pageIndex + 1, lastPageIndex);
171
+ }}
172
+ disabled={pageIndex == lastPageIndex}
173
+ iconRight={{
174
+ name: 'right-close',
175
+ size: Size.FillHeight,
176
+ }}>{i18n['scoria.action.next_page']()}</Button
177
+ >
178
+ </div>
179
+ </div>
180
+ </div>
181
+ </div>
182
+
183
183
  <style>.wrapper {
184
184
  display: flex;
185
185
  flex: 1;
@@ -254,4 +254,4 @@ const pageButtons = $derived(getPageWindow(pageIndex, lastPage, 5));
254
254
  }
255
255
  .spread_row .spacer {
256
256
  flex-grow: 2;
257
- }</style>
257
+ }</style>
@@ -1,13 +1,13 @@
1
- <svelte:options runes />
2
-
3
- <!-- @component
4
- An empty component that only exists to export common snippets
5
- (`pending` and `failed`) for re-use by `{#await}` blocks and other
6
- async-status surfaces. The component itself renders nothing.
7
- -->
8
- <script
9
- lang="ts"
10
- module
1
+ <svelte:options runes />
2
+
3
+ <!-- @component
4
+ An empty component that only exists to export common snippets
5
+ (`pending` and `failed`) for re-use by `{#await}` blocks and other
6
+ async-status surfaces. The component itself renders nothing.
7
+ -->
8
+ <script
9
+ lang="ts"
10
+ module
11
11
  >import { getErrorMessage, loadingText } from "../../Helpers/Helpers.svelte.js";
12
12
  import Button from "../Button.svelte";
13
13
  import { m as i18n } from "../../paraglide/messages.js";
@@ -18,18 +18,18 @@ import { m as i18n } from "../../paraglide/messages.js";
18
18
  // declaration and expose the un-prefixed name as the public surface.
19
19
  export const pending = _pending;
20
20
  export const failed = _failed;
21
- </script>
22
-
23
- {#snippet _pending()}
24
- {loadingText()}
25
- {/snippet}
26
- {#snippet _failed(e: unknown, retry?: () => void)}
27
- {i18n['scoria.text.error_prefix']({ message: getErrorMessage(e) })}
28
- {#if retry}
29
- <Button
30
- onclick={() => {
31
- retry();
32
- }}>{i18n['scoria.action.retry_load']()}</Button
33
- >
34
- {/if}
35
- {/snippet}
21
+ </script>
22
+
23
+ {#snippet _pending()}
24
+ {loadingText()}
25
+ {/snippet}
26
+ {#snippet _failed(e: unknown, retry?: () => void)}
27
+ {i18n['scoria.text.error_prefix']({ message: getErrorMessage(e) })}
28
+ {#if retry}
29
+ <Button
30
+ onclick={() => {
31
+ retry();
32
+ }}>{i18n['scoria.action.retry_load']()}</Button
33
+ >
34
+ {/if}
35
+ {/snippet}
@@ -1,38 +1,38 @@
1
- <svelte:options runes />
2
-
3
- <script
4
- lang="ts"
5
- generics="T"
1
+ <svelte:options runes />
2
+
3
+ <script
4
+ lang="ts"
5
+ generics="T"
6
6
  >let { name, options, selected = $bindable(), onchange } = $props();
7
7
  export {};
8
- </script>
9
-
10
- <div
11
- class="wrapper"
12
- role="radiogroup"
13
- >
14
- {#each options as option (option.value)}
15
- <!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
16
- {@render radio(option)}
17
- {/each}
18
- </div>
19
-
20
- {#snippet radio(option: BigRadioOption<T>)}
21
- <label class:selected={selected === option.value}>
22
- <input
23
- type="radio"
24
- {name}
25
- bind:group={selected}
26
- value={option.value}
27
- onchange={() => void onchange?.(option.value)}
28
- />
29
- <div class="text">
30
- <h5 class="title">{option.label}</h5>
31
- <p class="note">{option.info}</p>
32
- </div>
33
- </label>
34
- {/snippet}
35
-
8
+ </script>
9
+
10
+ <div
11
+ class="wrapper"
12
+ role="radiogroup"
13
+ >
14
+ {#each options as option (option.value)}
15
+ <!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
16
+ {@render radio(option)}
17
+ {/each}
18
+ </div>
19
+
20
+ {#snippet radio(option: BigRadioOption<T>)}
21
+ <label class:selected={selected === option.value}>
22
+ <input
23
+ type="radio"
24
+ {name}
25
+ bind:group={selected}
26
+ value={option.value}
27
+ onchange={() => void onchange?.(option.value)}
28
+ />
29
+ <div class="text">
30
+ <h5 class="title">{option.label}</h5>
31
+ <p class="note">{option.info}</p>
32
+ </div>
33
+ </label>
34
+ {/snippet}
35
+
36
36
  <style>.wrapper {
37
37
  display: flex;
38
38
  flex-flow: row wrap;
@@ -85,4 +85,4 @@ label.selected {
85
85
  }
86
86
  label.selected h5 {
87
87
  color: #ffffff;
88
- }</style>
88
+ }</style>
@@ -1,8 +1,8 @@
1
- <svelte:options runes />
2
-
3
- <script
4
- lang="ts"
5
- module
1
+ <svelte:options runes />
2
+
3
+ <script
4
+ lang="ts"
5
+ module
6
6
  >import { Size } from "../Types/Internal/Size.js";
7
7
  import Icon from "./Icon.svelte";
8
8
  // Per-size padding/typography. Only `Size.Large` has explicit overrides;
@@ -18,11 +18,11 @@ const DEFAULT_VERTICAL = "0.18rem";
18
18
  const DEFAULT_HORIZONTAL_WITH_VALUE = "0.5rem";
19
19
  const DEFAULT_HORIZONTAL_WITHOUT_VALUE = "0.75rem";
20
20
  const DEFAULT_FONT_SIZE = "1rem";
21
- </script>
22
-
23
- <script
24
- lang="ts"
25
- generics="T = unknown"
21
+ </script>
22
+
23
+ <script
24
+ lang="ts"
25
+ generics="T = unknown"
26
26
  >// `BubbleProps<T>` is intentionally annotated with `<T>` even though
27
27
  // the interface declares `T = unknown` as a default; the explicit
28
28
  // substitution flows the generic from `<Bubble<MyType> ...>` consumers
@@ -48,33 +48,33 @@ const wrapperStyle = $derived.by(() => {
48
48
  const radiusPart = isLarge ? `border-radius: ${LARGE_BORDER_RADIUS};` : "";
49
49
  return `${colourPart} padding: var(--bubble-padding, ${verticalPadding} ${horizontalPadding}); font-size: ${fontSize}; ${radiusPart}`;
50
50
  });
51
- </script>
52
-
53
- {#if onclick}
54
- <button
55
- class="contents"
56
- {onclick}
57
- >
58
- <!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
59
- {@render bubble()}
60
- </button>
61
- {:else}
62
- <!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
63
- {@render bubble()}
64
- {/if}
65
-
66
- {#snippet bubble()}
67
- <span
68
- class="bubble"
69
- class:bold
70
- class:hoverable={!!onclick}
71
- style={wrapperStyle}
72
- >{#if label}{label}:&nbsp;{/if}{displayLabel}{#if icon}<div class="icon">
73
- <Icon {...icon} />
74
- </div>{/if}</span
75
- >
76
- {/snippet}
77
-
51
+ </script>
52
+
53
+ {#if onclick}
54
+ <button
55
+ class="contents"
56
+ {onclick}
57
+ >
58
+ <!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
59
+ {@render bubble()}
60
+ </button>
61
+ {:else}
62
+ <!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
63
+ {@render bubble()}
64
+ {/if}
65
+
66
+ {#snippet bubble()}
67
+ <span
68
+ class="bubble"
69
+ class:bold
70
+ class:hoverable={!!onclick}
71
+ style={wrapperStyle}
72
+ >{#if label}{label}:&nbsp;{/if}{displayLabel}{#if icon}<div class="icon">
73
+ <Icon {...icon} />
74
+ </div>{/if}</span
75
+ >
76
+ {/snippet}
77
+
78
78
  <style>button.contents {
79
79
  display: contents;
80
80
  cursor: pointer;
@@ -105,4 +105,4 @@ const wrapperStyle = $derived.by(() => {
105
105
  }
106
106
  .bubble.bold {
107
107
  font-weight: 700;
108
- }</style>
108
+ }</style>