@stainless-api/ui-primitives 0.1.0-beta.39 → 0.1.0-beta.40

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.
@@ -1,2 +1,26 @@
1
- import { n as AccordionProps, t as Accordion } from "../Accordion-Cj5GURin.js";
1
+ import React from "react";
2
+ import * as react_jsx_runtime0 from "react/jsx-runtime";
3
+
4
+ //#region src/components/Accordion.d.ts
5
+ type AccordionProps = React.ComponentProps<'details'>;
6
+ declare function Accordion({
7
+ className,
8
+ children,
9
+ ...props
10
+ }: AccordionProps): react_jsx_runtime0.JSX.Element;
11
+ declare namespace Accordion {
12
+ var Summary: typeof AccordionSummary;
13
+ var Group: typeof AccordionGroup;
14
+ }
15
+ declare function AccordionSummary({
16
+ children,
17
+ className,
18
+ ...props
19
+ }: React.ComponentProps<'summary'>): react_jsx_runtime0.JSX.Element;
20
+ declare function AccordionGroup({
21
+ className,
22
+ children,
23
+ ...props
24
+ }: React.ComponentProps<'div'>): react_jsx_runtime0.JSX.Element;
25
+ //#endregion
2
26
  export { Accordion, AccordionProps };
@@ -1,3 +1,31 @@
1
- import { t as Accordion } from "../Accordion-CL3Oarbz.js";
1
+ import React from "react";
2
+ import clsx from "clsx";
3
+ import { jsx } from "react/jsx-runtime";
2
4
 
5
+ //#region src/components/Accordion.tsx
6
+ function Accordion({ className, children, ...props }) {
7
+ return /* @__PURE__ */ jsx("details", {
8
+ className: clsx("stl-ui-accordion", className),
9
+ ...props,
10
+ children
11
+ });
12
+ }
13
+ function AccordionSummary({ children, className, ...props }) {
14
+ return /* @__PURE__ */ jsx("summary", {
15
+ className: clsx("stl-ui-accordion__summary", className),
16
+ ...props,
17
+ children
18
+ });
19
+ }
20
+ Accordion.Summary = AccordionSummary;
21
+ function AccordionGroup({ className, children, ...props }) {
22
+ return /* @__PURE__ */ jsx("div", {
23
+ className: clsx("stl-ui-accordion-group", className),
24
+ ...props,
25
+ children
26
+ });
27
+ }
28
+ Accordion.Group = AccordionGroup;
29
+
30
+ //#endregion
3
31
  export { Accordion };
@@ -1,2 +1,42 @@
1
- import { n as ButtonProps, r as ButtonVariant, t as Button } from "../Button-D4DkAJY5.js";
1
+ import React from "react";
2
+ import * as react_jsx_runtime2 from "react/jsx-runtime";
3
+ import { LucideIcon } from "lucide-react";
4
+
5
+ //#region src/components/Button.d.ts
6
+ type ButtonVariant = 'outline' | 'ghost' | 'accent' | 'accent-muted' | 'muted' | 'success' | 'destructive' | 'default';
7
+ type BaseProps = {
8
+ variant?: ButtonVariant;
9
+ className?: string;
10
+ children?: React.ReactNode;
11
+ size?: 'sm' | 'lg' | 'default';
12
+ border?: boolean;
13
+ loading?: {
14
+ label: string;
15
+ };
16
+ };
17
+ type AnchorBranch = BaseProps & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'className' | 'children'> & {
18
+ href: string;
19
+ };
20
+ type ButtonBranch = BaseProps & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'className' | 'children'> & {
21
+ href?: never;
22
+ };
23
+ type ButtonProps = AnchorBranch | ButtonBranch;
24
+ declare function Button(props: ButtonProps): react_jsx_runtime2.JSX.Element;
25
+ declare namespace Button {
26
+ var Label: ({
27
+ className,
28
+ ...rest
29
+ }: LabelProps) => react_jsx_runtime2.JSX.Element;
30
+ var Icon: ({
31
+ className,
32
+ icon: Icon,
33
+ size
34
+ }: IconProps) => react_jsx_runtime2.JSX.Element;
35
+ }
36
+ type LabelProps = React.HTMLAttributes<HTMLSpanElement>;
37
+ type IconProps = {
38
+ icon: LucideIcon;
39
+ size?: number;
40
+ } & React.HTMLAttributes<HTMLSpanElement>;
41
+ //#endregion
2
42
  export { Button, ButtonProps, ButtonVariant };
