@saas-ui/react 3.0.0-next.2 → 3.0.0-next.20

package/dist/persona/index.d.ts

@@ -1,230 +0,0 @@
-import * as React$1 from 'react';
-import React__default from 'react';
-import * as _chakra_ui_react from '@chakra-ui/react';
-import { ImageProps as ImageProps$1, HTMLChakraProps, SlotRecipeProps } from '@chakra-ui/react';
-import { Avatar } from '@chakra-ui/react/avatar';
-import { RecipeVariantProps } from '@chakra-ui/react/styled-system';
-
-type ImageProps = React.ImgHTMLAttributes<HTMLImageElement>;
-interface AvatarProps extends Avatar.RootProps {
-    name?: string;
-    src?: string;
-    srcSet?: string;
-    loading?: ImageProps['loading'];
-    icon?: React.ReactElement;
-    fallback?: React.ReactNode;
-}
-
-declare const personaSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"details" | "label" | "avatar" | "root" | "presence" | "secondaryLabel" | "tertiaryLabel", {
-    size: {
-        '2xs': {
-            details: {
-                ms: number;
-            };
-            label: {
-                fontSize: "xs";
-            };
-            secondaryLabel: {
-                display: "none";
-            };
-            tertiaryLabel: {
-                display: "none";
-            };
-        };
-        xs: {
-            details: {
-                ms: number;
-            };
-            label: {
-                fontSize: "xs";
-            };
-            secondaryLabel: {
-                display: "none";
-            };
-            tertiaryLabel: {
-                display: "none";
-            };
-        };
-        sm: {
-            details: {
-                ms: number;
-            };
-            label: {
-                fontSize: "sm";
-            };
-            secondaryLabel: {
-                fontSize: "xs";
-            };
-            tertiaryLabel: {
-                display: "none";
-            };
-        };
-        md: {
-            details: {
-                ms: number;
-            };
-            label: {
-                fontSize: "sm";
-            };
-            secondaryLabel: {
-                fontSize: "xs";
-            };
-            tertiaryLabel: {
-                display: "none";
-            };
-        };
-        lg: {
-            details: {
-                ms: number;
-            };
-            label: {
-                fontSize: "md";
-            };
-            secondaryLabel: {
-                fontSize: "sm";
-            };
-            tertiaryLabel: {
-                fontSize: "sm";
-            };
-        };
-        xl: {
-            details: {
-                ms: number;
-            };
-            label: {
-                fontSize: "lg";
-            };
-            secondaryLabel: {
-                fontSize: "md";
-            };
-            tertiaryLabel: {
-                fontSize: "md";
-            };
-        };
-        '2xl': {
-            details: {
-                ms: number;
-            };
-            label: {
-                fontSize: "xl";
-            };
-            secondaryLabel: {
-                fontSize: "lg";
-            };
-            tertiaryLabel: {
-                fontSize: "lg";
-            };
-        };
-    };
-}>;
-type PersonaVariantProps = RecipeVariantProps<typeof personaSlotRecipe>;
-
-type PersonaPresence = 'online' | 'offline' | 'busy' | 'dnd' | 'away';
-interface PersonaPresenceConfig {
-    label: string;
-    color: string;
-}
-type PersonaPresenceOptions<P extends string = PersonaPresence> = Record<P, PersonaPresenceConfig>;
-/**
- * The presence configuration object.
- *
- * Default presence values: online, offline, busy, dnd, away
- *
- * You can overwrite colors in the theme semantic tokens.
- * theme.semanticTokens.colors['presence.online'] = 'cyan.500'
- *
- * Or add a custom presence value
- * theme.semanticTokens.colors['presence.vacay'] = 'blue.500'
- *
- * @see Docs https://saas-ui.dev/docs/components/data-display/persona
- */
-declare const defaultPersonaPresenceOptions: PersonaPresenceOptions;
-
-interface PersonaRootProps extends HTMLChakraProps<'div'>, SlotRecipeProps<'suiPersona'>, PersonaVariantProps {
-    /**
-     * Indicates that a person is out of office. Changes the presence badge style.
-     */
-    outOfOffice?: boolean;
-    /**
-     * The presence status of the person
-     */
-    presence?: PersonaPresence;
-}
-interface PersonaAvatarOptions {
-    /**
-     * The name of the person in the avatar.
-     *
-     * - if `src` has loaded, the name will be used as the `alt` attribute of the `img`
-     * - If `src` is not loaded, the name will be used to create the initials
-     */
-    name?: string;
-}
-interface PersonaAvatarProps$1 extends PersonaAvatarOptions, AvatarProps {
-    src?: string;
-    srcSet?: string;
-    loading?: ImageProps$1['loading'];
-    icon?: React__default.ReactElement;
-    fallback?: React__default.ReactNode;
-    getInitials?: (name?: string | null) => string | null;
-}
-
-interface PersonaOptions {
-    /**
-     * The name of the person in the avatar.
-     *
-     * - if `src` has loaded, the name will be used as the `alt` attribute of the `img`
-     * - If `src` is not loaded, the name will be used to create the initials
-     */
-    name?: string;
-    /**
-     * The presence status of the person
-     *
-     * If set will add an AvatarBadge with color configured in `Presence`
-     * Default presence options:
-     * - online
-     * - offline
-     * - busy
-     * - dnd
-     * - away
-     */
-    presence?: PersonaPresence;
-    /**
-     * The icon shown in the AvatarBadge
-     */
-    presenceIcon?: React$1.ReactNode;
-    /**
-     * Indicates that a person is out of office. Changes the presence badge style.
-     */
-    isOutOfOffice?: boolean;
-    /**
-     * Primary label of the persona, defaults to the name
-     */
-    label?: React$1.ReactNode;
-    /**
-     * Secondary label, usually the role of the person
-     * Only visible from md size and up.
-     */
-    secondaryLabel?: React$1.ReactNode;
-    /**
-     * Tertiary label, usually the status of the person.
-     * Only visible from lg size and up.
-     */
-    tertiaryLabel?: React$1.ReactNode;
-    /**
-     * Hide the persona details next to the avatar.
-     */
-    hideDetails?: boolean;
-}
-interface PersonaProps extends PersonaOptions, Omit<PersonaAvatarProps$1, 'size'>, Omit<PersonaRootProps, 'presence'>, PersonaVariantProps {
-}
-/**
- * The wrapper component that handles default composition.
- *
- * @see Docs https://saas-ui.dev/docs/components/data-display/persona
- */
-declare const Persona: React$1.ForwardRefExoticComponent<PersonaProps & React$1.RefAttributes<HTMLDivElement>>;
-interface PersonaAvatarProps extends Omit<PersonaProps, 'hideDetails' | 'label' | 'secondaryLabel' | 'tertiaryLabel' | 'children'> {
-}
-declare const PersonaAvatar: React$1.ForwardRefExoticComponent<PersonaAvatarProps & React$1.RefAttributes<HTMLDivElement>>;
-
-export { Persona, PersonaAvatar, type PersonaAvatarProps, type PersonaPresence, type PersonaPresenceConfig, type PersonaProps, defaultPersonaPresenceOptions };

