ui-svelte 0.2.0 → 0.2.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.
Files changed (65) hide show
  1. package/dist/charts/ArcChart.svelte +3 -3
  2. package/dist/charts/ArcChart.svelte.d.ts +1 -1
  3. package/dist/charts/AreaChart.svelte +3 -3
  4. package/dist/charts/AreaChart.svelte.d.ts +1 -1
  5. package/dist/charts/BarChart.svelte +3 -3
  6. package/dist/charts/BarChart.svelte.d.ts +1 -1
  7. package/dist/charts/Candlestick.svelte +3 -3
  8. package/dist/charts/Candlestick.svelte.d.ts +1 -1
  9. package/dist/charts/LineChart.svelte +3 -3
  10. package/dist/charts/LineChart.svelte.d.ts +1 -1
  11. package/dist/charts/PieChart.svelte +3 -3
  12. package/dist/charts/PieChart.svelte.d.ts +1 -1
  13. package/dist/control/Button.svelte +2 -8
  14. package/dist/control/Button.svelte.d.ts +0 -2
  15. package/dist/control/IconButton.svelte +0 -3
  16. package/dist/control/IconButton.svelte.d.ts +0 -1
  17. package/dist/control/css/btn.css +0 -4
  18. package/dist/css/base.css +263 -46
  19. package/dist/css/utilities.css +0 -4
  20. package/dist/display/Accordion.svelte +3 -3
  21. package/dist/display/Accordion.svelte.d.ts +1 -1
  22. package/dist/display/Alert.svelte +0 -2
  23. package/dist/display/Card.svelte +4 -17
  24. package/dist/display/Card.svelte.d.ts +1 -3
  25. package/dist/display/Carousel.svelte +3 -3
  26. package/dist/display/Carousel.svelte.d.ts +1 -1
  27. package/dist/display/ChatBox.svelte +3 -3
  28. package/dist/display/ChatBox.svelte.d.ts +1 -1
  29. package/dist/display/Collapsible.svelte +3 -3
  30. package/dist/display/Collapsible.svelte.d.ts +1 -1
  31. package/dist/display/Empty.svelte +11 -5
  32. package/dist/display/Marquee.svelte +3 -3
  33. package/dist/display/Marquee.svelte.d.ts +1 -1
  34. package/dist/display/Section.svelte +3 -3
  35. package/dist/display/Section.svelte.d.ts +1 -1
  36. package/dist/display/css/alert.css +1 -1
  37. package/dist/display/css/card.css +7 -126
  38. package/dist/display/css/section.css +5 -1
  39. package/dist/form/Select.svelte +3 -3
  40. package/dist/form/Select.svelte.d.ts +1 -1
  41. package/dist/form/TextField.svelte +4 -6
  42. package/dist/form/TextField.svelte.d.ts +2 -2
  43. package/dist/form/css/control.css +1 -1
  44. package/dist/index.d.ts +3 -2
  45. package/dist/index.js +2 -2
  46. package/dist/layout/AppBar.svelte +12 -6
  47. package/dist/layout/AppBar.svelte.d.ts +2 -1
  48. package/dist/layout/Footer.svelte +6 -4
  49. package/dist/layout/Footer.svelte.d.ts +2 -1
  50. package/dist/layout/Scaffold.svelte +4 -2
  51. package/dist/layout/Scaffold.svelte.d.ts +1 -0
  52. package/dist/layout/Sidebar.svelte +4 -11
  53. package/dist/layout/Sidebar.svelte.d.ts +1 -1
  54. package/dist/layout/css/app-bar.css +1 -1
  55. package/dist/navigation/BottomNav.svelte +80 -0
  56. package/dist/navigation/SideNav.svelte +17 -16
  57. package/dist/navigation/SideNav.svelte.d.ts +33 -0
  58. package/dist/navigation/Tabs.svelte +3 -3
  59. package/dist/navigation/Tabs.svelte.d.ts +1 -1
  60. package/dist/navigation/css/bottom-nav.css +134 -0
  61. package/dist/navigation/css/nav-menu.css +2 -2
  62. package/package.json +2 -2
  63. package/dist/navigation/BottomNav.svelte.d.ts +0 -26
  64. /package/dist/{types.d.ts → types.svelte.d.ts} +0 -0
  65. /package/dist/{types.js → types.svelte.js} +0 -0