@@ -1,3 +1,51 @@
1
- import { t as Button } from "../Button-C1OEwBk_.js";
1
+ import React from "react";
2
+ import clsx from "clsx";
3
+ import { jsx } from "react/jsx-runtime";
2
4
 
5
+ //#region src/components/Button.tsx
6
+ function Button(props) {
7
+ const { variant, children, border, loading, ...rest } = props;
8
+ const classes = clsx("stl-ui-button", {
9
+ "stl-ui-button--outline": variant === "outline",
10
+ "stl-ui-button--ghost": variant === "ghost",
11
+ "stl-ui-button--accent": variant === "accent",
12
+ "stl-ui-button--accent-muted": variant === "accent-muted",
13
+ "stl-ui-button--muted": variant === "muted",
14
+ "stl-ui-button--success": variant === "success",
15
+ "stl-ui-button--destructive": variant === "destructive"
16
+ }, {
17
+ "stl-ui-button--size-sm": props.size === "sm",
18
+ "stl-ui-button--size-lg": props.size === "lg"
19
+ }, { "stl-ui-button--with-border": variant === "outline" || border }, { "stl-ui-button--loading": !!loading }, "not-content", "stl-ui-not-prose", props.className);
20
+ if (loading) {
21
+ rest["aria-disabled"] = "true";
22
+ rest["aria-label"] = loading.label;
23
+ rest["title"] = loading.label;
24
+ }
25
+ if ("href" in rest) return /* @__PURE__ */ jsx("a", {
26
+ ...rest,
27
+ className: classes,
28
+ children
29
+ });
30
+ return /* @__PURE__ */ jsx("button", {
31
+ ...rest,
32
+ type: rest.type ?? "button",
33
+ className: classes,
34
+ children
35
+ });
36
+ }
37
+ Button.Label = function ButtonLabel({ className, ...rest }) {
38
+ return /* @__PURE__ */ jsx("span", {
39
+ className: clsx("stl-ui-button-label leading-none", className),
40
+ ...rest
41
+ });
42
+ };
43
+ Button.Icon = function ButtonIcon({ className, icon: Icon, size = 18 }) {
44
+ return /* @__PURE__ */ jsx("span", {
45
+ className: clsx("stl-ui-button__icon", className),
46
+ children: /* @__PURE__ */ jsx(Icon, { size })
47
+ });
48
+ };
49
+
50
+ //#endregion
3
51
  export { Button };
@@ -1,2 +1,18 @@
1
- import { n as CalloutProps, r as CalloutVariant, t as Callout } from "../Callout-Desqa2PM.js";
1
+ import React from "react";
2
+ import * as react_jsx_runtime5 from "react/jsx-runtime";
3
+
4
+ //#region src/components/Callout.d.ts
5
+ type CalloutVariant = 'info' | 'note' | 'tip' | 'success' | 'warning' | 'danger';
6
+ type CalloutProps = {
7
+ variant?: CalloutVariant;
8
+ className?: string;
9
+ children?: React.ReactNode;
10
+ } & Omit<React.ComponentProps<'aside'>, 'className' | 'children'>;
11
+ declare function Callout({
12
+ variant,
13
+ className,
14
+ children,
15
+ ...props
16
+ }: CalloutProps): react_jsx_runtime5.JSX.Element;
17
+ //#endregion
2
18
  export { Callout, CalloutProps, CalloutVariant };
