@fluid-app/rep-core 0.1.14 → 0.1.16

package/dist/registries/index.mjs

@@ -0,0 +1,229 @@
+import { faBan } from "@fortawesome/pro-regular-svg-icons";
+//#region src/registries/property-schema-types.ts
+/**
+* Property field type constant - single source of truth for field types.
+* Use PROPERTY_FIELD_TYPES.text instead of "text" for type-safe comparisons.
+*/
+const PROPERTY_FIELD_TYPES = {
+	text: "text",
+	textarea: "textarea",
+	number: "number",
+	boolean: "boolean",
+	select: "select",
+	color: "color",
+	range: "range",
+	dataSource: "dataSource",
+	resource: "resource",
+	image: "image",
+	alignment: "alignment",
+	slider: "slider",
+	colorPicker: "colorPicker",
+	sectionHeader: "sectionHeader",
+	separator: "separator",
+	buttonGroup: "buttonGroup",
+	colorSelect: "colorSelect",
+	sectionLayoutSelect: "sectionLayoutSelect",
+	background: "background",
+	contentPosition: "contentPosition",
+	textSizeSelect: "textSizeSelect",
+	cssUnit: "cssUnit"
+};
+/**
+* Runtime validation for property field types.
+* @param value - The value to check
+* @returns true if value is a valid PropertyFieldType
+*/
+function isPropertyFieldType(value) {
+	return Object.values(PROPERTY_FIELD_TYPES).includes(value);
+}
+/**
+* Group property fields by their group property
+*/
+function groupPropertyFields(fields) {
+	const grouped = {};
+	fields.forEach((field) => {
+		const group = field.group || "General";
+		if (!grouped[group]) grouped[group] = [];
+		grouped[group].push(field);
+	});
+	return grouped;
+}
+/**
+* Extract current values from widget props based on property fields
+*/
+function extractPropertyValues(widget, fields) {
+	const values = {};
+	fields.forEach((field) => {
+		const value = widget.props[field.key];
+		values[field.key] = value !== void 0 ? value : field.defaultValue;
+	});
+	return values;
+}
+/**
+* Apply property values to widget props
+*/
+function applyPropertyValues(widget, values) {
+	return {
+		...widget,
+		props: {
+			...widget.props,
+			...values
+		}
+	};
+}
+//#endregion
+//#region src/registries/field-helpers.ts
+const getColorField = (props) => {
+	return {
+		...props,
+		type: "colorSelect"
+	};
+};
+const getBorderRadiusField = (props) => {
+	return {
+		...props,
+		type: "buttonGroup",
+		options: [
+			{
+				icon: faBan,
+				value: "none"
+			},
+			{
+				label: "SM",
+				value: "sm"
+			},
+			{
+				label: "MD",
+				value: "md"
+			},
+			{
+				label: "LG",
+				value: "lg"
+			},
+			{
+				label: "XL",
+				value: "xl"
+			},
+			{
+				label: "FULL",
+				value: "full"
+			}
+		]
+	};
+};
+const getPaddingField = (props) => {
+	return {
+		...props,
+		type: "buttonGroup",
+		options: [
+			{
+				icon: faBan,
+				value: 0
+			},
+			{
+				label: "SM",
+				value: 2
+			},
+			{
+				label: "MD",
+				value: 4
+			},
+			{
+				label: "LG",
+				value: 6
+			},
+			{
+				label: "XL",
+				value: 8
+			},
+			{
+				label: "FULL",
+				value: 10
+			}
+		]
+	};
+};
+const getButtonSizeField = (props) => {
+	return {
+		...props,
+		type: "buttonGroup",
+		options: [
+			{
+				label: "SM",
+				value: "sm"
+			},
+			{
+				label: "MD",
+				value: "default"
+			},
+			{
+				label: "LG",
+				value: "lg"
+			},
+			{
+				label: "XL",
+				value: "xl"
+			}
+		]
+	};
+};
+const getFontSizeField = (props) => {
+	return {
+		...props,
+		type: "textSizeSelect"
+	};
+};
+const getGapField = (props) => {
+	return {
+		...props,
+		type: "buttonGroup",
+		options: [
+			{
+				icon: faBan,
+				value: "none"
+			},
+			{
+				label: "XS",
+				value: "xs"
+			},
+			{
+				label: "SM",
+				value: "sm"
+			},
+			{
+				label: "MD",
+				value: "md"
+			},
+			{
+				label: "LG",
+				value: "lg"
+			},
+			{
+				label: "XL",
+				value: "xl"
+			}
+		]
+	};
+};
+const getHeightField = (props) => {
+	return {
+		...props,
+		type: "cssUnit"
+	};
+};
+/**
+* Gap value mapping - use `as const satisfies` for compile-time validation
+* with literal type preservation.
+*/
+const gapValues = {
+	none: 0,
+	xs: 1,
+	sm: 2,
+	md: 4,
+	lg: 6,
+	xl: 8
+};
+//#endregion
+export { PROPERTY_FIELD_TYPES, applyPropertyValues, extractPropertyValues, gapValues, getBorderRadiusField, getButtonSizeField, getColorField, getFontSizeField, getGapField, getHeightField, getPaddingField, groupPropertyFields, isPropertyFieldType };
+
+//# sourceMappingURL=index.mjs.map