package/dist/charts/ArcChart.svelte CHANGED
@@ -24,7 +24,7 @@
24
24
  emptyText?: string;
25
25
  showLegend?: boolean;
26
26
  showValues?: boolean;
27
- class?: string;
27
+ rootClass?: string;
28
28
  chartClass?: string;
29
29
  };
30
30
 
@@ -41,7 +41,7 @@
41
41
  emptyText = 'No data',
42
42
  showLegend = true,
43
43
  showValues = true,
44
- class: className,
44
+ rootClass,
45
45
  chartClass
46
46
  }: Props = $props();
47
47
 
@@ -194,7 +194,7 @@
194
194
  }
195
195
  </script>
196
196
 
197
- <div class={cn('arc-chart-container', className)}>
197
+ <div class={cn('arc-chart-container', rootClass)}>
198
198
  {#if loading}
199
199
  <div class="arc-chart-loading">
200
200
  <svg class="arc-chart-loading-spinner" viewBox="0 0 24 24">
package/dist/charts/ArcChart.svelte.d.ts CHANGED
@@ -18,7 +18,7 @@ type Props = {
18
18
  emptyText?: string;
19
19
  showLegend?: boolean;
20
20
  showValues?: boolean;
21
- class?: string;
21
+ rootClass?: string;
22
22
  chartClass?: string;
23
23
  };
24
24
  declare const ArcChart: import("svelte").Component<Props, {}, "">;
package/dist/charts/AreaChart.svelte CHANGED
@@ -45,7 +45,7 @@
45
45
  loading?: boolean;
46
46
  empty?: boolean;
47
47
  emptyText?: string;
48
- class?: string;
48
+ rootClass?: string;
49
49
  };
50
50
 
51
51
  let {
@@ -65,7 +65,7 @@
65
65
  loading = false,
66
66
  empty = false,
67
67
  emptyText = 'No data available',
68
- class: className
68
+ rootClass
69
69
  }: Props = $props();
70
70
 
71
71
  let containerEl: HTMLDivElement | undefined = $state();
@@ -321,7 +321,7 @@
321
321
  });
322
322
  </script>
323
323
 
324
- <div class={cn('area-chart-container', className)}>
324
+ <div class={cn('area-chart-container', rootClass)}>
325
325
  {#if loading}
326
326
  <div class="area-chart-loading">
327
327
  <svg class="area-chart-loading-spinner" viewBox="0 0 24 24">
package/dist/charts/AreaChart.svelte.d.ts CHANGED
@@ -25,7 +25,7 @@ type Props = {
25
25
  loading?: boolean;
26
26
  empty?: boolean;
27
27
  emptyText?: string;
28
- class?: string;
28
+ rootClass?: string;
29
29
  };
30
30
  declare const AreaChart: import("svelte").Component<Props, {}, "">;
31
31
  type AreaChart = ReturnType<typeof AreaChart>;
package/dist/charts/BarChart.svelte CHANGED
@@ -60,7 +60,7 @@
60
60
  loading?: boolean;
61
61
  empty?: boolean;
62
62
  emptyText?: string;
63
- class?: string;
63
+ rootClass?: string;
64
64
  };
65
65
 
66
66
  let {
@@ -80,7 +80,7 @@
80
80
  loading = false,
81
81
  empty = false,
82
82
  emptyText = 'No data available',
83
- class: className
83
+ rootClass
84
84
  }: Props = $props();
85
85
 
86
86
  let containerEl: HTMLDivElement | undefined = $state();
@@ -282,7 +282,7 @@
282
282
  });
283
283
  </script>
284
284
 