@@ -1,3 +1,28 @@
1
- import { t as Callout } from "../Callout-BGkXD7D2.js";
1
+ import React from "react";
2
+ import clsx from "clsx";
3
+ import { jsx, jsxs } from "react/jsx-runtime";
4
+ import { Check, CircleAlert, Info, Lightbulb, OctagonAlert, TriangleAlert } from "lucide-react";
2
5
 
6
+ //#region src/components/Callout.tsx
7
+ function Callout({ variant = "info", className, children, ...props }) {
8
+ const classes = clsx("stl-ui-callout", `stl-ui-callout--${variant}`, className);
9
+ const Icon = {
10
+ info: Info,
11
+ note: CircleAlert,
12
+ tip: Lightbulb,
13
+ success: Check,
14
+ warning: TriangleAlert,
15
+ danger: OctagonAlert
16
+ }[variant];
17
+ return /* @__PURE__ */ jsxs("aside", {
18
+ className: classes,
19
+ ...props,
20
+ children: [/* @__PURE__ */ jsx(Icon, { className: "stl-ui-callout__icon" }), /* @__PURE__ */ jsx("div", {
21
+ className: "stl-ui-callout__content",
22
+ children
23
+ })]
24
+ });
25
+ }
26
+
27
+ //#endregion
3
28
  export { Callout };
@@ -0,0 +1,17 @@
1
+ import * as react_jsx_runtime6 from "react/jsx-runtime";
2
+
3
+ //#region src/components/Steps.d.ts
4
+ declare function Steps({
5
+ children
6
+ }: {
7
+ children: React.ReactNode;
8
+ }): react_jsx_runtime6.JSX.Element;
9
+ declare function Step({
10
+ children,
11
+ title
12
+ }: {
13
+ children: React.ReactNode;
14
+ title: string;
15
+ }): react_jsx_runtime6.JSX.Element;
16
+ //#endregion
17
+ export { Step, Steps };
@@ -0,0 +1,24 @@
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+
3
+ //#region src/components/Steps.tsx
4
+ function Steps({ children }) {
5
+ return /* @__PURE__ */ jsx("ol", {
6
+ className: "stl-ui-steps",
7
+ children
8
+ });
9
+ }
10
+ function Step({ children, title }) {
11
+ return /* @__PURE__ */ jsxs("li", {
12
+ className: "stl-ui-steps__step",
13
+ children: [/* @__PURE__ */ jsx("div", {
14
+ className: "stl-ui-steps__step-title",
15
+ children: title
16
+ }), /* @__PURE__ */ jsx("div", {
17
+ className: "stl-ui-steps__step-content",
18
+ children
19
+ })]
20
+ });
21
+ }
22
+
23
+ //#endregion
24
+ export { Step, Steps };
package/dist/index.d.ts CHANGED
@@ -1,15 +1,16 @@
1
- import { n as AccordionProps, t as Accordion } from "./Accordion-Cj5GURin.js";
2
- import { n as ButtonProps, r as ButtonVariant, t as Button } from "./Button-D4DkAJY5.js";
3
- import { n as CalloutProps, r as CalloutVariant, t as Callout } from "./Callout-Desqa2PM.js";
1
+ import { Accordion, AccordionProps } from "./components/Accordion.js";
2
+ import { Button, ButtonProps, ButtonVariant } from "./components/Button.js";
3
+ import { Callout, CalloutProps, CalloutVariant } from "./components/Callout.js";
4
+ import { Step, Steps } from "./components/Steps.js";
4
5
  import * as react3 from "react";
5
6
  import { ComponentProps } from "react";
6
- import * as react_jsx_runtime21 from "react/jsx-runtime";
7
+ import * as react_jsx_runtime23 from "react/jsx-runtime";
7
8
 
8
9
  //#region src/components/dropdown/DropdownMenu.d.ts