package/dist/registries/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/registries/property-schema-types.ts","../../src/registries/field-helpers.ts"],"sourcesContent":["import type { IconDefinition } from \"@fortawesome/fontawesome-svg-core\";\nimport type {\n  WidgetType,\n  WidgetSchema,\n  AlignOptions,\n  ColorOptions,\n  FontSizeOptions,\n  SectionLayoutType,\n  StrictOmit,\n} from \"../types\";\n\n/**\n * Tab configuration for organizing properties\n */\nexport interface TabConfig {\n  /** Unique identifier for the tab */\n  id: string;\n  /** Display label for the tab */\n  label: string;\n}\n\n// ============================================================================\n// Property Field Types - Derive from constant for single source of truth\n// ============================================================================\n\n/**\n * Property field type constant - single source of truth for field types.\n * Use PROPERTY_FIELD_TYPES.text instead of \"text\" for type-safe comparisons.\n */\nexport const PROPERTY_FIELD_TYPES = {\n  text: \"text\",\n  textarea: \"textarea\",\n  number: \"number\",\n  boolean: \"boolean\",\n  select: \"select\",\n  color: \"color\",\n  range: \"range\",\n  dataSource: \"dataSource\",\n  resource: \"resource\",\n  image: \"image\",\n  alignment: \"alignment\",\n  slider: \"slider\",\n  colorPicker: \"colorPicker\",\n  sectionHeader: \"sectionHeader\",\n  separator: \"separator\",\n  buttonGroup: \"buttonGroup\",\n  colorSelect: \"colorSelect\",\n  sectionLayoutSelect: \"sectionLayoutSelect\",\n  background: \"background\",\n  contentPosition: \"contentPosition\",\n  textSizeSelect: \"textSizeSelect\",\n  cssUnit: \"cssUnit\",\n} as const;\n\n/**\n * Union type of all property field types, derived from PROPERTY_FIELD_TYPES constant.\n * @see deriving-typeof-for-object-keys pattern\n */\nexport type PropertyFieldType =\n  (typeof PROPERTY_FIELD_TYPES)[keyof typeof PROPERTY_FIELD_TYPES];\n\n/**\n * Runtime validation for property field types.\n * @param value - The value to check\n * @returns true if value is a valid PropertyFieldType\n */\nexport function isPropertyFieldType(value: string): value is PropertyFieldType {\n  return Object.values(PROPERTY_FIELD_TYPES).includes(\n    value as PropertyFieldType,\n  );\n}\n\n/**\n * Base schema for a property field\n */\nexport interface PropertyFieldSchema {\n  /** Property key in the widget props */\n  key: string;\n  /** Display label for the field */\n  label: string;\n  /** Field type determines the input control */\n  type: PropertyFieldType;\n  /** Optional description/help text */\n  description?: string;\n  /** Optional default value */\n  defaultValue?: unknown;\n  /** Optional tab ID (must match a TabConfig id if widget has tabsConfig) */\n  tab?: string;\n  /** Optional group for organizing fields within a tab */\n  group?: string;\n  /**\n   * @deprecated Use requiresKeyValue instead\n   */\n  requiresKeyToBeTrue?: string;\n  /** Optional requires a specific key to have a specific value */\n  requiresKeyValue?: { key: string; value: unknown };\n}\n\n/**\n * Text field schema\n */\nexport interface TextFieldSchema extends PropertyFieldSchema {\n  type: \"text\";\n  placeholder?: string;\n  maxLength?: number;\n}\n\n/**\n * Textarea field schema\n */\nexport interface TextareaFieldSchema extends PropertyFieldSchema {\n  type: \"textarea\";\n  placeholder?: string;\n  rows?: number;\n  maxLength?: number;\n}\n\n/**\n * Number field schema\n */\nexport interface NumberFieldSchema extends PropertyFieldSchema {\n  type: \"number\";\n  min?: number;\n  max?: number;\n  step?: number;\n}\n\n/**\n * Boolean field schema\n */\nexport interface BooleanFieldSchema extends PropertyFieldSchema {\n  type: \"boolean\";\n}\n\n/**\n * Select field schema with type-safe option values.\n * Uses StrictOmit to ensure \"defaultValue\" key exists on PropertyFieldSchema.\n */\nexport interface SelectFieldSchema<\n  T extends string | number = string | number,\n> extends StrictOmit<PropertyFieldSchema, \"defaultValue\"> {\n  type: \"select\";\n  options: Array<{ label: string; value: T }>;\n  defaultValue?: T;\n}\n\n/**\n * Color field schema\n */\nexport interface ColorFieldSchema extends PropertyFieldSchema {\n  type: \"color\";\n}\n\n/**\n * Range slider field schema\n */\nexport interface RangeFieldSchema extends PropertyFieldSchema {\n  type: \"range\";\n  min: number;\n  max: number;\n  step?: number;\n}\n\n/**\n * Data source field schema for configuring widget data sources\n */\nexport interface DataSourceFieldSchema extends PropertyFieldSchema {\n  type: \"dataSource\";\n}\n\n/**\n * Resource field schema for selecting a single resource from the selection modal\n */\nexport interface ResourceFieldSchema extends PropertyFieldSchema {\n  type: \"resource\";\n  /** Optional filter to specific shareable types */\n  allowedTypes?: string[];\n}\n\n/**\n * Image field schema for selecting a single image from the image picker\n */\nexport interface ImageFieldSchema extends PropertyFieldSchema {\n  type: \"image\";\n}\n\n/**\n * Alignment field schema\n */\nexport interface AlignmentFieldSchema extends PropertyFieldSchema {\n  type: \"alignment\";\n  options: {\n    verticalEnabled: boolean;\n    horizontalEnabled: boolean;\n  };\n  defaultValue?: AlignOptions;\n}\n\n/**\n * Slider field schema with optional unit suffix (e.g., \"rem\", \"px\")\n */\nexport interface SliderFieldSchema extends PropertyFieldSchema {\n  type: \"slider\";\n  min: number;\n  max: number;\n  step?: number;\n  unit?: string;\n}\n\n/**\n * Color picker field schema with optional swatches\n */\nexport interface ColorPickerFieldSchema extends PropertyFieldSchema {\n  type: \"colorPicker\";\n  swatches?: string[];\n}\n\n/**\n * Section header field schema for visual grouping\n */\nexport interface SectionHeaderFieldSchema extends PropertyFieldSchema {\n  type: \"sectionHeader\";\n  subtitle?: string;\n}\n\n/**\n * Separator field schema for visual separation\n */\nexport interface SeparatorFieldSchema extends PropertyFieldSchema {\n  type: \"separator\";\n}\n\n/**\n * Button group field schema.\n * Uses StrictOmit to ensure \"defaultValue\" key exists on PropertyFieldSchema.\n */\nexport interface ButtonGroupFieldSchema<\n  T extends string | number = string | number,\n> extends StrictOmit<PropertyFieldSchema, \"defaultValue\"> {\n  type: \"buttonGroup\";\n  options: Array<{ label?: string; icon?: IconDefinition; value: T }>;\n  defaultValue?: T;\n}\n\n/**\n * Color select field schema\n */\nexport interface ColorSelectFieldSchema extends PropertyFieldSchema {\n  type: \"colorSelect\";\n  defaultValue?: ColorOptions;\n}\n\n/**\n * Section layout select field schema for visual masonry layout selector\n */\nexport interface SectionLayoutSelectFieldSchema extends PropertyFieldSchema {\n  type: \"sectionLayoutSelect\";\n  defaultValue?: SectionLayoutType;\n}\n\n/**\n * Background field combines resource selection and color properties.\n * Uses StrictOmit to exclude conflicting \"type\" discriminant from parents.\n */\nexport interface BackgroundFieldSchema\n  extends\n    StrictOmit<ResourceFieldSchema, \"type\">,\n    StrictOmit<ColorFieldSchema, \"type\"> {\n  type: \"background\";\n}\n\n/**\n * Content position field schema for 3x3 grid position picker\n */\nexport interface ContentPositionFieldSchema extends PropertyFieldSchema {\n  type: \"contentPosition\";\n  defaultValue?: string;\n}\n\n/**\n * Text size select field schema for visual font size selector\n */\nexport interface TextSizeSelectFieldSchema extends PropertyFieldSchema {\n  type: \"textSizeSelect\";\n  defaultValue?: FontSizeOptions;\n}\n\n/**\n * CSS unit type for height/width fields\n */\nexport type CssUnit = \"px\" | \"rem\" | \"vh\";\n\n/**\n * CSS unit field schema for numeric values with selectable units (px, rem, vh)\n */\nexport interface CssUnitFieldSchema extends PropertyFieldSchema {\n  type: \"cssUnit\";\n  min?: number;\n  max?: number;\n  step?: number;\n  allowedUnits?: CssUnit[];\n  defaultUnit?: CssUnit;\n}\n\n/**\n * Union of all field schema types\n */\nexport type PropertyField =\n  | TextFieldSchema\n  | TextareaFieldSchema\n  | NumberFieldSchema\n  | BooleanFieldSchema\n  | SelectFieldSchema<string | number>\n  | ColorFieldSchema\n  | RangeFieldSchema\n  | DataSourceFieldSchema\n  | ResourceFieldSchema\n  | ImageFieldSchema\n  | AlignmentFieldSchema\n  | SliderFieldSchema\n  | ColorPickerFieldSchema\n  | SectionHeaderFieldSchema\n  | SeparatorFieldSchema\n  | ButtonGroupFieldSchema<string | number>\n  | ColorSelectFieldSchema\n  | SectionLayoutSelectFieldSchema\n  | BackgroundFieldSchema\n  | ContentPositionFieldSchema\n  | TextSizeSelectFieldSchema\n  | CssUnitFieldSchema;\n\n/**\n * Schema for per-item configuration in custom data sources.\n * Widgets can define this to allow users to configure widget-specific\n * settings for each selected item (e.g., title, description, button).\n */\nexport interface ItemConfigSchema {\n  /** Fields available for per-item configuration */\n  fields: PropertyField[];\n  /** Optional description shown at top of item config panel */\n  description?: string;\n}\n\n/**\n * Schema for a widget's editable properties\n */\nexport interface WidgetPropertySchema {\n  /** Widget type this schema applies to */\n  widgetType: WidgetType;\n  /** Display name for the widget */\n  displayName: string;\n  /** Optional tab configuration - if present, tabs are enabled */\n  tabsConfig?: TabConfig[];\n  /** Editable property fields */\n  fields: PropertyField[];\n  /** Optional custom validator function */\n  validate?: (props: Record<string, unknown>) => string | null;\n  /** Props that can be populated from data sources */\n  dataSourceTargetProps?: string[];\n  /** Optional schema for per-item configurations in custom data sources */\n  itemConfigSchema?: ItemConfigSchema;\n}\n\n/**\n * Registry mapping widget types to their property schemas\n */\nexport type PropertySchemaRegistry = Record<WidgetType, WidgetPropertySchema>;\n\n/**\n * Group property fields by their group property\n */\nexport function groupPropertyFields(\n  fields: readonly PropertyField[],\n): Record<string, PropertyField[]> {\n  const grouped: Record<string, PropertyField[]> = {};\n\n  fields.forEach((field) => {\n    const group = field.group || \"General\";\n    if (!grouped[group]) {\n      grouped[group] = [];\n    }\n    grouped[group].push(field);\n  });\n\n  return grouped;\n}\n\n/**\n * Extract current values from widget props based on property fields\n */\nexport function extractPropertyValues(\n  widget: Readonly<WidgetSchema>,\n  fields: readonly PropertyField[],\n): Record<string, unknown> {\n  const values: Record<string, unknown> = {};\n\n  fields.forEach((field) => {\n    const value = widget.props[field.key];\n    values[field.key] = value !== undefined ? value : field.defaultValue;\n  });\n\n  return values;\n}\n\n/**\n * Apply property values to widget props\n */\nexport function applyPropertyValues(\n  widget: Readonly<WidgetSchema>,\n  values: Readonly<Record<string, unknown>>,\n): WidgetSchema {\n  return {\n    ...widget,\n    props: {\n      ...widget.props,\n      ...values,\n    },\n  };\n}\n","import type {\n  ButtonGroupFieldSchema,\n  ColorSelectFieldSchema,\n  CssUnitFieldSchema,\n  TextSizeSelectFieldSchema,\n} from \"./property-schema-types\";\nimport type {\n  BorderRadiusOptions,\n  PaddingOptions,\n  ButtonSizeOptions,\n  GapOptions,\n} from \"../types\";\nimport { faBan } from \"@fortawesome/pro-regular-svg-icons\";\n\nexport const getColorField = (\n  props: Readonly<Omit<ColorSelectFieldSchema, \"type\">>,\n): ColorSelectFieldSchema => {\n  return {\n    ...props,\n    type: \"colorSelect\",\n  };\n};\n\nexport const getBorderRadiusField = (\n  props: Readonly<\n    Omit<ButtonGroupFieldSchema<BorderRadiusOptions>, \"options\" | \"type\">\n  >,\n): ButtonGroupFieldSchema<BorderRadiusOptions> => {\n  return {\n    ...props,\n    type: \"buttonGroup\",\n    options: [\n      { icon: faBan, value: \"none\" },\n      { label: \"SM\", value: \"sm\" },\n      { label: \"MD\", value: \"md\" },\n      { label: \"LG\", value: \"lg\" },\n      { label: \"XL\", value: \"xl\" },\n      { label: \"FULL\", value: \"full\" },\n    ],\n  };\n};\n\nexport const getPaddingField = (\n  props: Readonly<\n    Omit<ButtonGroupFieldSchema<PaddingOptions>, \"options\" | \"type\">\n  >,\n): ButtonGroupFieldSchema<PaddingOptions> => {\n  return {\n    ...props,\n    type: \"buttonGroup\",\n    options: [\n      { icon: faBan, value: 0 },\n      { label: \"SM\", value: 2 },\n      { label: \"MD\", value: 4 },\n      { label: \"LG\", value: 6 },\n      { label: \"XL\", value: 8 },\n      { label: \"FULL\", value: 10 },\n    ],\n  };\n};\n\nexport const getButtonSizeField = (\n  props: Readonly<\n    Omit<ButtonGroupFieldSchema<ButtonSizeOptions>, \"options\" | \"type\">\n  >,\n): ButtonGroupFieldSchema<ButtonSizeOptions> => {\n  return {\n    ...props,\n    type: \"buttonGroup\",\n    options: [\n      { label: \"SM\", value: \"sm\" },\n      { label: \"MD\", value: \"default\" },\n      { label: \"LG\", value: \"lg\" },\n      { label: \"XL\", value: \"xl\" },\n    ],\n  };\n};\n\nexport const getFontSizeField = (\n  props: Readonly<Omit<TextSizeSelectFieldSchema, \"type\">>,\n): TextSizeSelectFieldSchema => {\n  return {\n    ...props,\n    type: \"textSizeSelect\",\n  };\n};\n\nexport const getGapField = (\n  props: Readonly<Omit<ButtonGroupFieldSchema<GapOptions>, \"options\" | \"type\">>,\n): ButtonGroupFieldSchema<GapOptions> => {\n  return {\n    ...props,\n    type: \"buttonGroup\",\n    options: [\n      { icon: faBan, value: \"none\" },\n      { label: \"XS\", value: \"xs\" },\n      { label: \"SM\", value: \"sm\" },\n      { label: \"MD\", value: \"md\" },\n      { label: \"LG\", value: \"lg\" },\n      { label: \"XL\", value: \"xl\" },\n    ],\n  };\n};\n\nexport const getHeightField = (\n  props: Readonly<Omit<CssUnitFieldSchema, \"type\">>,\n): CssUnitFieldSchema => {\n  return {\n    ...props,\n    type: \"cssUnit\",\n  };\n};\n\n/**\n * Gap value mapping - use `as const satisfies` for compile-time validation\n * with literal type preservation.\n */\nexport const gapValues = {\n  none: 0,\n  xs: 1,\n  sm: 2,\n  md: 4,\n  lg: 6,\n  xl: 8,\n} as const satisfies Record<GapOptions, number>;\n"],"mappings":";;;;;;AA6BA,MAAa,uBAAuB;CAClC,MAAM;CACN,UAAU;CACV,QAAQ;CACR,SAAS;CACT,QAAQ;CACR,OAAO;CACP,OAAO;CACP,YAAY;CACZ,UAAU;CACV,OAAO;CACP,WAAW;CACX,QAAQ;CACR,aAAa;CACb,eAAe;CACf,WAAW;CACX,aAAa;CACb,aAAa;CACb,qBAAqB;CACrB,YAAY;CACZ,iBAAiB;CACjB,gBAAgB;CAChB,SAAS;CACV;;;;;;AAcD,SAAgB,oBAAoB,OAA2C;AAC7E,QAAO,OAAO,OAAO,qBAAqB,CAAC,SACzC,MACD;;;;;AA8SH,SAAgB,oBACd,QACiC;CACjC,MAAM,UAA2C,EAAE;AAEnD,QAAO,SAAS,UAAU;EACxB,MAAM,QAAQ,MAAM,SAAS;AAC7B,MAAI,CAAC,QAAQ,OACX,SAAQ,SAAS,EAAE;AAErB,UAAQ,OAAO,KAAK,MAAM;GAC1B;AAEF,QAAO;;;;;AAMT,SAAgB,sBACd,QACA,QACyB;CACzB,MAAM,SAAkC,EAAE;AAE1C,QAAO,SAAS,UAAU;EACxB,MAAM,QAAQ,OAAO,MAAM,MAAM;AACjC,SAAO,MAAM,OAAO,UAAU,KAAA,IAAY,QAAQ,MAAM;GACxD;AAEF,QAAO;;;;;AAMT,SAAgB,oBACd,QACA,QACc;AACd,QAAO;EACL,GAAG;EACH,OAAO;GACL,GAAG,OAAO;GACV,GAAG;GACJ;EACF;;;;ACnZH,MAAa,iBACX,UAC2B;AAC3B,QAAO;EACL,GAAG;EACH,MAAM;EACP;;AAGH,MAAa,wBACX,UAGgD;AAChD,QAAO;EACL,GAAG;EACH,MAAM;EACN,SAAS;GACP;IAAE,MAAM;IAAO,OAAO;IAAQ;GAC9B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAQ,OAAO;IAAQ;GACjC;EACF;;AAGH,MAAa,mBACX,UAG2C;AAC3C,QAAO;EACL,GAAG;EACH,MAAM;EACN,SAAS;GACP;IAAE,MAAM;IAAO,OAAO;IAAG;GACzB;IAAE,OAAO;IAAM,OAAO;IAAG;GACzB;IAAE,OAAO;IAAM,OAAO;IAAG;GACzB;IAAE,OAAO;IAAM,OAAO;IAAG;GACzB;IAAE,OAAO;IAAM,OAAO;IAAG;GACzB;IAAE,OAAO;IAAQ,OAAO;IAAI;GAC7B;EACF;;AAGH,MAAa,sBACX,UAG8C;AAC9C,QAAO;EACL,GAAG;EACH,MAAM;EACN,SAAS;GACP;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAW;GACjC;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC7B;EACF;;AAGH,MAAa,oBACX,UAC8B;AAC9B,QAAO;EACL,GAAG;EACH,MAAM;EACP;;AAGH,MAAa,eACX,UACuC;AACvC,QAAO;EACL,GAAG;EACH,MAAM;EACN,SAAS;GACP;IAAE,MAAM;IAAO,OAAO;IAAQ;GAC9B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC5B;IAAE,OAAO;IAAM,OAAO;IAAM;GAC7B;EACF;;AAGH,MAAa,kBACX,UACuB;AACvB,QAAO;EACL,GAAG;EACH,MAAM;EACP;;;;;;AAOH,MAAa,YAAY;CACvB,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL"}

