@streamscloud/kit 0.38.0 → 0.38.2

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.
@@ -40,7 +40,6 @@ layout's concern. User-facing copy (placeholder, Generate label) is consumer-sup
40
40
  | `--sc-kit--ai-panel--gap` | Gap between sections | `16px` |
41
41
  | `--sc-kit--ai-panel--padding` | Panel padding | `16px` |
42
42
  | `--sc-kit--ai-panel--background` | Panel background | `--sc-kit--color--bg--panel` |
43
- | `--sc-kit--ai-panel--border-color` | Left divider color | `--sc-kit--color--border` |
44
43
  | `--sc-kit--ai-panel--surface` | Body / composer / tab-tray fill | `--sc-kit--color--bg--app` |
45
44
  | `--sc-kit--ai-panel--surface-radius` | Body / composer corner radius | `--sc-kit--radius--md` |
46
45
  -->
@@ -50,7 +49,6 @@ layout's concern. User-facing copy (placeholder, Generate label) is consumer-sup
50
49
  --_ai-panel--gap: var(--sc-kit--ai-panel--gap, 1rem);
51
50
  --_ai-panel--padding: var(--sc-kit--ai-panel--padding, 1rem);
52
51
  --_ai-panel--background: var(--sc-kit--ai-panel--background, var(--sc-kit--color--bg--panel));
53
- --_ai-panel--border-color: var(--sc-kit--ai-panel--border-color, var(--sc-kit--color--border));
54
52
  --_ai-panel--surface: var(--sc-kit--ai-panel--surface, var(--sc-kit--color--bg--app));
55
53
  --_ai-panel--surface-radius: var(--sc-kit--ai-panel--surface-radius, var(--sc-kit--radius--md));
56
54
  display: flex;
@@ -59,7 +57,6 @@ layout's concern. User-facing copy (placeholder, Generate label) is consumer-sup
59
57
  width: var(--_ai-panel--width);
60
58
  padding: var(--_ai-panel--padding);
61
59
  background: var(--_ai-panel--background);
62
- border-left: 1px solid var(--_ai-panel--border-color);
63
60
  overflow: hidden;
64
61
  }