9
10
  declare function Menu({
10
11
  className,
11
12
  ...props
12
- }: ComponentProps<'div'>): react_jsx_runtime21.JSX.Element;
13
+ }: ComponentProps<'div'>): react_jsx_runtime23.JSX.Element;
13
14
  declare namespace Menu {
14
15
  var Item: typeof MenuItem;
15
16
  var ItemText: typeof MenuItemText;
@@ -21,7 +22,7 @@ declare function MenuItemText({
21
22
  ...props
22
23
  }: ComponentProps<'span'> & {
23
24
  subtle?: boolean;
24
- }): react_jsx_runtime21.JSX.Element;
25
+ }): react_jsx_runtime23.JSX.Element;
25
26
  type MenuItemBaseProps = {
26
27
  children?: React.ReactNode;
27
28
  value: string;
@@ -42,7 +43,7 @@ declare function MenuItem({
42
43
  isExternalLink,
43
44
  isSelected,
44
45
  ...props
45
- }: MenuItemProps): react_jsx_runtime21.JSX.Element;
46
+ }: MenuItemProps): react_jsx_runtime23.JSX.Element;
46
47
  /**
47
48
  * A template component that defines the content to be displayed in the dropdown trigger
48
49
  * when a menu item is selected. This template is used to customize the appearance of
@@ -53,13 +54,13 @@ declare function MenuItem({
53
54
  */
54
55
  declare function MenuItemTemplate({
55
56
  ...props
56
- }: ComponentProps<'template'>): react_jsx_runtime21.JSX.Element;
57
+ }: ComponentProps<'template'>): react_jsx_runtime23.JSX.Element;
57
58
  //#endregion
58
59
  //#region src/components/dropdown/Dropdown.d.ts
59
60
  declare function Dropdown({
60
61
  className,
61
62
  ...props
62
- }: ComponentProps<'div'>): react_jsx_runtime21.JSX.Element;
63
+ }: ComponentProps<'div'>): react_jsx_runtime23.JSX.Element;
63
64
  declare namespace Dropdown {
64
65
  var Menu: typeof Menu;
65
66
  var MenuItem: ({
@@ -83,40 +84,40 @@ declare namespace Dropdown {
83
84
  isSelected?: boolean;
84
85
  } & react3.ClassAttributes<HTMLButtonElement> & react3.ButtonHTMLAttributes<HTMLButtonElement> & {
85
86
  href?: never;
86
- })) => react_jsx_runtime21.JSX.Element;
87
+ })) => react_jsx_runtime23.JSX.Element;
87
88
  var MenuItemText: ({
88
89
  className,
89
90
  subtle,
90
91
  ...props
91
92
  }: ComponentProps<"span"> & {
92
93
  subtle?: boolean;
93
- }) => react_jsx_runtime21.JSX.Element;
94
+ }) => react_jsx_runtime23.JSX.Element;
94
95
  var MenuItemTemplate: ({
95
96
  ...props
96
- }: ComponentProps<"template">) => react_jsx_runtime21.JSX.Element;
97
+ }: ComponentProps<"template">) => react_jsx_runtime23.JSX.Element;
97
98
  var Trigger: ({
98
99
  className,
99
100
  ...props
100
- }: ComponentProps<"button">) => react_jsx_runtime21.JSX.Element;
101
+ }: ComponentProps<"button">) => react_jsx_runtime23.JSX.Element;
101
102
  var TriggerSelectedItem: ({
102
103
  className,
103
104
  ...props
104
- }: ComponentProps<"div">) => react_jsx_runtime21.JSX.Element;
105
+ }: ComponentProps<"div">) => react_jsx_runtime23.JSX.Element;
105
106
  var TriggerIcon: ({
106
107
  className,
107
108
  ...props
108
- }: ComponentProps<"span">) => react_jsx_runtime21.JSX.Element;
109
+ }: ComponentProps<"span">) => react_jsx_runtime23.JSX.Element;
109
110
  var Icon: ({
110
111
  className,
111
112
  ...props
112
- }: ComponentProps<"div">) => react_jsx_runtime21.JSX.Element;
113
+ }: ComponentProps<"div">) => react_jsx_runtime23.JSX.Element;
113
114
  }