285
- <div bind:this={containerEl} class={cn('bar-chart-container', className)}>
285
+ <div bind:this={containerEl} class={cn('bar-chart-container', rootClass)}>
286
286
  {#if loading}
287
287
  <div class="bar-chart-loading">
288
288
  <svg class="bar-chart-loading-spinner" viewBox="0 0 24 24">
package/dist/charts/BarChart.svelte.d.ts CHANGED
@@ -31,7 +31,7 @@ type Props = {
31
31
  loading?: boolean;
32
32
  empty?: boolean;
33
33
  emptyText?: string;
34
- class?: string;
34
+ rootClass?: string;
35
35
  };
36
36
  declare const BarChart: import("svelte").Component<Props, {}, "">;
37
37
  type BarChart = ReturnType<typeof BarChart>;
package/dist/charts/Candlestick.svelte CHANGED
@@ -51,7 +51,7 @@
51
51
  initialVisibleCandles?: number;
52
52
  minVisibleCandles?: number;
53
53
  maxVisibleCandles?: number;
54
- class?: string;
54
+ rootClass?: string;
55
55
  chartClass?: string;
56
56
  };
57
57
 
@@ -72,7 +72,7 @@
72
72
  initialVisibleCandles = 50,
73
73
  minVisibleCandles = 10,
74
74
  maxVisibleCandles = 200,
75
- class: className,
75
+ rootClass,
76
76
  chartClass
77
77
  }: Props = $props();
78
78
 
@@ -345,7 +345,7 @@
345
345
  });
346
346
  </script>
347
347
 
348
- <div bind:this={containerEl} class={cn('candlestick-chart-container', className)}>
348
+ <div bind:this={containerEl} class={cn('candlestick-chart-container', rootClass)}>
349
349
  {#if loading}
350
350
  <div class="candlestick-chart-loading"></div>
351
351
  {:else if empty || data.length === 0}
package/dist/charts/Candlestick.svelte.d.ts CHANGED
@@ -30,7 +30,7 @@ type Props = {
30
30
  initialVisibleCandles?: number;
31
31
  minVisibleCandles?: number;
32
32
  maxVisibleCandles?: number;
33
- class?: string;
33
+ rootClass?: string;
34
34
  chartClass?: string;
35
35
  };
36
36
  declare const Candlestick: import("svelte").Component<Props, {}, "">;
package/dist/charts/LineChart.svelte CHANGED
@@ -51,7 +51,7 @@
51
51
  loading?: boolean;
52
52
  empty?: boolean;
53
53
  emptyText?: string;
54
- class?: string;
54
+ rootClass?: string;
55
55
  };
56
56
 
57
57
  let {
@@ -69,7 +69,7 @@
69
69
  loading = false,
70
70
  empty = false,
71
71
  emptyText = 'No data available',
72
- class: className
72
+ rootClass
73
73
  }: Props = $props();
74
74
 
75
75
  let containerEl: HTMLDivElement | undefined = $state();
@@ -233,7 +233,7 @@
233
233
  });
234
234
  </script>
235
235
 
236
- <div bind:this={containerEl} class={cn('line-chart-container', className)}>
236
+ <div bind:this={containerEl} class={cn('line-chart-container', rootClass)}>
237
237
  {#if loading}
238
238
  <div class="line-chart-loading">
239
239
  <svg class="line-chart-loading-spinner" viewBox="0 0 24 24">
package/dist/charts/LineChart.svelte.d.ts CHANGED
@@ -29,7 +29,7 @@ type Props = {
29
29
  loading?: boolean;
30
30
  empty?: boolean;
31
31
  emptyText?: string;
32
- class?: string;
32
+ rootClass?: string;
33
33
  };
34
34
  declare const LineChart: import("svelte").Component<Props, {}, "">;
35
35
  type LineChart = ReturnType<typeof LineChart>;
package/dist/charts/PieChart.svelte CHANGED
@@ -34,7 +34,7 @@
34
34
  loading?: boolean;
35
35
  empty?: boolean;
36
36
  emptyText?: string;
37
- class?: string;
37
+ rootClass?: string;
38
38
  chartClass?: string;
39
39
  };
40
40
 
@@ -54,7 +54,7 @@
54
54
  loading = false,
55
55
  empty = false,
56
56
  emptyText = 'No data available',
