@fidely-ui/react
Version:
Fidely UI is a modern, beautifully crafted React design system powered by Ark UI and Panda CSS, delivering accessible and themeable components for building exceptional web apps
1,321 lines (1,251 loc) • 76.4 kB
JavaScript
'use client'
"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/index.ts
var index_exports = {};
__export(index_exports, {
Accordion: () => namespace_exports,
AccordionContext: () => AccordionContext,
AccordionItem: () => AccordionItem,
AccordionItemContent: () => AccordionItemContent,
AccordionItemIndicator: () => AccordionItemIndicator,
AccordionItemTrigger: () => AccordionItemTrigger,
AccordionRoot: () => AccordionRoot,
AccordionRootProvider: () => AccordionRootProvider,
Avatar: () => namespace_exports2,
AvatarContext: () => AvatarContext,
AvatarFallback: () => AvatarFallback,
AvatarGroup: () => AvatarGroup,
AvatarIcon: () => AvatarIcon,
AvatarImage: () => AvatarImage,
AvatarRoot: () => AvatarRoot,
AvatarRootProvider: () => AvatarRootProvider,
Badge: () => Badge,
Box: () => Box,
Button: () => Button,
Card: () => namespace_exports3,
CardBody: () => CardBody,
CardDescription: () => CardDescription,
CardFooter: () => CardFooter,
CardHeader: () => CardHeader,
CardRoot: () => CardRoot,
CardTitle: () => CardTitle,
Center: () => Center,
Checkbox: () => namespace_exports4,
CheckboxContext: () => CheckboxContext,
CheckboxControl: () => CheckboxControl,
CheckboxGroup: () => CheckboxGroup,
CheckboxHiddenInput: () => CheckboxHiddenInput,
CheckboxIndicator: () => CheckboxIndicator,
CheckboxLabel: () => CheckboxLabel,
CheckboxRoot: () => CheckboxRoot,
CheckboxRootProvider: () => CheckboxRootProvider,
ClientOnly: () => ClientOnly,
Clipboard: () => namespace_exports5,
ClipboardContext: () => ClipboardContext,
ClipboardControl: () => ClipboardControl,
ClipboardIndicator: () => ClipboardIndicator,
ClipboardInput: () => ClipboardInput,
ClipboardLabel: () => ClipboardLabel,
ClipboardRoot: () => ClipboardRoot,
ClipboardRootProvider: () => ClipboardRootProvider,
ClipboardStatus: () => ClipboardStatus,
ClipboardTrigger: () => ClipboardTrigger,
CloseButton: () => CloseButton,
Combobox: () => namespace_exports6,
ComboboxClearTrigger: () => ComboboxClearTrigger,
ComboboxContent: () => ComboboxContent,
ComboboxContext: () => ComboboxContext,
ComboboxControl: () => ComboboxControl,
ComboboxEmpty: () => ComboboxEmpty,
ComboboxIndicatorGroup: () => ComboboxIndicatorGroup,
ComboboxInput: () => ComboboxInput,
ComboboxItem: () => ComboboxItem,
ComboboxItemContext: () => ComboboxItemContext,
ComboboxItemGroup: () => ComboboxItemGroup,
ComboboxItemGroupLabel: () => ComboboxItemGroupLabel,
ComboboxItemIndicator: () => ComboboxItemIndicator,
ComboboxItemText: () => ComboboxItemText,
ComboboxLabel: () => ComboboxLabel,
ComboboxList: () => ComboboxList,
ComboboxPositioner: () => ComboboxPositioner,
ComboboxRoot: () => ComboboxRoot,
ComboboxRootProvider: () => ComboboxRootProvider,
ComboboxTrigger: () => ComboboxTrigger,
CommandInput: () => CommandInput,
Dialog: () => namespace_exports7,
DialogBackdrop: () => DialogBackdrop,
DialogBody: () => DialogBody,
DialogCloseAction: () => DialogCloseAction,
DialogCloseTrigger: () => DialogCloseTrigger,
DialogContent: () => DialogContent,
DialogContext: () => DialogContext,
DialogDescription: () => DialogDescription,
DialogFooter: () => DialogFooter,
DialogHeader: () => DialogHeader,
DialogPositioner: () => DialogPositioner,
DialogRoot: () => DialogRoot,
DialogRootProvider: () => DialogRootProvider,
DialogTitle: () => DialogTitle,
DialogTrigger: () => DialogTrigger,
Divider: () => Divider,
DownloadTrigger: () => import_download_trigger.DownloadTrigger,
Em: () => Em,
Field: () => namespace_exports8,
FieldContext: () => FieldContext,
FieldError: () => FieldError,
FieldHelperText: () => FieldHelperText,
FieldLabel: () => FieldLabel,
FieldRequiredIndicator: () => FieldRequiredIndicator,
FieldRoot: () => FieldRoot,
FieldRootProvider: () => FieldRootProvider,
Flex: () => Flex,
FloatInput: () => FloatInput,
FormatByte: () => FormatByte,
FormatNumber: () => FormatNumber,
FormatRelativeTime: () => FormatRelativeTime,
Grid: () => Grid,
GridItem: () => GridItem,
Group: () => Group,
HStack: () => HStack,
Heading: () => Heading,
IconButton: () => IconButton,
Image: () => Image,
Input: () => Input,
InputAddon: () => InputAddon,
InputGroup: () => InputGroup,
Kbd: () => Kbd,
Paper: () => Paper,
PasswordInput: () => namespace_exports13,
PasswordInputContext: () => PasswordInputContext,
PasswordInputControl: () => PasswordInputControl,
PasswordInputIndicator: () => PasswordInputIndicator,
PasswordInputInput: () => PasswordInputInput,
PasswordInputLabel: () => PasswordInputLabel,
PasswordInputRoot: () => PasswordInputRoot,
PasswordInputRootProvider: () => PasswordInputRootProvider,
PasswordInputVisibilityTrigger: () => PasswordInputVisibilityTrigger,
Persona: () => Persona,
PinInput: () => namespace_exports14,
PinInputContext: () => PinInputContext,
PinInputControl: () => PinInputControl,
PinInputHiddenInput: () => PinInputHiddenInput,
PinInputInput: () => PinInputInput,
PinInputLabel: () => PinInputLabel,
PinInputRoot: () => PinInputRoot,
PinInputRootProvider: () => PinInputRootProvider,
Portal: () => import_portal.Portal,
Select: () => namespace_exports9,
SelectClearTrigger: () => SelectClearTrigger,
SelectContent: () => SelectContent,
SelectControl: () => SelectControl,
SelectHiddenSelect: () => SelectHiddenSelect,
SelectIndicator: () => SelectIndicator,
SelectItem: () => SelectItem,
SelectItemContext: () => SelectItemContext,
SelectItemGroup: () => SelectItemGroup,
SelectItemGroupLabel: () => SelectItemGroupLabel,
SelectItemIndicator: () => SelectItemIndicator,
SelectItemText: () => SelectItemText,
SelectLabel: () => SelectLabel,
SelectPositioner: () => SelectPositioner,
SelectRoot: () => SelectRoot,
SelectRootProvider: () => SelectRootProvider,
SelectTrigger: () => SelectTrigger,
SelectValueText: () => SelectValueText,
Skeleton: () => Skeleton,
SkeletonText: () => SkeletonText,
Span: () => Span,
Spinner: () => Spinner,
Stack: () => Stack,
Switch: () => namespace_exports10,
SwitchContext: () => SwitchContext,
SwitchControl: () => SwitchControl,
SwitchHiddenInput: () => SwitchHiddenInput,
SwitchLabel: () => SwitchLabel,
SwitchRoot: () => SwitchRoot,
SwitchRootProvider: () => SwitchRootProvider,
SwitchThumb: () => SwitchThumb,
TabContent: () => TabContent,
TabIndicator: () => TabIndicator,
TabList: () => TabList,
TabTrigger: () => TabTrigger,
Table: () => namespace_exports11,
TableBody: () => TableBody,
TableCaption: () => TableCaption,
TableCell: () => TableCell,
TableFooter: () => TableFooter,
TableHeadCell: () => TableHeadCell,
TableHeader: () => TableHeader,
TableRoot: () => TableRoot,
TableRow: () => TableRow,
TableScrollArea: () => TableScrollArea,
Tabs: () => namespace_exports12,
TabsContext: () => TabsContext,
TabsRoot: () => TabsRoot,
TabsRootProvider: () => TabsRootProvider,
Text: () => Text,
Textarea: () => Textarea,
VStack: () => VStack,
Wrap: () => Wrap,
createFileTreeCollection: () => import_collection.createFileTreeCollection,
createGridCollection: () => import_collection.createGridCollection,
createListCollection: () => import_collection.createListCollection,
createTreeCollection: () => import_collection.createTreeCollection,
fidely: () => import_factory22.ark,
useAccordion: () => import_accordion4.useAccordion,
useAccordionContext: () => import_accordion4.useAccordionContext,
useCheckbox: () => import_checkbox4.useCheckbox,
useCheckboxContext: () => import_checkbox4.useCheckboxContext,
useCheckboxGroup: () => import_checkbox4.useCheckboxGroup,
useCheckboxGroupContext: () => import_checkbox4.useCheckboxGroupContext,
useClipboard: () => import_clipboard4.useClipboard,
useClipboardContext: () => import_clipboard4.useClipboardContext,
useCombobox: () => import_combobox4.useCombobox,
useComboboxContext: () => import_combobox4.useComboboxContext,
useComboboxItemContext: () => import_combobox4.useComboboxItemContext,
useDialog: () => import_dialog4.useDialog,
useDialogContext: () => import_dialog4.useDialogContext,
useFilter: () => import_locale.useFilter,
usePasswordInput: () => import_password_input4.usePasswordInput,
usePasswordInputContext: () => import_password_input4.usePasswordInputContext,
usePinInput: () => import_pin_input4.usePinInput,
usePinInputContext: () => import_pin_input4.usePinInputContext,
useSelect: () => import_select4.useSelect,
useSelectContext: () => import_select4.useSelectContext,
useSelectItemContext: () => import_select4.useSelectItemContext,
useTabs: () => import_tabs4.useTabs,
useTabsContext: () => import_tabs4.useTabsContext
});
module.exports = __toCommonJS(index_exports);
// src/components/index.ts
var import_factory22 = require("@ark-ui/react/factory");
// src/components/accordion/accordion.tsx
var import_accordion = require("@ark-ui/react/accordion");
var import_recipes = require("@fidely-ui/styled-system/recipes");
// src/system/make-style-context.tsx
var React = __toESM(require("react"), 1);
var import_jsx = require("@fidely-ui/styled-system/jsx");
var import_css = require("@fidely-ui/styled-system/css");
var import_jsx_runtime = require("react/jsx-runtime");
var canForward = (prop, variantKeys, opts = {}) => opts.forwardProps?.includes(prop) || !variantKeys.includes(prop) && !(0, import_jsx.isCssProperty)(prop);
function makeStyleContext(recipe) {
const Ctx = React.createContext(null);
function withSlotRootProvider2(Component) {
const Comp = (props) => {
const [variantProps, rest] = recipe.splitVariantProps(props);
const slots = recipe(variantProps);
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Ctx.Provider, { value: slots, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...rest }) });
};
Comp.displayName = "FidelyRoot";
return Comp;
}
function withSlotProvider14(Component, slot, opts) {
const Styled = (0, import_jsx.styled)(
Component,
{},
{
shouldForwardProp: (prop, variantKeys) => canForward(prop, variantKeys, opts)
}
);
const Comp = React.forwardRef((props, ref) => {
const [variantProps, rest] = recipe.splitVariantProps(props);
const slots = recipe(variantProps);
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Ctx.Provider, { value: slots, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
Styled,
{
...rest,
ref,
className: (0, import_css.cx)(slots?.[slot], props.className)
}
) });
});
Comp.displayName = `FidelySlotProvider(${String(slot)})`;
return Comp;
}
function withSlotContext15(Component, slot) {
const Styled = (0, import_jsx.styled)(Component);
const Comp = React.forwardRef((props, ref) => {
const slots = React.useContext(Ctx);
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
Styled,
{
...props,
ref,
className: (0, import_css.cx)(slots?.[slot], props.className)
}
);
});
Comp.displayName = `FidelySlotConsumer(${String(slot)})`;
return Comp;
}
return { withSlotRootProvider: withSlotRootProvider2, withSlotProvider: withSlotProvider14, withSlotContext: withSlotContext15 };
}
// src/components/accordion/accordion.tsx
var { withSlotProvider, withSlotContext } = makeStyleContext(import_recipes.accordion);
var AccordionRootProvider = withSlotProvider(import_accordion.Accordion.RootProvider, "root");
var AccordionRoot = withSlotProvider(import_accordion.Accordion.Root, "root");
var AccordionItem = withSlotContext(import_accordion.Accordion.Item, "item");
var AccordionItemContent = withSlotContext(import_accordion.Accordion.ItemContent, "itemContent");
var AccordionItemTrigger = withSlotContext(import_accordion.Accordion.ItemTrigger, "itemTrigger");
var AccordionItemIndicator = withSlotContext(import_accordion.Accordion.ItemIndicator, "itemIndicator");
var AccordionContext = import_accordion.Accordion.Context;
// src/components/accordion/index.ts
var import_accordion4 = require("@ark-ui/react/accordion");
// src/components/accordion/namespace.ts
var namespace_exports = {};
__export(namespace_exports, {
Item: () => AccordionItem,
ItemContent: () => AccordionItemContent,
ItemIndicator: () => AccordionItemIndicator,
ItemTrigger: () => AccordionItemTrigger,
Root: () => AccordionRoot,
RootProvider: () => AccordionRootProvider
});
// src/components/avatar/avatar.tsx
var import_react = require("react");
var import_factory = require("@ark-ui/react/factory");
var import_avatar = require("@ark-ui/react/avatar");
var import_recipes2 = require("@fidely-ui/styled-system/recipes");
var import_jsx2 = require("@fidely-ui/styled-system/jsx");
// src/utils/get-initial.ts
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);
}
// src/components/avatar/avatar.tsx
var import_jsx_runtime2 = require("react/jsx-runtime");
var { withSlotProvider: withSlotProvider2, withSlotContext: withSlotContext2 } = makeStyleContext(import_recipes2.avatar);
var AvatarRootProvider = withSlotProvider2(import_avatar.Avatar.RootProvider, "root");
var AvatarRoot = withSlotProvider2(
import_avatar.Avatar.Root,
"root"
);
var StyledFallback = (0, import_jsx2.styled)(import_avatar.Avatar.Fallback, {});
function getFallback(props) {
if (props.children) return props.children;
if (props.name) return getInitials(props.name);
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(AvatarIcon, {});
}
var AvatarFallback = (0, import_react.forwardRef)(
function AvatarFallback2(props, ref) {
const { name: _, ...rest } = props;
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(StyledFallback, { ref, ...rest, children: getFallback(props) });
}
);
var AvatarImage = withSlotContext2(
import_avatar.Avatar.Image,
"image"
);
var AvatarIcon = (0, import_react.forwardRef)(
function AvatarIcon2(props, ref) {
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
import_factory.ark.svg,
{
ref,
stroke: "currentColor",
fill: "currentColor",
strokeWidth: "0",
viewBox: "0 0 24 24",
height: "1.2em",
width: "1.2em",
...props,
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M20 22H18V20C18 18.3431 16.6569 17 15 17H9C7.34315 17 6 18.3431 6 20V22H4V20C4 17.2386 6.23858 15 9 15H15C17.7614 15 20 17.2386 20 20V22ZM12 13C8.68629 13 6 10.3137 6 7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7C18 10.3137 15.3137 13 12 13ZM12 11C14.2091 11 16 9.20914 16 7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7C8 9.20914 9.79086 11 12 11Z" })
}
);
}
);
AvatarIcon.displayName = "AvatarIcon";
var AvatarContext = import_avatar.Avatar.Context;
// src/components/avatar/avatar-group.tsx
var import_react2 = require("react");
// src/components/group/group.tsx
var React2 = __toESM(require("react"), 1);
var import_factory2 = require("@ark-ui/react/factory");
var import_jsx3 = require("@fidely-ui/styled-system/jsx");
var import_recipes3 = require("@fidely-ui/styled-system/recipes");
var import_css2 = require("@fidely-ui/styled-system/css");
var import_jsx_runtime3 = require("react/jsx-runtime");
var StyledGroup = (0, import_jsx3.styled)(import_factory2.ark.div, import_recipes3.group);
var Group = React2.forwardRef(
function Group2(props, ref) {
const {
alignItems = "center",
justifyContent = "flex-start",
flexWrap,
children,
className,
...rest
} = props;
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
StyledGroup,
{
ref,
alignItems,
justifyContent,
flexWrap,
...rest,
className: (0, import_css2.cx)(className),
children
}
);
}
);
Group.displayName = "Group";
// src/components/avatar/avatar-group.tsx
var import_jsx_runtime4 = require("react/jsx-runtime");
var AvatarGroup = (0, import_react2.forwardRef)(
function AvatarGroup2(props, ref) {
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Group, { overlap: true, ref, ...props });
}
);
// src/components/avatar/namespace.ts
var namespace_exports2 = {};
__export(namespace_exports2, {
Context: () => AvatarContext,
Fallback: () => AvatarFallback,
Icon: () => AvatarIcon,
Image: () => AvatarImage,
Root: () => AvatarRoot,
RootProvider: () => AvatarRootProvider
});
// src/components/badge/badge.tsx
var import_react3 = require("react");
var import_factory3 = require("@ark-ui/react/factory");
var import_jsx4 = require("@fidely-ui/styled-system/jsx");
var import_recipes4 = require("@fidely-ui/styled-system/recipes");
var import_jsx_runtime5 = require("react/jsx-runtime");
var StyledBagde = (0, import_jsx4.styled)(import_factory3.ark.span, import_recipes4.badge);
var Badge = (0, import_react3.forwardRef)(
function Bagde(props, ref) {
const { children, ...rest } = props;
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(StyledBagde, { ref, ...rest, children });
}
);
Badge.displayName = "Badge";
// src/components/box/index.ts
var import_factory4 = require("@ark-ui/react/factory");
var import_jsx5 = require("@fidely-ui/styled-system/jsx");
var Box = (0, import_jsx5.styled)(import_factory4.ark.div);
// src/components/button/button.tsx
var React3 = __toESM(require("react"), 1);
var import_factory6 = require("@ark-ui/react/factory");
var import_jsx7 = require("@fidely-ui/styled-system/jsx");
var import_recipes6 = require("@fidely-ui/styled-system/recipes");
// src/utils/attr.ts
var dataAttr = (condition) => condition ? "" : void 0;
// src/components/spinner/spinner.tsx
var import_react4 = require("react");
var import_factory5 = require("@ark-ui/react/factory");
var import_jsx6 = require("@fidely-ui/styled-system/jsx");
var import_recipes5 = require("@fidely-ui/styled-system/recipes");
var import_jsx_runtime6 = require("react/jsx-runtime");
var StyledSpinner = (0, import_jsx6.styled)(import_factory5.ark.div, import_recipes5.spinner);
var Spinner = (0, import_react4.forwardRef)(
function Spinner2(props, ref) {
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(StyledSpinner, { ref, ...props });
}
);
Spinner.displayName = "Spinner";
// src/components/loader/index.tsx
var import_jsx_runtime7 = require("react/jsx-runtime");
var Loader = (props) => {
const { spinner: spinner2, ...rest } = props;
if (spinner2) return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_jsx_runtime7.Fragment, { children: spinner2 });
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
Spinner,
{
width: "1.1em",
height: "1.1em",
borderWidth: "1.5px",
"aria-hidden": "true",
...rest
}
);
};
// src/components/button/button.tsx
var import_jsx_runtime8 = require("react/jsx-runtime");
var StyledButton = (0, import_jsx7.styled)(import_factory6.ark.button, import_recipes6.button);
var Button = React3.forwardRef(
function Button2(props, ref) {
const {
isLoading,
loadingText,
spinnerPlacement = "start",
children,
asChild,
disabled,
spinner: spinner2,
...rest
} = props;
const LoaderComp = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Loader, { spinner: spinner2 });
const checkDisabled = isLoading || disabled;
const buttonContent = /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
isLoading && spinnerPlacement === "start" && !loadingText && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LoaderComp, {}),
isLoading && loadingText ? loadingText : children,
isLoading && spinnerPlacement === "end" && !loadingText && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LoaderComp, {})
] });
if (asChild) {
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
StyledButton,
{
asChild: true,
ref,
disabled: checkDisabled,
"data-disabled": dataAttr(disabled),
"data-loading": dataAttr(isLoading),
...rest,
children
}
);
}
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
StyledButton,
{
ref,
disabled: checkDisabled,
"data-disabled": dataAttr(disabled),
"data-loading": dataAttr(isLoading),
...rest,
children: buttonContent
}
);
}
);
Button.displayName = "Button";
// src/components/card/card.tsx
var import_factory7 = require("@ark-ui/react/factory");
var import_recipes7 = require("@fidely-ui/styled-system/recipes");
var { withSlotProvider: withSlotProvider3, withSlotContext: withSlotContext3 } = makeStyleContext(import_recipes7.card);
var CardRoot = withSlotProvider3(
import_factory7.ark.div,
"root"
);
var CardBody = withSlotContext3(
import_factory7.ark.div,
"body"
);
var CardHeader = withSlotContext3(
import_factory7.ark.div,
"header"
);
var CardTitle = withSlotContext3(
import_factory7.ark.h4,
"title"
);
var CardDescription = withSlotContext3(import_factory7.ark.div, "description");
var CardFooter = withSlotContext3(
import_factory7.ark.div,
"footer"
);
// src/components/card/namespace.ts
var namespace_exports3 = {};
__export(namespace_exports3, {
Body: () => CardBody,
Description: () => CardDescription,
Footer: () => CardFooter,
Header: () => CardHeader,
Root: () => CardRoot,
Title: () => CardTitle
});
// src/components/center/index.tsx
var import_react5 = require("react");
var import_jsx8 = require("@fidely-ui/styled-system/jsx");
var import_patterns = require("@fidely-ui/styled-system/patterns");
// src/utils/split-props.ts
function splitProps(props, patternKeys) {
const patternProps = {};
const restProps = {};
for (const key in props) {
if (patternKeys.includes(key)) {
patternProps[key] = props[key];
} else {
restProps[key] = props[key];
}
}
return [patternProps, restProps];
}
// src/components/center/index.tsx
var import_jsx_runtime9 = require("react/jsx-runtime");
var Center = (0, import_react5.forwardRef)(
function Center2(props, ref) {
const [patternProps, restProps] = splitProps(props, ["inline"]);
const styles = import_patterns.center.raw(patternProps);
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx8.styled.div, { ref, ...styles, ...restProps });
}
);
Center.displayName = "Center";
// src/components/checkbox/checkbox.tsx
var import_checkbox = require("@ark-ui/react/checkbox");
var import_recipes8 = require("@fidely-ui/styled-system/recipes");
// src/components/icons/create-icon.tsx
var React4 = __toESM(require("react"), 1);
var import_factory8 = require("@ark-ui/react/factory");
var import_jsx_runtime10 = require("react/jsx-runtime");
function createIcon(path) {
return React4.forwardRef(function Icon(props, ref) {
const { size = 20, ...rest } = props;
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
import_factory8.ark.svg,
{
ref,
width: size,
height: size,
viewBox: "0 0 24 24",
fill: "currentColor",
xmlns: "http://www.w3.org/2000/svg",
...rest,
children: path
}
);
});
}
// src/components/icons/FiCheck.tsx
var import_jsx_runtime11 = require("react/jsx-runtime");
var FiCheck = createIcon(
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M20.29 5.71a1 1 0 0 0-1.41 0L9 15.59l-3.88-3.88a1 1 0 0 0-1.41 1.41l4.59 4.59a1 1 0 0 0 1.41 0L20.29 7.12a1 1 0 0 0 0-1.41z" })
);
// src/components/checkbox/checkbox.tsx
var import_jsx_runtime12 = require("react/jsx-runtime");
var { withSlotProvider: withSlotProvider4, withSlotContext: withSlotContext4 } = makeStyleContext(import_recipes8.checkbox);
var CheckboxRootProvider = withSlotProvider4(import_checkbox.Checkbox.RootProvider, "root");
var CheckboxRoot = withSlotProvider4(
import_checkbox.Checkbox.Root,
"root"
);
var CheckboxGroup = withSlotContext4(import_checkbox.Checkbox.Group, "group");
var CheckboxControl = withSlotContext4(import_checkbox.Checkbox.Control, "control");
var CheckboxLabel = withSlotContext4(import_checkbox.Checkbox.Label, "label");
var CheckboxIndicator = withSlotContext4((props) => {
const { idleIcon = /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FiCheck, {}), children, ...rest } = props;
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_checkbox.Checkbox.Indicator, { ...rest, children: children ?? idleIcon });
}, "indicator");
var CheckboxContext = import_checkbox.Checkbox.Context;
var CheckboxHiddenInput = import_checkbox.Checkbox.HiddenInput;
// src/components/checkbox/index.ts
var import_checkbox4 = require("@ark-ui/react/checkbox");
// src/components/checkbox/namespace.ts
var namespace_exports4 = {};
__export(namespace_exports4, {
Context: () => CheckboxContext,
Control: () => CheckboxControl,
Group: () => CheckboxGroup,
HiddenInput: () => CheckboxHiddenInput,
Indicator: () => CheckboxIndicator,
Label: () => CheckboxLabel,
Root: () => CheckboxRoot,
RootProvider: () => CheckboxRootProvider
});
// src/components/client-only/index.tsx
var import_client_only = require("@ark-ui/react/client-only");
var import_jsx_runtime13 = require("react/jsx-runtime");
var ClientOnly = (props) => {
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_client_only.ClientOnly, { ...props });
};
// src/components/clipboard/clipboard.tsx
var React5 = __toESM(require("react"), 1);
var import_clipboard = require("@ark-ui/react/clipboard");
var import_recipes9 = require("@fidely-ui/styled-system/recipes");
// src/components/icons/FiCopy.tsx
var import_jsx_runtime14 = require("react/jsx-runtime");
var FiCopy = createIcon(
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
"rect",
{
x: "9",
y: "9",
width: "13",
height: "13",
rx: "2",
ry: "2",
stroke: "currentColor",
strokeWidth: "2",
fill: "none"
}
),
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
"rect",
{
x: "3",
y: "3",
width: "13",
height: "13",
rx: "2",
ry: "2",
stroke: "currentColor",
strokeWidth: "2",
fill: "none"
}
)
] })
);
// src/components/clipboard/clipboard.tsx
var import_jsx_runtime15 = require("react/jsx-runtime");
var { withSlotProvider: withSlotProvider5, withSlotContext: withSlotContext5 } = makeStyleContext(import_recipes9.clipboard);
var ClipboardRootProvider = withSlotProvider5(import_clipboard.Clipboard.RootProvider, "root");
var ClipboardRoot = withSlotProvider5(import_clipboard.Clipboard.Root, "root");
var ClipboardControl = withSlotContext5(import_clipboard.Clipboard.Control, "control");
var ClipboardTrigger = withSlotContext5(import_clipboard.Clipboard.Trigger, "trigger");
var ClipboardIndicator = withSlotContext5((props) => {
const {
copiedIcon = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FiCheck, {}),
idleIcon = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FiCopy, {}),
children,
...rest
} = props;
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_clipboard.Clipboard.Indicator, { ...rest, copied: props.copied ?? copiedIcon, children: children ?? idleIcon });
}, "indicator");
var ClipboardInput = withSlotContext5(import_clipboard.Clipboard.Input, "input");
var ClipboardLabel = withSlotContext5(import_clipboard.Clipboard.Label, "label");
var ClipboardContext = import_clipboard.Clipboard.Context;
var ClipboardStatus = React5.forwardRef(function ClipboardStatus2(props, ref) {
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ClipboardIndicator, { copied: "Copied", ref, ...props, children: "Copy" });
});
// src/components/clipboard/index.ts
var import_clipboard4 = require("@ark-ui/react/clipboard");
// src/components/clipboard/namespace.ts
var namespace_exports5 = {};
__export(namespace_exports5, {
Context: () => ClipboardContext,
Control: () => ClipboardControl,
Indicator: () => ClipboardIndicator,
Input: () => ClipboardInput,
Label: () => ClipboardLabel,
Root: () => ClipboardRoot,
RootProvider: () => ClipboardRootProvider,
Status: () => ClipboardStatus,
Trigger: () => ClipboardTrigger
});
// src/components/close-button/index.tsx
var import_react7 = require("react");
// src/components/icon-button/icon-button.tsx
var import_react6 = require("react");
var import_jsx_runtime16 = require("react/jsx-runtime");
var IconButton = (0, import_react6.forwardRef)(
function IconButton2(props, ref) {
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
Button,
{
ref,
px: "0",
py: "0",
display: "inline-flex",
alignItems: "center",
justifyContent: "center",
_icon: { fontSize: "1.1em" },
...props
}
);
}
);
IconButton.displayName = "IconButton";
// src/components/icons/FiClose.tsx
var import_jsx_runtime17 = require("react/jsx-runtime");
var FiClose = createIcon(
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
"path",
{
d: "M18 6 6 18M6 6l12 12",
stroke: "currentColor",
strokeWidth: "2",
fill: "none",
strokeLinecap: "round"
}
)
);
// src/components/close-button/index.tsx
var import_jsx_runtime18 = require("react/jsx-runtime");
var CloseButton = (0, import_react7.forwardRef)(
function CloseButton2(props, ref) {
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(IconButton, { variant: "ghost", "aria-label": "Close", ref, ...props, children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(FiClose, {}) });
}
);
CloseButton.displayName = "CloseButton";
// src/components/command-input/command-input.tsx
var React6 = __toESM(require("react"), 1);
var import_css3 = require("@fidely-ui/styled-system/css");
var import_recipes12 = require("@fidely-ui/styled-system/recipes");
// src/components/kbd/index.tsx
var import_factory9 = require("@ark-ui/react/factory");
var import_jsx9 = require("@fidely-ui/styled-system/jsx");
var import_recipes10 = require("@fidely-ui/styled-system/recipes");
var Kbd = (0, import_jsx9.styled)(import_factory9.ark.kbd, import_recipes10.kbd);
// src/components/flex/index.tsx
var import_react8 = require("react");
var import_jsx10 = require("@fidely-ui/styled-system/jsx");
var import_patterns2 = require("@fidely-ui/styled-system/patterns");
var import_jsx_runtime19 = require("react/jsx-runtime");
var Flex = (0, import_react8.forwardRef)(
function Flex2(props, ref) {
const [patternProps, restProps] = splitProps(props, [
"align",
"justify",
"direction",
"wrap",
"basis",
"grow",
"shrink",
"gap"
]);
const styles = import_patterns2.flex.raw(patternProps);
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx10.styled.div, { ref, ...styles, ...restProps });
}
);
Flex.displayName = "Flex";
// src/components/text/index.tsx
var import_react9 = require("react");
var import_factory10 = require("@ark-ui/react/factory");
var import_jsx11 = require("@fidely-ui/styled-system/jsx");
var import_recipes11 = require("@fidely-ui/styled-system/recipes");
var import_jsx_runtime20 = require("react/jsx-runtime");
var StyledText = (0, import_jsx11.styled)(import_factory10.ark.p, import_recipes11.text);
var Text = (0, import_react9.forwardRef)(
function Text2(props, ref) {
const { className, ...rest } = props;
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(StyledText, { ref, ...rest });
}
);
Text.displayName = "Text";
// src/utils/is-mobile-device.ts
function isMobileDevice() {
if (typeof navigator === "undefined") return false;
return /android|bb\d+|meego|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(?:hone|od|pad)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(?:ob|in)i|palm(?: os)?|phone|p(?:ixi|re)\/|plucker|pocket|psp|series(?:4|6)0|symbian|treo|up\.(?:browser|link)|vodafone|wap|windows ce|windows phone|xda|xiino|zte-/i.test(
navigator.userAgent
);
}
// src/components/icons/FiSearch.tsx
var import_jsx_runtime21 = require("react/jsx-runtime");
var FiSearch = createIcon(
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
"path",
{
d: "M21 21l-4.35-4.35M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16z",
stroke: "currentColor",
strokeWidth: "2",
fill: "none",
strokeLinecap: "round",
strokeLinejoin: "round"
}
)
);
// src/components/command-input/command-input.tsx
var import_jsx_runtime22 = require("react/jsx-runtime");
var CommandInput = React6.forwardRef(function CommandInput2(props, ref) {
const {
shortcut,
onOpen,
placeholder = "Search...",
leftElement,
className,
...rest
} = props;
const slotStyles = (0, import_recipes12.commandInput)();
const [isMobile, setIsMobile] = React6.useState(false);
const [resolvedShortcut, setResolvedShortcut] = React6.useState(
null
);
React6.useEffect(() => {
const mobile = isMobileDevice();
setIsMobile(mobile);
if (!mobile) {
const isMac = /Mac|iPod|iPhone|iPad/.test(navigator.userAgent);
setResolvedShortcut(shortcut ?? (isMac ? "\u2318 + K" : "Ctrl + K"));
}
}, [shortcut]);
React6.useEffect(() => {
if (isMobile || !resolvedShortcut) return;
const parts = resolvedShortcut.split("+").map((p) => p.trim().toLowerCase());
const handleKeyDown = (e) => {
const pressed = [];
if (e.metaKey) pressed.push("\u2318");
if (e.ctrlKey) pressed.push("ctrl");
pressed.push(e.key.toLowerCase());
const combo = pressed.join(" ");
const target = parts.join(" ").toLowerCase();
if (combo === target) {
e.preventDefault();
onOpen?.();
}
};
window.addEventListener("keydown", handleKeyDown);
return () => window.removeEventListener("keydown", handleKeyDown);
}, [resolvedShortcut, onOpen, isMobile]);
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
Group,
{
as: "button",
ref,
onClick: onOpen,
"aria-haspopup": "dialog",
"aria-expanded": false,
className: (0, import_css3.cx)(slotStyles, className),
...rest,
children: [
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Flex, { alignItems: "center", gap: "2", children: [
leftElement ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(FiSearch, {}),
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text, { color: "fg.muted", children: placeholder })
] }),
!isMobile && resolvedShortcut ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Flex, { gap: "1", children: resolvedShortcut.split("+").map((key, i) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Kbd, { children: key.trim() }, i)) }) : null
]
}
);
});
CommandInput.displayName = "CommandInput";
// src/components/combobox/combobox.tsx
var import_combobox = require("@ark-ui/react/combobox");
var import_recipes13 = require("@fidely-ui/styled-system/recipes");
// src/components/icons/FiCaretDownIcon.tsx
var import_jsx_runtime23 = require("react/jsx-runtime");
var FiCaretDownIcon = createIcon(
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
"path",
{
d: "M6 9L12 15L18 9",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round"
}
)
);
// src/components/combobox/combobox.tsx
var import_jsx_runtime24 = require("react/jsx-runtime");
var { withSlotProvider: withSlotProvider6, withSlotContext: withSlotContext6 } = makeStyleContext(import_recipes13.combobox);
var ComboboxRootProvider = withSlotProvider6(import_combobox.Combobox.RootProvider, "root");
var ComboboxRoot = withSlotProvider6(
import_combobox.Combobox.Root,
"root"
);
var ComboboxLabel = withSlotContext6(import_combobox.Combobox.Label, "label");
var ComboboxControl = withSlotContext6(import_combobox.Combobox.Control, "control");
var ComboboxInput = withSlotContext6(import_combobox.Combobox.Input, "input");
var ComboboxTrigger = withSlotContext6((props) => {
const { idleIcon = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(FiCaretDownIcon, { size: 18 }), children, ...rest } = props;
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_combobox.Combobox.Trigger, { ...rest, children: children ?? idleIcon });
}, "trigger");
var ComboboxClearTrigger = withSlotContext6((props) => {
const { idleIcon = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(FiClose, { size: 18 }), children, ...rest } = props;
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_combobox.Combobox.ClearTrigger, { ...rest, children: children ?? idleIcon });
}, "clearTrigger");
var ComboboxPositioner = withSlotContext6(import_combobox.Combobox.Positioner, "positioner");
var ComboboxContent = withSlotContext6(import_combobox.Combobox.Content, "content");
var ComboboxItemGroup = withSlotContext6(import_combobox.Combobox.ItemGroup, "itemGroup");
var ComboboxItemGroupLabel = withSlotContext6(import_combobox.Combobox.ItemGroupLabel, "itemGroupLabel");
var ComboboxItem = withSlotContext6(
import_combobox.Combobox.Item,
"item"
);
var ComboboxItemText = withSlotContext6(import_combobox.Combobox.ItemText, "itemText");
var ComboboxItemIndicator = withSlotContext6(import_combobox.Combobox.ItemIndicator, "itemIndicator");
var ComboboxIndicatorGroup = withSlotContext6("div", "indicatorGroup");
var ComboboxEmpty = withSlotContext6(import_combobox.Combobox.Empty, "empty");
var ComboboxList = withSlotContext6(
import_combobox.Combobox.List,
"list"
);
var ComboboxContext = import_combobox.Combobox.Context;
var ComboboxItemContext = import_combobox.Combobox.ItemContext;
// src/components/combobox/index.ts
var import_combobox4 = require("@ark-ui/react/combobox");
// src/components/combobox/namespace.ts
var namespace_exports6 = {};
__export(namespace_exports6, {
ClearTrigger: () => ComboboxClearTrigger,
Content: () => ComboboxContent,
Context: () => ComboboxContext,
Control: () => ComboboxControl,
Empty: () => ComboboxEmpty,
IndicatorGroup: () => ComboboxIndicatorGroup,
Input: () => ComboboxInput,
Item: () => ComboboxItem,
ItemContext: () => ComboboxItemContext,
ItemGroup: () => ComboboxItemGroup,
ItemGroupLabel: () => ComboboxItemGroupLabel,
ItemIndicator: () => ComboboxItemIndicator,
ItemText: () => ComboboxItemText,
Label: () => ComboboxLabel,
List: () => ComboboxList,
Positioner: () => ComboboxPositioner,
Root: () => ComboboxRoot,
RootProvider: () => ComboboxRootProvider,
Trigger: () => ComboboxTrigger
});
// src/components/dialog/dialog.tsx
var import_factory11 = require("@ark-ui/react/factory");
var import_dialog = require("@ark-ui/react/dialog");
var import_recipes14 = require("@fidely-ui/styled-system/recipes");
var import_jsx12 = require("@fidely-ui/styled-system/jsx");
var import_react10 = require("react");
var import_jsx_runtime25 = require("react/jsx-runtime");
var { withSlotRootProvider, withSlotContext: withSlotContext7 } = makeStyleContext(import_recipes14.dialog);
var DialogRootProvider = withSlotRootProvider(
import_dialog.Dialog.RootProvider
);
var DialogRoot = withSlotRootProvider(import_dialog.Dialog.Root);
var DialogContent = withSlotContext7(import_dialog.Dialog.Content, "content");
var DialogDescription = withSlotContext7(import_dialog.Dialog.Description, "description");
var DialogTitle = withSlotContext7(import_dialog.Dialog.Title, "title");
var DialogCloseTrigger = withSlotContext7(import_dialog.Dialog.CloseTrigger, "closeTrigger");
var DialogTrigger = withSlotContext7(import_dialog.Dialog.Trigger, "trigger");
var StyledCloseAction = (0, import_jsx12.styled)(import_factory11.ark.button);
var DialogCloseAction = (0, import_react10.forwardRef)(function DialogCloseAction2(props, ref) {
const dialog2 = (0, import_dialog.useDialogContext)();
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
StyledCloseAction,
{
...props,
ref,
onClick: () => dialog2.setOpen(false)
}
);
});
var DialogPositioner = withSlotContext7(import_dialog.Dialog.Positioner, "positioner");
var DialogBackdrop = withSlotContext7(import_dialog.Dialog.Backdrop, "backdrop");
var DialogBody = withSlotContext7(
"div",
"body"
);
var DialogHeader = withSlotContext7(
"div",
"header"
);
var DialogFooter = withSlotContext7(
"div",
"footer"
);
var DialogContext = import_dialog.Dialog.Context;
// src/components/dialog/index.ts
var import_dialog4 = require("@ark-ui/react/dialog");
// src/components/dialog/namespace.ts
var namespace_exports7 = {};
__export(namespace_exports7, {
Backdrop: () => DialogBackdrop,
Body: () => DialogBody,
CloseAction: () => DialogCloseAction,
CloseTrigger: () => DialogCloseTrigger,
Content: () => DialogContent,
Context: () => DialogContext,
Description: () => DialogDescription,
Footer: () => DialogFooter,
Header: () => DialogHeader,
Positioner: () => DialogPositioner,
Root: () => DialogRoot,
RootProvider: () => DialogRootProvider,
Title: () => DialogTitle,
Trigger: () => DialogTrigger
});
// src/components/divider/index.tsx
var import_react11 = require("react");
var import_jsx13 = require("@fidely-ui/styled-system/jsx");
var import_patterns3 = require("@fidely-ui/styled-system/patterns");
var import_jsx_runtime26 = require("react/jsx-runtime");
var Divider = (0, import_react11.forwardRef)(
function Divider2(props, ref) {
const [patternProps, restProps] = splitProps(props, [
"orientation",
"thickness",
"color"
]);
const styles = import_patterns3.divider.raw(patternProps);
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_jsx13.styled.div, { ref, ...styles, ...restProps });
}
);
Divider.displayName = "Divider";
// src/components/download-trigger/index.ts
var import_download_trigger = require("@ark-ui/react/download-trigger");
// src/components/em/index.ts
var import_factory12 = require("@ark-ui/react/factory");
var import_jsx14 = require("@fidely-ui/styled-system/jsx");
var Em = (0, import_jsx14.styled)(import_factory12.ark.em, {
base: {
fontStyle: "italic"
}
});
Em.displayName = "Em";
// src/components/field/field.tsx
var React7 = __toESM(require("react"), 1);
var import_factory13 = require("@ark-ui/react/factory");
var import_field = require("@ark-ui/react/field");
var import_recipes15 = require("@fidely-ui/styled-system/recipes");
var import_css4 = require("@fidely-ui/styled-system/css");
var import_jsx_runtime27 = require("react/jsx-runtime");
var { withSlotProvider: withSlotProvider7, withSlotContext: withSlotContext8 } = makeStyleContext(import_recipes15.field);
var FieldRootProvider = withSlotProvider7(import_field.Field.RootProvider, "root");
var FieldRoot = withSlotProvider7(
import_field.Field.Root,
"root"
);
var FieldError = withSlotContext8(
import_field.Field.ErrorText,
"errorText"
);
var FieldHelperText = withSlotContext8(import_field.Field.HelperText, "helperText");
var FieldLabel = withSlotContext8(
import_field.Field.Label,
"label"
);
var FieldRequiredIndicator = React7.forwardRef(function FieldIndicator(props, ref) {
const { fallback, className, children = "*", ...rest } = props;
const slotStyles = (0, import_recipes15.field)().requiredIndicator;
const context = (0, import_field.useFieldContext)();
if (!context.required) {
return fallback;
}
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
import_factory13.ark.span,
{
ref,
"aria-hidden": "true",
...rest,
className: (0, import_css4.cx)("fidely-field__indicator", slotStyles, className),
children
}
);
});
var FieldContext = import_field.Field.Context;
// src/components/field/namespace.ts
var namespace_exports8 = {};
__export(namespace_exports8, {
Error: () => FieldError,
FieldContext: () => FieldContext,
HelperText: () => FieldHelperText,
Label: () => FieldLabel,
RequiredIndicator: () => FieldRequiredIndicator,
Root: () => FieldRoot,
RootProvider: () => FieldRootProvider
});
// src/components/float-input/float-input.tsx
var React8 = __toESM(require("react"), 1);
var import_css5 = require("@fidely-ui/styled-system/css");
var import_recipes17 = require("@fidely-ui/styled-system/recipes");
// src/components/input/index.tsx
var import_field4 = require("@ark-ui/react/field");
var import_jsx15 = require("@fidely-ui/styled-system/jsx");
var import_recipes16 = require("@fidely-ui/styled-system/recipes");
var Input = (0, import_jsx15.styled)(import_field4.Field.Input, import_recipes16.input);
// src/components/float-input/float-input.tsx
var import_jsx_runtime28 = require("react/jsx-runtime");
var FloatInput = React8.forwardRef(
function FloatInput2(props, ref) {
const { label, value, onBlur, onFocus, className, ...rest } = props;
const [focused, setFocused] = React8.useState(false);
const isFloating = focused || Boolean(value && value.length > 0);
const inputSize = rest.size ?? "md";
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(Box, { position: "relative", width: "100%", children: [
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
Input,
{
ref,
value,
onFocus: (e) => {
setFocused(true);
onFocus?.(e);
},
onBlur: (e) => {
setFocused(false);
onBlur?.(e);
},
...rest
}
),
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
namespace_exports8.Label,
{
className: (0, import_css5.cx)(
(0, import_recipes17.floatLabel)({ float: isFloating, size: inputSize }),
className
),
children: label
}
)
] });
}
);
FloatInput.displayName = "FloatInput";
// src/components/format/index.ts
var import_format = require("@ark-ui/react/format");
var FormatByte = import_format.Format.Byte;
var FormatNumber = import_format.Format.Number;
var FormatRelativeTime = import_format.Format.RelativeTime;
// src/components/grid/grid.tsx
var import_react12 = require("react");
var import_jsx16 = require("@fidely-ui/styled-system/jsx");
var import_patterns4 = require("@fidely-ui/styled-system/patterns");
var import_jsx_runtime29 = require("react/jsx-runtime");
var Grid = (0, import_react12.forwardRef)(
function Grid2(props, ref) {
const [patternProps, restProps] = splitProps(props, [
"minChildWidth",
"rowGap",
"columnGap",
"columns",
"gap"
]);
const styles = import_patterns4.grid.raw(patternProps);
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_jsx16.styled.div, { ref, ...styles, ...restProps });
}
);
Grid.displayName = "Grid";
// src/components/grid/gridItem.tsx
var import_react13 = require("react");
var import_jsx17 = require("@fidely-ui/styled-system/jsx");
var import_patterns5 = require("@fidely-ui/styled-system/patterns");
var import_jsx_runtime30 = require("react/jsx-runtime");
var GridItem = (0, import_react13.forwardRef)(
function GridItem2(props, ref) {
const [patternProps, restProps] = splitProps(props, [
"colSpan",
"rowSpan",
"rowStart",
"rowEnd",
"colStart",
"colEnd"
]);
const styles = import_patterns5.gridItem.raw(patternProps);
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx17.styled.div, { ref, ...styles, ...restProps });
}
);
GridItem.displayName = "GridItem";
// src/components/heading/index.tsx
var import_react14 = require("react");
var import_factory14 = require("@ark-ui/react/factory");
var import_jsx18 = require("@fidely-ui/styled-system/jsx");
var import_recipes18 = require("@fidely-ui/styled-system/recipes");
var import_jsx_runtime31 = require("react/jsx-runtime");
var StyledHeading = (0, import_jsx18.styled)(import_factory14.ark.h2, import_recipes18.heading);
var Heading = (0, import_react14.forwardRef)(
function Heading2(props, ref) {
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(StyledHeading, { ref, ...props });
}
);
Heading.displayName = "Heading";
// src/compon