114
115
  //#endregion
115
116
  //#region src/components/dropdown/DropdownButton.d.ts
116
117
  declare function DropdownButton({
117
118
  className,
118
119
  ...props
119
- }: ComponentProps<'div'>): react_jsx_runtime21.JSX.Element;
120
+ }: ComponentProps<'div'>): react_jsx_runtime23.JSX.Element;
120
121
  declare namespace DropdownButton {
121
122
  var Menu: typeof Menu;
122
123
  var MenuItem: ({
@@ -140,31 +141,31 @@ declare namespace DropdownButton {
140
141
  isSelected?: boolean;
141
142
  } & react3.ClassAttributes<HTMLButtonElement> & react3.ButtonHTMLAttributes<HTMLButtonElement> & {
142
143
  href?: never;
143
- })) => react_jsx_runtime21.JSX.Element;
144
+ })) => react_jsx_runtime23.JSX.Element;
144
145
  var MenuItemText: ({
145
146
  className,
146
147
  subtle,
147
148
  ...props
148
149
  }: ComponentProps<"span"> & {
149
150
  subtle?: boolean;
150
- }) => react_jsx_runtime21.JSX.Element;
151
+ }) => react_jsx_runtime23.JSX.Element;
151
152
  var PrimaryAction: ({
152
153
  className,
153
154
  ...props
154
- }: ComponentProps<"button">) => react_jsx_runtime21.JSX.Element;
155
+ }: ComponentProps<"button">) => react_jsx_runtime23.JSX.Element;
155
156
  var PrimaryActionText: ({
156
157
  children
157
158
  }: {
158
159
  children?: React.ReactNode;
159
- }) => react_jsx_runtime21.JSX.Element;
160
+ }) => react_jsx_runtime23.JSX.Element;
160
161
  var Trigger: ({
161
162
  className,
162
163
  ...props
163
- }: ComponentProps<"button">) => react_jsx_runtime21.JSX.Element;
164
+ }: ComponentProps<"button">) => react_jsx_runtime23.JSX.Element;
164
165
  var Icon: ({
165
166
  className,
166
167
  ...props
167
- }: ComponentProps<"div">) => react_jsx_runtime21.JSX.Element;
168
+ }: ComponentProps<"div">) => react_jsx_runtime23.JSX.Element;
168
169
  }
169
170
  //#endregion
170
- export { Accordion, AccordionProps, Button, ButtonProps, ButtonVariant, Callout, CalloutProps, CalloutVariant, Dropdown, DropdownButton };
171
+ export { Accordion, AccordionProps, Button, ButtonProps, ButtonVariant, Callout, CalloutProps, CalloutVariant, Dropdown, DropdownButton, Step, Steps };
package/dist/index.js CHANGED
@@ -1,6 +1,7 @@
1
- import { t as Button } from "./Button-C1OEwBk_.js";
2
- import { t as Callout } from "./Callout-BGkXD7D2.js";
3
- import { t as Accordion } from "./Accordion-CL3Oarbz.js";
1
+ import { Button } from "./components/Button.js";
2
+ import { Callout } from "./components/Callout.js";
3
+ import { Accordion } from "./components/Accordion.js";
4
+ import { Step, Steps } from "./components/Steps.js";
4
5
  import clsx from "clsx";
5
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
6
7
  import { CheckIcon, ChevronsUpDown, ExternalLink } from "lucide-react";
@@ -177,4 +178,4 @@ DropdownButton.Trigger = Trigger;
177
178
  DropdownButton.Icon = Icon;
178
179
 
179
180
  //#endregion
180
- export { Accordion, Button, Callout, Dropdown, DropdownButton };
181
+ export { Accordion, Button, Callout, Dropdown, DropdownButton, Step, Steps };
@@ -146,3 +146,8 @@
146
146
  }