65
62
  .ai-panel__tabs {
@@ -49,7 +49,6 @@ interface $$IsomorphicComponent {
49
49
  * | `--sc-kit--ai-panel--gap` | Gap between sections | `16px` |
50
50
  * | `--sc-kit--ai-panel--padding` | Panel padding | `16px` |
51
51
  * | `--sc-kit--ai-panel--background` | Panel background | `--sc-kit--color--bg--panel` |
52
- * | `--sc-kit--ai-panel--border-color` | Left divider color | `--sc-kit--color--border` |
53
52
  * | `--sc-kit--ai-panel--surface` | Body / composer / tab-tray fill | `--sc-kit--color--bg--app` |
54
53
  * | `--sc-kit--ai-panel--surface-radius` | Body / composer corner radius | `--sc-kit--radius--md` |
55
54
  */
@@ -35,6 +35,7 @@ const localization = new PageLayoutLocalization();
35
35
  icon={IconWindowMultiple}
36
36
  label={localization.togglePanels}
37
37
  active={editorControls.panelsToggle.active}
38
+ flip
38
39
  on={{ click: editorControls.panelsToggle.onClick }} />
39
40
  <LayoutControlButton
40
41
  icon={IconDismiss}
@@ -1,5 +1,5 @@
1
1
  <script lang="ts">import { Icon } from '../icon';
2
- const { icon, label, variant = 'outlined', active, on } = $props();
2
+ const { icon, label, variant = 'outlined', active, flip = false, on } = $props();
3
3
  </script>
4
4
 
5
5
  <button
@@ -8,6 +8,7 @@ const { icon, label, variant = 'outlined', active, on } = $props();
8
8
  class:layout-control-button--active={active}
9
9
  aria-label={label}
10
10
  aria-pressed={active}
11
+ style:transform={flip ? 'scaleX(-1)' : undefined}
11
12
  onclick={on.click}>
12
13
  <Icon src={icon} size={variant === 'flat' ? 'control-xl' : 'control-md'} />
13
14
  </button>
@@ -6,6 +6,8 @@ type Props = {
6
6
  variant?: 'outlined' | 'flat';
7
7
  /** Toggle state. Leave undefined for a plain action button so no `aria-pressed` is emitted. */
8
8
  active?: boolean;
9
+ /** Mirrors the glyph horizontally. @default false */
10
+ flip?: boolean;
9
11
  on: {
10
12
  click: () => void;
11
13
  };
@@ -31,6 +31,7 @@
31
31
  --_table--card--background: var(--sc-kit--table--card--background, var(--sc-kit--color--bg--panel));
32
32
  --_table--card--border-color: var(--sc-kit--table--card--border-color, var(--sc-kit--color--border));
33
33
  --_table--card--border-radius: var(--sc-kit--table--card--border-radius, var(--sc-kit--radius--lg));
34
+ --_table--card--padding-bottom: var(--sc-kit--table--card--padding-bottom, var(--sc-kit--space--4));
34
35
 
35
36
  display: flex;
36
37
  overflow-x: auto;
@@ -56,6 +57,7 @@
56
57
  background: var(--_table--card--background);
57
58
  border: 1px solid var(--_table--card--border-color);
58
59
  border-radius: var(--_table--card--border-radius);
60
+ padding-bottom: var(--_table--card--padding-bottom);
59
61
  // No overflow here: the radius already clips via the base overflow-x, and `hidden` would kill both scroll axes.
60
62
  }
61
63
  }
@@ -176,6 +176,7 @@ preserve the current selection. For non-reorderable tables use `Table` (it ships
176
176
  | `--sc-kit--table--card--background` | Card variant background | `--sc-kit--color--bg--panel` |
177
177
  | `--sc-kit--table--card--border-color` | Card variant border | `--sc-kit--color--border` |
178
178
  | `--sc-kit--table--card--border-radius` | Card variant radius | `--sc-kit--radius--lg` |
179
+ | `--sc-kit--table--card--padding-bottom` | Card variant bottom padding | `--sc-kit--space--4` |
179
180
  -->
180
181
 
181
182
  <style>.alternative-view__placeholder {
@@ -203,6 +204,7 @@ preserve the current selection. For non-reorderable tables use `Table` (it ships
203
204
  --_table--card--background: var(--sc-kit--table--card--background, var(--sc-kit--color--bg--panel));
204
205
  --_table--card--border-color: var(--sc-kit--table--card--border-color, var(--sc-kit--color--border));
205
206
  --_table--card--border-radius: var(--sc-kit--table--card--border-radius, var(--sc-kit--radius--lg));
207
+ --_table--card--padding-bottom: var(--sc-kit--table--card--padding-bottom, var(--sc-kit--space--4));
206
208
  display: flex;
207
209
  overflow-x: auto;
208
210
  height: 100%;
@@ -243,6 +245,7 @@ preserve the current selection. For non-reorderable tables use `Table` (it ships
243
245
  background: var(--_table--card--background);
244
246
  border: 1px solid var(--_table--card--border-color);
245
247
  border-radius: var(--_table--card--border-radius);
248
+ padding-bottom: var(--_table--card--padding-bottom);
246
249
  }
247
250
 
248
251
  .table {
@@ -71,6 +71,7 @@ interface $$IsomorphicComponent {
71
71
  * | `--sc-kit--table--card--background` | Card variant background | `--sc-kit--color--bg--panel` |
72
72
  * | `--sc-kit--table--card--border-color` | Card variant border | `--sc-kit--color--border` |
73
73
  * | `--sc-kit--table--card--border-radius` | Card variant radius | `--sc-kit--radius--lg` |
74
+ * | `--sc-kit--table--card--padding-bottom` | Card variant bottom padding | `--sc-kit--space--4` |
74
75
  */
75
76
  declare const Cmp: $$IsomorphicComponent;
76
77
  type Cmp<T extends {
@@ -157,6 +157,7 @@ variant ships no dnd code).
157
157
  | `--sc-kit--table--card--background` | Card variant background | `--sc-kit--color--bg--panel` |
158
158
  | `--sc-kit--table--card--border-color` | Card variant border | `--sc-kit--color--border` |
159
159
  | `--sc-kit--table--card--border-radius` | Card variant radius | `--sc-kit--radius--lg` |
160
+ | `--sc-kit--table--card--padding-bottom` | Card variant bottom padding | `--sc-kit--space--4` |
160
161
  -->
161
162
 
162
163
  <style>.alternative-view__placeholder {
@@ -184,6 +185,7 @@ variant ships no dnd code).
184
185
  --_table--card--background: var(--sc-kit--table--card--background, var(--sc-kit--color--bg--panel));
185
186
  --_table--card--border-color: var(--sc-kit--table--card--border-color, var(--sc-kit--color--border));
186
187
  --_table--card--border-radius: var(--sc-kit--table--card--border-radius, var(--sc-kit--radius--lg));
188
+ --_table--card--padding-bottom: var(--sc-kit--table--card--padding-bottom, var(--sc-kit--space--4));
187
189
  display: flex;
188
190
  overflow-x: auto;
189
191
  height: 100%;
@@ -224,6 +226,7 @@ variant ships no dnd code).
224
226
  background: var(--_table--card--background);
225
227
  border: 1px solid var(--_table--card--border-color);
226
228
  border-radius: var(--_table--card--border-radius);
229
+ padding-bottom: var(--_table--card--padding-bottom);
227
230
  }
228
231
 
229
232
  .table {
@@ -83,6 +83,7 @@ interface $$IsomorphicComponent {
83
83
  * | `--sc-kit--table--card--background` | Card variant background | `--sc-kit--color--bg--panel` |
84
84
  * | `--sc-kit--table--card--border-color` | Card variant border | `--sc-kit--color--border` |
85
85
  * | `--sc-kit--table--card--border-radius` | Card variant radius | `--sc-kit--radius--lg` |
86
+ * | `--sc-kit--table--card--padding-bottom` | Card variant bottom padding | `--sc-kit--space--4` |
86
87
  */
87
88
  declare const Cmp: $$IsomorphicComponent;
88
89
  type Cmp<T extends {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@streamscloud/kit",
3
- "version": "0.38.0",
3
+ "version": "0.38.2",
4
4
  "author": "StreamsCloud",
5
5
  "repository": {
6
6
  "type": "git",