@immich/ui 0.2.2 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (75) hide show
  1. package/dist/assets/immich-logo-inline-dark.svg +63 -0
  2. package/dist/assets/immich-logo-inline-light.svg +62 -0
  3. package/dist/assets/immich-logo-stacked-dark.svg +66 -0
  4. package/dist/assets/immich-logo-stacked-light.svg +66 -0
  5. package/dist/assets/immich-logo.json +3 -0
  6. package/dist/assets/immich-logo.svg +29 -0
  7. package/dist/common/use-context.svelte.d.ts +5 -0
  8. package/dist/common/use-context.svelte.js +19 -0
  9. package/dist/components/Alert/Alert.svelte +50 -0
  10. package/dist/components/Alert/Alert.svelte.d.ts +9 -0
  11. package/dist/components/Button/Button.svelte +8 -0
  12. package/dist/components/Button/Button.svelte.d.ts +4 -0
  13. package/dist/components/Card/Card.svelte +187 -0
  14. package/dist/components/Card/Card.svelte.d.ts +11 -0
  15. package/dist/components/Card/CardBody.svelte +20 -0
  16. package/dist/components/Card/CardBody.svelte.d.ts +6 -0
  17. package/dist/components/Card/CardDescription.svelte +16 -0
  18. package/dist/components/Card/CardDescription.svelte.d.ts +6 -0
  19. package/dist/components/Card/CardFooter.svelte +15 -0
  20. package/dist/components/Card/CardFooter.svelte.d.ts +5 -0
  21. package/dist/components/Card/CardHeader.svelte +15 -0
  22. package/dist/components/Card/CardHeader.svelte.d.ts +5 -0
  23. package/dist/components/Card/CardTitle.svelte +17 -0
  24. package/dist/components/Card/CardTitle.svelte.d.ts +8 -0
  25. package/dist/components/{Checkbox.svelte → Form/Checkbox.svelte} +20 -30
  26. package/dist/components/{Checkbox.svelte.d.ts → Form/Checkbox.svelte.d.ts} +1 -1
  27. package/dist/components/{Input.svelte → Form/Input.svelte} +1 -1
  28. package/dist/components/{Label.svelte → Form/Label.svelte} +1 -1
  29. package/dist/components/Heading/Heading.svelte +53 -0
  30. package/dist/components/Heading/Heading.svelte.d.ts +9 -0
  31. package/dist/components/Icon/Icon.svelte +52 -0
  32. package/dist/components/Icon/Icon.svelte.d.ts +4 -0
  33. package/dist/components/IconButton/IconButton.svelte +11 -0
  34. package/dist/components/IconButton/IconButton.svelte.d.ts +3 -0
  35. package/dist/components/Logo/Logo.svelte +59 -0
  36. package/dist/components/Logo/Logo.svelte.d.ts +8 -0
  37. package/dist/components/Stack/HStack.svelte +10 -0
  38. package/dist/components/Stack/HStack.svelte.d.ts +8 -0
  39. package/dist/components/Stack/Stack.svelte +68 -0
  40. package/dist/components/Stack/Stack.svelte.d.ts +3 -0
  41. package/dist/components/Stack/VStack.svelte +10 -0
  42. package/dist/components/Stack/VStack.svelte.d.ts +8 -0
  43. package/dist/components/Text/Text.svelte +49 -0
  44. package/dist/components/Text/Text.svelte.d.ts +11 -0
  45. package/dist/constants.d.ts +6 -0
  46. package/dist/constants.js +7 -0
  47. package/dist/index.d.ts +20 -1
  48. package/dist/index.js +20 -1
  49. package/dist/{components → internal}/Button.svelte +79 -71
  50. package/dist/internal/Button.svelte.d.ts +6 -0
  51. package/dist/internal/Child.svelte +21 -0
  52. package/dist/internal/Child.svelte.d.ts +8 -0
  53. package/dist/types.d.ts +48 -0
  54. package/dist/utils.d.ts +2 -0
  55. package/dist/utils.js +1 -0
  56. package/package.json +3 -1
  57. package/dist/components/Button.svelte.d.ts +0 -15
  58. package/dist/components/Card.svelte +0 -17
  59. package/dist/components/Card.svelte.d.ts +0 -4
  60. package/dist/components/CardBody.svelte +0 -16
  61. package/dist/components/CardBody.svelte.d.ts +0 -4
  62. package/dist/components/CardDescription.svelte +0 -16
  63. package/dist/components/CardDescription.svelte.d.ts +0 -4
  64. package/dist/components/CardFooter.svelte +0 -16
  65. package/dist/components/CardFooter.svelte.d.ts +0 -4
  66. package/dist/components/CardHeader.svelte +0 -17
  67. package/dist/components/CardHeader.svelte.d.ts +0 -4
  68. package/dist/components/CardTitle.svelte +0 -25
  69. package/dist/components/CardTitle.svelte.d.ts +0 -7
  70. package/dist/components/Icon.svelte +0 -62
  71. package/dist/components/Icon.svelte.d.ts +0 -20
  72. package/dist/components/index.d.ts +0 -11
  73. package/dist/components/index.js +0 -11
  74. /package/dist/components/{Input.svelte.d.ts → Form/Input.svelte.d.ts} +0 -0
  75. /package/dist/components/{Label.svelte.d.ts → Form/Label.svelte.d.ts} +0 -0