147
147
  }
148
148
 
149
+ /* Steps Compatibility */
150
+ ol.sl-steps {
151
+ padding-left: 0;
152
+ }
153
+
package/dist/styles.css CHANGED
@@ -1107,6 +1107,68 @@ a.stl-ui-button {
1107
1107
  }
1108
1108
  }
1109
1109
 
1110
+ .stl-ui-steps {
1111
+ padding-left: 0;
1112
+ }
1113
+
1114
+ .stl-ui-steps__step {
1115
+ --step-icon-width: 24px;
1116
+ --step-padding: 12px;
1117
+ list-style: none;
1118
+ position: relative;
1119
+ padding: var(--step-padding);
1120
+ /* Space for the custom marker */
1121
+ padding-left: calc(var(--step-icon-width) + var(--step-padding));
1122
+ margin: 0;
1123
+
1124
+ &::before {
1125
+ content: counter(list-item);
1126
+ position: absolute;
1127
+ left: 0;
1128
+ top: var(--step-padding);
1129
+ width: var(--step-icon-width);
1130
+ height: var(--step-icon-width);
1131
+ border: 1px solid var(--stl-color-border);
1132
+ border-radius: 100%;
1133
+ display: flex;
1134
+ align-items: center;
1135
+ justify-content: center;
1136
+ background: var(--stl-color-bg);
1137
+ z-index: 1;
1138
+ font-size: var(--stl-typography-text-body-xs);
1139
+ font-style: normal;
1140
+ font-weight: 600;
1141
+ line-height: 100%;
1142
+ }
1143
+
1144
+ &::after {
1145
+ content: '';
1146
+ position: absolute;
1147
+ left: calc(var(--step-icon-width) / 2 - 0.5px);
1148
+ top: calc(var(--step-icon-width) + var(--step-padding));
1149
+ bottom: calc(-1 * (var(--step-padding)));
1150
+ width: 1px;
1151
+ background: var(--stl-color-border);
1152
+ }
1153
+
1154
+ &:last-child {
1155
+ padding-bottom: 0;
1156
+
1157
+ /* No line after the last step */
1158
+ &::after {
1159
+ display: none;
1160
+ }
1161
+ }
1162
+ }
1163
+ .stl-ui-steps__step-title {
1164
+ font-weight: 600;
1165
+ }
1166
+
1167
+ .stl-ui-steps__step-content {
1168
+ margin-bottom: 0;
1169
+ margin-top: 4px;
1170
+ }
1171
+
1110
1172
  /* design system variables */
1111
1173
 
1112
1174
  /* components */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stainless-api/ui-primitives",
3
- "version": "0.1.0-beta.39",
3
+ "version": "0.1.0-beta.40",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -14,16 +14,16 @@
14
14
  },
15
15
  "dependencies": {
16
16
  "clsx": "^2.1.1",
17
- "lucide-react": "^0.561.0"
17
+ "lucide-react": "^0.562.0"
18
18
  },
19
19
  "devDependencies": {
20
20
  "@types/react": "19.2.7",
21
21
  "@types/react-dom": "^19.2.3",
22
22
  "react": "^19.2.3",
23
23
  "react-dom": "^19.2.3",
24
- "rolldown": "1.0.0-beta.54",
25
- "sass": "^1.96.0",
26
- "tsdown": "^0.18.0",
24
+ "rolldown": "1.0.0-beta.58",
25
+ "sass": "^1.97.2",
26
+ "tsdown": "^0.19.0-beta.3",
27
27
  "typescript": "5.9.3",
28
28
  "@stainless/eslint-config": "0.1.0-beta.1"
29
29
  },
