@mohasinac/appkit 2.1.3 → 2.2.0

package/dist/ui/components/Typography.style.css

@@ -0,0 +1,178 @@
+.appkit-heading {
+  margin: 0;
+  line-height: 1.15;
+  letter-spacing: -0.02em;
+  font-family: var(--font-display), Poppins, ui-sans-serif, system-ui, sans-serif;
+}
+
+.appkit-heading--h1 {
+  font-size: clamp(1.875rem, 1.3rem + 2vw, 3rem);
+  font-weight: 700;
+}
+
+.appkit-heading--h2 {
+  font-size: clamp(1.5rem, 1.2rem + 1.6vw, 2.25rem);
+  font-weight: 700;
+}
+
+.appkit-heading--h3 {
+  font-size: clamp(1.25rem, 1.05rem + 1vw, 1.875rem);
+  font-weight: 700;
+}
+
+.appkit-heading--h4 {
+  font-size: clamp(1.125rem, 1rem + 0.8vw, 1.5rem);
+  font-weight: 700;
+}
+
+.appkit-heading--h5 {
+  font-size: clamp(1rem, 0.92rem + 0.4vw, 1.25rem);
+  font-weight: 500;
+}
+
+.appkit-heading--h6 {
+  font-size: clamp(0.875rem, 0.84rem + 0.3vw, 1.125rem);
+  font-weight: 500;
+}
+
+.appkit-text,
+.appkit-span,
+.appkit-label,
+.appkit-caption {
+  font-family: var(--font-body), ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
+}
+
+.appkit-text {
+  margin: 0;
+  line-height: 1.65;
+}
+
+.appkit-text--xs {
+  font-size: 0.75rem;
+}
+
+.appkit-text--sm {
+  font-size: 0.875rem;
+}
+
+.appkit-text--base {
+  font-size: 1rem;
+}
+
+.appkit-text--lg {
+  font-size: 1.125rem;
+}
+
+.appkit-text--xl {
+  font-size: 1.25rem;
+}
+
+.appkit-font--normal {
+  font-weight: 400;
+}
+
+.appkit-font--medium {
+  font-weight: 500;
+}
+
+.appkit-font--semibold {
+  font-weight: 600;
+}
+
+.appkit-font--bold {
+  font-weight: 700;
+}
+
+.appkit-color--primary {
+  color: #18181b;
+}
+
+.appkit-color--secondary {
+  color: #71717a;
+}
+
+.appkit-color--muted {
+  color: #a1a1aa;
+}
+
+.appkit-color--error {
+  color: #dc2626;
+}
+
+.appkit-color--success {
+  color: #059669;
+}
+
+.appkit-color--accent {
+  color: #65c408;
+}
+
+.dark .appkit-color--primary {
+  color: #fafafa;
+}
+
+.dark .appkit-color--secondary {
+  color: #a3a3a3;
+}
+
+.dark .appkit-color--muted {
+  color: #737373;
+}
+
+.dark .appkit-color--error {
+  color: #f87171;
+}
+
+.dark .appkit-color--success {
+  color: #34d399;
+}
+
+.dark .appkit-color--accent {
+  color: #f063b9;
+}
+
+.appkit-label {
+  display: block;
+  margin-bottom: 0.375rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: #71717a;
+}
+
+.dark .appkit-label {
+  color: #cbd5e1;
+}
+
+.appkit-label__required {
+  margin-left: 0.25rem;
+  color: #ef4444;
+}
+
+.appkit-caption {
+  font-size: 0.75rem;
+}
+
+.appkit-caption--default {
+  color: #a1a1aa;
+}
+
+.appkit-caption--accent {
+  color: #65c408;
+  font-weight: 600;
+}
+
+.appkit-caption--inverse {
+  color: rgba(101, 196, 8, 0.4);
+}
+
+.dark .appkit-caption--default {
+  color: #737373;
+}
+
+.dark .appkit-caption--accent {
+  color: #f063b9;
+}
+
+.dark .appkit-caption--inverse {
+  color: rgba(240, 99, 185, 0.5);
+}

package/dist/ui/components/UnsavedChangesModal.d.ts

