ui-ingredients 0.0.33 → 0.0.35

Sign up to get free protection for your applications and to get access to all the features.
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",