ui-ingredients 0.0.33 → 0.0.35

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 (14) hide show
  1. package/README.md +57 -60
  2. package/dist/qr-code/context.svelte.d.ts +2 -2
  3. package/dist/qr-code/create-qr-code.svelte.d.ts +3 -3
  4. package/dist/qr-code/frame.svelte +2 -2
  5. package/dist/qr-code/frame.svelte.d.ts +1 -1
  6. package/dist/qr-code/index.d.ts +5 -5
  7. package/dist/qr-code/index.js +1 -1
  8. package/dist/qr-code/overlay.svelte +2 -2
  9. package/dist/qr-code/overlay.svelte.d.ts +1 -1
  10. package/dist/qr-code/pattern.svelte +2 -2
  11. package/dist/qr-code/pattern.svelte.d.ts +1 -1
  12. package/dist/qr-code/root.svelte +8 -8
  13. package/dist/qr-code/root.svelte.d.ts +1 -1
  14. package/package.json +1 -1
package/README.md CHANGED
@@ -12,70 +12,67 @@ npm install ui-ingredients
12
12
 
13
13
  ```svelte
14
14
  <script>
15
- import {Clipboard} from 'ui-ingredients';
16
-
17
- let {data} = $props();
15
+ import {Dialog, Portal} from 'ui-ingredients';
16
+ import {XCloseIcon} from '$lib/icons';
18
17
  </script>
19
18
 
20
- <Clipboard.Root value={data.token}>
21
- <Clipboard.Label>Token</Clipboard.Label>
22
- <Clipboard.Control>
23
- <Clipboard.Input />
24
- <Clipboard.Trigger>
25
- <Clipboard.Indicator copied>
26
- <CheckIcon />
27
- </Clipboard.Indicator>
28
- <Clipboard.Indicator>
29
- <CopyIcon />
30
- </Clipboard.Indicator>
31
- </Clipboard.Trigger>
32
- </Clipboard.Control>
33
- </Clipboard.Root>
19
+ <Dialog.Root>
20
+ <Dialog.Trigger>Open</Dialog.Trigger>
21
+
22
+ <Portal>
23
+ <Dialog.Backdrop />
24
+ <Dialog.Positioner>
25
+ <Dialog.Content>
26
+ <Dialog.Title>Title</Dialog.Title>
27
+ <Dialog.Description>Description</Dialog.Description>
28
+ <Dialog.CloseTrigger>
29
+ <XCloseIcon />
30
+ </Dialog.CloseTrigger>
31
+ </Dialog.Content>
32
+ </Dialog.Positioner>
33
+ </Portal>
34
+ </Dialog.Root>
34
35
  ```
35
36
 
36
- ## Components
37
+ ## Documentation
37
38
 