@@ -0,0 +1,17 @@
+import "client-only";
+export interface UnsavedChangesLabels {
+    title?: string;
+    message?: string;
+    stay?: string;
+    leave?: string;
+}
+export interface UnsavedChangesModalProps {
+    labels?: UnsavedChangesLabels;
+}
+/**
+ * UnsavedChangesModal
+ *
+ * Mount this once near the app shell. It listens for the
+ * UNSAVED_CHANGES_EVENT and resolves the pending leave promise.
+ */
+export declare function UnsavedChangesModal({ labels }: UnsavedChangesModalProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/ui/components/UnsavedChangesModal.js

@@ -0,0 +1,52 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import "client-only";
+import { useEffect, useState } from "react";
+import { eventBus } from "../../core/EventBus";
+import { UNSAVED_CHANGES_EVENT } from "../../react";
+import { Button } from "./Button";
+import { Card } from "./Card";
+import { Heading, Text } from "./Typography";
+/**
+ * UnsavedChangesModal
+ *
+ * Mount this once near the app shell. It listens for the
+ * UNSAVED_CHANGES_EVENT and resolves the pending leave promise.
+ */
+export function UnsavedChangesModal({ labels = {} }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const [resolve, setResolve] = useState(null);
+    useEffect(() => {
+        const subscription = eventBus.on(UNSAVED_CHANGES_EVENT, (...args) => {
+            const resolveFn = args[0];
+            setResolve(() => resolveFn);
+            setIsOpen(true);
+        });
+        return () => subscription.unsubscribe();
+    }, []);
+    useEffect(() => {
+        if (!isOpen)
+            return;
+        const handler = (e) => {
+            if (e.key === "Escape") {
+                handleCancel();
+            }
+        };
+        document.addEventListener("keydown", handler);
+        return () => document.removeEventListener("keydown", handler);
+    }, [isOpen]);
+    function handleConfirm() {
+        setIsOpen(false);
+        resolve?.(true);
+        setResolve(null);
+    }
+    function handleCancel() {
+        setIsOpen(false);
+        resolve?.(false);
+        setResolve(null);
+    }
+    if (!isOpen)
+        return null;
+    return (_jsx("div", { className: "appkit-unsaved-modal__backdrop", onClick: handleCancel, children: _jsx("div", { onClick: (e) => e.stopPropagation(), children: _jsxs(Card, { className: "appkit-unsaved-modal__card", children: [_jsx(Heading, { level: 2, className: "appkit-unsaved-modal__title", children: labels.title ?? "Unsaved changes" }), _jsx(Text, { className: "appkit-unsaved-modal__message", children: labels.message ??
+                            "You have unsaved changes. Are you sure you want to leave this page?" }), _jsxs("div", { className: "appkit-unsaved-modal__actions", children: [_jsx(Button, { variant: "outline", onClick: handleCancel, children: labels.stay ?? "Stay" }), _jsx(Button, { variant: "danger", onClick: handleConfirm, children: labels.leave ?? "Leave" })] })] }) }) }));
+}

package/dist/ui/components/UnsavedChangesModal.style.css

@@ -0,0 +1,33 @@
+/* UnsavedChangesModal — confirmation dialog for unsaved navigation */
+
+.appkit-unsaved-modal__backdrop {
+  position: fixed;
+  inset: 0;
+  z-index: 50;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 1rem;
+  background: rgba(0, 0, 0, 0.5);
+  backdrop-filter: blur(4px);
+}
+
+.appkit-unsaved-modal__card {
+  width: 100%;
+  max-width: 28rem;
+  padding: 1.5rem;
+}
+
+.appkit-unsaved-modal__title {
+  margin-bottom: 0.5rem;
+}
+
+.appkit-unsaved-modal__message {
+  margin-bottom: 1.5rem;
+}
+
+.appkit-unsaved-modal__actions {
+  display: flex;
+  gap: 0.75rem;
+  justify-content: flex-start;
+}

package/dist/ui/components/ViewToggle.d.ts

@@ -0,0 +1,15 @@
+/** Three layout modes for listing pages. Stored in URL as ?view=card|fluid|list */
+export type ViewMode = "card" | "fluid" | "list";
+export interface ViewToggleLabels {
+    card: string;
+    fluid: string;
+    list: string;
+    toolbar?: string;
+}
+export interface ViewToggleProps {
+    value: ViewMode;
+    onChange: (mode: ViewMode) => void;
+    labels?: ViewToggleLabels;
+    className?: string;
+}
+export declare function ViewToggle({ value, onChange, labels, className, }: ViewToggleProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/components/ViewToggle.js

@@ -0,0 +1,29 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "./Button";
+import { Div } from "./Div";
+const DEFAULT_LABELS = {
+    card: "Card grid",
+    fluid: "Fluid grid",
+    list: "List view",
+    toolbar: "View mode",
+};
+export function ViewToggle({ value, onChange, labels, className, }) {
+    const mergedLabels = { ...DEFAULT_LABELS, ...labels };
+    return (_jsxs(Div, { className: ["appkit-view-toggle", className ?? ""].join(" ").trim(), role: "toolbar", "aria-label": mergedLabels.toolbar, children: [_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => onChange("card"), "aria-label": mergedLabels.card, "aria-pressed": value === "card", className: [
+                    "appkit-view-toggle__button",
+                    value === "card"
+                        ? "appkit-view-toggle__button--active"
+                        : "appkit-view-toggle__button--inactive",
+                ].join(" "), children: _jsx("svg", { className: "appkit-view-toggle__icon", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 1.5, "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3.75 6A2.25 2.25 0 016 3.75h2.25A2.25 2.25 0 0110.5 6v2.25a2.25 2.25 0 01-2.25 2.25H6a2.25 2.25 0 01-2.25-2.25V6zM3.75 15.75A2.25 2.25 0 016 13.5h2.25a2.25 2.25 0 012.25 2.25V18a2.25 2.25 0 01-2.25 2.25H6A2.25 2.25 0 013.75 18v-2.25zM13.5 6a2.25 2.25 0 012.25-2.25H18A2.25 2.25 0 0120.25 6v2.25A2.25 2.25 0 0118 10.5h-2.25a2.25 2.25 0 01-2.25-2.25V6zM13.5 15.75a2.25 2.25 0 012.25-2.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-2.25A2.25 2.25 0 0113.5 18v-2.25z" }) }) }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => onChange("fluid"), "aria-label": mergedLabels.fluid, "aria-pressed": value === "fluid", className: [
+                    "appkit-view-toggle__button",
+                    value === "fluid"
+                        ? "appkit-view-toggle__button--active"
+                        : "appkit-view-toggle__button--inactive",
+                ].join(" "), children: _jsx("svg", { className: "appkit-view-toggle__icon", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 1.5, "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3.375 19.5h17.25m-17.25 0a1.125 1.125 0 01-1.125-1.125M3.375 19.5h1.5C5.496 19.5 6 18.996 6 18.375m-3.75 0V5.625m0 12.75v-1.5c0-.621.504-1.125 1.125-1.125m18.375 2.625V5.625m0 12.75c0 .621-.504 1.125-1.125 1.125m1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125m0 3.75h-1.5A1.125 1.125 0 0118 18.375M20.625 4.5H3.375m17.25 0c.621 0 1.125.504 1.125 1.125M20.625 4.5h-1.5C18.504 4.5 18 5.004 18 5.625m3.75 0v1.5c0 .621-.504 1.125-1.125 1.125M3.375 4.5c-.621 0-1.125.504-1.125 1.125M3.375 4.5h1.5C5.496 4.5 6 5.004 6 5.625m-3.75 0v1.5c0 .621.504 1.125 1.125 1.125m0 0h1.5m-1.5 0c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125m1.5-3.75C5.496 8.25 6 8.754 6 9.375v1.5m0-5.25v5.25m0-5.25C6 5.004 6.504 4.5 7.125 4.5h9.75c.621 0 1.125.504 1.125 1.125m1.125 2.625h1.5m-1.5 0A1.125 1.125 0 0118 9.375v1.5m1.5-3.75C19.496 8.25 20 8.754 20 9.375v1.5m0-5.25v5.25m0-5.25C20 5.004 19.496 4.5 18.875 4.5M7.5 15h9" }) }) }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => onChange("list"), "aria-label": mergedLabels.list, "aria-pressed": value === "list", className: [
+                    "appkit-view-toggle__button",
+                    value === "list"
+                        ? "appkit-view-toggle__button--active"
+                        : "appkit-view-toggle__button--inactive",
+                ].join(" "), children: _jsx("svg", { className: "appkit-view-toggle__icon", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 1.5, "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M8.25 6.75h12M8.25 12h12m-12 5.25h12M3.75 6.75h.007v.008H3.75V6.75zm.375 0a.375.375 0 11-.75 0 .375.375 0 01.75 0zM3.75 12h.007v.008H3.75V12zm.375 0a.375.375 0 11-.75 0 .375.375 0 01.75 0zm-.375 5.25h.007v.008H3.75v-.008zm.375 0a.375.375 0 11-.75 0 .375.375 0 01.75 0z" }) }) })] }));
+}