package/dist/shell/AppShellLayout.cjs

@@ -1,14 +1,49 @@
-'use strict';
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_chunk = require("../chunk-CKQMccvm.cjs");
+const require_shell_sidebar = require("./sidebar.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/shell/AppShellLayout.tsx
+/**
+* Pure visual frame that replicates the RepApp layout:
+* - 13rem collapsible sidebar
+* - 52px header area
+* - rounded-xl bg-background shadow-lg content area with bg-muted gutters
+*
+* This component handles zero business logic — it simply provides the visual shell.
+*/
+function AppShellLayout({ sidebarContent, headerContent, children, sidebarHeader, sidebarFooter, afterContent, useBottomNav = false }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_shell_sidebar.SidebarProvider, {
+		useBottomNav,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "bg-muted relative flex max-h-dvh w-full overflow-hidden",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_shell_sidebar.Sidebar, { children: [
+					sidebarHeader && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_shell_sidebar.SidebarHeader, { children: sidebarHeader }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_shell_sidebar.SidebarContent, {
+						className: "p-4",
+						children: sidebarContent
+					}),
+					sidebarFooter && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_shell_sidebar.SidebarFooter, { children: sidebarFooter })
+				] }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_shell_sidebar.SidebarInset, {
+					className: "flex flex-1 flex-col overflow-hidden",
+					children: [headerContent, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: `bg-muted flex-1 overflow-hidden md:pr-4 md:pb-4 ${useBottomNav ? "max-md:pb-[calc(4rem+env(safe-area-inset-bottom))]" : ""}`,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "scrollbar-none bg-background text-foreground h-full overflow-auto rounded-xl shadow-lg",
+							children
+						})
+					})]
+				}),
+				afterContent
+			]
+		})
+	});
+}
+//#endregion
+exports.AppShellLayout = AppShellLayout;
 
