@invopop/popui 0.0.76 → 0.0.77-beta

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 (84) hide show
  1. package/dist/AlertDialog.svelte +38 -0
  2. package/dist/AlertDialog.svelte.d.ts +25 -0
  3. package/dist/BaseDropdown.svelte +1 -1
  4. package/dist/BaseTable.svelte +43 -56
  5. package/dist/BaseTableActions.svelte +12 -2
  6. package/dist/BaseTableCellContent.svelte +64 -0
  7. package/dist/BaseTableCellContent.svelte.d.ts +24 -0
  8. package/dist/BaseTableCheckbox.svelte +28 -0
  9. package/dist/BaseTableCheckbox.svelte.d.ts +21 -0
  10. package/dist/BaseTableHeaderContent.svelte +59 -0
  11. package/dist/BaseTableHeaderContent.svelte.d.ts +21 -0
  12. package/dist/BaseTableRow.svelte +44 -41
  13. package/dist/BaseTableRow.svelte.d.ts +1 -1
  14. package/dist/DrawerContext.svelte +1 -1
  15. package/dist/StepIconList.svelte +45 -0
  16. package/dist/StepIconList.svelte.d.ts +17 -0
  17. package/dist/alert-dialog/alert-dialog-action.svelte +19 -0
  18. package/dist/alert-dialog/alert-dialog-action.svelte.d.ts +28 -0
  19. package/dist/alert-dialog/alert-dialog-cancel.svelte +16 -0
  20. package/dist/alert-dialog/alert-dialog-cancel.svelte.d.ts +23 -0
  21. package/dist/alert-dialog/alert-dialog-content.svelte +23 -0
  22. package/dist/alert-dialog/alert-dialog-content.svelte.d.ts +17 -0
  23. package/dist/alert-dialog/alert-dialog-description.svelte +12 -0
  24. package/dist/alert-dialog/alert-dialog-description.svelte.d.ts +17 -0
  25. package/dist/alert-dialog/alert-dialog-footer.svelte +11 -0
  26. package/dist/alert-dialog/alert-dialog-footer.svelte.d.ts +17 -0
  27. package/dist/alert-dialog/alert-dialog-header.svelte +8 -0
  28. package/dist/alert-dialog/alert-dialog-header.svelte.d.ts +17 -0
  29. package/dist/alert-dialog/alert-dialog-overlay.svelte +17 -0
  30. package/dist/alert-dialog/alert-dialog-overlay.svelte.d.ts +15 -0
  31. package/dist/alert-dialog/alert-dialog-portal.svelte +6 -0
  32. package/dist/alert-dialog/alert-dialog-portal.svelte.d.ts +17 -0
  33. package/dist/alert-dialog/alert-dialog-title.svelte +10 -0
  34. package/dist/alert-dialog/alert-dialog-title.svelte.d.ts +17 -0
  35. package/dist/alert-dialog/index.d.ts +13 -0
  36. package/dist/alert-dialog/index.js +15 -0
  37. package/dist/button/button.svelte +20 -0
  38. package/dist/button/button.svelte.d.ts +16 -0
  39. package/dist/button/index.d.ts +60 -0
  40. package/dist/button/index.js +29 -0
  41. package/dist/index.d.ts +6 -2
  42. package/dist/index.js +6 -1
  43. package/dist/table/index.d.ts +9 -0
  44. package/dist/table/index.js +11 -0
  45. package/dist/table/table-body.svelte +8 -0
  46. package/dist/table/table-body.svelte.d.ts +17 -0
  47. package/dist/table/table-caption.svelte +8 -0
  48. package/dist/table/table-caption.svelte.d.ts +17 -0
  49. package/dist/table/table-cell.svelte +16 -0
  50. package/dist/table/table-cell.svelte.d.ts +20 -0
  51. package/dist/table/table-footer.svelte +8 -0
  52. package/dist/table/table-footer.svelte.d.ts +17 -0
  53. package/dist/table/table-head.svelte +14 -0
  54. package/dist/table/table-head.svelte.d.ts +17 -0
  55. package/dist/table/table-header.svelte +14 -0
  56. package/dist/table/table-header.svelte.d.ts +20 -0
  57. package/dist/table/table-row.svelte +17 -0
  58. package/dist/table/table-row.svelte.d.ts +23 -0
  59. package/dist/table/table.svelte +10 -0
  60. package/dist/table/table.svelte.d.ts +17 -0
  61. package/dist/tabs/index.d.ts +6 -0
  62. package/dist/tabs/index.js +8 -0
  63. package/dist/tabs/tabs-content.svelte +17 -0
  64. package/dist/tabs/tabs-content.svelte.d.ts +17 -0
  65. package/dist/tabs/tabs-list.svelte +15 -0
  66. package/dist/tabs/tabs-list.svelte.d.ts +17 -0
  67. package/dist/tabs/tabs-trigger.svelte +18 -0
  68. package/dist/tabs/tabs-trigger.svelte.d.ts +15 -0
  69. package/dist/tooltip/index.d.ts +5 -0
  70. package/dist/tooltip/index.js +7 -0
  71. package/dist/tooltip/tooltip-content.svelte +25 -0
  72. package/dist/tooltip/tooltip-content.svelte.d.ts +17 -0
  73. package/dist/tw.theme.d.ts +4 -0
  74. package/dist/tw.theme.js +7 -3
  75. package/dist/types.d.ts +4 -0
  76. package/dist/utils.d.ts +13 -0
  77. package/dist/utils.js +38 -0
  78. package/package.json +4 -1
  79. package/dist/BaseTableCell.svelte +0 -91
  80. package/dist/BaseTableCell.svelte.d.ts +0 -28
  81. package/dist/BaseTableHeader.svelte +0 -68
  82. package/dist/BaseTableHeader.svelte.d.ts +0 -24
  83. package/dist/Tabs.svelte +0 -41
  84. package/dist/Tabs.svelte.d.ts +0 -20