38
- - 🟢 [Accordion](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/accordion.md)
39
- - 🟢 [Avatar](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/avatar.md)
40
- - 🟢 [Carousel](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/carousel.md)
41
- - 🟢 [Checkbox](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/checkbox.md)
42
- - 🟢 [Clipboard](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/clipboard.md)
43
- - 🟢 [Collapsible](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/collapsible.md)
44
- - ⚪ [ColorPicker](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/colorPicker.md)
45
- - 🟢 [Combobox](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/combobox.md)
46
- - 🟢 [DatePicker](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/datePicker.md)
47
- - 🟢 [Dialog](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/dialog.md)
48
- - 🟢 [Editable](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/editable.md)
49
- - 🟢 [Field](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/field.md)
50
- - 🟢 [FileUpload](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/file-upload.md)
51
- - ⚪ [FloatingPanel](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/floating-panel.md)
52
- - 🟢 [HoverCard](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/hover-card.md)
53
- - 🟢 [Menu](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/menu.md)
54
- - 🟢 [NumberInput](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/number-input.md)
55
- - 🟢 [Pagination](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/pagination.md)
56
- - 🟢 [PinInput](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/pin-input.md)
57
- - 🟢 [Popover](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/popover.md)
58
- - 🟢 [Portal](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/portal.md)
59
- - ⚪ [Presence](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/presence.md)
60
- - 🟢 [Progress](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/progress.md)
61
- - 🟢 [QRCode](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/qr-code.md)
62
- - 🟢 [RadioGroup](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/radio-group.md)
63
- - 🟢 [RatingGroup](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/rating-group.md)
64
- - 🟢 [Select](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/select.md)
65
- - 🟢 [SegmentGroup](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/segment-group.md)
66
- - 🟢 [SignaturePad](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/signature-pad.md)
67
- - 🟢 [Slider](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/slider.md)
68
- - 🟢 [Splitter](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/splitter.md)
69
- - 🟢 [Steps](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/steps.md)
70
- - 🟢 [Switch](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/switch.md)
71
- - 🟢 [Tabs](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tabs.md)
72
- - 🟢 [TagsInput](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tags-input.md)
73
- - 🟢 [TimePicker](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/time-picker.md)
74
- - 🟢 [Timer](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/timer.md)
75
- - 🟢 [Toast](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/toast.md)
76
- - 🟢 [ToggleGroup](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/toggle-group.md)
77
- - 🟢 [Tooltip](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tooltip.md)
78
- - ⚪ [Tour](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tour.md)
79
- - 🟢 [TreeView](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tree-view.md)
39
+ - [Accordion](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/accordion.md)
40
+ - [Avatar](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/avatar.md)
41
+ - [Carousel](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/carousel.md)
42
+ - [Checkbox](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/checkbox.md)
43
+ - [Clipboard](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/clipboard.md)
44
+ - [Collapsible](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/collapsible.md)
45
+ - [Combobox](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/combobox.md)
46
+ - [DatePicker](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/date-picker.md)
47
+ - [Dialog](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/dialog.md)
48
+ - [Editable](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/editable.md)
49
+ - [Field](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/field.md)
50
+ - [FileUpload](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/file-upload.md)
51
+ - [HoverCard](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/hover-card.md)
52
+ - [Menu](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/menu.md)
53
+ - [NumberInput](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/number-input.md)
54
+ - [Pagination](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/pagination.md)
55
+ - [PinInput](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/pin-input.md)
56
+ - [Popover](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/popover.md)
57
+ - [Portal](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/portal.md)
58
+ - [Progress](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/progress.md)
59
+ - [QrCode](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/qr-code.md)
60
+ - [RadioGroup](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/radio-group.md)
61
+ - [RatingGroup](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/rating-group.md)
62
+ - [Select](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/select.md)
63
+ - [SegmentGroup](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/segment-group.md)
64
+ - [SignaturePad](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/signature-pad.md)
65
+ - [Slider](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/slider.md)
66
+ - [Splitter](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/splitter.md)
67
+ - [Steps](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/steps.md)
68
+ - [Switch](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/switch.md)
69
+ - [Tabs](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tabs.md)
70
+ - [TagsInput](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tags-input.md)
71
+ - [TimePicker](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/time-picker.md)
72
+ - [Timer](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/timer.md)
73
+ - [Toast](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/toast.md)
74
+ - [ToggleGroup](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/toggle-group.md)
75
+ - [Tooltip](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tooltip.md)
76
+ - [TreeView](https://github.com/calvo-jp/ui-ingredients/blob/main/docs/tree-view.md)
80
77
 
81
78
  View components demo [here](https://ui-ingredients.vercel.app/)
package/dist/qr-code/context.svelte.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { Context } from '../context.svelte.js';
2
- import type { CreateQRCodeReturn } from './create-qr-code.svelte.js';
3
- export declare const qrCodeContext: Context<CreateQRCodeReturn>;
2
+ import type { CreateQrCodeReturn } from './create-qr-code.svelte.js';
3
+ export declare const qrCodeContext: Context<CreateQrCodeReturn>;
package/dist/qr-code/create-qr-code.svelte.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as qrCode from '@zag-js/qr-code';
2
- export interface CreateQRCodeProps extends Omit<qrCode.Context, 'id' | 'dir' | 'getRootNode'> {
2
+ export interface CreateQrCodeProps extends Omit<qrCode.Context, 'id' | 'dir' | 'getRootNode'> {
3
3
  id?: string | null;
4
4
  }
5
- export interface CreateQRCodeReturn extends qrCode.Api {
5
+ export interface CreateQrCodeReturn extends qrCode.Api {
6
6
  }
7
- export declare function createQRCode(props: CreateQRCodeProps): CreateQRCodeReturn;
7
+ export declare function createQRCode(props: CreateQrCodeProps): CreateQrCodeReturn;
package/dist/qr-code/frame.svelte CHANGED
@@ -1,7 +1,7 @@
1
1
  <script lang="ts" module>
2
2
  import type {AsChild, HTMLProps} from '../types.js';
3
3
 
4
- export interface QRCodeFrameProps extends HTMLProps<'svg'> {
4
+ export interface QrCodeFrameProps extends HTMLProps<'svg'> {
5
5
  asChild?: AsChild;
6
6
  }
7
7
  </script>
@@ -10,7 +10,7 @@
10
10
  import {mergeProps} from '../merge-props.js';
11
11
  import {qrCodeContext} from './context.svelte.js';
12
12
 
13
- let {asChild, children, ...props}: QRCodeFrameProps = $props();
13
+ let {asChild, children, ...props}: QrCodeFrameProps = $props();
14
14
 
15
15
  let qrCode = qrCodeContext.get();
16
16
 
package/dist/qr-code/frame.svelte.d.ts CHANGED
@@ -11,7 +11,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
11
11
  };
12
12
  z_$$bindings?: Bindings;
13
13
  }
14
- declare const Frame: $$__sveltets_2_IsomorphicComponent<QRCodeFrameProps, {
14
+ declare const Frame: $$__sveltets_2_IsomorphicComponent<QrCodeFrameProps, {
15
15
  [evt: string]: CustomEvent<any>;
16
16
  }, {}, {}, "">;
17
17
  type Frame = InstanceType<typeof Frame>;
package/dist/qr-code/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- export * as QRCode from './qr-code.js';
2
- export type { QRCodeFrameProps } from './frame.svelte';
3
- export type { QRCodeOverlayProps } from './overlay.svelte';
4
- export type { QRCodePatternProps } from './pattern.svelte';
5
- export type { QRCodeProps } from './root.svelte';
1
+ export * as QrCode from './qr-code.js';
2
+ export type { QrCodeFrameProps } from './frame.svelte';
3
+ export type { QrCodeOverlayProps } from './overlay.svelte';
4
+ export type { QrCodePatternProps } from './pattern.svelte';
5
+ export type { QrCodeProps } from './root.svelte';
6
6
  export { anatomy as qrCodeAnatomy } from '@zag-js/qr-code';
package/dist/qr-code/index.js CHANGED
@@ -1,2 +1,2 @@
1
- export * as QRCode from './qr-code.js';
1
+ export * as QrCode from './qr-code.js';
2
2
  export { anatomy as qrCodeAnatomy } from '@zag-js/qr-code';
package/dist/qr-code/overlay.svelte CHANGED
@@ -1,7 +1,7 @@
1
1
  <script lang="ts" module>
2
2
  import type {AsChild, HTMLProps} from '../types.js';
3
3
 
4
- export interface QRCodeOverlayProps extends HTMLProps<'div'> {
4
+ export interface QrCodeOverlayProps extends HTMLProps<'div'> {
5
5
  asChild?: AsChild;
6
6
  }
7
7
  </script>
@@ -10,7 +10,7 @@
10
10
  import {mergeProps} from '../merge-props.js';
11
11
  import {qrCodeContext} from './context.svelte.js';
12
12
 
13
- let {asChild, children, ...props}: QRCodeOverlayProps = $props();
13
+ let {asChild, children, ...props}: QrCodeOverlayProps = $props();
14
14
 
15
15
  let qrCode = qrCodeContext.get();
16
16
 
package/dist/qr-code/overlay.svelte.d.ts CHANGED
@@ -11,7 +11,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
11
11
  };
12
12
  z_$$bindings?: Bindings;
13
13
  }
14
- declare const Overlay: $$__sveltets_2_IsomorphicComponent<QRCodeOverlayProps, {
14
+ declare const Overlay: $$__sveltets_2_IsomorphicComponent<QrCodeOverlayProps, {
15
15
  [evt: string]: CustomEvent<any>;
16
16
  }, {}, {}, "">;
17
17
  type Overlay = InstanceType<typeof Overlay>;
package/dist/qr-code/pattern.svelte CHANGED
@@ -1,7 +1,7 @@
1
1
  <script lang="ts" module>
2
2
  import type {AsChild, HTMLProps} from '../types.js';
3
3
 
4
- export interface QRCodePatternProps extends HTMLProps<'path'> {
4
+ export interface QrCodePatternProps extends HTMLProps<'path'> {
5
5
  asChild?: AsChild;
6
6
  }
7
7
  </script>
@@ -10,7 +10,7 @@
10
10
  import {mergeProps} from '../merge-props.js';
11
11
  import {qrCodeContext} from './context.svelte.js';
12
12
 
13
- let {asChild, children, ...props}: QRCodePatternProps = $props();
13
+ let {asChild, children, ...props}: QrCodePatternProps = $props();
14
14
 
15
15
  let qrCode = qrCodeContext.get();
16
16
 
package/dist/qr-code/pattern.svelte.d.ts CHANGED
@@ -11,7 +11,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
11
11
  };
12
12
  z_$$bindings?: Bindings;
13
13
  }
14
- declare const Pattern: $$__sveltets_2_IsomorphicComponent<QRCodePatternProps, {
14
+ declare const Pattern: $$__sveltets_2_IsomorphicComponent<QrCodePatternProps, {
15
15
  [evt: string]: CustomEvent<any>;
16
16
  }, {}, {}, "">;
17
17
  type Pattern = InstanceType<typeof Pattern>;
package/dist/qr-code/root.svelte CHANGED
@@ -2,14 +2,14 @@
2
2
  import type {AsChild, Assign, HTMLProps} from '../types.js';
3
3
  import type {Snippet} from 'svelte';
4
4
  import type {
5
- CreateQRCodeProps,
6
- CreateQRCodeReturn,
5
+ CreateQrCodeProps,
6
+ CreateQrCodeReturn,
7
7
  } from './create-qr-code.svelte.js';
8
8
 
9
- export interface QRCodeProps
10
- extends Assign<Omit<HTMLProps<'div'>, 'children'>, CreateQRCodeProps> {
11
- asChild?: AsChild<CreateQRCodeReturn>;
12
- children?: Snippet<[CreateQRCodeReturn]>;
9
+ export interface QrCodeProps
10
+ extends Assign<Omit<HTMLProps<'div'>, 'children'>, CreateQrCodeProps> {
11
+ asChild?: AsChild<CreateQrCodeReturn>;
12
+ children?: Snippet<[CreateQrCodeReturn]>;
13
13
  }
14
14
  </script>
15
15
 
@@ -20,10 +20,10 @@
20
20
  import {qrCodeContext} from './context.svelte.js';
21
21
  import {createQRCode} from './create-qr-code.svelte.js';
22
22
 
23
- let {asChild, children, ...props}: QRCodeProps = $props();
23
+ let {asChild, children, ...props}: QrCodeProps = $props();
24
24
 
25
25
  let [qrCodeProps, otherProps] = $derived(
26
- createSplitProps<CreateQRCodeProps>(['id', 'ids', 'value', 'encoding'])(
26
+ createSplitProps<CreateQrCodeProps>(['id', 'ids', 'value', 'encoding'])(
27
27
  props,
28
28
  ),
29
29
  );
package/dist/qr-code/root.svelte.d.ts CHANGED
@@ -11,7 +11,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
11
11
  };
12
12
  z_$$bindings?: Bindings;
13
13
  }
14
- declare const Root: $$__sveltets_2_IsomorphicComponent<QRCodeProps, {
14
+ declare const Root: $$__sveltets_2_IsomorphicComponent<QrCodeProps, {
15
15
  [evt: string]: CustomEvent<any>;
16
16
  }, {}, {}, "">;
17
17
  type Root = InstanceType<typeof Root>;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "ui-ingredients",
3
3
  "type": "module",
4
- "version": "0.0.33",
4
+ "version": "0.0.35",
5
5
  "packageManager": "pnpm@9.7.0",
6
6
  "svelte": "./dist/index.js",
7
7
  "types": "./dist/index.d.ts",