-var chunk45BCVWQK_cjs = require('../chunk-45BCVWQK.cjs');
-require('../chunk-PFDBULOI.cjs');
-require('../chunk-5NYM4UTW.cjs');
-
-
-
-Object.defineProperty(exports, "AppShellLayout", {
-  enumerable: true,
-  get: function () { return chunk45BCVWQK_cjs.AppShellLayout; }
-});
-//# sourceMappingURL=AppShellLayout.cjs.map
 //# sourceMappingURL=AppShellLayout.cjs.map

package/dist/shell/AppShellLayout.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"AppShellLayout.cjs"}
+{"version":3,"file":"AppShellLayout.cjs","names":["SidebarProvider","Sidebar","SidebarHeader","SidebarContent","SidebarFooter","SidebarInset"],"sources":["../../src/shell/AppShellLayout.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Sidebar,\n  SidebarContent,\n  SidebarFooter,\n  SidebarHeader,\n  SidebarInset,\n  SidebarProvider,\n} from \"./sidebar\";\n\nexport interface AppShellLayoutProps {\n  /** Navigation content rendered inside the sidebar's scrollable area */\n  sidebarContent: React.ReactNode;\n  /** Header content rendered above the main content area */\n  headerContent: React.ReactNode;\n  /** Main page content */\n  children: React.ReactNode;\n  /** Optional slot at the top of the sidebar (e.g. logo, search) */\n  sidebarHeader?: React.ReactNode;\n  /** Optional slot at the bottom of the sidebar (e.g. user info) */\n  sidebarFooter?: React.ReactNode;\n  /** Content rendered after SidebarInset (e.g. MobileBottomNav) */\n  afterContent?: React.ReactNode;\n  /** Enable bottom nav mode (hides sidebar on mobile, adds bottom padding) */\n  useBottomNav?: boolean;\n}\n\n/**\n * Pure visual frame that replicates the RepApp layout:\n * - 13rem collapsible sidebar\n * - 52px header area\n * - rounded-xl bg-background shadow-lg content area with bg-muted gutters\n *\n * This component handles zero business logic — it simply provides the visual shell.\n */\nexport function AppShellLayout({\n  sidebarContent,\n  headerContent,\n  children,\n  sidebarHeader,\n  sidebarFooter,\n  afterContent,\n  useBottomNav = false,\n}: AppShellLayoutProps) {\n  return (\n    <SidebarProvider useBottomNav={useBottomNav}>\n      <div className=\"bg-muted relative flex max-h-dvh w-full overflow-hidden\">\n        {/* Navigation Sidebar */}\n        <Sidebar>\n          {sidebarHeader && <SidebarHeader>{sidebarHeader}</SidebarHeader>}\n          <SidebarContent className=\"p-4\">{sidebarContent}</SidebarContent>\n          {sidebarFooter && <SidebarFooter>{sidebarFooter}</SidebarFooter>}\n        </Sidebar>\n\n        {/* Main Content Area */}\n        <SidebarInset className=\"flex flex-1 flex-col overflow-hidden\">\n          {/* Header */}\n          {headerContent}\n\n          {/* Screen Content */}\n          <div\n            className={`bg-muted flex-1 overflow-hidden md:pr-4 md:pb-4 ${useBottomNav ? \"max-md:pb-[calc(4rem+env(safe-area-inset-bottom))]\" : \"\"}`}\n          >\n            <div className=\"scrollbar-none bg-background text-foreground h-full overflow-auto rounded-xl shadow-lg\">\n              {children}\n            </div>\n          </div>\n        </SidebarInset>\n\n        {/* After content (e.g. MobileBottomNav) */}\n        {afterContent}\n      </div>\n    </SidebarProvider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAqCA,SAAgB,eAAe,EAC7B,gBACA,eACA,UACA,eACA,eACA,cACA,eAAe,SACO;AACtB,QACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,iBAAD;EAA+B;YAC7B,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAU;aAAf;IAEE,iBAAA,GAAA,kBAAA,MAACC,sBAAAA,SAAD,EAAA,UAAA;KACG,iBAAiB,iBAAA,GAAA,kBAAA,KAACC,sBAAAA,eAAD,EAAA,UAAgB,eAA8B,CAAA;KAChE,iBAAA,GAAA,kBAAA,KAACC,sBAAAA,gBAAD;MAAgB,WAAU;gBAAO;MAAgC,CAAA;KAChE,iBAAiB,iBAAA,GAAA,kBAAA,KAACC,sBAAAA,eAAD,EAAA,UAAgB,eAA8B,CAAA;KACxD,EAAA,CAAA;IAGV,iBAAA,GAAA,kBAAA,MAACC,sBAAAA,cAAD;KAAc,WAAU;eAAxB,CAEG,eAGD,iBAAA,GAAA,kBAAA,KAAC,OAAD;MACE,WAAW,mDAAmD,eAAe,uDAAuD;gBAEpI,iBAAA,GAAA,kBAAA,KAAC,OAAD;OAAK,WAAU;OACZ;OACG,CAAA;MACF,CAAA,CACO;;IAGd;IACG;;EACU,CAAA"}

package/dist/shell/AppShellLayout.d.cts

@@ -1,21 +1,22 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as React from "react";
 
+//#region src/shell/AppShellLayout.d.ts
 interface AppShellLayoutProps {
-    /** Navigation content rendered inside the sidebar's scrollable area */
-    sidebarContent: React.ReactNode;
-    /** Header content rendered above the main content area */
-    headerContent: React.ReactNode;
-    /** Main page content */
-    children: React.ReactNode;
-    /** Optional slot at the top of the sidebar (e.g. logo, search) */
-    sidebarHeader?: React.ReactNode;
-    /** Optional slot at the bottom of the sidebar (e.g. user info) */
-    sidebarFooter?: React.ReactNode;
-    /** Content rendered after SidebarInset (e.g. MobileBottomNav) */
-    afterContent?: React.ReactNode;
-    /** Enable bottom nav mode (hides sidebar on mobile, adds bottom padding) */
-    useBottomNav?: boolean;
+  /** Navigation content rendered inside the sidebar's scrollable area */
+  sidebarContent: React.ReactNode;
+  /** Header content rendered above the main content area */
+  headerContent: React.ReactNode;
+  /** Main page content */
+  children: React.ReactNode;
+  /** Optional slot at the top of the sidebar (e.g. logo, search) */
+  sidebarHeader?: React.ReactNode;
+  /** Optional slot at the bottom of the sidebar (e.g. user info) */
+  sidebarFooter?: React.ReactNode;
+  /** Content rendered after SidebarInset (e.g. MobileBottomNav) */
+  afterContent?: React.ReactNode;
+  /** Enable bottom nav mode (hides sidebar on mobile, adds bottom padding) */
+  useBottomNav?: boolean;
 }
 /**
  * Pure visual frame that replicates the RepApp layout:
@@ -25,6 +26,15 @@ interface AppShellLayoutProps {
  *
  * This component handles zero business logic — it simply provides the visual shell.
  */
-declare function AppShellLayout({ sidebarContent, headerContent, children, sidebarHeader, sidebarFooter, afterContent, useBottomNav, }: AppShellLayoutProps): react_jsx_runtime.JSX.Element;
-
-export { AppShellLayout, type AppShellLayoutProps };
+declare function AppShellLayout({
+  sidebarContent,
+  headerContent,
+  children,
+  sidebarHeader,
+  sidebarFooter,
+  afterContent,
+  useBottomNav
+}: AppShellLayoutProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { AppShellLayout, AppShellLayoutProps };
+//# sourceMappingURL=AppShellLayout.d.cts.map

package/dist/shell/AppShellLayout.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppShellLayout.d.cts","names":[],"sources":["../../src/shell/AppShellLayout.tsx"],"mappings":";;;;UAYiB,mBAAA;;EAEf,cAAA,EAAgB,KAAA,CAAM,SAAA;EAFP;EAIf,aAAA,EAAe,KAAA,CAAM,SAAA;;EAErB,QAAA,EAAU,KAAA,CAAM,SAAA;EAFD;EAIf,aAAA,GAAgB,KAAA,CAAM,SAAA;EAAN;EAEhB,aAAA,GAAgB,KAAA,CAAM,SAAA;EAEP;EAAf,YAAA,GAAe,KAAA,CAAM,SAAA;EAAS;EAE9B,YAAA;AAAA;;;;;;;;;iBAWc,cAAA,CAAA;EACd,cAAA;EACA,aAAA;EACA,QAAA;EACA,aAAA;EACA,aAAA;EACA,YAAA;EACA;AAAA,GACC,mBAAA,GAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/shell/AppShellLayout.d.mts

@@ -0,0 +1,40 @@
+import * as React from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/shell/AppShellLayout.d.ts
+interface AppShellLayoutProps {
+  /** Navigation content rendered inside the sidebar's scrollable area */
+  sidebarContent: React.ReactNode;
+  /** Header content rendered above the main content area */
+  headerContent: React.ReactNode;
+  /** Main page content */
+  children: React.ReactNode;
+  /** Optional slot at the top of the sidebar (e.g. logo, search) */
+  sidebarHeader?: React.ReactNode;
+  /** Optional slot at the bottom of the sidebar (e.g. user info) */
+  sidebarFooter?: React.ReactNode;
+  /** Content rendered after SidebarInset (e.g. MobileBottomNav) */
+  afterContent?: React.ReactNode;
+  /** Enable bottom nav mode (hides sidebar on mobile, adds bottom padding) */
+  useBottomNav?: boolean;
+}
+/**
+ * Pure visual frame that replicates the RepApp layout:
+ * - 13rem collapsible sidebar
+ * - 52px header area
+ * - rounded-xl bg-background shadow-lg content area with bg-muted gutters
+ *
+ * This component handles zero business logic — it simply provides the visual shell.
+ */
+declare function AppShellLayout({
+  sidebarContent,
+  headerContent,
+  children,
+  sidebarHeader,
+  sidebarFooter,
+  afterContent,
+  useBottomNav
+}: AppShellLayoutProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { AppShellLayout, AppShellLayoutProps };
+//# sourceMappingURL=AppShellLayout.d.mts.map

package/dist/shell/AppShellLayout.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppShellLayout.d.mts","names":[],"sources":["../../src/shell/AppShellLayout.tsx"],"mappings":";;;;UAYiB,mBAAA;;EAEf,cAAA,EAAgB,KAAA,CAAM,SAAA;EAFP;EAIf,aAAA,EAAe,KAAA,CAAM,SAAA;;EAErB,QAAA,EAAU,KAAA,CAAM,SAAA;EAFD;EAIf,aAAA,GAAgB,KAAA,CAAM,SAAA;EAAN;EAEhB,aAAA,GAAgB,KAAA,CAAM,SAAA;EAEP;EAAf,YAAA,GAAe,KAAA,CAAM,SAAA;EAAS;EAE9B,YAAA;AAAA;;;;;;;;;iBAWc,cAAA,CAAA;EACd,cAAA;EACA,aAAA;EACA,QAAA;EACA,aAAA;EACA,aAAA;EACA,YAAA;EACA;AAAA,GACC,mBAAA,GAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/shell/AppShellLayout.mjs

@@ -0,0 +1,46 @@
+"use client";
+import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarInset, SidebarProvider } from "./sidebar.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/shell/AppShellLayout.tsx
+/**
+* Pure visual frame that replicates the RepApp layout:
+* - 13rem collapsible sidebar
+* - 52px header area
+* - rounded-xl bg-background shadow-lg content area with bg-muted gutters
+*
+* This component handles zero business logic — it simply provides the visual shell.
+*/
+function AppShellLayout({ sidebarContent, headerContent, children, sidebarHeader, sidebarFooter, afterContent, useBottomNav = false }) {
+	return /* @__PURE__ */ jsx(SidebarProvider, {
+		useBottomNav,
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "bg-muted relative flex max-h-dvh w-full overflow-hidden",
+			children: [
+				/* @__PURE__ */ jsxs(Sidebar, { children: [
+					sidebarHeader && /* @__PURE__ */ jsx(SidebarHeader, { children: sidebarHeader }),
+					/* @__PURE__ */ jsx(SidebarContent, {
+						className: "p-4",
+						children: sidebarContent
+					}),
+					sidebarFooter && /* @__PURE__ */ jsx(SidebarFooter, { children: sidebarFooter })
+				] }),
+				/* @__PURE__ */ jsxs(SidebarInset, {
+					className: "flex flex-1 flex-col overflow-hidden",
+					children: [headerContent, /* @__PURE__ */ jsx("div", {
+						className: `bg-muted flex-1 overflow-hidden md:pr-4 md:pb-4 ${useBottomNav ? "max-md:pb-[calc(4rem+env(safe-area-inset-bottom))]" : ""}`,
+						children: /* @__PURE__ */ jsx("div", {
+							className: "scrollbar-none bg-background text-foreground h-full overflow-auto rounded-xl shadow-lg",
+							children
+						})
+					})]
+				}),
+				afterContent
+			]
+		})
+	});
+}
+//#endregion
+export { AppShellLayout };
+
+//# sourceMappingURL=AppShellLayout.mjs.map