57
- class: className,
57
+ rootClass,
58
58
  chartClass
59
59
  }: Props = $props();
60
60
 
@@ -175,7 +175,7 @@
175
175
  });
176
176
  </script>
177
177
 
178
- <div class={cn('pie-chart-container', className)}>
178
+ <div class={cn('pie-chart-container', rootClass)}>
179
179
  {#if loading}
180
180
  <div class="pie-chart-loading">
181
181
  <svg class="pie-chart-loading-spinner" viewBox="0 0 24 24">
package/dist/charts/PieChart.svelte.d.ts CHANGED
@@ -20,7 +20,7 @@ type Props = {
20
20
  loading?: boolean;
21
21
  empty?: boolean;
22
22
  emptyText?: string;
23
- class?: string;
23
+ rootClass?: string;
24
24
  chartClass?: string;
25
25
  };
26
26
  declare const PieChart: import("svelte").Component<Props, {}, "">;
package/dist/control/Button.svelte CHANGED
@@ -27,9 +27,7 @@
27
27
  endIcon?: IconData;
28
28
  isWide?: boolean;
29
29
  isDisabled?: boolean;
30
- hasShadow?: boolean;
31
30
  isSolid?: boolean;
32
- isIcon?: boolean;
33
31
  };
34
32
 
35
33
  const {
@@ -45,9 +43,7 @@
45
43
  isLoading,
46
44
  isWide,
47
45
  isDisabled,
48
- hasShadow,
49
- isSolid,
50
- isIcon
46
+ isSolid
51
47
  }: Props = $props();
52
48
 
53
49
  const variantClasses = {
@@ -75,10 +71,8 @@
75
71
  'btn',
76
72
  variantClasses[variant],
77
73
  sizeClasses[size],
78
- isIcon && 'is-icon',
79
74
  isSolid && 'is-solid',
80
- isWide && 'has-wide',
81
- hasShadow && 'has-shadow',
75
+ isWide && 'is-wide',
82
76
  className
83
77
  )
84
78
  );
package/dist/control/Button.svelte.d.ts CHANGED
@@ -13,9 +13,7 @@ type Props = {
13
13
  endIcon?: IconData;
14
14
  isWide?: boolean;
15
15
  isDisabled?: boolean;
16
- hasShadow?: boolean;
17
16
  isSolid?: boolean;
18
- isIcon?: boolean;
19
17
  };
20
18
  declare const Button: import("svelte").Component<Props, {}, "">;
21
19
  type Button = ReturnType<typeof Button>;
package/dist/control/IconButton.svelte CHANGED
@@ -23,7 +23,6 @@
23
23
  isLoading?: boolean;
24
24
  icon: IconData;
25
25
  isDisabled?: boolean;
26
- hasShadow?: boolean;
27
26
  isSolid?: boolean;
28
27
  };
29
28
 
@@ -37,7 +36,6 @@
37
36
  icon,
38
37
  isLoading,
39
38
  isDisabled,
40
- hasShadow,
41
39
  isSolid
42
40
  }: Props = $props();
43
41
 
@@ -68,7 +66,6 @@
68
66
  variantClasses[variant],
69
67
  sizeClasses[size],
70
68
  isSolid && 'is-solid',
71
- hasShadow && 'has-shadow',
72
69
  className
73
70
  )
74
71
  );
package/dist/control/IconButton.svelte.d.ts CHANGED
@@ -9,7 +9,6 @@ type Props = {
9
9
  isLoading?: boolean;
10
10
  icon: IconData;
11
11
  isDisabled?: boolean;
12
- hasShadow?: boolean;
13
12
  isSolid?: boolean;
14
13
  };
15
14
  declare const IconButton: import("svelte").Component<Props, {}, "">;
package/dist/control/css/btn.css CHANGED
@@ -125,10 +125,6 @@
125
125
  @apply w-full;
126
126
  }
127
127
 
128
- .btn.has-shadow {
129
- @apply shadow-sm shadow-muted;
130
- }
131
-
132
128
  .btn:disabled {
133
129
  @apply opacity-50;
134
130
  }