@stubber/ui 1.9.0 → 1.11.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.
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { type VariantProps } from "tailwind-variants";
|
|
2
|
+
import Root from "./toggle.svelte";
|
|
3
|
+
export declare const toggleVariants: import("tailwind-variants").TVReturnType<{
|
|
4
|
+
variant: {
|
|
5
|
+
default: string;
|
|
6
|
+
outline: string;
|
|
7
|
+
};
|
|
8
|
+
size: {
|
|
9
|
+
default: string;
|
|
10
|
+
sm: string;
|
|
11
|
+
lg: string;
|
|
12
|
+
};
|
|
13
|
+
}, undefined, "ring-offset-background hover:bg-muted hover:text-muted-foreground focus-visible:ring-ring data-[state=on]:bg-accent data-[state=on]:text-accent-foreground inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", import("tailwind-variants/dist/config.d.ts").TVConfig<{
|
|
14
|
+
variant: {
|
|
15
|
+
default: string;
|
|
16
|
+
outline: string;
|
|
17
|
+
};
|
|
18
|
+
size: {
|
|
19
|
+
default: string;
|
|
20
|
+
sm: string;
|
|
21
|
+
lg: string;
|
|
22
|
+
};
|
|
23
|
+
}, {
|
|
24
|
+
variant: {
|
|
25
|
+
default: string;
|
|
26
|
+
outline: string;
|
|
27
|
+
};
|
|
28
|
+
size: {
|
|
29
|
+
default: string;
|
|
30
|
+
sm: string;
|
|
31
|
+
lg: string;
|
|
32
|
+
};
|
|
33
|
+
}>, {
|
|
34
|
+
variant: {
|
|
35
|
+
default: string;
|
|
36
|
+
outline: string;
|
|
37
|
+
};
|
|
38
|
+
size: {
|
|
39
|
+
default: string;
|
|
40
|
+
sm: string;
|
|
41
|
+
lg: string;
|
|
42
|
+
};
|
|
43
|
+
}, undefined, import("tailwind-variants").TVReturnType<{
|
|
44
|
+
variant: {
|
|
45
|
+
default: string;
|
|
46
|
+
outline: string;
|
|
47
|
+
};
|
|
48
|
+
size: {
|
|
49
|
+
default: string;
|
|
50
|
+
sm: string;
|
|
51
|
+
lg: string;
|
|
52
|
+
};
|
|
53
|
+
}, undefined, "ring-offset-background hover:bg-muted hover:text-muted-foreground focus-visible:ring-ring data-[state=on]:bg-accent data-[state=on]:text-accent-foreground inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", import("tailwind-variants/dist/config.d.ts").TVConfig<{
|
|
54
|
+
variant: {
|
|
55
|
+
default: string;
|
|
56
|
+
outline: string;
|
|
57
|
+
};
|
|
58
|
+
size: {
|
|
59
|
+
default: string;
|
|
60
|
+
sm: string;
|
|
61
|
+
lg: string;
|
|
62
|
+
};
|
|
63
|
+
}, {
|
|
64
|
+
variant: {
|
|
65
|
+
default: string;
|
|
66
|
+
outline: string;
|
|
67
|
+
};
|
|
68
|
+
size: {
|
|
69
|
+
default: string;
|
|
70
|
+
sm: string;
|
|
71
|
+
lg: string;
|
|
72
|
+
};
|
|
73
|
+
}>, unknown, unknown, undefined>>;
|
|
74
|
+
export type Variant = VariantProps<typeof toggleVariants>["variant"];
|
|
75
|
+
export type Size = VariantProps<typeof toggleVariants>["size"];
|
|
76
|
+
export { Root, Root as Toggle, };
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { tv } from "tailwind-variants";
|
|
2
|
+
import Root from "./toggle.svelte";
|
|
3
|
+
export const toggleVariants = tv({
|
|
4
|
+
base: "ring-offset-background hover:bg-muted hover:text-muted-foreground focus-visible:ring-ring data-[state=on]:bg-accent data-[state=on]:text-accent-foreground inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
|
|
5
|
+
variants: {
|
|
6
|
+
variant: {
|
|
7
|
+
default: "bg-transparent",
|
|
8
|
+
outline: "border-input hover:bg-accent hover:text-accent-foreground border bg-transparent",
|
|
9
|
+
},
|
|
10
|
+
size: {
|
|
11
|
+
default: "h-10 px-3",
|
|
12
|
+
sm: "h-9 px-2.5",
|
|
13
|
+
lg: "h-11 px-5",
|
|
14
|
+
},
|
|
15
|
+
},
|
|
16
|
+
defaultVariants: {
|
|
17
|
+
variant: "default",
|
|
18
|
+
size: "default",
|
|
19
|
+
},
|
|
20
|
+
});
|
|
21
|
+
export { Root,
|
|
22
|
+
//
|
|
23
|
+
Root as Toggle, };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<script>import { Toggle as TogglePrimitive } from "bits-ui";
|
|
2
|
+
import { toggleVariants } from "./index.js";
|
|
3
|
+
import { cn } from "../../utils/shadcn-utils.js";
|
|
4
|
+
let className = void 0;
|
|
5
|
+
export let variant = "default";
|
|
6
|
+
export let size = "default";
|
|
7
|
+
export let pressed = void 0;
|
|
8
|
+
export { className as class };
|
|
9
|
+
</script>
|
|
10
|
+
|
|
11
|
+
<TogglePrimitive.Root
|
|
12
|
+
bind:pressed
|
|
13
|
+
class={cn(toggleVariants({ variant, size, className }))}
|
|
14
|
+
{...$$restProps}
|
|
15
|
+
on:click
|
|
16
|
+
>
|
|
17
|
+
<slot />
|
|
18
|
+
</TogglePrimitive.Root>
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { SvelteComponent } from "svelte";
|
|
2
|
+
import { Toggle as TogglePrimitive } from "bits-ui";
|
|
3
|
+
import { type Size, type Variant } from "./index.js";
|
|
4
|
+
declare const __propDef: {
|
|
5
|
+
props: {
|
|
6
|
+
disabled?: boolean | undefined;
|
|
7
|
+
pressed?: boolean | undefined | undefined;
|
|
8
|
+
onPressedChange?: import("bits-ui/dist/internal/types.js").OnChangeFn<boolean> | undefined;
|
|
9
|
+
asChild?: boolean | undefined | undefined;
|
|
10
|
+
el?: HTMLButtonElement | undefined;
|
|
11
|
+
} & import("svelte/elements.js").HTMLButtonAttributes & {
|
|
12
|
+
variant?: Variant;
|
|
13
|
+
size?: Size;
|
|
14
|
+
};
|
|
15
|
+
slots: {
|
|
16
|
+
default: {};
|
|
17
|
+
};
|
|
18
|
+
events: TogglePrimitive.Events;
|
|
19
|
+
};
|
|
20
|
+
export type ToggleProps = typeof __propDef.props;
|
|
21
|
+
export type ToggleEvents = typeof __propDef.events;
|
|
22
|
+
export type ToggleSlots = typeof __propDef.slots;
|
|
23
|
+
export default class Toggle extends SvelteComponent<ToggleProps, ToggleEvents, ToggleSlots> {
|
|
24
|
+
}
|
|
25
|
+
export {};
|
|
@@ -122,3 +122,58 @@ body {
|
|
|
122
122
|
}
|
|
123
123
|
}
|
|
124
124
|
}
|
|
125
|
+
|
|
126
|
+
.prose {
|
|
127
|
+
font-size: unset;
|
|
128
|
+
line-height: unset;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.prose li,
|
|
132
|
+
.prose ul {
|
|
133
|
+
margin: unset;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
.prose h1,
|
|
137
|
+
.prose h2,
|
|
138
|
+
.prose h3,
|
|
139
|
+
.prose h4,
|
|
140
|
+
.prose h5,
|
|
141
|
+
.prose h6 {
|
|
142
|
+
color: unset;
|
|
143
|
+
margin: unset;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
.prose h1 {
|
|
147
|
+
font-size: 1.5em;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
.prose h2 {
|
|
151
|
+
font-size: 1.25em;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
.prose h3 {
|
|
155
|
+
font-size: 1.125em;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.prose h4 {
|
|
159
|
+
font-size: 1em;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
.prose h5 {
|
|
163
|
+
font-weight: 600;
|
|
164
|
+
font-size: 0.875em;
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
.prose h6 {
|
|
168
|
+
font-weight: 600;
|
|
169
|
+
font-size: 0.875em;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
.prose p {
|
|
173
|
+
margin: unset;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.prose hr {
|
|
177
|
+
margin-top: 1em;
|
|
178
|
+
margin-bottom: 1em;
|
|
179
|
+
}
|