package/dist/{chunk-45BCVWQK.cjs.map → shell/AppShellLayout.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/shell/AppShellLayout.tsx"],"names":["SidebarProvider","jsxs","Sidebar","jsx","SidebarHeader","SidebarContent","SidebarFooter","SidebarInset"],"mappings":";;;;;;AAqCO,SAAS,cAAA,CAAe;AAAA,EAC7B,cAAA;AAAA,EACA,aAAA;AAAA,EACA,QAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,YAAA,GAAe;AACjB,CAAA,EAAwB;AACtB,EAAA,sCACGA,iCAAA,EAAA,EAAgB,YAAA,EACf,QAAA,kBAAAC,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yDAAA,EAEb,QAAA,EAAA;AAAA,oBAAAA,eAAA,CAACC,yBAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,aAAA,oBAAiBC,cAAA,CAACC,mCAAe,QAAA,EAAA,aAAA,EAAc,CAAA;AAAA,sBAChDD,cAAA,CAACE,gCAAA,EAAA,EAAe,SAAA,EAAU,KAAA,EAAO,QAAA,EAAA,cAAA,EAAe,CAAA;AAAA,MAC/C,aAAA,oBAAiBF,cAAA,CAACG,+BAAA,EAAA,EAAe,QAAA,EAAA,aAAA,EAAc;AAAA,KAAA,EAClD,CAAA;AAAA,oBAGAL,eAAA,CAACM,8BAAA,EAAA,EAAa,SAAA,EAAU,sCAAA,EAErB,QAAA,EAAA;AAAA,MAAA,aAAA;AAAA,sBAGDJ,cAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,CAAA,gDAAA,EAAmD,YAAA,GAAe,oDAAA,GAAuD,EAAE,CAAA,CAAA;AAAA,UAEtI,QAAA,kBAAAA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,wFAAA,EACZ,QAAA,EACH;AAAA;AAAA;AACF,KAAA,EACF,CAAA;AAAA,IAGC;AAAA,GAAA,EACH,CAAA,EACF,CAAA;AAEJ","file":"chunk-45BCVWQK.cjs","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Sidebar,\n  SidebarContent,\n  SidebarFooter,\n  SidebarHeader,\n  SidebarInset,\n  SidebarProvider,\n} from \"./sidebar\";\n\nexport interface AppShellLayoutProps {\n  /** Navigation content rendered inside the sidebar's scrollable area */\n  sidebarContent: React.ReactNode;\n  /** Header content rendered above the main content area */\n  headerContent: React.ReactNode;\n  /** Main page content */\n  children: React.ReactNode;\n  /** Optional slot at the top of the sidebar (e.g. logo, search) */\n  sidebarHeader?: React.ReactNode;\n  /** Optional slot at the bottom of the sidebar (e.g. user info) */\n  sidebarFooter?: React.ReactNode;\n  /** Content rendered after SidebarInset (e.g. MobileBottomNav) */\n  afterContent?: React.ReactNode;\n  /** Enable bottom nav mode (hides sidebar on mobile, adds bottom padding) */\n  useBottomNav?: boolean;\n}\n\n/**\n * Pure visual frame that replicates the RepApp layout:\n * - 13rem collapsible sidebar\n * - 52px header area\n * - rounded-xl bg-background shadow-lg content area with bg-muted gutters\n *\n * This component handles zero business logic — it simply provides the visual shell.\n */\nexport function AppShellLayout({\n  sidebarContent,\n  headerContent,\n  children,\n  sidebarHeader,\n  sidebarFooter,\n  afterContent,\n  useBottomNav = false,\n}: AppShellLayoutProps) {\n  return (\n    <SidebarProvider useBottomNav={useBottomNav}>\n      <div className=\"bg-muted relative flex max-h-dvh w-full overflow-hidden\">\n        {/* Navigation Sidebar */}\n        <Sidebar>\n          {sidebarHeader && <SidebarHeader>{sidebarHeader}</SidebarHeader>}\n          <SidebarContent className=\"p-4\">{sidebarContent}</SidebarContent>\n          {sidebarFooter && <SidebarFooter>{sidebarFooter}</SidebarFooter>}\n        </Sidebar>\n\n        {/* Main Content Area */}\n        <SidebarInset className=\"flex flex-1 flex-col overflow-hidden\">\n          {/* Header */}\n          {headerContent}\n\n          {/* Screen Content */}\n          <div\n            className={`bg-muted flex-1 overflow-hidden md:pr-4 md:pb-4 ${useBottomNav ? \"max-md:pb-[calc(4rem+env(safe-area-inset-bottom))]\" : \"\"}`}\n          >\n            <div className=\"scrollbar-none bg-background text-foreground h-full overflow-auto rounded-xl shadow-lg\">\n              {children}\n            </div>\n          </div>\n        </SidebarInset>\n\n        {/* After content (e.g. MobileBottomNav) */}\n        {afterContent}\n      </div>\n    </SidebarProvider>\n  );\n}\n"]}
+{"version":3,"file":"AppShellLayout.mjs","names":[],"sources":["../../src/shell/AppShellLayout.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Sidebar,\n  SidebarContent,\n  SidebarFooter,\n  SidebarHeader,\n  SidebarInset,\n  SidebarProvider,\n} from \"./sidebar\";\n\nexport interface AppShellLayoutProps {\n  /** Navigation content rendered inside the sidebar's scrollable area */\n  sidebarContent: React.ReactNode;\n  /** Header content rendered above the main content area */\n  headerContent: React.ReactNode;\n  /** Main page content */\n  children: React.ReactNode;\n  /** Optional slot at the top of the sidebar (e.g. logo, search) */\n  sidebarHeader?: React.ReactNode;\n  /** Optional slot at the bottom of the sidebar (e.g. user info) */\n  sidebarFooter?: React.ReactNode;\n  /** Content rendered after SidebarInset (e.g. MobileBottomNav) */\n  afterContent?: React.ReactNode;\n  /** Enable bottom nav mode (hides sidebar on mobile, adds bottom padding) */\n  useBottomNav?: boolean;\n}\n\n/**\n * Pure visual frame that replicates the RepApp layout:\n * - 13rem collapsible sidebar\n * - 52px header area\n * - rounded-xl bg-background shadow-lg content area with bg-muted gutters\n *\n * This component handles zero business logic — it simply provides the visual shell.\n */\nexport function AppShellLayout({\n  sidebarContent,\n  headerContent,\n  children,\n  sidebarHeader,\n  sidebarFooter,\n  afterContent,\n  useBottomNav = false,\n}: AppShellLayoutProps) {\n  return (\n    <SidebarProvider useBottomNav={useBottomNav}>\n      <div className=\"bg-muted relative flex max-h-dvh w-full overflow-hidden\">\n        {/* Navigation Sidebar */}\n        <Sidebar>\n          {sidebarHeader && <SidebarHeader>{sidebarHeader}</SidebarHeader>}\n          <SidebarContent className=\"p-4\">{sidebarContent}</SidebarContent>\n          {sidebarFooter && <SidebarFooter>{sidebarFooter}</SidebarFooter>}\n        </Sidebar>\n\n        {/* Main Content Area */}\n        <SidebarInset className=\"flex flex-1 flex-col overflow-hidden\">\n          {/* Header */}\n          {headerContent}\n\n          {/* Screen Content */}\n          <div\n            className={`bg-muted flex-1 overflow-hidden md:pr-4 md:pb-4 ${useBottomNav ? \"max-md:pb-[calc(4rem+env(safe-area-inset-bottom))]\" : \"\"}`}\n          >\n            <div className=\"scrollbar-none bg-background text-foreground h-full overflow-auto rounded-xl shadow-lg\">\n              {children}\n            </div>\n          </div>\n        </SidebarInset>\n\n        {/* After content (e.g. MobileBottomNav) */}\n        {afterContent}\n      </div>\n    </SidebarProvider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAqCA,SAAgB,eAAe,EAC7B,gBACA,eACA,UACA,eACA,eACA,cACA,eAAe,SACO;AACtB,QACE,oBAAC,iBAAD;EAA+B;YAC7B,qBAAC,OAAD;GAAK,WAAU;aAAf;IAEE,qBAAC,SAAD,EAAA,UAAA;KACG,iBAAiB,oBAAC,eAAD,EAAA,UAAgB,eAA8B,CAAA;KAChE,oBAAC,gBAAD;MAAgB,WAAU;gBAAO;MAAgC,CAAA;KAChE,iBAAiB,oBAAC,eAAD,EAAA,UAAgB,eAA8B,CAAA;KACxD,EAAA,CAAA;IAGV,qBAAC,cAAD;KAAc,WAAU;eAAxB,CAEG,eAGD,oBAAC,OAAD;MACE,WAAW,mDAAmD,eAAe,uDAAuD;gBAEpI,oBAAC,OAAD;OAAK,WAAU;OACZ;OACG,CAAA;MACF,CAAA,CACO;;IAGd;IACG;;EACU,CAAA"}

package/dist/shell/ScreenHeader.cjs

@@ -0,0 +1,44 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../chunk-CKQMccvm.cjs");
+const require_shell_sidebar = require("./sidebar.cjs");
+const require_shell_ScreenHeaderContext = require("./ScreenHeaderContext.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _fortawesome_pro_regular_svg_icons = require("@fortawesome/pro-regular-svg-icons");
+let _fortawesome_react_fontawesome = require("@fortawesome/react-fontawesome");
+//#region src/shell/ScreenHeader.tsx
+function ScreenHeader({ title }) {
+	const { toggleSidebar, isMobile } = require_shell_sidebar.useSidebar();
+	const { actions, breadcrumbs } = require_shell_ScreenHeaderContext.useScreenHeaderContext();
+	if (!title && !breadcrumbs) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "border-border bg-background sticky top-0 z-10 flex flex-row items-center border-b px-4 py-3 md:px-6",
+		children: [
+			!isMobile && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				onClick: toggleSidebar,
+				className: "text-muted-foreground hover:text-foreground -ml-1 inline-flex items-center justify-center rounded-md p-1",
+				"aria-label": "Toggle Sidebar",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_fortawesome_react_fontawesome.FontAwesomeIcon, {
+					icon: _fortawesome_pro_regular_svg_icons.faTableLayout,
+					className: "size-4"
+				})
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-border mx-2 h-4 w-px" })] }),
+			breadcrumbs ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "min-w-0 flex-1",
+				children: breadcrumbs
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
+				className: "text-foreground text-lg font-semibold",
+				children: title
+			}),
+			actions && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "ml-auto flex items-center gap-2",
+				children: actions
+			})
+		]
+	});
+}
+//#endregion
+exports.ScreenHeader = ScreenHeader;
+
+//# sourceMappingURL=ScreenHeader.cjs.map

