@burdenoff/fe-libs 2026.527.6 → 2026.528.1

package/dist/form/FormSection.js

@@ -0,0 +1,78 @@
+import { cn as e } from "../shared-utils.js";
+import "react";
+import * as t from "@radix-ui/react-accordion";
+import { ChevronDownIcon as n } from "lucide-react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/form/FormSection.tsx
+function a({ title: a, description: o, actions: s, collapsible: c = !1, defaultOpen: l = !0, className: u, contentClassName: d, children: f }) {
+	if (!c) return /* @__PURE__ */ i("section", {
+		"data-slot": "form-section",
+		className: e("rounded-lg border border-border-default bg-bg-surface p-4 sm:p-6", u),
+		children: [/* @__PURE__ */ i("header", {
+			className: "mb-4 flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between",
+			children: [/* @__PURE__ */ i("div", {
+				className: "min-w-0",
+				children: [/* @__PURE__ */ r("h2", {
+					className: "text-base font-semibold text-text-primary",
+					children: a
+				}), o ? /* @__PURE__ */ r("p", {
+					className: "mt-1 text-sm text-text-secondary",
+					children: o
+				}) : null]
+			}), s ? /* @__PURE__ */ r("div", {
+				className: "flex flex-shrink-0 items-center gap-2",
+				children: s
+			}) : null]
+		}), /* @__PURE__ */ r("div", {
+			className: e("space-y-4", d),
+			children: f
+		})]
+	});
+	let p = "form-section";
+	return /* @__PURE__ */ r(t.Root, {
+		type: "single",
+		collapsible: !0,
+		defaultValue: l ? p : void 0,
+		"data-slot": "form-section",
+		className: e("rounded-lg border border-border-default bg-bg-surface", u),
+		children: /* @__PURE__ */ i(t.Item, {
+			value: p,
+			className: "border-b-0",
+			children: [/* @__PURE__ */ r(t.Header, {
+				className: "flex",
+				children: /* @__PURE__ */ i(t.Trigger, {
+					"data-slot": "form-section-trigger",
+					className: e("group flex w-full items-center justify-between gap-3 px-4 py-3 text-left transition-colors sm:px-6", "hover:bg-bg-sunken focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-action-primary-bg/40", "rounded-lg min-h-11"),
+					children: [/* @__PURE__ */ i("div", {
+						className: "min-w-0",
+						children: [/* @__PURE__ */ r("div", {
+							className: "text-base font-semibold text-text-primary",
+							children: a
+						}), o ? /* @__PURE__ */ r("div", {
+							className: "text-sm text-text-secondary",
+							children: o
+						}) : null]
+					}), /* @__PURE__ */ i("div", {
+						className: "flex items-center gap-2 flex-shrink-0",
+						children: [s ? /* @__PURE__ */ r("div", {
+							onClick: (e) => e.stopPropagation(),
+							children: s
+						}) : null, /* @__PURE__ */ r(n, {
+							className: "size-4 shrink-0 text-text-secondary transition-transform duration-200 group-data-[state=open]:rotate-180",
+							"aria-hidden": "true"
+						})]
+					})]
+				})
+			}), /* @__PURE__ */ r(t.Content, {
+				"data-slot": "form-section-content",
+				className: "overflow-hidden data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
+				children: /* @__PURE__ */ r("div", {
+					className: e("border-t border-border-subtle px-4 py-4 space-y-4 sm:px-6", d),
+					children: f
+				})
+			})]
+		})
+	});
+}
+//#endregion
+export { a as FormSection };

package/dist/form/Input.d.ts