package/dist/ui/components/ViewToggle.style.css

@@ -0,0 +1,50 @@
+.appkit-view-toggle {
+  display: flex;
+  gap: 0.25rem;
+}
+
+.appkit-view-toggle__button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.5rem;
+  border-radius: 0.5rem;
+  border: 1px solid;
+  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
+}
+
+.appkit-view-toggle__button--active {
+  color: #509c02;
+  background: rgba(80, 156, 2, 0.08);
+  border-color: rgba(80, 156, 2, 0.3);
+}
+
+.appkit-view-toggle__button--inactive {
+  color: #71717a;
+  background: transparent;
+  border-color: #e4e4e7;
+}
+
+.appkit-view-toggle__button--inactive:hover {
+  background: #f4f4f5;
+}
+
+.appkit-view-toggle__icon {
+  width: 1.25rem;
+  height: 1.25rem;
+}
+
+.dark .appkit-view-toggle__button--active {
+  color: #e91e8c;
+  background: rgba(233, 30, 140, 0.14);
+  border-color: rgba(233, 30, 140, 0.35);
+}
+
+.dark .appkit-view-toggle__button--inactive {
+  color: #94a3b8;
+  border-color: #334155;
+}
+
+.dark .appkit-view-toggle__button--inactive:hover {
+  background: #1e293b;
+}