package/dist/shell/ScreenHeader.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenHeader.cjs","names":["useSidebar","useScreenHeaderContext","FontAwesomeIcon","faTableLayout"],"sources":["../../src/shell/ScreenHeader.tsx"],"sourcesContent":["\"use client\";\n\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faTableLayout } from \"@fortawesome/pro-regular-svg-icons\";\nimport { useSidebar } from \"./sidebar\";\nimport { useScreenHeaderContext } from \"./ScreenHeaderContext\";\n\nexport interface ScreenHeaderProps {\n  title?: string;\n}\n\nexport function ScreenHeader({ title }: ScreenHeaderProps) {\n  const { toggleSidebar, isMobile } = useSidebar();\n  const { actions, breadcrumbs } = useScreenHeaderContext();\n\n  if (!title && !breadcrumbs) return null;\n\n  return (\n    <div className=\"border-border bg-background sticky top-0 z-10 flex flex-row items-center border-b px-4 py-3 md:px-6\">\n      {!isMobile && (\n        <>\n          <button\n            type=\"button\"\n            onClick={toggleSidebar}\n            className=\"text-muted-foreground hover:text-foreground -ml-1 inline-flex items-center justify-center rounded-md p-1\"\n            aria-label=\"Toggle Sidebar\"\n          >\n            <FontAwesomeIcon icon={faTableLayout} className=\"size-4\" />\n          </button>\n          <div className=\"bg-border mx-2 h-4 w-px\" />\n        </>\n      )}\n      {breadcrumbs ? (\n        <div className=\"min-w-0 flex-1\">{breadcrumbs}</div>\n      ) : (\n        <h1 className=\"text-foreground text-lg font-semibold\">{title}</h1>\n      )}\n      {actions && (\n        <div className=\"ml-auto flex items-center gap-2\">{actions}</div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;AAWA,SAAgB,aAAa,EAAE,SAA4B;CACzD,MAAM,EAAE,eAAe,aAAaA,sBAAAA,YAAY;CAChD,MAAM,EAAE,SAAS,gBAAgBC,kCAAAA,wBAAwB;AAEzD,KAAI,CAAC,SAAS,CAAC,YAAa,QAAO;AAEnC,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,WAAU;YAAf;GACG,CAAC,YACA,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,WAAU;IACV,cAAW;cAEX,iBAAA,GAAA,kBAAA,KAACC,+BAAAA,iBAAD;KAAiB,MAAMC,mCAAAA;KAAe,WAAU;KAAW,CAAA;IACpD,CAAA,EACT,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAK,WAAU,2BAA4B,CAAA,CAC1C,EAAA,CAAA;GAEJ,cACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;cAAkB;IAAkB,CAAA,GAEnD,iBAAA,GAAA,kBAAA,KAAC,MAAD;IAAI,WAAU;cAAyC;IAAW,CAAA;GAEnE,WACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;cAAmC;IAAc,CAAA;GAE9D"}