@@ -0,0 +1,45 @@
+import * as React from 'react';
+/**
+ * Input component props
+ */
+export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
+/**
+ * Input component - Styled text input field
+ *
+ * A flexible input component with consistent styling using semantic tokens.
+ * Supports all native HTML input attributes including type, placeholder, disabled, etc.
+ *
+ * @example Basic usage
+ * ```tsx
+ * <Input type="text" placeholder="Enter your name" />
+ * ```
+ *
+ * @example With React Hook Form
+ * ```tsx
+ * <FormField
+ *   control={form.control}
+ *   name="email"
+ *   render={({ field }) => (
+ *     <FormItem>
+ *       <FormLabel>Email</FormLabel>
+ *       <FormControl>
+ *         <Input type="email" placeholder="you@example.com" {...field} />
+ *       </FormControl>
+ *       <FormMessage />
+ *     </FormItem>
+ *   )}
+ * />
+ * ```
+ *
+ * @example Different input types
+ * ```tsx
+ * <Input type="password" placeholder="Enter password" />
+ * <Input type="number" min={0} max={100} />
+ * <Input type="date" />
+ * <Input type="file" accept="image/*" />
+ * ```
+ */
+export declare function Input({ ref, className, type, ...props }: InputProps & {
+    ref?: React.Ref<HTMLInputElement>;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Input.d.ts.map

package/dist/form/Input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/form/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;AAErE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,KAAK,CAAC,EACpB,GAAG,EACH,SAAS,EACT,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,UAAU,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAA;CAAE,2CAiBpD"}

package/dist/form/Radio.d.ts

@@ -0,0 +1,109 @@
+import * as React from 'react';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+/**
+ * RadioGroup component - Container for radio button options
+ */
+declare function RadioGroup({ ref, className, ...props }: React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> & {
+    ref?: React.Ref<React.ElementRef<typeof RadioGroupPrimitive.Root>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace RadioGroup {
+    var displayName: string | undefined;
+}
+/**
+ * RadioGroupItem component props
+ */
+export type RadioGroupItemProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>;
+/**
+ * RadioGroupItem component - Individual radio button
+ *
+ * A styled radio button component with proper accessibility features.
+ * Uses Radix UI RadioGroup primitive for robust functionality.
+ *
+ * @example Basic usage
+ * ```tsx
+ * <RadioGroup defaultValue="option1">
+ *   <div className="flex items-center space-x-2">
+ *     <RadioGroupItem value="option1" id="option1" />
+ *     <label htmlFor="option1">Option 1</label>
+ *   </div>
+ *   <div className="flex items-center space-x-2">
+ *     <RadioGroupItem value="option2" id="option2" />
+ *     <label htmlFor="option2">Option 2</label>
+ *   </div>
+ * </RadioGroup>
+ * ```
+ *
+ * @example With React Hook Form
+ * ```tsx
+ * <FormField
+ *   control={form.control}
+ *   name="type"
+ *   render={({ field }) => (
+ *     <FormItem className="space-y-3">
+ *       <FormLabel>Notification Type</FormLabel>
+ *       <FormControl>
+ *         <RadioGroup
+ *           onValueChange={field.onChange}
+ *           defaultValue={field.value}
+ *           className="flex flex-col space-y-1"
+ *         >
+ *           <FormItem className="flex items-center space-x-3 space-y-0">
+ *             <FormControl>
+ *               <RadioGroupItem value="all" />
+ *             </FormControl>
+ *             <FormLabel className="font-normal">
+ *               All new messages
+ *             </FormLabel>
+ *           </FormItem>
+ *           <FormItem className="flex items-center space-x-3 space-y-0">
+ *             <FormControl>
+ *               <RadioGroupItem value="mentions" />
+ *             </FormControl>
+ *             <FormLabel className="font-normal">
+ *               Direct messages and mentions
+ *             </FormLabel>
+ *           </FormItem>
+ *           <FormItem className="flex items-center space-x-3 space-y-0">
+ *             <FormControl>
+ *               <RadioGroupItem value="none" />
+ *             </FormControl>
+ *             <FormLabel className="font-normal">
+ *               Nothing
+ *             </FormLabel>
+ *           </FormItem>
+ *         </RadioGroup>
+ *       </FormControl>
+ *       <FormMessage />
+ *     </FormItem>
+ *   )}
+ * />
+ * ```
+ *
+ * @example Controlled radio group
+ * ```tsx
+ * const [value, setValue] = useState('option1');
+ *
+ * <RadioGroup value={value} onValueChange={setValue}>
+ *   <div className="flex items-center space-x-2">
+ *     <RadioGroupItem value="option1" id="r1" />
+ *     <label htmlFor="r1">Default</label>
+ *   </div>
+ *   <div className="flex items-center space-x-2">
+ *     <RadioGroupItem value="option2" id="r2" />
+ *     <label htmlFor="r2">Comfortable</label>
+ *   </div>
+ *   <div className="flex items-center space-x-2">
+ *     <RadioGroupItem value="option3" id="r3" />
+ *     <label htmlFor="r3">Compact</label>
+ *   </div>
+ * </RadioGroup>
+ * ```
+ */
+declare function RadioGroupItem({ ref, className, ...props }: RadioGroupItemProps & {
+    ref?: React.Ref<React.ElementRef<typeof RadioGroupPrimitive.Item>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace RadioGroupItem {
+    var displayName: string | undefined;
+}
+export { RadioGroup, RadioGroupItem };
+//# sourceMappingURL=Radio.d.ts.map

package/dist/form/Radio.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/form/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AAInE;;GAEG;AACH,iBAAS,UAAU,CAAC,EAClB,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,GAAG;IACnE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,CAAC,CAAC;CACpE,2CAEA;kBARQ,UAAU;;;AAWnB;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,CAAC;AAElG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqFG;AACH,iBAAS,cAAc,CAAC,EACtB,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,mBAAmB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,CAAC,CAAA;CAAE,2CAiB9F;kBArBQ,cAAc;;;AAwBvB,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAC"}

package/dist/form/Select.d.ts

@@ -0,0 +1,136 @@
+import * as React from 'react';
+import * as SelectPrimitive from '@radix-ui/react-select';
+/**
+ * Select Root component
+ */
+declare const Select: React.FC<SelectPrimitive.SelectProps>;
+/**
+ * SelectGroup component
+ */
+declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * SelectValue component
+ */
+declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
+/**
+ * SelectTrigger component props
+ */
+export type SelectTriggerProps = React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>;
+/**
+ * SelectTrigger component - Button that opens the select dropdown
+ *
+ * @example
+ * ```tsx
+ * <Select>
+ *   <SelectTrigger>
+ *     <SelectValue placeholder="Select an option" />
+ *   </SelectTrigger>
+ * </Select>
+ * ```
+ */
+declare function SelectTrigger({ ref, className, children, ...props }: SelectTriggerProps & {
+    ref?: React.Ref<React.ElementRef<typeof SelectPrimitive.Trigger>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace SelectTrigger {
+    var displayName: string | undefined;
+}
+/**
+ * SelectScrollUpButton component - Scroll up button for long lists
+ */
+declare function SelectScrollUpButton({ ref, className, ...props }: React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton> & {
+    ref?: React.Ref<React.ElementRef<typeof SelectPrimitive.ScrollUpButton>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace SelectScrollUpButton {
+    var displayName: string | undefined;
+}
+/**
+ * SelectScrollDownButton component - Scroll down button for long lists
+ */
+declare function SelectScrollDownButton({ ref, className, ...props }: React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton> & {
+    ref?: React.Ref<React.ElementRef<typeof SelectPrimitive.ScrollDownButton>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace SelectScrollDownButton {
+    var displayName: string | undefined;
+}
+/**
+ * SelectContent component props
+ */
+export interface SelectContentProps extends React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content> {
+    position?: 'item-aligned' | 'popper';
+}
+/**
+ * SelectContent component - Dropdown content container
+ *
+ * @example
+ * ```tsx
+ * <Select>
+ *   <SelectTrigger>
+ *     <SelectValue placeholder="Choose" />
+ *   </SelectTrigger>
+ *   <SelectContent>
+ *     <SelectItem value="option1">Option 1</SelectItem>
+ *     <SelectItem value="option2">Option 2</SelectItem>
+ *   </SelectContent>
+ * </Select>
+ * ```
+ */
+declare function SelectContent({ ref, className, children, position, ...props }: SelectContentProps & {
+    ref?: React.Ref<React.ElementRef<typeof SelectPrimitive.Content>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace SelectContent {
+    var displayName: string | undefined;
+}
+/**
+ * SelectLabel component props
+ */
+export type SelectLabelProps = React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>;
+/**
+ * SelectLabel component - Label for select option groups
+ *
+ * @example
+ * ```tsx
+ * <SelectContent>
+ *   <SelectLabel>Fruits</SelectLabel>
+ *   <SelectItem value="apple">Apple</SelectItem>
+ *   <SelectItem value="banana">Banana</SelectItem>
+ * </SelectContent>
+ * ```
+ */
+declare function SelectLabel({ ref, className, ...props }: SelectLabelProps & {
+    ref?: React.Ref<React.ElementRef<typeof SelectPrimitive.Label>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace SelectLabel {
+    var displayName: string | undefined;
+}
+/**
+ * SelectItem component props
+ */
+export type SelectItemProps = React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>;
+/**
+ * SelectItem component - Individual select option
+ *
+ * @example
+ * ```tsx
+ * <SelectContent>
+ *   <SelectItem value="option1">Option 1</SelectItem>
+ *   <SelectItem value="option2" disabled>Option 2 (disabled)</SelectItem>
+ * </SelectContent>
+ * ```
+ */
+declare function SelectItem({ ref, className, children, ...props }: SelectItemProps & {
+    ref?: React.Ref<React.ElementRef<typeof SelectPrimitive.Item>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace SelectItem {
+    var displayName: string | undefined;
+}
+/**
+ * SelectSeparator component - Visual separator between select items
+ */
+declare function SelectSeparator({ ref, className, ...props }: React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator> & {
+    ref?: React.Ref<React.ElementRef<typeof SelectPrimitive.Separator>>;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace SelectSeparator {
+    var displayName: string | undefined;
+}
+export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, };
+//# sourceMappingURL=Select.d.ts.map

package/dist/form/Select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/form/Select.tsx"],"names":[],"mappings":"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"}

package/dist/form/Textarea.d.ts

@@ -0,0 +1,52 @@
+import * as React from 'react';
+/**
+ * Textarea component props
+ */
+export type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
+/**
+ * Textarea component - Multi-line text input field
+ *
+ * A flexible textarea component with consistent styling using semantic tokens.
+ * Supports all native HTML textarea attributes including rows, cols, placeholder, etc.
+ * Automatically handles resize behavior.
+ *
+ * @example Basic usage
+ * ```tsx
+ * <Textarea placeholder="Enter your message" rows={4} />
+ * ```
+ *
+ * @example With React Hook Form
+ * ```tsx
+ * <FormField
+ *   control={form.control}
+ *   name="description"
+ *   render={({ field }) => (
+ *     <FormItem>
+ *       <FormLabel>Description</FormLabel>
+ *       <FormControl>
+ *         <Textarea
+ *           placeholder="Tell us about your project"
+ *           rows={5}
+ *           {...field}
+ *         />
+ *       </FormControl>
+ *       <FormDescription>Minimum 50 characters</FormDescription>
+ *       <FormMessage />
+ *     </FormItem>
+ *   )}
+ * />
+ * ```
+ *
+ * @example With character limit
+ * ```tsx
+ * <Textarea
+ *   placeholder="Enter comment (max 500 characters)"
+ *   maxLength={500}
+ *   rows={3}
+ * />
+ * ```
+ */
+export declare function Textarea({ ref, className, ...props }: TextareaProps & {
+    ref?: React.Ref<HTMLTextAreaElement>;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Textarea.d.ts.map

package/dist/form/Textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../src/form/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,CAAC;AAE9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,wBAAgB,QAAQ,CAAC,EACvB,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,mBAAmB,CAAC,CAAA;CAAE,2CAgB1D"}

package/dist/form/index.d.ts

@@ -0,0 +1,26 @@
+export { Form, FormProvider, useForm, useFormContext } from './Form';
+export type { FormProps } from './Form';
+export { FormField, FormItem, FormControl, useFormField } from './FormField';
+export type { FormFieldProps, FormItemProps, FormControlProps } from './FormField';
+export { FormSection } from './FormSection';
+export type { FormSectionProps } from './FormSection';
+export { FormLabel } from './FormLabel';
+export type { FormLabelProps } from './FormLabel';
+export { FormMessage } from './FormMessage';
+export type { FormMessageProps } from './FormMessage';
+export { FormDescription } from './FormDescription';
+export type { FormDescriptionProps } from './FormDescription';
+export { Input } from './Input';
+export type { InputProps } from './Input';
+export { Textarea } from './Textarea';
+export type { TextareaProps } from './Textarea';
+export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, } from './Select';
+export type { SelectTriggerProps, SelectContentProps, SelectLabelProps, SelectItemProps, } from './Select';
+export { Checkbox } from './Checkbox';
+export type { CheckboxProps } from './Checkbox';
+export { RadioGroup, RadioGroupItem } from './Radio';
+export type { RadioGroupItemProps } from './Radio';
+export type { UseFormReturn, FieldValues, SubmitHandler, UseFormProps, ControllerProps, FieldPath, } from 'react-hook-form';
+export { z } from 'zod';
+export type { ZodType } from 'zod';
+//# sourceMappingURL=index.d.ts.map

package/dist/form/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/form/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AACrE,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAGxC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC7E,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAGnF,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAGtD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAG9D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,OAAO,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,UAAU,CAAC;AAClB,YAAY,EACV,kBAAkB,EAClB,kBAAkB,EAClB,gBAAgB,EAChB,eAAe,GAChB,MAAM,UAAU,CAAC;AAGlB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACrD,YAAY,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAGnD,YAAY,EACV,aAAa,EACb,WAAW,EACX,aAAa,EACb,YAAY,EACZ,eAAe,EACf,SAAS,GACV,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,YAAY,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC"}

package/dist/form.d.ts

@@ -0,0 +1,2 @@
+export * from './form/index'
+export {}

package/dist/form.js

@@ -1,12 +1,13 @@
 import { Form as e, FormProvider as t, useForm as n, useFormContext as r } from "./form/Form.js";
 import { FormControl as i, FormField as a, FormItem as o, useFormField as s } from "./form/FormField.js";
-import { FormLabel as c } from "./form/FormLabel.js";
-import { FormMessage as l } from "./form/FormMessage.js";
-import { FormDescription as u } from "./form/FormDescription.js";
-import { Input as d } from "./form/Input.js";
-import { Textarea as f } from "./form/Textarea.js";
-import { Select as p, SelectContent as m, SelectGroup as h, SelectItem as g, SelectLabel as _, SelectScrollDownButton as v, SelectScrollUpButton as y, SelectSeparator as b, SelectTrigger as x, SelectValue as S } from "./form/Select.js";
-import { Checkbox as C } from "./form/Checkbox.js";
-import { RadioGroup as w, RadioGroupItem as T } from "./form/Radio.js";
-import { z as E } from "zod";
-export { C as Checkbox, e as Form, i as FormControl, u as FormDescription, a as FormField, o as FormItem, c as FormLabel, l as FormMessage, t as FormProvider, d as Input, w as RadioGroup, T as RadioGroupItem, p as Select, m as SelectContent, h as SelectGroup, g as SelectItem, _ as SelectLabel, v as SelectScrollDownButton, y as SelectScrollUpButton, b as SelectSeparator, x as SelectTrigger, S as SelectValue, f as Textarea, n as useForm, r as useFormContext, s as useFormField, E as z };
+import { FormSection as c } from "./form/FormSection.js";
+import { FormLabel as l } from "./form/FormLabel.js";
+import { FormMessage as u } from "./form/FormMessage.js";
+import { FormDescription as d } from "./form/FormDescription.js";
+import { Input as f } from "./form/Input.js";
+import { Textarea as p } from "./form/Textarea.js";
+import { Select as m, SelectContent as h, SelectGroup as g, SelectItem as _, SelectLabel as v, SelectScrollDownButton as y, SelectScrollUpButton as b, SelectSeparator as x, SelectTrigger as S, SelectValue as C } from "./form/Select.js";
+import { Checkbox as w } from "./form/Checkbox.js";
+import { RadioGroup as T, RadioGroupItem as E } from "./form/Radio.js";
+import { z as D } from "zod";
+export { w as Checkbox, e as Form, i as FormControl, d as FormDescription, a as FormField, o as FormItem, l as FormLabel, u as FormMessage, t as FormProvider, c as FormSection, f as Input, T as RadioGroup, E as RadioGroupItem, m as Select, h as SelectContent, g as SelectGroup, _ as SelectItem, v as SelectLabel, y as SelectScrollDownButton, b as SelectScrollUpButton, x as SelectSeparator, S as SelectTrigger, C as SelectValue, p as Textarea, n as useForm, r as useFormContext, s as useFormField, D as z };

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export declare const FE_LIBS_VERSION = "0.1.0";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,eAAe,UAAU,CAAC"}

package/dist/lib/utils.d.ts

@@ -0,0 +1,3 @@
+import { ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;
+//# sourceMappingURL=utils.d.ts.map

package/dist/lib/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,MAAM,CAAC;AAG7C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC"}

package/dist/shared/components/AccessDenied.d.ts

@@ -0,0 +1,117 @@
+import { ReactNode } from 'react';
+export interface AccessDeniedProps {
+    /**
+     * Title text
+     * @default "Access Denied"
+     */
+    title?: string;
+    /**
+     * Description text
+     * @default "You don't have permission to access this resource."
+     */
+    description?: string;
+    /**
+     * Additional details (e.g., required permissions)
+     */
+    details?: string;
+    /**
+     * Custom icon to display
+     */
+    icon?: ReactNode;
+    /**
+     * Primary action button
+     */
+    primaryAction?: {
+        label: string;
+        onClick: () => void;
+    };
+    /**
+     * Secondary action button
+     */
+    secondaryAction?: {
+        label: string;
+        onClick: () => void;
+    };
+    /**
+     * Variant style
+     * - 'page': Full page layout with centered content
+     * - 'card': Card-style layout for inline use
+     * - 'inline': Minimal inline layout
+     * @default 'card'
+     */
+    variant?: 'page' | 'card' | 'inline';
+    /**
+     * Custom className for styling
+     */
+    className?: string;
+    /**
+     * Children to render below the message
+     */
+    children?: ReactNode;
+}
+/**
+ * AccessDenied - Centralized component for displaying access denied messages
+ *
+ * Use this component instead of creating custom access denied UI in each MFE.
+ * This ensures consistent styling and behavior across the application.
+ *
+ * @example Page variant (for route-level access denial)
+ * ```tsx
+ * <AccessDenied
+ *   variant="page"
+ *   title="Access Denied"
+ *   description="You don't have permission to view this page."
+ *   primaryAction={{
+ *     label: "Go Back",
+ *     onClick: () => navigate(-1)
+ *   }}
+ * />
+ * ```
+ *
+ * @example Card variant (for section-level access denial)
+ * ```tsx
+ * <AccessDenied
+ *   variant="card"
+ *   title="Billing Access Required"
+ *   description="Contact your administrator to request billing access."
+ *   details="Required permission: billing:read"
+ * />
+ * ```
+ *
+ * @example Inline variant (for small UI elements)
+ * ```tsx
+ * <AccessDenied
+ *   variant="inline"
+ *   description="No access"
+ * />
+ * ```
+ */
+export declare function AccessDenied({ title, description, details, icon, primaryAction, secondaryAction, variant, className, children, }: AccessDeniedProps): import("react/jsx-runtime").JSX.Element;
+export interface PermissionDeniedProps extends Omit<AccessDeniedProps, 'details'> {
+    /**
+     * Permission(s) that were required but not granted
+     */
+    requiredPermissions?: string | string[];
+    /**
+     * Role(s) that were required but not granted
+     */
+    requiredRoles?: string | string[];
+    /**
+     * Whether to show the required permissions/roles
+     * @default true
+     */
+    showRequirements?: boolean;
+}
+/**
+ * PermissionDenied - Specialized AccessDenied for permission-based denials
+ *
+ * @example
+ * ```tsx
+ * <PermissionDenied
+ *   requiredPermissions={["project:write", "project:delete"]}
+ *   description="You need additional permissions to perform this action."
+ * />
+ * ```
+ */
+export declare function PermissionDenied({ requiredPermissions, requiredRoles, showRequirements, ...props }: PermissionDeniedProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AccessDenied.d.ts.map

package/dist/shared/components/AccessDenied.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccessDenied.d.ts","sourceRoot":"","sources":["../../../src/shared/components/AccessDenied.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,MAAM,WAAW,iBAAiB;IAChC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE;QACd,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,CAAC;IACF;;OAEG;IACH,eAAe,CAAC,EAAE;QAChB,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,CAAC;IACF;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4CD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAuB,EACvB,WAAkE,EAClE,OAAO,EACP,IAAI,EACJ,aAAa,EACb,eAAe,EACf,OAAgB,EAChB,SAAc,EACd,QAAQ,GACT,EAAE,iBAAiB,2CA8FnB;AAMD,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IAC/E;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACxC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAClC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,mBAAmB,EACnB,aAAa,EACb,gBAAuB,EACvB,GAAG,KAAK,EACT,EAAE,qBAAqB,2CAyBvB"}

package/dist/shared/components/AppErrorBoundary.d.ts

@@ -0,0 +1,19 @@
+import { Component, ReactNode, ErrorInfo } from 'react';
+interface Props {
+    children: ReactNode;
+}
+interface State {
+    hasError: boolean;
+    error: Error | null;
+    errorInfo: ErrorInfo | null;
+}
+export declare class ErrorBoundary extends Component<Props, State> {
+    constructor(props: Props);
+    static getDerivedStateFromError(error: Error): Partial<State>;
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    private isConfigurationError;
+    private handleReload;
+    render(): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+}
+export {};
+//# sourceMappingURL=AppErrorBoundary.d.ts.map