package/dist/ui/components/index.style.css

@@ -0,0 +1,76 @@
+@import "./Typography.style.css";
+@import "./Button.style.css";
+@import "./Input.style.css";
+@import "./Textarea.style.css";
+@import "./Select.style.css";
+@import "./Accordion.style.css";
+@import "./Breadcrumb.style.css";
+@import "./Badge.style.css";
+@import "./Divider.style.css";
+@import "./TextLink.style.css";
+@import "./IconButton.style.css";
+@import "./Alert.style.css";
+@import "./Modal.style.css";
+@import "./Drawer.style.css";
+@import "./Pagination.style.css";
+@import "./Progress.style.css";
+@import "./ActiveFilterChips.style.css";
+@import "./Spinner.style.css";
+@import "./Skeleton.style.css";
+@import "./RatingDisplay.style.css";
+@import "./PriceDisplay.style.css";
+@import "./ItemRow.style.css";
+@import "./Tooltip.style.css";
+@import "./TabStrip.style.css";
+@import "./SectionTabs.style.css";
+@import "./Layout.style.css";
+@import "./SortDropdown.style.css";
+@import "./TablePagination.style.css";
+@import "./ViewToggle.style.css";
+@import "./SummaryCard.style.css";
+@import "./StatsGrid.style.css";
+@import "./StatusBadge.style.css";
+@import "./StepperNav.style.css";
+@import "./TagInput.style.css";
+@import "./StarRating.style.css";
+@import "./BulkActionBar.style.css";
+@import "./CountdownDisplay.style.css";
+@import "./DescriptionField.style.css";
+@import "./FormGrid.style.css";
+@import "./HorizontalScroller.style.css";
+@import "./ImageLightbox.style.css";
+@import "./SideModal.style.css";
+@import "./Slider.style.css";
+@import "./ListingLayout.style.css";
+@import "./Card.style.css";
+@import "./Avatar.style.css";
+@import "./Toggle.style.css";
+@import "./Checkbox.style.css";
+@import "./EmptyState.style.css";
+@import "./SkipToMain.style.css";
+@import "./Toast.style.css";
+@import "./Tabs.style.css";
+@import "./Radio.style.css";
+@import "./Dropdown.style.css";
+@import "./DashboardStatsCard.style.css";
+@import "./AvatarDisplay.style.css";
+@import "./BaseListingCard.style.css";
+@import "./ConfirmDeleteModal.style.css";
+@import "./DynamicSelect.style.css";
+@import "./SideDrawer.style.css";
+@import "./BackgroundRenderer.style.css";
+@import "./FilterDrawer.style.css";
+@import "./FlowDiagram.style.css";
+@import "./Form.style.css";
+@import "./FormField.style.css";
+@import "./ImageGallery.style.css";
+@import "./PasswordStrengthIndicator.style.css";
+@import "./ResponsiveView.style.css";
+@import "./RoleBadge.style.css";
+@import "./RowActionMenu.style.css";
+@import "./Div.style.css";
+@import "./Menu.style.css";
+@import "./Semantic.style.css";
+@import "./UnsavedChangesModal.style.css";
+@import "../DataTable.style.css";
+@import "../rich-text/RichText.style.css";