@@ -0,0 +1,45 @@
1
+ <script>import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip";
2
+ export let icons = [];
3
+ $:
4
+ maxItems = icons.length > 6 ? 5 : 6;
5
+ $:
6
+ mainIcons = icons.slice(0, maxItems);
7
+ $:
8
+ restIcons = icons.slice(maxItems + 1, icons.length);
9
+ </script>
10
+
11
+ <div class="flex flex-col space-y-2 sm:flex-row sm:space-y-0 items-center overflow-x-auto">
12
+ {#each mainIcons as icon, i (i)}
13
+ <Tooltip>
14
+ <TooltipTrigger>
15
+ <div
16
+ class="p-1.5 border rounded-md border-neutral-200 flex items-center space-x-1 bg-white text-neutral-800 flex-shrink-0"
17
+ >
18
+ <img src={icon.url} alt={icon.name} class="w-4 h-4" />
19
+ </div>
20
+ </TooltipTrigger>
21
+ <TooltipContent>{icon.name}</TooltipContent>
22
+ </Tooltip>
23
+
24
+ {#if i < mainIcons.length - 1}
25
+ <div class="hidden sm:block h-px w-3 border border-neutral-200 mx-px flex-shrink-0" />
26
+ {/if}
27
+ {/each}
28
+ {#if restIcons.length}
29
+ <div class="hidden sm:block h-px w-3 border border-neutral-200 mx-px flex-shrink-0" />
30
+ <Tooltip>
31
+ <TooltipTrigger>
32
+ <div
33
+ class="flex items-center justify-center text-neutral-500 font-medium text-base h-7 w-7"
34
+ >
35
+ +{restIcons.length}
36
+ </div>
37
+ </TooltipTrigger>
38
+ <TooltipContent>
39
+ {#each restIcons as restIcon}
40
+ <div>{restIcon.name}</div>
41
+ {/each}
42
+ </TooltipContent>
43
+ </Tooltip>
44
+ {/if}
45
+ </div>
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import type { StepIcon } from './types.js';
3
+ declare const __propDef: {
4
+ props: {
5
+ icons?: StepIcon[] | undefined;
6
+ };
7
+ events: {
8
+ [evt: string]: CustomEvent<any>;
9
+ };
10
+ slots: {};
11
+ };
12
+ export type StepIconListProps = typeof __propDef.props;
13
+ export type StepIconListEvents = typeof __propDef.events;
14
+ export type StepIconListSlots = typeof __propDef.slots;
15
+ export default class StepIconList extends SvelteComponent<StepIconListProps, StepIconListEvents, StepIconListSlots> {
16
+ }
17
+ export {};
@@ -0,0 +1,19 @@
1
+ <script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
2
+ import { buttonVariants } from "../button/index.js";
3
+ import { cn } from "../utils.js";
4
+ let className = void 0;
5
+ let destructive = false;
6
+ export { className as class, destructive };
7
+ $:
8
+ variant = destructive ? "destructive" : "primary";
9
+ </script>
10
+
11
+ <AlertDialogPrimitive.Action
12
+ class={cn(buttonVariants({ variant }), className)}
13
+ {...$$restProps}
14
+ on:click
15
+ on:keydown
16
+ let:builder
17
+ >
18
+ <slot {builder} />
19
+ </AlertDialogPrimitive.Action>
@@ -0,0 +1,28 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
3
+ declare const __propDef: {
4
+ props: {
5
+ asChild?: boolean | undefined;
6
+ el?: HTMLButtonElement | undefined;
7
+ } & import("svelte/elements").HTMLButtonAttributes & {
8
+ destructive: boolean;
9
+ };
10
+ slots: {
11
+ default: {
12
+ builder: {
13
+ readonly type: "button";
14
+ } & {
15
+ [x: `data-melt-${string}`]: "";
16
+ } & {
17
+ action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"click" | "keydown">;
18
+ };
19
+ };
20
+ };
21
+ events: AlertDialogPrimitive.ActionEvents;
22
+ };
23
+ export type AlertDialogActionProps = typeof __propDef.props;
24
+ export type AlertDialogActionEvents = typeof __propDef.events;
25
+ export type AlertDialogActionSlots = typeof __propDef.slots;
26
+ export default class AlertDialogAction extends SvelteComponent<AlertDialogActionProps, AlertDialogActionEvents, AlertDialogActionSlots> {
27
+ }
28
+ export {};
@@ -0,0 +1,16 @@
1
+ <script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
2
+ import { buttonVariants } from "../button/index.js";
3
+ import { cn } from "../utils.js";
4
+ let className = void 0;
5
+ export { className as class };
6
+ </script>
7
+
8
+ <AlertDialogPrimitive.Cancel
9
+ class={cn(buttonVariants({ variant: 'secondary' }), 'mt-2 sm:mt-0', className)}
10
+ {...$$restProps}
11
+ on:click
12
+ on:keydown
13
+ let:builder
14
+ >
15
+ <slot {builder} />
16
+ </AlertDialogPrimitive.Cancel>
@@ -0,0 +1,23 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
3
+ declare const __propDef: {
4
+ props: AlertDialogPrimitive.CancelProps;
5
+ slots: {
6
+ default: {
7
+ builder: {
8
+ readonly type: "button";
9
+ } & {
10
+ [x: `data-melt-${string}`]: "";
11
+ } & {
12
+ action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"click" | "keydown">;
13
+ };
14
+ };
15
+ };
16
+ events: AlertDialogPrimitive.CancelEvents;
17
+ };
18
+ export type AlertDialogCancelProps = typeof __propDef.props;
19
+ export type AlertDialogCancelEvents = typeof __propDef.events;
20
+ export type AlertDialogCancelSlots = typeof __propDef.slots;
21
+ export default class AlertDialogCancel extends SvelteComponent<AlertDialogCancelProps, AlertDialogCancelEvents, AlertDialogCancelSlots> {
22
+ }
23
+ export {};
@@ -0,0 +1,23 @@
1
+ <script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
2
+ import * as AlertDialog from "./index.js";
3
+ import { cn, flyAndScale } from "../utils.js";
4
+ export let transition = flyAndScale;
5
+ export let transitionConfig = void 0;
6
+ let className = void 0;
7
+ export { className as class };
8
+ </script>
9
+
10
+ <AlertDialog.Portal>
11
+ <AlertDialog.Overlay />
12
+ <AlertDialogPrimitive.Content
13
+ {transition}
14
+ {transitionConfig}
15
+ class={cn(
16
+ 'bg-white fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-5 border pt-3 px-4 pb-4 sm:rounded-lg md:w-full',
17
+ className
18
+ )}
19
+ {...$$restProps}
20
+ >
21
+ <slot />
22
+ </AlertDialogPrimitive.Content>
23
+ </AlertDialog.Portal>
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
3
+ declare const __propDef: {
4
+ props: AlertDialogPrimitive.ContentProps;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type AlertDialogContentProps = typeof __propDef.props;
13
+ export type AlertDialogContentEvents = typeof __propDef.events;
14
+ export type AlertDialogContentSlots = typeof __propDef.slots;
15
+ export default class AlertDialogContent extends SvelteComponent<AlertDialogContentProps, AlertDialogContentEvents, AlertDialogContentSlots> {
16
+ }
17
+ export {};
@@ -0,0 +1,12 @@
1
+ <script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
2
+ import { cn } from "../utils.js";
3
+ let className = void 0;
4
+ export { className as class };
5
+ </script>
6
+
7
+ <AlertDialogPrimitive.Description
8
+ class={cn('text-neutral-500 text-base', className)}
9
+ {...$$restProps}
10
+ >
11
+ <slot />
12
+ </AlertDialogPrimitive.Description>
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
3
+ declare const __propDef: {
4
+ props: AlertDialogPrimitive.DescriptionProps;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type AlertDialogDescriptionProps = typeof __propDef.props;
13
+ export type AlertDialogDescriptionEvents = typeof __propDef.events;
14
+ export type AlertDialogDescriptionSlots = typeof __propDef.slots;
15
+ export default class AlertDialogDescription extends SvelteComponent<AlertDialogDescriptionProps, AlertDialogDescriptionEvents, AlertDialogDescriptionSlots> {
16
+ }
17
+ export {};
@@ -0,0 +1,11 @@
1
+ <script>import { cn } from "../utils.js";
2
+ let className = void 0;
3
+ export { className as class };
4
+ </script>
5
+
6
+ <div
7
+ class={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-3', className)}
8
+ {...$$restProps}
9
+ >
10
+ <slot />
11
+ </div>
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import type { HTMLAttributes } from 'svelte/elements';
3
+ declare const __propDef: {
4
+ props: HTMLAttributes<HTMLDivElement>;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type AlertDialogFooterProps = typeof __propDef.props;
13
+ export type AlertDialogFooterEvents = typeof __propDef.events;
14
+ export type AlertDialogFooterSlots = typeof __propDef.slots;
15
+ export default class AlertDialogFooter extends SvelteComponent<AlertDialogFooterProps, AlertDialogFooterEvents, AlertDialogFooterSlots> {
16
+ }
17
+ export {};
@@ -0,0 +1,8 @@
1
+ <script>import { cn } from "../utils.js";
2
+ let className = void 0;
3
+ export { className as class };
4
+ </script>
5
+
6
+ <div class={cn('flex flex-col space-y-1 text-center sm:text-left', className)} {...$$restProps}>
7
+ <slot />
8
+ </div>
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import type { HTMLAttributes } from 'svelte/elements';
3
+ declare const __propDef: {
4
+ props: HTMLAttributes<HTMLDivElement>;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type AlertDialogHeaderProps = typeof __propDef.props;
13
+ export type AlertDialogHeaderEvents = typeof __propDef.events;
14
+ export type AlertDialogHeaderSlots = typeof __propDef.slots;
15
+ export default class AlertDialogHeader extends SvelteComponent<AlertDialogHeaderProps, AlertDialogHeaderEvents, AlertDialogHeaderSlots> {
16
+ }
17
+ export {};
@@ -0,0 +1,17 @@
1
+ <script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
2
+ import { fade } from "svelte/transition";
3
+ import { cn } from "../utils.js";
4
+ let className = void 0;
5
+ export let transition = fade;
6
+ export let transitionConfig = {
7
+ duration: 150
8
+ };
9
+ export { className as class };
10
+ </script>
11
+
12
+ <AlertDialogPrimitive.Overlay
13
+ {transition}
14
+ {transitionConfig}
15
+ class={cn('bg-neutral-800/30 fixed inset-0 z-50', className)}
16
+ {...$$restProps}
17
+ />
@@ -0,0 +1,15 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
3
+ declare const __propDef: {
4
+ props: AlertDialogPrimitive.OverlayProps;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {};
9
+ };
10
+ export type AlertDialogOverlayProps = typeof __propDef.props;
11
+ export type AlertDialogOverlayEvents = typeof __propDef.events;
12
+ export type AlertDialogOverlaySlots = typeof __propDef.slots;
13
+ export default class AlertDialogOverlay extends SvelteComponent<AlertDialogOverlayProps, AlertDialogOverlayEvents, AlertDialogOverlaySlots> {
14
+ }
15
+ export {};
@@ -0,0 +1,6 @@
1
+ <script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
2
+ </script>
3
+
4
+ <AlertDialogPrimitive.Portal {...$$restProps}>
5
+ <slot />
6
+ </AlertDialogPrimitive.Portal>
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
3
+ declare const __propDef: {
4
+ props: AlertDialogPrimitive.PortalProps;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type AlertDialogPortalProps = typeof __propDef.props;
13
+ export type AlertDialogPortalEvents = typeof __propDef.events;
14
+ export type AlertDialogPortalSlots = typeof __propDef.slots;
15
+ export default class AlertDialogPortal extends SvelteComponent<AlertDialogPortalProps, AlertDialogPortalEvents, AlertDialogPortalSlots> {
16
+ }
17
+ export {};
@@ -0,0 +1,10 @@
1
+ <script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
2
+ import { cn } from "../utils.js";
3
+ let className = void 0;
4
+ export let level = "h3";
5
+ export { className as class };
6
+ </script>
7
+
8
+ <AlertDialogPrimitive.Title class={cn('text-lg font-semibold', className)} {level} {...$$restProps}>
9
+ <slot />
10
+ </AlertDialogPrimitive.Title>
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
3
+ declare const __propDef: {
4
+ props: AlertDialogPrimitive.TitleProps;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type AlertDialogTitleProps = typeof __propDef.props;
13
+ export type AlertDialogTitleEvents = typeof __propDef.events;
14
+ export type AlertDialogTitleSlots = typeof __propDef.slots;
15
+ export default class AlertDialogTitle extends SvelteComponent<AlertDialogTitleProps, AlertDialogTitleEvents, AlertDialogTitleSlots> {
16
+ }
17
+ export {};
@@ -0,0 +1,13 @@
1
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
2
+ import Title from './alert-dialog-title.svelte';
3
+ import Action from './alert-dialog-action.svelte';
4
+ import Cancel from './alert-dialog-cancel.svelte';
5
+ import Portal from './alert-dialog-portal.svelte';
6
+ import Footer from './alert-dialog-footer.svelte';
7
+ import Header from './alert-dialog-header.svelte';
8
+ import Overlay from './alert-dialog-overlay.svelte';
9
+ import Content from './alert-dialog-content.svelte';
10
+ import Description from './alert-dialog-description.svelte';
11
+ declare const Root: typeof AlertDialogPrimitive.Root;
12
+ declare const Trigger: typeof AlertDialogPrimitive.Trigger;
13
+ export { Root, Title, Action, Cancel, Portal, Footer, Header, Trigger, Overlay, Content, Description, Root as AlertDialog, Title as AlertDialogTitle, Action as AlertDialogAction, Cancel as AlertDialogCancel, Portal as AlertDialogPortal, Footer as AlertDialogFooter, Header as AlertDialogHeader, Trigger as AlertDialogTrigger, Overlay as AlertDialogOverlay, Content as AlertDialogContent, Description as AlertDialogDescription };
@@ -0,0 +1,15 @@
1
+ import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
2
+ import Title from './alert-dialog-title.svelte';
3
+ import Action from './alert-dialog-action.svelte';
4
+ import Cancel from './alert-dialog-cancel.svelte';
5
+ import Portal from './alert-dialog-portal.svelte';
6
+ import Footer from './alert-dialog-footer.svelte';
7
+ import Header from './alert-dialog-header.svelte';
8
+ import Overlay from './alert-dialog-overlay.svelte';
9
+ import Content from './alert-dialog-content.svelte';
10
+ import Description from './alert-dialog-description.svelte';
11
+ const Root = AlertDialogPrimitive.Root;
12
+ const Trigger = AlertDialogPrimitive.Trigger;
13
+ export { Root, Title, Action, Cancel, Portal, Footer, Header, Trigger, Overlay, Content, Description,
14
+ //
15
+ Root as AlertDialog, Title as AlertDialogTitle, Action as AlertDialogAction, Cancel as AlertDialogCancel, Portal as AlertDialogPortal, Footer as AlertDialogFooter, Header as AlertDialogHeader, Trigger as AlertDialogTrigger, Overlay as AlertDialogOverlay, Content as AlertDialogContent, Description as AlertDialogDescription };
@@ -0,0 +1,20 @@
1
+ <script>import { Button as ButtonPrimitive } from "bits-ui";
2
+ import { buttonVariants } from "./index.js";
3
+ import { cn } from "../utils.js";
4
+ let className = void 0;
5
+ export let variant = "default";
6
+ export let size = "default";
7
+ export let builders = [];
8
+ export { className as class };
9
+ </script>
10
+
11
+ <ButtonPrimitive.Root
12
+ {builders}
13
+ class={cn(buttonVariants({ variant, size, className }))}
14
+ type="button"
15
+ {...$$restProps}
16
+ on:click
17
+ on:keydown
18
+ >
19
+ <slot />
20
+ </ButtonPrimitive.Root>
@@ -0,0 +1,16 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import { Button as ButtonPrimitive } from 'bits-ui';
3
+ import { type Props } from './index.js';
4
+ declare const __propDef: {
5
+ props: Props;
6
+ slots: {
7
+ default: {};
8
+ };
9
+ events: ButtonPrimitive.Events;
10
+ };
11
+ export type ButtonProps = typeof __propDef.props;
12
+ export type ButtonEvents = typeof __propDef.events;
13
+ export type ButtonSlots = typeof __propDef.slots;
14
+ export default class Button extends SvelteComponent<ButtonProps, ButtonEvents, ButtonSlots> {
15
+ }
16
+ export {};
@@ -0,0 +1,60 @@
1
+ import { type VariantProps } from 'tailwind-variants';
2
+ import type { Button as ButtonPrimitive } from 'bits-ui';
3
+ import Root from './button.svelte';
4
+ declare const buttonVariants: import("tailwind-variants").TVReturnType<{
5
+ variant: {
6
+ default: string;
7
+ destructive: string;
8
+ outline: string;
9
+ primary: string;
10
+ secondary: string;
11
+ ghost: string;
12
+ link: string;
13
+ };
14
+ size: {
15
+ default: string;
16
+ sm: string;
17
+ lg: string;
18
+ icon: string;
19
+ };
20
+ }, undefined, "ring-workspace-accent-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 flex items-center justify-center font-medium font-sans relative group tracking-tight rounded-md", {
21
+ variant: {
22
+ default: string;
23
+ destructive: string;
24
+ outline: string;
25
+ primary: string;
26
+ secondary: string;
27
+ ghost: string;
28
+ link: string;
29
+ };
30
+ size: {
31
+ default: string;
32
+ sm: string;
33
+ lg: string;
34
+ icon: string;
35
+ };
36
+ }, undefined, import("tailwind-variants").TVReturnType<{
37
+ variant: {
38
+ default: string;
39
+ destructive: string;
40
+ outline: string;
41
+ primary: string;
42
+ secondary: string;
43
+ ghost: string;
44
+ link: string;
45
+ };
46
+ size: {
47
+ default: string;
48
+ sm: string;
49
+ lg: string;
50
+ icon: string;
51
+ };
52
+ }, undefined, "ring-workspace-accent-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 flex items-center justify-center font-medium font-sans relative group tracking-tight rounded-md", unknown, unknown, undefined>>;
53
+ type Variant = VariantProps<typeof buttonVariants>['variant'];
54
+ type Size = VariantProps<typeof buttonVariants>['size'];
55
+ type Props = ButtonPrimitive.Props & {
56
+ variant?: Variant;
57
+ size?: Size;
58
+ };
59
+ type Events = ButtonPrimitive.Events;
60
+ export { Root, type Props, type Events, type Variant, Root as Button, type Props as ButtonProps, type Events as ButtonEvents, buttonVariants };
@@ -0,0 +1,29 @@
1
+ import { tv } from 'tailwind-variants';
2
+ import Root from './button.svelte';
3
+ const buttonVariants = tv({
4
+ base: 'ring-workspace-accent-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 flex items-center justify-center font-medium font-sans relative group tracking-tight rounded-md',
5
+ variants: {
6
+ variant: {
7
+ default: 'bg-primary text-primary-foreground hover:bg-primary/90',
8
+ destructive: 'ring-danger-200 bg-danger-500 border border-danger-500 hover:bg-danger-600 hover:border-danger-600 active:bg-danger-700 active:border-danger-700 text-white',
9
+ outline: 'border-input bg-background hover:bg-accent hover:text-accent-foreground border',
10
+ primary: 'bg-workspace-accent-500 hover:bg-workspace-accent-600 active:bg-workspace-accent-700 text-white',
11
+ secondary: 'bg-neutral-100 border border-neutral-100 hover:bg-neutral-200 hover:border-neutral-200 active:bg-neutral-300 active:border-neutral-300',
12
+ ghost: 'hover:bg-accent hover:text-accent-foreground',
13
+ link: 'text-primary underline-offset-4 hover:underline'
14
+ },
15
+ size: {
16
+ default: 'h-[30px] px-3 py-[5px]',
17
+ sm: 'h-9 rounded-md px-3',
18
+ lg: 'h-11 rounded-md px-8',
19
+ icon: 'h-10 w-10'
20
+ }
21
+ },
22
+ defaultVariants: {
23
+ variant: 'default',
24
+ size: 'default'
25
+ }
26
+ });
27
+ export { Root,
28
+ //
29
+ Root as Button, buttonVariants };
package/dist/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import AlertDialog from './AlertDialog.svelte';
1
2
  import BaseButton from './BaseButton.svelte';
2
3
  import BaseCard from './BaseCard.svelte';
3
4
  import BaseCounter from './BaseCounter.svelte';
@@ -41,7 +42,10 @@ import SectionLayout from './SectionLayout.svelte';
41
42
  import SeparatorHorizontal from './SeparatorHorizontal.svelte';
42
43
  import ShortcutWrapper from './ShortcutWrapper.svelte';
43
44
  import StatusLabel from './StatusLabel.svelte';
44
- import Tabs from './Tabs.svelte';
45
+ import { Tabs } from './tabs';
46
+ import { TabsContent } from './tabs';
47
+ import { TabsList } from './tabs';
48
+ import { TabsTrigger } from './tabs';
45
49
  import TagBeta from './TagBeta.svelte';
46
50
  import TagSearch from './TagSearch.svelte';
47
51
  import TagStatus from './TagStatus.svelte';
@@ -52,4 +56,4 @@ import twTheme from './tw.theme.js';
52
56
  import { resolveIcon } from './helpers.js';
53
57
  import { getCountryName } from './helpers.js';
54
58
  import { getStatusType } from './helpers.js';
55
- export { BaseButton, BaseCard, BaseCounter, BaseDropdown, BaseFlag, BaseTable, Breadcrumbs, ButtonFile, CardCheckbox, CardRelation, CompanySelector, CounterWorkflow, DataListItem, DatePicker, DrawerContext, DrawerContextItem, DropdownSelect, EmptyStateIcon, EmptyStateIllustration, FeedEvents, FeedIconEvent, FeedIconStatus, FeedItem, FeedItemDetail, FeedViewer, GlobalSearch, InputCheckbox, InputError, InputLabel, InputRadio, InputSearch, InputSelect, InputText, InputTextarea, InputToggle, MenuItem, MenuItemCollapsible, ProfileAvatar, ProfileSelector, SectionLayout, SeparatorHorizontal, ShortcutWrapper, StatusLabel, Tabs, TagBeta, TagSearch, TagStatus, TitleMain, TitleSection, UuidCopy, twTheme, resolveIcon, getCountryName, getStatusType };
59
+ export { AlertDialog, BaseButton, BaseCard, BaseCounter, BaseDropdown, BaseFlag, BaseTable, Breadcrumbs, ButtonFile, CardCheckbox, CardRelation, CompanySelector, CounterWorkflow, DataListItem, DatePicker, DrawerContext, DrawerContextItem, DropdownSelect, EmptyStateIcon, EmptyStateIllustration, FeedEvents, FeedIconEvent, FeedIconStatus, FeedItem, FeedItemDetail, FeedViewer, GlobalSearch, InputCheckbox, InputError, InputLabel, InputRadio, InputSearch, InputSelect, InputText, InputTextarea, InputToggle, MenuItem, MenuItemCollapsible, ProfileAvatar, ProfileSelector, SectionLayout, SeparatorHorizontal, ShortcutWrapper, StatusLabel, Tabs, TabsContent, TabsList, TabsTrigger, TagBeta, TagSearch, TagStatus, TitleMain, TitleSection, UuidCopy, twTheme, resolveIcon, getCountryName, getStatusType };
package/dist/index.js CHANGED
@@ -1,3 +1,4 @@
1
+ import AlertDialog from './AlertDialog.svelte'
1
2
  import BaseButton from './BaseButton.svelte'
2
3
  import BaseCard from './BaseCard.svelte'
3
4
  import BaseCounter from './BaseCounter.svelte'
@@ -41,7 +42,7 @@ import SectionLayout from './SectionLayout.svelte'
41
42
  import SeparatorHorizontal from './SeparatorHorizontal.svelte'
42
43
  import ShortcutWrapper from './ShortcutWrapper.svelte'
43
44
  import StatusLabel from './StatusLabel.svelte'
44
- import Tabs from './Tabs.svelte'
45
+ import { Tabs, TabsContent, TabsList, TabsTrigger } from './tabs'
45
46
  import TagBeta from './TagBeta.svelte'
46
47
  import TagSearch from './TagSearch.svelte'
47
48
  import TagStatus from './TagStatus.svelte'
@@ -52,6 +53,7 @@ import twTheme from './tw.theme.js'
52
53
  import { resolveIcon, getCountryName, getStatusType } from './helpers.js'
53
54
 
54
55
  export {
56
+ AlertDialog,
55
57
  BaseButton,
56
58
  BaseCard,
57
59
  BaseCounter,
@@ -96,6 +98,9 @@ export {
96
98
  ShortcutWrapper,
97
99
  StatusLabel,
98
100
  Tabs,
101
+ TabsContent,
102
+ TabsList,
103
+ TabsTrigger,
99
104
  TagBeta,
100
105
  TagSearch,
101
106
  TagStatus,
@@ -0,0 +1,9 @@
1
+ import Root from './table.svelte';
2
+ import Body from './table-body.svelte';
3
+ import Caption from './table-caption.svelte';
4
+ import Cell from './table-cell.svelte';
5
+ import Footer from './table-footer.svelte';
6
+ import Head from './table-head.svelte';
7
+ import Header from './table-header.svelte';
8
+ import Row from './table-row.svelte';
9
+ export { Root, Body, Caption, Cell, Footer, Head, Header, Row, Root as Table, Body as TableBody, Caption as TableCaption, Cell as TableCell, Footer as TableFooter, Head as TableHead, Header as TableHeader, Row as TableRow };
@@ -0,0 +1,11 @@
1
+ import Root from './table.svelte';
2
+ import Body from './table-body.svelte';
3
+ import Caption from './table-caption.svelte';
4
+ import Cell from './table-cell.svelte';
5
+ import Footer from './table-footer.svelte';
6
+ import Head from './table-head.svelte';
7
+ import Header from './table-header.svelte';
8
+ import Row from './table-row.svelte';
9
+ export { Root, Body, Caption, Cell, Footer, Head, Header, Row,
10
+ //
11
+ Root as Table, Body as TableBody, Caption as TableCaption, Cell as TableCell, Footer as TableFooter, Head as TableHead, Header as TableHeader, Row as TableRow };
@@ -0,0 +1,8 @@
1
+ <script>import { cn } from "../utils";
2
+ let className = void 0;
3
+ export { className as class };
4
+ </script>
5
+
6
+ <tbody class={cn('[&_tr:hover]:bg-neutral-50', className)} {...$$restProps}>
7
+ <slot />
8
+ </tbody>
@@ -0,0 +1,17 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import type { HTMLAttributes } from 'svelte/elements';
3
+ declare const __propDef: {
4
+ props: HTMLAttributes<HTMLTableSectionElement>;
5
+ events: {
6
+ [evt: string]: CustomEvent<any>;
7
+ };
8
+ slots: {
9
+ default: {};
10
+ };
11
+ };
12
+ export type TableBodyProps = typeof __propDef.props;
13
+ export type TableBodyEvents = typeof __propDef.events;
14
+ export type TableBodySlots = typeof __propDef.slots;
15
+ export default class TableBody extends SvelteComponent<TableBodyProps, TableBodyEvents, TableBodySlots> {
16
+ }
17
+ export {};