@@ -1,17 +0,0 @@
1
- <script lang="ts">
2
- import { cleanClass } from '../utils.js';
3
- import type { WithElementRef } from 'bits-ui';
4
- import type { HTMLAttributes } from 'svelte/elements';
5
-
6
- type Props = WithElementRef<HTMLAttributes<HTMLDivElement>>;
7
-
8
- let { ref = $bindable(null), class: className, children, ...restProps }: Props = $props();
9
- </script>
10
-
11
- <div
12
- bind:this={ref}
13
- class={cleanClass('flex flex-col space-y-1.5 rounded-t-lg p-6 pb-0', className)}
14
- {...restProps}
15
- >
16
- {@render children?.()}
17
- </div>
@@ -1,4 +0,0 @@
1
- import type { WithElementRef } from 'bits-ui';
2
- import type { HTMLAttributes } from 'svelte/elements';
3
- declare const CardHeader: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
4
- export default CardHeader;
@@ -1,25 +0,0 @@
1
- <script lang="ts">
2
- import type { WithElementRef } from 'bits-ui';
3
- import type { HTMLAttributes } from 'svelte/elements';
4
- import { cleanClass } from '../utils.js';
5
-
6
- let {
7
- ref = $bindable(null),
8
- class: className,
9
- level = 3,
10
- children,
11
- ...restProps
12
- }: WithElementRef<HTMLAttributes<HTMLDivElement>> & {
13
- level?: 1 | 2 | 3 | 4 | 5 | 6;
14
- } = $props();
15
- </script>
16
-
17
- <div
18
- role="heading"
19
- aria-level={level}
20
- bind:this={ref}
21
- class={cleanClass('text-lg font-semibold leading-none tracking-tight', className)}
22
- {...restProps}
23
- >
24
- {@render children?.()}
25
- </div>
@@ -1,7 +0,0 @@
1
- import type { HTMLAttributes } from 'svelte/elements';
2
- declare const CardTitle: import("svelte").Component<HTMLAttributes<HTMLDivElement> & {
3
- ref?: HTMLElement | null | undefined;
4
- } & {
5
- level?: 1 | 2 | 3 | 4 | 5 | 6;
6
- }, {}, "ref">;
7
- export default CardTitle;
@@ -1,62 +0,0 @@
1
- <script lang="ts">
2
- import type { Color } from '../types.js';
3
- import { cleanClass } from '../utils.js';
4
- import type { AriaRole } from 'svelte/elements';
5
-
6
- type IconProps = {
7
- path: string;
8
- size?: string;
9
- color?: Color | 'currentColor' | string;
10
- flipped?: boolean;
11
- class?: string;
12
- viewBox?: string;
13
- role?: AriaRole;
14
- title?: string;
15
- description?: string;
16
- ariaHidden?: boolean;
17
- ariaLabel?: string;
18
- ariaLabelledby?: string;
19
- strokeWidth?: number;
20
- strokeColor?: string;
21
- spin?: false;
22
- };
23
-
24
- const {
25
- size = '1em',
26
- viewBox = '0 0 24 24',
27
- class: className = '',
28
- flipped = false,
29
- spin = false,
30
- role = 'img',
31
- ariaLabelledby,
32
- strokeColor = 'currentColor',
33
- strokeWidth = 2,
34
- ariaLabel = '',
35
- ariaHidden = false,
36
- title,
37
- path,
38
- color = 'currentColor',
39
- description,
40
- }: IconProps = $props();
41
- </script>
42
-
43
- <svg
44
- width={size}
45
- height={size}
46
- {viewBox}
47
- class={cleanClass(className, flipped && '-scale-x-100', spin && 'animate-spin')}
48
- {role}
49
- stroke={strokeColor}
50
- stroke-width={strokeWidth}
51
- aria-label={ariaLabel}
52
- aria-hidden={ariaHidden}
53
- aria-labelledby={ariaLabelledby}
54
- >
55
- {#if title}
56
- <title>{title}</title>
57
- {/if}
58
- {#if description}
59
- <desc>{description}</desc>
60
- {/if}
61
- <path d={path} fill={color} />
62
- </svg>
@@ -1,20 +0,0 @@
1
- import type { Color } from '../types.js';
2
- import type { AriaRole } from 'svelte/elements';
3
- declare const Icon: import("svelte").Component<{
4
- path: string;
5
- size?: string;
6
- color?: Color | "currentColor" | string;
7
- flipped?: boolean;
8
- class?: string;
9
- viewBox?: string;
10
- role?: AriaRole;
11
- title?: string;
12
- description?: string;
13
- ariaHidden?: boolean;
14
- ariaLabel?: string;
15
- ariaLabelledby?: string;
16
- strokeWidth?: number;
17
- strokeColor?: string;
18
- spin?: false;
19
- }, {}, "">;
20
- export default Icon;
@@ -1,11 +0,0 @@
1
- export { default as Button } from './Button.svelte';
2
- export { default as Card } from './Card.svelte';
3
- export { default as CardBody } from './CardBody.svelte';
4
- export { default as CardDescription } from './CardDescription.svelte';
5
- export { default as CardFooter } from './CardFooter.svelte';
6
- export { default as CardHeader } from './CardHeader.svelte';
7
- export { default as CardTitle } from './CardTitle.svelte';
8
- export { default as Checkbox } from './Checkbox.svelte';
9
- export { default as Icon } from './Icon.svelte';
10
- export { default as Input } from './Input.svelte';
11
- export { default as Label } from './Label.svelte';
@@ -1,11 +0,0 @@
1
- export { default as Button } from './Button.svelte';
2
- export { default as Card } from './Card.svelte';
3
- export { default as CardBody } from './CardBody.svelte';
4
- export { default as CardDescription } from './CardDescription.svelte';
5
- export { default as CardFooter } from './CardFooter.svelte';
6
- export { default as CardHeader } from './CardHeader.svelte';
7
- export { default as CardTitle } from './CardTitle.svelte';
8
- export { default as Checkbox } from './Checkbox.svelte';
9
- export { default as Icon } from './Icon.svelte';
10
- export { default as Input } from './Input.svelte';
11
- export { default as Label } from './Label.svelte';