package/dist/ui/index.d.ts

@@ -0,0 +1,165 @@
+import "./components/index.style.css";
+export { buildColumns, createColumnBuilder, renderBoolean, renderCurrency, renderCurrencyCompact, renderCount, renderNullable, renderRating, } from "./columns";
+export type { BooleanRenderOpts, RatingMode, RatingRenderOpts, } from "./columns";
+export type { SectionProps, ArticleProps, MainProps, AsideProps, NavProps, BlockHeaderProps, BlockFooterProps, HeaderProps, FooterProps, UlProps, OlProps, LiProps, } from "./components/Semantic";
+export { Section, Article, Main, Aside, Nav, BlockHeader, BlockFooter, Header, Footer, Ul, Ol, Li, } from "./components/Semantic";
+export type { DivProps } from "./components/Div";
+export { Div } from "./components/Div";
+export { Heading, Text, Label, Caption, Span } from "./components/Typography";
+export type { SpinnerProps } from "./components/Spinner";
+export { Spinner } from "./components/Spinner";
+export type { SkeletonProps } from "./components/Skeleton";
+export { Skeleton } from "./components/Skeleton";
+export type { ButtonProps } from "./components/Button";
+export { Button } from "./components/Button";
+export type { IconButtonProps } from "./components/IconButton";
+export { IconButton } from "./components/IconButton";
+export type { TextLinkProps } from "./components/TextLink";
+export { TextLink } from "./components/TextLink";
+export type { TooltipProps } from "./components/Tooltip";
+export { Tooltip } from "./components/Tooltip";
+export type { AccordionProps, AccordionItemProps, } from "./components/Accordion";
+export { Accordion, AccordionItem } from "./components/Accordion";
+export type { FormProps, GapToken, FormGroupProps, FormFieldSpanProps, FormActionsProps, } from "./components/Form";
+export { Form, FormGroup, FormFieldSpan, FormActions } from "./components/Form";
+export type { BadgeProps, BadgeVariant } from "./components/Badge";
+export { Badge } from "./components/Badge";
+export type { AlertProps } from "./components/Alert";
+export { Alert } from "./components/Alert";
+export type { DividerProps } from "./components/Divider";
+export { Divider } from "./components/Divider";
+export type { ProgressProps, IndeterminateProgressProps, } from "./components/Progress";
+export { Progress, IndeterminateProgress } from "./components/Progress";
+export type { PaginationProps } from "./components/Pagination";
+export { Pagination } from "./components/Pagination";
+export type { StatusBadgeProps, StatusBadgeStatus, OrderStatus, PaymentStatus, ReviewStatus, TicketStatus, GenericStatus, } from "./components/StatusBadge";
+export { StatusBadge } from "./components/StatusBadge";
+export type { ModalProps } from "./components/Modal";
+export { Modal, ModalFooter } from "./components/Modal";
+export type { UnsavedChangesModalProps, UnsavedChangesLabels, } from "./components/UnsavedChangesModal";
+export { UnsavedChangesModal } from "./components/UnsavedChangesModal";
+export type { DrawerProps } from "./components/Drawer";
+export { Drawer } from "./components/Drawer";
+export type { BackgroundRendererProps, BackgroundConfig, } from "./components/BackgroundRenderer";
+export { BackgroundRenderer } from "./components/BackgroundRenderer";
+export type { ResponsiveViewProps } from "./components/ResponsiveView";
+export { ResponsiveView } from "./components/ResponsiveView";
+export type { SelectProps, SelectOption } from "./components/Select";
+export { Select } from "./components/Select";
+export type { InputProps } from "./components/Input";
+export { Input } from "./components/Input";
+export type { TextareaProps } from "./components/Textarea";
+export { Textarea } from "./components/Textarea";
+export type { SliderProps } from "./components/Slider";
+export { Slider } from "./components/Slider";
+export type { CheckboxProps } from "./components/Checkbox";
+export { Checkbox } from "./components/Checkbox";
+export type { RadioGroupProps, RadioOption } from "./components/Radio";
+export { RadioGroup } from "./components/Radio";
+export type { ToggleProps } from "./components/Toggle";
+export { Toggle } from "./components/Toggle";
+export type { ToastVariant, ToastPosition, ToastProviderProps, } from "./components/Toast";
+export { ToastProvider, useToast } from "./components/Toast";
+export type { StarRatingProps } from "./components/StarRating";
+export { StarRating } from "./components/StarRating";
+export type { BreadcrumbProps, BreadcrumbItem } from "./components/Breadcrumb";
+export { Breadcrumb } from "./components/Breadcrumb";
+export type { ImageLightboxProps, LightboxImage, } from "./components/ImageLightbox";
+export { ImageLightbox } from "./components/ImageLightbox";
+export type { TagInputProps } from "./components/TagInput";
+export { TagInput } from "./components/TagInput";
+export type { StepperNavProps, StepperNavStep } from "./components/StepperNav";
+export { StepperNav } from "./components/StepperNav";
+export type { ViewMode, ViewToggleProps, ViewToggleLabels, } from "./components/ViewToggle";
+export { ViewToggle } from "./components/ViewToggle";
+export type { RatingDisplayProps } from "./components/RatingDisplay";
+export { RatingDisplay } from "./components/RatingDisplay";
+export type { PriceDisplayProps } from "./components/PriceDisplay";
+export { PriceDisplay } from "./components/PriceDisplay";
+export type { StatsGridProps, StatItem } from "./components/StatsGrid";
+export { StatsGrid } from "./components/StatsGrid";
+export type { SummaryCardProps, SummaryLine } from "./components/SummaryCard";
+export { SummaryCard } from "./components/SummaryCard";
+export type { CountdownDisplayProps } from "./components/CountdownDisplay";
+export { CountdownDisplay } from "./components/CountdownDisplay";
+export type { ItemRowProps } from "./components/ItemRow";
+export { ItemRow } from "./components/ItemRow";
+export type { HorizontalScrollerProps, PerViewConfig, } from "./components/HorizontalScroller";
+export { HorizontalScroller } from "./components/HorizontalScroller";
+export type { SectionTabsProps, SectionTab } from "./components/SectionTabs";
+export { SectionTabs } from "./components/SectionTabs";
+export type { TabStripProps, TabStripTab } from "./components/TabStrip";
+export { TabStrip } from "./components/TabStrip";
+export type { FormGridProps, FormFieldProps } from "./components/FormGrid";
+export { FormGrid, FormField as FormGridField } from "./components/FormGrid";
+export type { FormFieldProps as SmartFormFieldProps } from "./components/FormField";
+export { FormField } from "./components/FormField";
+export type { DescriptionFieldProps } from "./components/DescriptionField";
+export { DescriptionField } from "./components/DescriptionField";
+export type { CardProps, CardSectionProps } from "./components/Card";
+export { Card, CardHeader, CardBody, CardFooter } from "./components/Card";
+export type { EmptyStateProps } from "./components/EmptyState";
+export { EmptyState } from "./components/EmptyState";
+export type { AvatarProps, AvatarGroupProps } from "./components/Avatar";
+export { Avatar, AvatarGroup } from "./components/Avatar";
+export type { DropdownProps, DropdownMenuItem } from "./components/Dropdown";
+export { Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, DropdownSeparator, } from "./components/Dropdown";
+export type { MenuProps } from "./components/Menu";
+export { Menu, MenuTrigger, MenuContent, MenuItem, MenuSeparator, } from "./components/Menu";
+export type { DynamicSelectProps, DynamicSelectOption, AsyncPage, } from "./components/DynamicSelect";
+export { DynamicSelect } from "./components/DynamicSelect";
+export type { RoleBadgeProps } from "./components/RoleBadge";
+export { RoleBadge } from "./components/RoleBadge";
+export type { SkipToMainProps } from "./components/SkipToMain";
+export { SkipToMain } from "./components/SkipToMain";
+export type { TabsProps, TabsListProps, TabsTriggerProps, TabsContentProps, } from "./components/Tabs";
+export { Tabs, TabsList, TabsTrigger, TabsContent } from "./components/Tabs";
+export type { FilterDrawerProps } from "./components/FilterDrawer";
+export { FilterDrawer } from "./components/FilterDrawer";
+export type { RowAction, RowActionMenuProps } from "./components/RowActionMenu";
+export { RowActionMenu } from "./components/RowActionMenu";
+export type { PasswordStrengthIndicatorProps } from "./components/PasswordStrengthIndicator";
+export { PasswordStrengthIndicator } from "./components/PasswordStrengthIndicator";
+export type { AvatarDisplayProps } from "./components/AvatarDisplay";
+export { AvatarDisplay } from "./components/AvatarDisplay";
+export type { DashboardStatsCardProps } from "./components/DashboardStatsCard";
+export { DashboardStatsCard } from "./components/DashboardStatsCard";
+export type { ActiveFilter, ActiveFilterChipsProps, } from "./components/ActiveFilterChips";
+export { ActiveFilterChips } from "./components/ActiveFilterChips";
+export type { SortOption, SortDropdownProps } from "./components/SortDropdown";
+export { SortDropdown } from "./components/SortDropdown";
+export type { TablePaginationProps, TablePaginationLabels, } from "./components/TablePagination";
+export { TablePagination } from "./components/TablePagination";
+export type { DataTableProps, DataTableColumn } from "./DataTable";
+export { DataTable } from "./DataTable";
+export type { TableConfig, TableViewMode, PaginationConfig, StickyConfig, } from "../contracts";
+export { DEFAULT_TABLE_CONFIG, DEFAULT_PAGINATION_CONFIG, DEFAULT_STICKY_CONFIG, mergeTableConfig, } from "../contracts";
+export type { GapKey, ContainerSize, GridCols, ViewPortal, ContainerProps, StackProps, RowProps, GridProps, } from "./components/Layout";
+export { Container, Stack, Row, Grid, GRID_MAP } from "./components/Layout";
+export { classNames, mergeTailwindClasses } from "./style.helper";
+export type { SideModalProps } from "./components/SideModal";
+export { SideModal } from "./components/SideModal";
+export type { RichTextProps } from "./rich-text/RichText";
+export { RichText } from "./rich-text/RichText";
+export type { ListingLayoutProps, ListingLayoutLabels, } from "./components/ListingLayout";
+export { ListingLayout } from "./components/ListingLayout";
+export type { ListingViewShellProps } from "./components/ListingViewShell";
+export { ListingViewShell } from "./components/ListingViewShell";
+export type { SlottedListingViewProps, SlottedListingViewLabels, } from "./components/SlottedListingView";
+export { SlottedListingView } from "./components/SlottedListingView";
+export type { DetailViewShellProps, DetailViewLayout, } from "./components/DetailViewShell";
+export { DetailViewShell } from "./components/DetailViewShell";
+export type { StackedViewShellProps, StackedViewShellLabels, } from "./components/StackedViewShell";
+export { StackedViewShell } from "./components/StackedViewShell";
+export type { BulkActionBarProps, BulkActionBarLabels, BulkActionItem, } from "./components/BulkActionBar";
+export { BulkActionBar } from "./components/BulkActionBar";
+export type { FlowStep, FlowDiagramProps } from "./components/FlowDiagram";
+export { FlowDiagram } from "./components/FlowDiagram";
+export type { BaseListingCardRootProps, BaseListingCardHeroProps, BaseListingCardInfoProps, BaseListingCardCheckboxProps, } from "./components/BaseListingCard";
+export { BaseListingCard } from "./components/BaseListingCard";
+export type { GalleryImage, ImageGalleryProps, } from "./components/ImageGallery";
+export { default as ImageGallery } from "./components/ImageGallery";
+export type { SideDrawerProps, DrawerMode } from "./components/SideDrawer";
+export { SideDrawer } from "./components/SideDrawer";
+export type { ConfirmDeleteModalProps } from "./components/ConfirmDeleteModal";
+export { ConfirmDeleteModal } from "./components/ConfirmDeleteModal";