@@ -1,31 +0,0 @@
1
- import React from "react";
2
- import clsx from "clsx";
3
- import { jsx } from "react/jsx-runtime";
4
-
5
- //#region src/components/Accordion.tsx
6
- function Accordion({ className, children, ...props }) {
7
- return /* @__PURE__ */ jsx("details", {
8
- className: clsx("stl-ui-accordion", className),
9
- ...props,
10
- children
11
- });
12
- }
13
- function AccordionSummary({ children, className, ...props }) {
14
- return /* @__PURE__ */ jsx("summary", {
15
- className: clsx("stl-ui-accordion__summary", className),
16
- ...props,
17
- children
18
- });
19
- }
20
- Accordion.Summary = AccordionSummary;
21
- function AccordionGroup({ className, children, ...props }) {
22
- return /* @__PURE__ */ jsx("div", {
23
- className: clsx("stl-ui-accordion-group", className),
24
- ...props,
25
- children
26
- });
27
- }
28
- Accordion.Group = AccordionGroup;
29
-
30
- //#endregion
31
- export { Accordion as t };
@@ -1,26 +0,0 @@
1
- import React from "react";
2
- import * as react_jsx_runtime0 from "react/jsx-runtime";
3
-
4
- //#region src/components/Accordion.d.ts
5
- type AccordionProps = React.ComponentProps<'details'>;
6
- declare function Accordion({
7
- className,
8
- children,
9
- ...props
10
- }: AccordionProps): react_jsx_runtime0.JSX.Element;
11
- declare namespace Accordion {
12
- var Summary: typeof AccordionSummary;
13
- var Group: typeof AccordionGroup;
14
- }
15
- declare function AccordionSummary({
16
- children,
17
- className,
18
- ...props
19
- }: React.ComponentProps<'summary'>): react_jsx_runtime0.JSX.Element;
20
- declare function AccordionGroup({
21
- className,
22
- children,
23
- ...props
24
- }: React.ComponentProps<'div'>): react_jsx_runtime0.JSX.Element;
25
- //#endregion
26
- export { AccordionProps as n, Accordion as t };
@@ -1,51 +0,0 @@
1
- import React from "react";
2
- import clsx from "clsx";
3
- import { jsx } from "react/jsx-runtime";
4
-
5
- //#region src/components/Button.tsx
6
- function Button(props) {
7
- const { variant, children, border, loading, ...rest } = props;
8
- const classes = clsx("stl-ui-button", {
9
- "stl-ui-button--outline": variant === "outline",
10
- "stl-ui-button--ghost": variant === "ghost",
11
- "stl-ui-button--accent": variant === "accent",
12
- "stl-ui-button--accent-muted": variant === "accent-muted",
13
- "stl-ui-button--muted": variant === "muted",
14
- "stl-ui-button--success": variant === "success",
15
- "stl-ui-button--destructive": variant === "destructive"
16
- }, {
17
- "stl-ui-button--size-sm": props.size === "sm",
18
- "stl-ui-button--size-lg": props.size === "lg"
19
- }, { "stl-ui-button--with-border": variant === "outline" || border }, { "stl-ui-button--loading": !!loading }, "not-content", "stl-ui-not-prose", props.className);
20
- if (loading) {
21
- rest["aria-disabled"] = "true";
22
- rest["aria-label"] = loading.label;
23
- rest["title"] = loading.label;
24
- }
25
- if ("href" in rest) return /* @__PURE__ */ jsx("a", {
26
- ...rest,
27
- className: classes,
28
- children
29
- });
30
- return /* @__PURE__ */ jsx("button", {
31
- ...rest,
32
- type: rest.type ?? "button",
33
- className: classes,
34
- children
35
- });
36
- }
37
- Button.Label = function ButtonLabel({ className, ...rest }) {
38
- return /* @__PURE__ */ jsx("span", {
39
- className: clsx("stl-ui-button-label leading-none", className),
40
- ...rest
41
- });
42
- };
43
- Button.Icon = function ButtonIcon({ className, icon: Icon, size = 18 }) {
44
- return /* @__PURE__ */ jsx("span", {
45
- className: clsx("stl-ui-button__icon", className),
46
- children: /* @__PURE__ */ jsx(Icon, { size })
47
- });
48
- };
49
-
50
- //#endregion
51
- export { Button as t };
@@ -1,42 +0,0 @@
1
- import React from "react";
2
- import * as react_jsx_runtime3 from "react/jsx-runtime";
3
- import { LucideIcon } from "lucide-react";
4
-
5
- //#region src/components/Button.d.ts
6
- type ButtonVariant = 'outline' | 'ghost' | 'accent' | 'accent-muted' | 'muted' | 'success' | 'destructive' | 'default';
7
- type BaseProps = {
8
- variant?: ButtonVariant;
9
- className?: string;
10
- children?: React.ReactNode;
11
- size?: 'sm' | 'lg' | 'default';
12
- border?: boolean;
13
- loading?: {
14
- label: string;
15
- };
16
- };
17
- type AnchorBranch = BaseProps & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'className' | 'children'> & {
18
- href: string;
19
- };
20
- type ButtonBranch = BaseProps & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'className' | 'children'> & {
21
- href?: never;
22
- };
23
- type ButtonProps = AnchorBranch | ButtonBranch;
24
- declare function Button(props: ButtonProps): react_jsx_runtime3.JSX.Element;
25
- declare namespace Button {
26
- var Label: ({
27
- className,
28
- ...rest
29
- }: LabelProps) => react_jsx_runtime3.JSX.Element;
30
- var Icon: ({
31
- className,
32
- icon: Icon,
33
- size
34
- }: IconProps) => react_jsx_runtime3.JSX.Element;
35
- }
36
- type LabelProps = React.HTMLAttributes<HTMLSpanElement>;
37
- type IconProps = {
38
- icon: LucideIcon;
39
- size?: number;
40
- } & React.HTMLAttributes<HTMLSpanElement>;
41
- //#endregion
42
- export { ButtonProps as n, ButtonVariant as r, Button as t };
@@ -1,28 +0,0 @@
1
- import React from "react";
2
- import clsx from "clsx";
3
- import { jsx, jsxs } from "react/jsx-runtime";
4
- import { Check, CircleAlert, Info, Lightbulb, OctagonAlert, TriangleAlert } from "lucide-react";
5
-
6
- //#region src/components/Callout.tsx
7
- function Callout({ variant = "info", className, children, ...props }) {
8
- const classes = clsx("stl-ui-callout", `stl-ui-callout--${variant}`, className);
9
- const Icon = {
10
- info: Info,
11
- note: CircleAlert,
12
- tip: Lightbulb,
13
- success: Check,
14
- warning: TriangleAlert,
15
- danger: OctagonAlert
16
- }[variant];
17
- return /* @__PURE__ */ jsxs("aside", {
18
- className: classes,
19
- ...props,
20
- children: [/* @__PURE__ */ jsx(Icon, { className: "stl-ui-callout__icon" }), /* @__PURE__ */ jsx("div", {
21
- className: "stl-ui-callout__content",
22
- children
23
- })]
24
- });
25
- }
26
-
27
- //#endregion
28
- export { Callout as t };
@@ -1,18 +0,0 @@
1
- import React from "react";
2
- import * as react_jsx_runtime0 from "react/jsx-runtime";
3
-
4
- //#region src/components/Callout.d.ts
5
- type CalloutVariant = 'info' | 'note' | 'tip' | 'success' | 'warning' | 'danger';
6
- type CalloutProps = {
7
- variant?: CalloutVariant;
8
- className?: string;
9
- children?: React.ReactNode;
10
- } & Omit<React.ComponentProps<'aside'>, 'className' | 'children'>;
11
- declare function Callout({
12
- variant,
13
- className,
14
- children,
15
- ...props
16
- }: CalloutProps): react_jsx_runtime0.JSX.Element;
17
- //#endregion
18
- export { CalloutProps as n, CalloutVariant as r, Callout as t };