package/dist/persona/index.js

@@ -1,212 +0,0 @@
-'use client'
-import "../chunk-RTMS5TJN.js";
-
-// src/components/persona/persona.tsx
-import * as React2 from "react";
-
-// src/components/persona/persona-primitive.tsx
-import { forwardRef as forwardRef2 } from "react";
-import {
-  chakra
-} from "@chakra-ui/react";
-import { dataAttr } from "@saas-ui/core/utils";
-
-// src/components/avatar/avatar.tsx
-import { forwardRef } from "react";
-import { Avatar as ChakraAvatar } from "@chakra-ui/react/avatar";
-import { Group } from "@chakra-ui/react/group";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var Avatar = forwardRef(
-  function Avatar2(props, ref) {
-    const { name, src, srcSet, loading, icon, fallback, children, ...rest } = props;
-    return /* @__PURE__ */ jsxs(ChakraAvatar.Root, { ref, ...rest, children: [
-      /* @__PURE__ */ jsx(AvatarFallback, { name, icon, children: fallback }),
-      /* @__PURE__ */ jsx(ChakraAvatar.Image, { src, srcSet, loading }),
-      children
-    ] });
-  }
-);
-var AvatarFallback = forwardRef(
-  function AvatarFallback2(props, ref) {
-    const { name, icon, children, ...rest } = props;
-    return /* @__PURE__ */ jsxs(ChakraAvatar.Fallback, { ref, ...rest, children: [
-      children,
-      name != null && children == null && /* @__PURE__ */ jsx(Fragment, { children: getInitials(name) }),
-      name == null && children == null && /* @__PURE__ */ jsx(ChakraAvatar.Icon, { asChild: !!icon, children: icon })
-    ] });
-  }
-);
-function getInitials(name) {
-  const names = name.trim().split(" ");
-  const firstName = names[0] != null ? names[0] : "";
-  const lastName = names.length > 1 ? names[names.length - 1] : "";
-  return firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` : firstName.charAt(0);
-}
-var AvatarGroup = forwardRef(
-  function AvatarGroup2(props, ref) {
-    const { size, variant, borderless, ...rest } = props;
-    return /* @__PURE__ */ jsx(ChakraAvatar.PropsProvider, { value: { size, variant, borderless }, children: /* @__PURE__ */ jsx(Group, { gap: "0", spaceX: "-3", ref, ...rest }) });
-  }
-);
-
-// src/components/persona/persona.context.ts
-import { createSlotRecipeContext } from "@chakra-ui/react";
-var {
-  useStyles: usePersonaStyles,
-  withProvider,
-  withContext
-} = createSlotRecipeContext({
-  key: "suiPersona"
-});
-
-// src/components/persona/persona-primitive.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var PersonaRoot = withProvider(
-  forwardRef2((props, ref) => {
-    const { outOfOffice, presence, ...rest } = props;
-    return /* @__PURE__ */ jsx2(
-      chakra.div,
-      {
-        ref,
-        ...rest,
-        "data-out-of-office": dataAttr(outOfOffice),
-        "data-presence": presence,
-        css: [
-          presence ? {
-            "--persona-presence": `colors.presence.${presence}`
-          } : void 0,
-          rest.css
-        ]
-      }
-    );
-  }),
-  "root"
-);
-var PersonaAvatar = forwardRef2(
-  (props, ref) => {
-    const {
-      name,
-      getInitials: getInitials2 = (name2) => name2 == null ? void 0 : name2[0],
-      icon,
-      loading,
-      onError,
-      src,
-      srcSet,
-      children,
-      ...rest
-    } = props;
-    return /* @__PURE__ */ jsx2(Avatar, { ref, ...rest, children });
-  }
-);
-var PersonaPresenceBadge = withContext("span", "presence");
-var PersonaDetails = withContext(
-  "div",
-  "details"
-);
-var PersonaLabel = withContext(
-  "span",
-  "label"
-);
-PersonaLabel.displayName = "PersonaLabel";
-var PersonaSecondaryLabel = withContext(
-  "span",
-  "secondaryLabel"
-);
-var PersonaTertiaryLabel = withContext(
-  "span",
-  "tertiaryLabel"
-);
-
-// src/components/persona/persona.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var Persona = React2.forwardRef(
-  (props, ref) => {
-    const {
-      name,
-      presence,
-      presenceIcon,
-      isOutOfOffice,
-      label,
-      secondaryLabel,
-      tertiaryLabel,
-      size,
-      hideDetails,
-      children,
-      /** Avatar props */
-      getInitials: getInitials2,
-      icon,
-      loading,
-      onError,
-      src,
-      srcSet,
-      fallback,
-      ...rest
-    } = props;
-    return /* @__PURE__ */ jsxs2(
-      PersonaRoot,
-      {
-        ref,
-        outOfOffice: isOutOfOffice,
-        presence,
-        size,
-        ...rest,
-        children: [
-          /* @__PURE__ */ jsx3(
-            PersonaAvatar,
-            {
-              name,
-              size,
-              getInitials: getInitials2,
-              icon,
-              loading,
-              onError,
-              src,
-              srcSet,
-              fallback,
-              children: presence ? /* @__PURE__ */ jsx3(PersonaPresenceBadge, { children: presenceIcon }) : null
-            }
-          ),
-          !hideDetails && /* @__PURE__ */ jsxs2(PersonaDetails, { children: [
-            /* @__PURE__ */ jsx3(PersonaLabel, { children: label || name }),
-            secondaryLabel && /* @__PURE__ */ jsx3(PersonaSecondaryLabel, { children: secondaryLabel }),
-            tertiaryLabel && /* @__PURE__ */ jsx3(PersonaTertiaryLabel, { children: tertiaryLabel }),
-            children
-          ] })
-        ]
-      }
-    );
-  }
-);
-Persona.displayName = "Persona";
-var PersonaAvatar2 = React2.forwardRef(function PersonaAvatar3(props, ref) {
-  return /* @__PURE__ */ jsx3(Persona, { ref, ...props, hideDetails: true });
-});
-
-// src/components/persona/presence.ts
-var defaultPersonaPresenceOptions = {
-  online: {
-    label: "Online",
-    color: "presence.online"
-  },
-  offline: {
-    label: "Offline",
-    color: "presence.offline"
-  },
-  busy: {
-    label: "Busy",
-    color: "presence.busy"
-  },
-  dnd: {
-    label: "Do-not-disturb",
-    color: "presence.dnd"
-  },
-  away: {
-    label: "Away",
-    color: "presence.away"
-  }
-};
-export {
-  Persona,
-  PersonaAvatar2 as PersonaAvatar,
-  defaultPersonaPresenceOptions
-};

package/dist/pin-input/index.cjs

@@ -1,52 +0,0 @@
-'use client'
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/pin-input/index.ts
-var pin_input_exports = {};
-__export(pin_input_exports, {
-  PinInput: () => PinInput
-});
-module.exports = __toCommonJS(pin_input_exports);
-
-// src/components/pin-input/pin-input.tsx
-var import_react = require("react");
-var import_group = require("@chakra-ui/react/group");
-var import_pin_input = require("@chakra-ui/react/pin-input");
-var import_jsx_runtime = require("react/jsx-runtime");
-var PinInput = (0, import_react.forwardRef)(
-  function PinInput2(props, ref) {
-    const {
-      pinLength = 4,
-      inputProps,
-      rootRef,
-      attached,
-      gap = attached ? 0 : 2,
-      ...rest
-    } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_pin_input.PinInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_pin_input.PinInput.HiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_pin_input.PinInput.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_group.Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_pin_input.PinInput.Input, { index }, index)) }) })
-    ] });
-  }
-);
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  PinInput
-});

package/dist/pin-input/index.d.cts

@@ -1,12 +0,0 @@
-import * as React$1 from 'react';
-import { PinInput as PinInput$1 } from '@chakra-ui/react/pin-input';
-
-interface PinInputProps extends PinInput$1.RootProps {
-    rootRef?: React.Ref<HTMLDivElement>;
-    pinLength?: number;
-    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
-    attached?: boolean;
-}
-declare const PinInput: React$1.ForwardRefExoticComponent<PinInputProps & React$1.RefAttributes<HTMLInputElement>>;
-
-export { PinInput, type PinInputProps };

package/dist/pin-input/index.d.ts

@@ -1,12 +0,0 @@
-import * as React$1 from 'react';
-import { PinInput as PinInput$1 } from '@chakra-ui/react/pin-input';
-
-interface PinInputProps extends PinInput$1.RootProps {
-    rootRef?: React.Ref<HTMLDivElement>;
-    pinLength?: number;
-    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
-    attached?: boolean;
-}
-declare const PinInput: React$1.ForwardRefExoticComponent<PinInputProps & React$1.RefAttributes<HTMLInputElement>>;
-
-export { PinInput, type PinInputProps };

package/dist/pin-input/index.js

@@ -1,27 +0,0 @@
-'use client'
-import "../chunk-RTMS5TJN.js";
-
-// src/components/pin-input/pin-input.tsx
-import { forwardRef } from "react";
-import { Group } from "@chakra-ui/react/group";
-import { PinInput as ChakraPinInput } from "@chakra-ui/react/pin-input";
-import { jsx, jsxs } from "react/jsx-runtime";
-var PinInput = forwardRef(
-  function PinInput2(props, ref) {
-    const {
-      pinLength = 4,
-      inputProps,
-      rootRef,
-      attached,
-      gap = attached ? 0 : 2,
-      ...rest
-    } = props;
-    return /* @__PURE__ */ jsxs(ChakraPinInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ jsx(ChakraPinInput.HiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ jsx(ChakraPinInput.Control, { children: /* @__PURE__ */ jsx(Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ jsx(ChakraPinInput.Input, { index }, index)) }) })
-    ] });
-  }
-);
-export {
-  PinInput
-};