package/dist/shell/ScreenHeader.d.cts

@@ -0,0 +1,12 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/shell/ScreenHeader.d.ts
+interface ScreenHeaderProps {
+  title?: string;
+}
+declare function ScreenHeader({
+  title
+}: ScreenHeaderProps): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { ScreenHeader, ScreenHeaderProps };
+//# sourceMappingURL=ScreenHeader.d.cts.map

package/dist/shell/ScreenHeader.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenHeader.d.cts","names":[],"sources":["../../src/shell/ScreenHeader.tsx"],"mappings":";;;UAOiB,iBAAA;EACf,KAAA;AAAA;AAAA,iBAGc,YAAA,CAAA;EAAe;AAAA,GAAS,iBAAA,GAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/shell/ScreenHeader.d.mts

@@ -0,0 +1,12 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/shell/ScreenHeader.d.ts
+interface ScreenHeaderProps {
+  title?: string;
+}
+declare function ScreenHeader({
+  title
+}: ScreenHeaderProps): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { ScreenHeader, ScreenHeaderProps };
+//# sourceMappingURL=ScreenHeader.d.mts.map

package/dist/shell/ScreenHeader.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenHeader.d.mts","names":[],"sources":["../../src/shell/ScreenHeader.tsx"],"mappings":";;;UAOiB,iBAAA;EACf,KAAA;AAAA;AAAA,iBAGc,YAAA,CAAA;EAAe;AAAA,GAAS,iBAAA,GAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/shell/ScreenHeader.mjs

