@saasflare/ui 3.0.1 → 3.1.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.
- package/dist/button-0Bdl7Nqm.d.ts +87 -0
- package/dist/button-Brb4BhPO.d.mts +87 -0
- package/dist/{chunk-VQQ6MF5I.js → chunk-4BOMMZEY.js} +20 -13
- package/dist/{chunk-OYH6LQWR.js → chunk-D5LKWKG7.js} +50 -150
- package/dist/chunk-DNLCSV5M.js +151 -0
- package/dist/{chunk-W53NTFPB.mjs → chunk-EJHYM2HP.mjs} +7 -16
- package/dist/chunk-FT66KYRN.js +30 -0
- package/dist/{chunk-7UGPCRZ6.mjs → chunk-RW2S3KNB.mjs} +14 -7
- package/dist/chunk-WPOOC2FX.mjs +128 -0
- package/dist/{chunk-QWLQV6FS.mjs → chunk-WRONFPRI.mjs} +22 -121
- package/dist/{dialog-CwyBJeNl.d.mts → dialog-BmY55WSX.d.ts} +4 -1
- package/dist/{dialog-CwyBJeNl.d.ts → dialog-CcaHMAsS.d.mts} +4 -1
- package/dist/entries/calendar.d.mts +5 -3
- package/dist/entries/calendar.d.ts +5 -3
- package/dist/entries/calendar.js +44 -36
- package/dist/entries/calendar.mjs +11 -3
- package/dist/entries/carousel.d.mts +4 -3
- package/dist/entries/carousel.d.ts +4 -3
- package/dist/entries/carousel.js +18 -11
- package/dist/entries/carousel.mjs +11 -4
- package/dist/entries/chart.d.mts +4 -2
- package/dist/entries/chart.d.ts +4 -2
- package/dist/entries/chart.js +17 -10
- package/dist/entries/chart.mjs +8 -1
- package/dist/entries/command.d.mts +5 -2
- package/dist/entries/command.d.ts +5 -2
- package/dist/entries/command.js +25 -18
- package/dist/entries/command.mjs +12 -5
- package/dist/entries/drawer.d.mts +4 -1
- package/dist/entries/drawer.d.ts +4 -1
- package/dist/entries/drawer.js +15 -8
- package/dist/entries/drawer.mjs +9 -2
- package/dist/entries/input-otp.d.mts +4 -2
- package/dist/entries/input-otp.d.ts +4 -2
- package/dist/entries/input-otp.js +13 -6
- package/dist/entries/input-otp.mjs +10 -3
- package/dist/entries/resizable.d.mts +3 -1
- package/dist/entries/resizable.d.ts +3 -1
- package/dist/entries/resizable.js +12 -5
- package/dist/entries/resizable.mjs +10 -3
- package/dist/index.d.mts +181 -79
- package/dist/index.d.ts +181 -79
- package/dist/index.js +807 -477
- package/dist/index.mjs +498 -172
- package/dist/{button-DUQJ0X7e.d.mts → use-saasflare-props-NrM2Glmp.d.mts} +1 -86
- package/dist/{button-DUQJ0X7e.d.ts → use-saasflare-props-NrM2Glmp.d.ts} +1 -86
- package/package.json +1 -1
- package/dist/chunk-CWW36RYE.js +0 -59
- package/dist/chunk-JOVJRQO3.js +0 -12
- package/dist/chunk-S26666D6.mjs +0 -10
|
@@ -1,8 +1,3 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import { VariantProps } from 'class-variance-authority';
|
|
5
|
-
|
|
6
1
|
/**
|
|
7
2
|
* @fileoverview Theme-related types and constants consumed by SaasflareProvider,
|
|
8
3
|
* SaasflareShell, and CustomPaletteInjector.
|
|
@@ -210,84 +205,4 @@ interface ResolvedSaasflareProps {
|
|
|
210
205
|
*/
|
|
211
206
|
declare function useSaasflareProps(props?: SaasflareComponentProps): ResolvedSaasflareProps;
|
|
212
207
|
|
|
213
|
-
|
|
214
|
-
type Intent = (typeof INTENTS)[number];
|
|
215
|
-
/**
|
|
216
|
-
* Button variant definitions using the 3-axis system.
|
|
217
|
-
*
|
|
218
|
-
* Axes:
|
|
219
|
-
* variant — visual treatment: solid, soft, outline, ghost, link, glass, shadow
|
|
220
|
-
* intent — color intent via data-intent attribute + CSS tokens
|
|
221
|
-
* size — dimensional: xs, sm, md, lg, xl, icon, icon-xs, icon-sm, icon-lg
|
|
222
|
-
*/
|
|
223
|
-
declare const buttonVariants: (props?: ({
|
|
224
|
-
variant?: "link" | "glass" | "soft" | "solid" | "outline" | "ghost" | "shadow" | null | undefined;
|
|
225
|
-
size?: "xs" | "sm" | "md" | "lg" | "xl" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
|
|
226
|
-
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
227
|
-
/** Framer-motion event overrides that conflict with React HTML events */
|
|
228
|
-
type MotionConflicts = "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd";
|
|
229
|
-
/**
|
|
230
|
-
* Props for the Saasflare Button component.
|
|
231
|
-
*
|
|
232
|
-
* Extends {@link SaasflareComponentProps} to accept `surface` and `animated`
|
|
233
|
-
* overrides that are resolved against the <SaasflareProvider> context.
|
|
234
|
-
*/
|
|
235
|
-
interface ButtonProps extends Omit<React.ComponentProps<"button">, MotionConflicts>, VariantProps<typeof buttonVariants>, SaasflareComponentProps {
|
|
236
|
-
/** Render as child element (Radix Slot pattern) */
|
|
237
|
-
asChild?: boolean;
|
|
238
|
-
/** Semantic color intent */
|
|
239
|
-
intent?: Intent;
|
|
240
|
-
/** Show loading spinner (replaces left icon, keeps text visible) */
|
|
241
|
-
loading?: boolean;
|
|
242
|
-
/** Stretch to full width of container */
|
|
243
|
-
fullWidth?: boolean;
|
|
244
|
-
}
|
|
245
|
-
/**
|
|
246
|
-
* Primary interactive button with motion, loading, and intent support.
|
|
247
|
-
*
|
|
248
|
-
* Resolves `surface` and `animated` via {@link useSaasflareProps} with the
|
|
249
|
-
* precedence: component prop > <SaasflareProvider> context > hardcoded default.
|
|
250
|
-
*
|
|
251
|
-
* When no explicit `variant` is set and the resolved surface is `"glass"`, the
|
|
252
|
-
* button promotes itself to `variant="glass"`. An explicit `variant` prop always
|
|
253
|
-
* wins over the surface-based promotion.
|
|
254
|
-
*
|
|
255
|
-
* @component
|
|
256
|
-
* @layer ui
|
|
257
|
-
*
|
|
258
|
-
* @param {string} variant - Visual treatment: "solid" | "soft" | "outline" | "ghost" | "link" | "glass" | "shadow"
|
|
259
|
-
* @param {string} intent - Color intent: "primary" | "neutral" | "success" | "warning" | "danger" | "info"
|
|
260
|
-
* @param {string} size - Button size: "xs" | "sm" | "md" | "lg" | "xl" | "icon" | "icon-xs" | "icon-sm" | "icon-lg"
|
|
261
|
-
* @param {string} surface - Surface style override: "flat" | "glass" (inherits from provider when omitted)
|
|
262
|
-
* @param {boolean} animated - Gate motion effects (inherits from provider when omitted)
|
|
263
|
-
* @param {boolean} loading - Shows spinner, sets aria-busy, preserves width
|
|
264
|
-
* @param {boolean} fullWidth - Stretches to container width
|
|
265
|
-
* @param {boolean} asChild - Render as child element (Slot pattern)
|
|
266
|
-
*
|
|
267
|
-
* @example
|
|
268
|
-
* // Solid primary (default)
|
|
269
|
-
* <Button>Save Changes</Button>
|
|
270
|
-
*
|
|
271
|
-
* @example
|
|
272
|
-
* // Outline danger
|
|
273
|
-
* <Button variant="outline" intent="danger">Delete Account</Button>
|
|
274
|
-
*
|
|
275
|
-
* @example
|
|
276
|
-
* // Inherits surface from provider — auto-promotes to glass variant
|
|
277
|
-
* <SaasflareProvider surface="glass"><Button>Frosted</Button></SaasflareProvider>
|
|
278
|
-
*
|
|
279
|
-
* @example
|
|
280
|
-
* // Loading state
|
|
281
|
-
* <Button loading>Processing...</Button>
|
|
282
|
-
*
|
|
283
|
-
* @example
|
|
284
|
-
* // Icon button
|
|
285
|
-
* <Button variant="ghost" size="icon"><SettingsIcon /></Button>
|
|
286
|
-
*
|
|
287
|
-
* @example
|
|
288
|
-
* // Legacy API (deprecated but supported)
|
|
289
|
-
* <Button variant="destructive">Delete</Button>
|
|
290
|
-
*/
|
|
291
|
-
declare function Button({ className, variant: variantProp, size, intent: intentProp, asChild, loading, fullWidth, surface, animated, disabled, children, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
292
|
-
|
|
293
|
-
export { Button as B, type CustomPalette as C, type Intent as I, type Palette as P, type RadiusProp as R, type Surface as S, type StyleVariant as a, type Radius as b, type SaasflareComponentProps as c, type ButtonProps as d, PALETTES as e, type PaletteId as f, RADII as g, type ResolvedSaasflareProps as h, STYLES as i, buttonVariants as j, useSaasflareProps as u };
|
|
208
|
+
export { type CustomPalette as C, type Palette as P, type RadiusProp as R, type Surface as S, type StyleVariant as a, type Radius as b, type SaasflareComponentProps as c, PALETTES as d, type PaletteId as e, RADII as f, type ResolvedSaasflareProps as g, STYLES as h, useSaasflareProps as u };
|
|
@@ -1,8 +1,3 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import { VariantProps } from 'class-variance-authority';
|
|
5
|
-
|
|
6
1
|
/**
|
|
7
2
|
* @fileoverview Theme-related types and constants consumed by SaasflareProvider,
|
|
8
3
|
* SaasflareShell, and CustomPaletteInjector.
|
|
@@ -210,84 +205,4 @@ interface ResolvedSaasflareProps {
|
|
|
210
205
|
*/
|
|
211
206
|
declare function useSaasflareProps(props?: SaasflareComponentProps): ResolvedSaasflareProps;
|
|
212
207
|
|
|
213
|
-
|
|
214
|
-
type Intent = (typeof INTENTS)[number];
|
|
215
|
-
/**
|
|
216
|
-
* Button variant definitions using the 3-axis system.
|
|
217
|
-
*
|
|
218
|
-
* Axes:
|
|
219
|
-
* variant — visual treatment: solid, soft, outline, ghost, link, glass, shadow
|
|
220
|
-
* intent — color intent via data-intent attribute + CSS tokens
|
|
221
|
-
* size — dimensional: xs, sm, md, lg, xl, icon, icon-xs, icon-sm, icon-lg
|
|
222
|
-
*/
|
|
223
|
-
declare const buttonVariants: (props?: ({
|
|
224
|
-
variant?: "link" | "glass" | "soft" | "solid" | "outline" | "ghost" | "shadow" | null | undefined;
|
|
225
|
-
size?: "xs" | "sm" | "md" | "lg" | "xl" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
|
|
226
|
-
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
227
|
-
/** Framer-motion event overrides that conflict with React HTML events */
|
|
228
|
-
type MotionConflicts = "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd";
|
|
229
|
-
/**
|
|
230
|
-
* Props for the Saasflare Button component.
|
|
231
|
-
*
|
|
232
|
-
* Extends {@link SaasflareComponentProps} to accept `surface` and `animated`
|
|
233
|
-
* overrides that are resolved against the <SaasflareProvider> context.
|
|
234
|
-
*/
|
|
235
|
-
interface ButtonProps extends Omit<React.ComponentProps<"button">, MotionConflicts>, VariantProps<typeof buttonVariants>, SaasflareComponentProps {
|
|
236
|
-
/** Render as child element (Radix Slot pattern) */
|
|
237
|
-
asChild?: boolean;
|
|
238
|
-
/** Semantic color intent */
|
|
239
|
-
intent?: Intent;
|
|
240
|
-
/** Show loading spinner (replaces left icon, keeps text visible) */
|
|
241
|
-
loading?: boolean;
|
|
242
|
-
/** Stretch to full width of container */
|
|
243
|
-
fullWidth?: boolean;
|
|
244
|
-
}
|
|
245
|
-
/**
|
|
246
|
-
* Primary interactive button with motion, loading, and intent support.
|
|
247
|
-
*
|
|
248
|
-
* Resolves `surface` and `animated` via {@link useSaasflareProps} with the
|
|
249
|
-
* precedence: component prop > <SaasflareProvider> context > hardcoded default.
|
|
250
|
-
*
|
|
251
|
-
* When no explicit `variant` is set and the resolved surface is `"glass"`, the
|
|
252
|
-
* button promotes itself to `variant="glass"`. An explicit `variant` prop always
|
|
253
|
-
* wins over the surface-based promotion.
|
|
254
|
-
*
|
|
255
|
-
* @component
|
|
256
|
-
* @layer ui
|
|
257
|
-
*
|
|
258
|
-
* @param {string} variant - Visual treatment: "solid" | "soft" | "outline" | "ghost" | "link" | "glass" | "shadow"
|
|
259
|
-
* @param {string} intent - Color intent: "primary" | "neutral" | "success" | "warning" | "danger" | "info"
|
|
260
|
-
* @param {string} size - Button size: "xs" | "sm" | "md" | "lg" | "xl" | "icon" | "icon-xs" | "icon-sm" | "icon-lg"
|
|
261
|
-
* @param {string} surface - Surface style override: "flat" | "glass" (inherits from provider when omitted)
|
|
262
|
-
* @param {boolean} animated - Gate motion effects (inherits from provider when omitted)
|
|
263
|
-
* @param {boolean} loading - Shows spinner, sets aria-busy, preserves width
|
|
264
|
-
* @param {boolean} fullWidth - Stretches to container width
|
|
265
|
-
* @param {boolean} asChild - Render as child element (Slot pattern)
|
|
266
|
-
*
|
|
267
|
-
* @example
|
|
268
|
-
* // Solid primary (default)
|
|
269
|
-
* <Button>Save Changes</Button>
|
|
270
|
-
*
|
|
271
|
-
* @example
|
|
272
|
-
* // Outline danger
|
|
273
|
-
* <Button variant="outline" intent="danger">Delete Account</Button>
|
|
274
|
-
*
|
|
275
|
-
* @example
|
|
276
|
-
* // Inherits surface from provider — auto-promotes to glass variant
|
|
277
|
-
* <SaasflareProvider surface="glass"><Button>Frosted</Button></SaasflareProvider>
|
|
278
|
-
*
|
|
279
|
-
* @example
|
|
280
|
-
* // Loading state
|
|
281
|
-
* <Button loading>Processing...</Button>
|
|
282
|
-
*
|
|
283
|
-
* @example
|
|
284
|
-
* // Icon button
|
|
285
|
-
* <Button variant="ghost" size="icon"><SettingsIcon /></Button>
|
|
286
|
-
*
|
|
287
|
-
* @example
|
|
288
|
-
* // Legacy API (deprecated but supported)
|
|
289
|
-
* <Button variant="destructive">Delete</Button>
|
|
290
|
-
*/
|
|
291
|
-
declare function Button({ className, variant: variantProp, size, intent: intentProp, asChild, loading, fullWidth, surface, animated, disabled, children, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
292
|
-
|
|
293
|
-
export { Button as B, type CustomPalette as C, type Intent as I, type Palette as P, type RadiusProp as R, type Surface as S, type StyleVariant as a, type Radius as b, type SaasflareComponentProps as c, type ButtonProps as d, PALETTES as e, type PaletteId as f, RADII as g, type ResolvedSaasflareProps as h, STYLES as i, buttonVariants as j, useSaasflareProps as u };
|
|
208
|
+
export { type CustomPalette as C, type Palette as P, type RadiusProp as R, type Surface as S, type StyleVariant as a, type Radius as b, type SaasflareComponentProps as c, PALETTES as d, type PaletteId as e, RADII as f, type ResolvedSaasflareProps as g, STYLES as h, useSaasflareProps as u };
|
package/package.json
CHANGED
package/dist/chunk-CWW36RYE.js
DELETED
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
var React = require('react');
|
|
5
|
-
|
|
6
|
-
function _interopNamespace(e) {
|
|
7
|
-
if (e && e.__esModule) return e;
|
|
8
|
-
var n = Object.create(null);
|
|
9
|
-
if (e) {
|
|
10
|
-
Object.keys(e).forEach(function (k) {
|
|
11
|
-
if (k !== 'default') {
|
|
12
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
13
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
14
|
-
enumerable: true,
|
|
15
|
-
get: function () { return e[k]; }
|
|
16
|
-
});
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
}
|
|
20
|
-
n.default = e;
|
|
21
|
-
return Object.freeze(n);
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
25
|
-
|
|
26
|
-
// src/hooks/use-reduced-motion.ts
|
|
27
|
-
var QUERY = "(prefers-reduced-motion: reduce)";
|
|
28
|
-
var subscribe = (cb) => {
|
|
29
|
-
const mql = window.matchMedia(QUERY);
|
|
30
|
-
mql.addEventListener("change", cb);
|
|
31
|
-
return () => mql.removeEventListener("change", cb);
|
|
32
|
-
};
|
|
33
|
-
var getSnapshot = () => window.matchMedia(QUERY).matches;
|
|
34
|
-
var getServerSnapshot = () => false;
|
|
35
|
-
function useReducedMotion() {
|
|
36
|
-
return React__namespace.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
// src/components/ui/motion-config.ts
|
|
40
|
-
var spring = { type: "spring", stiffness: 400, damping: 25 };
|
|
41
|
-
var springBouncy = { type: "spring", stiffness: 300, damping: 15 };
|
|
42
|
-
var springGentle = { type: "spring", stiffness: 200, damping: 20 };
|
|
43
|
-
var springStiff = { type: "spring", stiffness: 500, damping: 30 };
|
|
44
|
-
var noMotion = { duration: 0 };
|
|
45
|
-
var fadeIn = { initial: { opacity: 0 }, animate: { opacity: 1 } };
|
|
46
|
-
var scaleIn = { initial: { opacity: 0, scale: 0.95 }, animate: { opacity: 1, scale: 1 } };
|
|
47
|
-
var slideUp = { initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 } };
|
|
48
|
-
var slideDown = { initial: { opacity: 0, y: -8 }, animate: { opacity: 1, y: 0 } };
|
|
49
|
-
|
|
50
|
-
exports.fadeIn = fadeIn;
|
|
51
|
-
exports.noMotion = noMotion;
|
|
52
|
-
exports.scaleIn = scaleIn;
|
|
53
|
-
exports.slideDown = slideDown;
|
|
54
|
-
exports.slideUp = slideUp;
|
|
55
|
-
exports.spring = spring;
|
|
56
|
-
exports.springBouncy = springBouncy;
|
|
57
|
-
exports.springGentle = springGentle;
|
|
58
|
-
exports.springStiff = springStiff;
|
|
59
|
-
exports.useReducedMotion = useReducedMotion;
|
package/dist/chunk-JOVJRQO3.js
DELETED