@@ -0,0 +1,42 @@
+"use client";
+import { useSidebar } from "./sidebar.mjs";
+import { useScreenHeaderContext } from "./ScreenHeaderContext.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { faTableLayout } from "@fortawesome/pro-regular-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+//#region src/shell/ScreenHeader.tsx
+function ScreenHeader({ title }) {
+	const { toggleSidebar, isMobile } = useSidebar();
+	const { actions, breadcrumbs } = useScreenHeaderContext();
+	if (!title && !breadcrumbs) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "border-border bg-background sticky top-0 z-10 flex flex-row items-center border-b px-4 py-3 md:px-6",
+		children: [
+			!isMobile && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: toggleSidebar,
+				className: "text-muted-foreground hover:text-foreground -ml-1 inline-flex items-center justify-center rounded-md p-1",
+				"aria-label": "Toggle Sidebar",
+				children: /* @__PURE__ */ jsx(FontAwesomeIcon, {
+					icon: faTableLayout,
+					className: "size-4"
+				})
+			}), /* @__PURE__ */ jsx("div", { className: "bg-border mx-2 h-4 w-px" })] }),
+			breadcrumbs ? /* @__PURE__ */ jsx("div", {
+				className: "min-w-0 flex-1",
+				children: breadcrumbs
+			}) : /* @__PURE__ */ jsx("h1", {
+				className: "text-foreground text-lg font-semibold",
+				children: title
+			}),
+			actions && /* @__PURE__ */ jsx("div", {
+				className: "ml-auto flex items-center gap-2",
+				children: actions
+			})
+		]
+	});
+}
+//#endregion
+export { ScreenHeader };
+
+//# sourceMappingURL=ScreenHeader.mjs.map

package/dist/shell/ScreenHeader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenHeader.mjs","names":[],"sources":["../../src/shell/ScreenHeader.tsx"],"sourcesContent":["\"use client\";\n\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faTableLayout } from \"@fortawesome/pro-regular-svg-icons\";\nimport { useSidebar } from \"./sidebar\";\nimport { useScreenHeaderContext } from \"./ScreenHeaderContext\";\n\nexport interface ScreenHeaderProps {\n  title?: string;\n}\n\nexport function ScreenHeader({ title }: ScreenHeaderProps) {\n  const { toggleSidebar, isMobile } = useSidebar();\n  const { actions, breadcrumbs } = useScreenHeaderContext();\n\n  if (!title && !breadcrumbs) return null;\n\n  return (\n    <div className=\"border-border bg-background sticky top-0 z-10 flex flex-row items-center border-b px-4 py-3 md:px-6\">\n      {!isMobile && (\n        <>\n          <button\n            type=\"button\"\n            onClick={toggleSidebar}\n            className=\"text-muted-foreground hover:text-foreground -ml-1 inline-flex items-center justify-center rounded-md p-1\"\n            aria-label=\"Toggle Sidebar\"\n          >\n            <FontAwesomeIcon icon={faTableLayout} className=\"size-4\" />\n          </button>\n          <div className=\"bg-border mx-2 h-4 w-px\" />\n        </>\n      )}\n      {breadcrumbs ? (\n        <div className=\"min-w-0 flex-1\">{breadcrumbs}</div>\n      ) : (\n        <h1 className=\"text-foreground text-lg font-semibold\">{title}</h1>\n      )}\n      {actions && (\n        <div className=\"ml-auto flex items-center gap-2\">{actions}</div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAWA,SAAgB,aAAa,EAAE,SAA4B;CACzD,MAAM,EAAE,eAAe,aAAa,YAAY;CAChD,MAAM,EAAE,SAAS,gBAAgB,wBAAwB;AAEzD,KAAI,CAAC,SAAS,CAAC,YAAa,QAAO;AAEnC,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACG,CAAC,YACA,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,WAAU;IACV,cAAW;cAEX,oBAAC,iBAAD;KAAiB,MAAM;KAAe,WAAU;KAAW,CAAA;IACpD,CAAA,EACT,oBAAC,OAAD,EAAK,WAAU,2BAA4B,CAAA,CAC1C,EAAA,CAAA;GAEJ,cACC,oBAAC,OAAD;IAAK,WAAU;cAAkB;IAAkB,CAAA,GAEnD,oBAAC,MAAD;IAAI,WAAU;cAAyC;IAAW,CAAA;GAEnE,WACC,oBAAC,OAAD;IAAK,WAAU;cAAmC;IAAc,CAAA;GAE9D"}