@fluid-app/rep-core 0.1.6 → 0.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-2IFFXFJL.js → chunk-4NBPTMT4.js} +3 -4
- package/dist/chunk-4NBPTMT4.js.map +1 -0
- package/dist/chunk-EMFSTGLP.cjs +38 -0
- package/dist/chunk-EMFSTGLP.cjs.map +1 -0
- package/dist/{chunk-PZ6BM57A.js → chunk-KZHNZ2NG.js} +10 -4
- package/dist/chunk-KZHNZ2NG.js.map +1 -0
- package/dist/{chunk-CMXYKDHC.cjs → chunk-M54NWBRO.cjs} +3 -4
- package/dist/chunk-M54NWBRO.cjs.map +1 -0
- package/dist/data-sources/DataAwareWidget.d.cts +1 -1
- package/dist/data-sources/DataAwareWidget.d.ts +1 -1
- package/dist/data-sources/use-widget-data.d.cts +1 -1
- package/dist/data-sources/use-widget-data.d.ts +1 -1
- package/dist/registries/index.cjs +9 -1
- package/dist/registries/index.cjs.map +1 -1
- package/dist/registries/index.d.cts +21 -4
- package/dist/registries/index.d.ts +21 -4
- package/dist/registries/index.js +9 -2
- package/dist/registries/index.js.map +1 -1
- package/dist/shell/AppShellLayout.cjs +3 -3
- package/dist/shell/AppShellLayout.js +2 -2
- package/dist/shell/index.cjs +98 -28
- package/dist/shell/index.cjs.map +1 -1
- package/dist/shell/index.d.cts +37 -2
- package/dist/shell/index.d.ts +37 -2
- package/dist/shell/index.js +72 -2
- package/dist/shell/index.js.map +1 -1
- package/dist/shell/sidebar.cjs +25 -25
- package/dist/shell/sidebar.js +1 -1
- package/dist/theme/index.d.cts +2 -2
- package/dist/theme/index.d.ts +2 -2
- package/dist/types/index.d.cts +4 -4
- package/dist/types/index.d.ts +4 -4
- package/dist/{types-hru7Ix8C.d.cts → types-CNIhy4JD.d.cts} +1 -1
- package/dist/{types-hru7Ix8C.d.ts → types-CNIhy4JD.d.ts} +1 -1
- package/dist/{widget-schema-DxdlJD8E.d.ts → widget-schema-D-ca3--K.d.ts} +1 -1
- package/dist/{widget-schema-36uGUTWL.d.cts → widget-schema-DvJdg1-B.d.cts} +1 -1
- package/dist/widget-utils/index.d.cts +1 -1
- package/dist/widget-utils/index.d.ts +1 -1
- package/package.json +21 -1
- package/dist/chunk-2IFFXFJL.js.map +0 -1
- package/dist/chunk-BWHUEED3.cjs +0 -32
- package/dist/chunk-BWHUEED3.cjs.map +0 -1
- package/dist/chunk-CMXYKDHC.cjs.map +0 -1
- package/dist/chunk-PZ6BM57A.js.map +0 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
|
|
2
2
|
import { StrictOmit, AlignOptions, ColorOptions, SectionLayoutType, FontSizeOptions, BorderRadiusOptions, PaddingOptions, ButtonSizeOptions, GapOptions } from '../types/index.js';
|
|
3
|
-
import { b as WidgetType,
|
|
4
|
-
import '../types-
|
|
3
|
+
import { b as WidgetType, a as WidgetSchema } from '../widget-schema-D-ca3--K.js';
|
|
4
|
+
import '../types-CNIhy4JD.js';
|
|
5
5
|
import 'colorjs.io';
|
|
6
6
|
import '@fluid-app/fluidos-api-client';
|
|
7
7
|
import '../shareable-item-DkgWpwoU.js';
|
|
@@ -42,6 +42,7 @@ declare const PROPERTY_FIELD_TYPES: {
|
|
|
42
42
|
readonly background: "background";
|
|
43
43
|
readonly contentPosition: "contentPosition";
|
|
44
44
|
readonly textSizeSelect: "textSizeSelect";
|
|
45
|
+
readonly cssUnit: "cssUnit";
|
|
45
46
|
};
|
|
46
47
|
/**
|
|
47
48
|
* Union type of all property field types, derived from PROPERTY_FIELD_TYPES constant.
|
|
@@ -244,10 +245,25 @@ interface TextSizeSelectFieldSchema extends PropertyFieldSchema {
|
|
|
244
245
|
type: "textSizeSelect";
|
|
245
246
|
defaultValue?: FontSizeOptions;
|
|
246
247
|
}
|
|
248
|
+
/**
|
|
249
|
+
* CSS unit type for height/width fields
|
|
250
|
+
*/
|
|
251
|
+
type CssUnit = "px" | "rem" | "vh";
|
|
252
|
+
/**
|
|
253
|
+
* CSS unit field schema for numeric values with selectable units (px, rem, vh)
|
|
254
|
+
*/
|
|
255
|
+
interface CssUnitFieldSchema extends PropertyFieldSchema {
|
|
256
|
+
type: "cssUnit";
|
|
257
|
+
min?: number;
|
|
258
|
+
max?: number;
|
|
259
|
+
step?: number;
|
|
260
|
+
allowedUnits?: CssUnit[];
|
|
261
|
+
defaultUnit?: CssUnit;
|
|
262
|
+
}
|
|
247
263
|
/**
|
|
248
264
|
* Union of all field schema types
|
|
249
265
|
*/
|
|
250
|
-
type PropertyField = TextFieldSchema | TextareaFieldSchema | NumberFieldSchema | BooleanFieldSchema | SelectFieldSchema<string | number> | ColorFieldSchema | RangeFieldSchema | DataSourceFieldSchema | ResourceFieldSchema | AlignmentFieldSchema | SliderFieldSchema | ColorPickerFieldSchema | SectionHeaderFieldSchema | SeparatorFieldSchema | ButtonGroupFieldSchema<string | number> | ColorSelectFieldSchema | SectionLayoutSelectFieldSchema | BackgroundFieldSchema | ContentPositionFieldSchema | TextSizeSelectFieldSchema;
|
|
266
|
+
type PropertyField = TextFieldSchema | TextareaFieldSchema | NumberFieldSchema | BooleanFieldSchema | SelectFieldSchema<string | number> | ColorFieldSchema | RangeFieldSchema | DataSourceFieldSchema | ResourceFieldSchema | AlignmentFieldSchema | SliderFieldSchema | ColorPickerFieldSchema | SectionHeaderFieldSchema | SeparatorFieldSchema | ButtonGroupFieldSchema<string | number> | ColorSelectFieldSchema | SectionLayoutSelectFieldSchema | BackgroundFieldSchema | ContentPositionFieldSchema | TextSizeSelectFieldSchema | CssUnitFieldSchema;
|
|
251
267
|
/**
|
|
252
268
|
* Schema for per-item configuration in custom data sources.
|
|
253
269
|
* Widgets can define this to allow users to configure widget-specific
|
|
@@ -301,6 +317,7 @@ declare const getPaddingField: (props: Readonly<Omit<ButtonGroupFieldSchema<Padd
|
|
|
301
317
|
declare const getButtonSizeField: (props: Readonly<Omit<ButtonGroupFieldSchema<ButtonSizeOptions>, "options" | "type">>) => ButtonGroupFieldSchema<ButtonSizeOptions>;
|
|
302
318
|
declare const getFontSizeField: (props: Readonly<Omit<TextSizeSelectFieldSchema, "type">>) => TextSizeSelectFieldSchema;
|
|
303
319
|
declare const getGapField: (props: Readonly<Omit<ButtonGroupFieldSchema<GapOptions>, "options" | "type">>) => ButtonGroupFieldSchema<GapOptions>;
|
|
320
|
+
declare const getHeightField: (props: Readonly<Omit<CssUnitFieldSchema, "type">>) => CssUnitFieldSchema;
|
|
304
321
|
/**
|
|
305
322
|
* Gap value mapping - use `as const satisfies` for compile-time validation
|
|
306
323
|
* with literal type preservation.
|
|
@@ -314,4 +331,4 @@ declare const gapValues: {
|
|
|
314
331
|
readonly xl: 8;
|
|
315
332
|
};
|
|
316
333
|
|
|
317
|
-
export { type AlignmentFieldSchema, type BackgroundFieldSchema, type BooleanFieldSchema, type ButtonGroupFieldSchema, type ColorFieldSchema, type ColorPickerFieldSchema, type ColorSelectFieldSchema, type ContentPositionFieldSchema, type DataSourceFieldSchema, type ItemConfigSchema, type NumberFieldSchema, PROPERTY_FIELD_TYPES, type PropertyField, type PropertyFieldSchema, type PropertyFieldType, type PropertySchemaRegistry, type RangeFieldSchema, type ResourceFieldSchema, type SectionHeaderFieldSchema, type SectionLayoutSelectFieldSchema, type SelectFieldSchema, type SeparatorFieldSchema, type SliderFieldSchema, type TabConfig, type TextFieldSchema, type TextSizeSelectFieldSchema, type TextareaFieldSchema, type WidgetPropertySchema, applyPropertyValues, extractPropertyValues, gapValues, getBorderRadiusField, getButtonSizeField, getColorField, getFontSizeField, getGapField, getPaddingField, groupPropertyFields, isPropertyFieldType };
|
|
334
|
+
export { type AlignmentFieldSchema, type BackgroundFieldSchema, type BooleanFieldSchema, type ButtonGroupFieldSchema, type ColorFieldSchema, type ColorPickerFieldSchema, type ColorSelectFieldSchema, type ContentPositionFieldSchema, type CssUnit, type CssUnitFieldSchema, type DataSourceFieldSchema, type ItemConfigSchema, type NumberFieldSchema, PROPERTY_FIELD_TYPES, type PropertyField, type PropertyFieldSchema, type PropertyFieldType, type PropertySchemaRegistry, type RangeFieldSchema, type ResourceFieldSchema, type SectionHeaderFieldSchema, type SectionLayoutSelectFieldSchema, type SelectFieldSchema, type SeparatorFieldSchema, type SliderFieldSchema, type TabConfig, type TextFieldSchema, type TextSizeSelectFieldSchema, type TextareaFieldSchema, type WidgetPropertySchema, applyPropertyValues, extractPropertyValues, gapValues, getBorderRadiusField, getButtonSizeField, getColorField, getFontSizeField, getGapField, getHeightField, getPaddingField, groupPropertyFields, isPropertyFieldType };
|
package/dist/registries/index.js
CHANGED
|
@@ -21,7 +21,8 @@ var PROPERTY_FIELD_TYPES = {
|
|
|
21
21
|
sectionLayoutSelect: "sectionLayoutSelect",
|
|
22
22
|
background: "background",
|
|
23
23
|
contentPosition: "contentPosition",
|
|
24
|
-
textSizeSelect: "textSizeSelect"
|
|
24
|
+
textSizeSelect: "textSizeSelect",
|
|
25
|
+
cssUnit: "cssUnit"
|
|
25
26
|
};
|
|
26
27
|
function isPropertyFieldType(value) {
|
|
27
28
|
return Object.values(PROPERTY_FIELD_TYPES).includes(
|
|
@@ -122,6 +123,12 @@ var getGapField = (props) => {
|
|
|
122
123
|
]
|
|
123
124
|
};
|
|
124
125
|
};
|
|
126
|
+
var getHeightField = (props) => {
|
|
127
|
+
return {
|
|
128
|
+
...props,
|
|
129
|
+
type: "cssUnit"
|
|
130
|
+
};
|
|
131
|
+
};
|
|
125
132
|
var gapValues = {
|
|
126
133
|
none: 0,
|
|
127
134
|
xs: 1,
|
|
@@ -131,6 +138,6 @@ var gapValues = {
|
|
|
131
138
|
xl: 8
|
|
132
139
|
};
|
|
133
140
|
|
|
134
|
-
export { PROPERTY_FIELD_TYPES, applyPropertyValues, extractPropertyValues, gapValues, getBorderRadiusField, getButtonSizeField, getColorField, getFontSizeField, getGapField, getPaddingField, groupPropertyFields, isPropertyFieldType };
|
|
141
|
+
export { PROPERTY_FIELD_TYPES, applyPropertyValues, extractPropertyValues, gapValues, getBorderRadiusField, getButtonSizeField, getColorField, getFontSizeField, getGapField, getHeightField, getPaddingField, groupPropertyFields, isPropertyFieldType };
|
|
135
142
|
//# sourceMappingURL=index.js.map
|
|
136
143
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/registries/property-schema-types.ts","../../src/registries/field-helpers.ts"],"names":[],"mappings":"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","file":"index.js","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 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} 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<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 * 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 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 * 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 | AlignmentFieldSchema\n | SliderFieldSchema\n | ColorPickerFieldSchema\n | SectionHeaderFieldSchema\n | SeparatorFieldSchema\n | ButtonGroupFieldSchema<string | number>\n | ColorSelectFieldSchema\n | SectionLayoutSelectFieldSchema\n | BackgroundFieldSchema\n | ContentPositionFieldSchema\n | TextSizeSelectFieldSchema;\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 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\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"]}
|
|
1
|
+
{"version":3,"sources":["../../src/registries/property-schema-types.ts","../../src/registries/field-helpers.ts"],"names":[],"mappings":"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","file":"index.js","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 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<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 * 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 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 | 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"]}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
require('../chunk-
|
|
3
|
+
var chunkEMFSTGLP_cjs = require('../chunk-EMFSTGLP.cjs');
|
|
4
|
+
require('../chunk-M54NWBRO.cjs');
|
|
5
5
|
require('../chunk-5NYM4UTW.cjs');
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
Object.defineProperty(exports, "AppShellLayout", {
|
|
10
10
|
enumerable: true,
|
|
11
|
-
get: function () { return
|
|
11
|
+
get: function () { return chunkEMFSTGLP_cjs.AppShellLayout; }
|
|
12
12
|
});
|
|
13
13
|
//# sourceMappingURL=AppShellLayout.cjs.map
|
|
14
14
|
//# sourceMappingURL=AppShellLayout.cjs.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { AppShellLayout } from '../chunk-
|
|
2
|
-
import '../chunk-
|
|
1
|
+
export { AppShellLayout } from '../chunk-KZHNZ2NG.js';
|
|
2
|
+
import '../chunk-4NBPTMT4.js';
|
|
3
3
|
import '../chunk-HIDJYVKJ.js';
|
|
4
4
|
//# sourceMappingURL=AppShellLayout.js.map
|
|
5
5
|
//# sourceMappingURL=AppShellLayout.js.map
|
package/dist/shell/index.cjs
CHANGED
|
@@ -1,11 +1,76 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var chunkYXJMBVXO_cjs = require('../chunk-YXJMBVXO.cjs');
|
|
4
|
-
var
|
|
5
|
-
var
|
|
4
|
+
var chunkEMFSTGLP_cjs = require('../chunk-EMFSTGLP.cjs');
|
|
5
|
+
var chunkM54NWBRO_cjs = require('../chunk-M54NWBRO.cjs');
|
|
6
6
|
var chunk5NYM4UTW_cjs = require('../chunk-5NYM4UTW.cjs');
|
|
7
|
+
var reactFontawesome = require('@fortawesome/react-fontawesome');
|
|
8
|
+
var proRegularSvgIcons = require('@fortawesome/pro-regular-svg-icons');
|
|
9
|
+
var react = require('react');
|
|
10
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
7
11
|
|
|
8
|
-
|
|
12
|
+
var ScreenHeaderWriteContext = react.createContext(null);
|
|
13
|
+
var ScreenHeaderReadContext = react.createContext(null);
|
|
14
|
+
var ScreenHeaderBreadcrumbsWriteContext = react.createContext(null);
|
|
15
|
+
var ScreenHeaderBreadcrumbsReadContext = react.createContext(null);
|
|
16
|
+
function ScreenHeaderProvider({ children }) {
|
|
17
|
+
const [actions, setActions] = react.useState(null);
|
|
18
|
+
const [breadcrumbs, setBreadcrumbs] = react.useState(null);
|
|
19
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ScreenHeaderWriteContext.Provider, { value: setActions, children: /* @__PURE__ */ jsxRuntime.jsx(ScreenHeaderReadContext.Provider, { value: actions, children: /* @__PURE__ */ jsxRuntime.jsx(ScreenHeaderBreadcrumbsWriteContext.Provider, { value: setBreadcrumbs, children: /* @__PURE__ */ jsxRuntime.jsx(ScreenHeaderBreadcrumbsReadContext.Provider, { value: breadcrumbs, children }) }) }) });
|
|
20
|
+
}
|
|
21
|
+
function useScreenHeaderActions(actions) {
|
|
22
|
+
const setActions = react.useContext(ScreenHeaderWriteContext);
|
|
23
|
+
const setActionsRef = react.useRef(setActions);
|
|
24
|
+
setActionsRef.current = setActions;
|
|
25
|
+
react.useEffect(() => {
|
|
26
|
+
if (!setActions) return;
|
|
27
|
+
setActions(actions);
|
|
28
|
+
}, [actions, setActions]);
|
|
29
|
+
react.useEffect(() => {
|
|
30
|
+
return () => setActionsRef.current?.(null);
|
|
31
|
+
}, []);
|
|
32
|
+
return setActions !== null;
|
|
33
|
+
}
|
|
34
|
+
function useScreenHeaderBreadcrumbs(breadcrumbs) {
|
|
35
|
+
const setBreadcrumbs = react.useContext(ScreenHeaderBreadcrumbsWriteContext);
|
|
36
|
+
const setBreadcrumbsRef = react.useRef(setBreadcrumbs);
|
|
37
|
+
setBreadcrumbsRef.current = setBreadcrumbs;
|
|
38
|
+
react.useEffect(() => {
|
|
39
|
+
if (!setBreadcrumbs) return;
|
|
40
|
+
setBreadcrumbs(breadcrumbs);
|
|
41
|
+
}, [breadcrumbs, setBreadcrumbs]);
|
|
42
|
+
react.useEffect(() => {
|
|
43
|
+
return () => setBreadcrumbsRef.current?.(null);
|
|
44
|
+
}, []);
|
|
45
|
+
return setBreadcrumbs !== null;
|
|
46
|
+
}
|
|
47
|
+
function useScreenHeaderContext() {
|
|
48
|
+
const actions = react.useContext(ScreenHeaderReadContext);
|
|
49
|
+
const breadcrumbs = react.useContext(ScreenHeaderBreadcrumbsReadContext);
|
|
50
|
+
return { actions: actions ?? null, breadcrumbs: breadcrumbs ?? null };
|
|
51
|
+
}
|
|
52
|
+
function ScreenHeader({ title }) {
|
|
53
|
+
const { toggleSidebar, isMobile } = chunkM54NWBRO_cjs.useSidebar();
|
|
54
|
+
const { actions, breadcrumbs } = useScreenHeaderContext();
|
|
55
|
+
if (!title && !breadcrumbs) return null;
|
|
56
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sticky top-0 z-[15] flex flex-row items-center border-b border-border bg-background px-4 py-3 md:px-6", children: [
|
|
57
|
+
!isMobile && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
58
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
59
|
+
"button",
|
|
60
|
+
{
|
|
61
|
+
type: "button",
|
|
62
|
+
onClick: toggleSidebar,
|
|
63
|
+
className: "-ml-1 inline-flex items-center justify-center rounded-md p-1 text-muted-foreground hover:text-foreground",
|
|
64
|
+
"aria-label": "Toggle Sidebar",
|
|
65
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(reactFontawesome.FontAwesomeIcon, { icon: proRegularSvgIcons.faTableLayout, className: "size-4" })
|
|
66
|
+
}
|
|
67
|
+
),
|
|
68
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-2 h-4 w-px bg-border" })
|
|
69
|
+
] }),
|
|
70
|
+
breadcrumbs ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1", children: breadcrumbs }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-lg font-semibold text-foreground", children: title }),
|
|
71
|
+
actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ml-auto flex items-center gap-2", children: actions })
|
|
72
|
+
] });
|
|
73
|
+
}
|
|
9
74
|
|
|
10
75
|
Object.defineProperty(exports, "ThemeModeProvider", {
|
|
11
76
|
enumerable: true,
|
|
@@ -21,103 +86,103 @@ Object.defineProperty(exports, "useThemeMode", {
|
|
|
21
86
|
});
|
|
22
87
|
Object.defineProperty(exports, "AppShellLayout", {
|
|
23
88
|
enumerable: true,
|
|
24
|
-
get: function () { return
|
|
89
|
+
get: function () { return chunkEMFSTGLP_cjs.AppShellLayout; }
|
|
25
90
|
});
|
|
26
91
|
Object.defineProperty(exports, "Sidebar", {
|
|
27
92
|
enumerable: true,
|
|
28
|
-
get: function () { return
|
|
93
|
+
get: function () { return chunkM54NWBRO_cjs.Sidebar; }
|
|
29
94
|
});
|
|
30
95
|
Object.defineProperty(exports, "SidebarContent", {
|
|
31
96
|
enumerable: true,
|
|
32
|
-
get: function () { return
|
|
97
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarContent; }
|
|
33
98
|
});
|
|
34
99
|
Object.defineProperty(exports, "SidebarContext", {
|
|
35
100
|
enumerable: true,
|
|
36
|
-
get: function () { return
|
|
101
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarContext; }
|
|
37
102
|
});
|
|
38
103
|
Object.defineProperty(exports, "SidebarFooter", {
|
|
39
104
|
enumerable: true,
|
|
40
|
-
get: function () { return
|
|
105
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarFooter; }
|
|
41
106
|
});
|
|
42
107
|
Object.defineProperty(exports, "SidebarGroup", {
|
|
43
108
|
enumerable: true,
|
|
44
|
-
get: function () { return
|
|
109
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarGroup; }
|
|
45
110
|
});
|
|
46
111
|
Object.defineProperty(exports, "SidebarGroupAction", {
|
|
47
112
|
enumerable: true,
|
|
48
|
-
get: function () { return
|
|
113
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarGroupAction; }
|
|
49
114
|
});
|
|
50
115
|
Object.defineProperty(exports, "SidebarGroupContent", {
|
|
51
116
|
enumerable: true,
|
|
52
|
-
get: function () { return
|
|
117
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarGroupContent; }
|
|
53
118
|
});
|
|
54
119
|
Object.defineProperty(exports, "SidebarGroupLabel", {
|
|
55
120
|
enumerable: true,
|
|
56
|
-
get: function () { return
|
|
121
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarGroupLabel; }
|
|
57
122
|
});
|
|
58
123
|
Object.defineProperty(exports, "SidebarHeader", {
|
|
59
124
|
enumerable: true,
|
|
60
|
-
get: function () { return
|
|
125
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarHeader; }
|
|
61
126
|
});
|
|
62
127
|
Object.defineProperty(exports, "SidebarInput", {
|
|
63
128
|
enumerable: true,
|
|
64
|
-
get: function () { return
|
|
129
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarInput; }
|
|
65
130
|
});
|
|
66
131
|
Object.defineProperty(exports, "SidebarInset", {
|
|
67
132
|
enumerable: true,
|
|
68
|
-
get: function () { return
|
|
133
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarInset; }
|
|
69
134
|
});
|
|
70
135
|
Object.defineProperty(exports, "SidebarMenu", {
|
|
71
136
|
enumerable: true,
|
|
72
|
-
get: function () { return
|
|
137
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenu; }
|
|
73
138
|
});
|
|
74
139
|
Object.defineProperty(exports, "SidebarMenuAction", {
|
|
75
140
|
enumerable: true,
|
|
76
|
-
get: function () { return
|
|
141
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenuAction; }
|
|
77
142
|
});
|
|
78
143
|
Object.defineProperty(exports, "SidebarMenuBadge", {
|
|
79
144
|
enumerable: true,
|
|
80
|
-
get: function () { return
|
|
145
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenuBadge; }
|
|
81
146
|
});
|
|
82
147
|
Object.defineProperty(exports, "SidebarMenuButton", {
|
|
83
148
|
enumerable: true,
|
|
84
|
-
get: function () { return
|
|
149
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenuButton; }
|
|
85
150
|
});
|
|
86
151
|
Object.defineProperty(exports, "SidebarMenuItem", {
|
|
87
152
|
enumerable: true,
|
|
88
|
-
get: function () { return
|
|
153
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenuItem; }
|
|
89
154
|
});
|
|
90
155
|
Object.defineProperty(exports, "SidebarMenuSkeleton", {
|
|
91
156
|
enumerable: true,
|
|
92
|
-
get: function () { return
|
|
157
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenuSkeleton; }
|
|
93
158
|
});
|
|
94
159
|
Object.defineProperty(exports, "SidebarMenuSub", {
|
|
95
160
|
enumerable: true,
|
|
96
|
-
get: function () { return
|
|
161
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenuSub; }
|
|
97
162
|
});
|
|
98
163
|
Object.defineProperty(exports, "SidebarMenuSubButton", {
|
|
99
164
|
enumerable: true,
|
|
100
|
-
get: function () { return
|
|
165
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenuSubButton; }
|
|
101
166
|
});
|
|
102
167
|
Object.defineProperty(exports, "SidebarMenuSubItem", {
|
|
103
168
|
enumerable: true,
|
|
104
|
-
get: function () { return
|
|
169
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarMenuSubItem; }
|
|
105
170
|
});
|
|
106
171
|
Object.defineProperty(exports, "SidebarProvider", {
|
|
107
172
|
enumerable: true,
|
|
108
|
-
get: function () { return
|
|
173
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarProvider; }
|
|
109
174
|
});
|
|
110
175
|
Object.defineProperty(exports, "SidebarRail", {
|
|
111
176
|
enumerable: true,
|
|
112
|
-
get: function () { return
|
|
177
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarRail; }
|
|
113
178
|
});
|
|
114
179
|
Object.defineProperty(exports, "SidebarSeparator", {
|
|
115
180
|
enumerable: true,
|
|
116
|
-
get: function () { return
|
|
181
|
+
get: function () { return chunkM54NWBRO_cjs.SidebarSeparator; }
|
|
117
182
|
});
|
|
118
183
|
Object.defineProperty(exports, "useSidebar", {
|
|
119
184
|
enumerable: true,
|
|
120
|
-
get: function () { return
|
|
185
|
+
get: function () { return chunkM54NWBRO_cjs.useSidebar; }
|
|
121
186
|
});
|
|
122
187
|
Object.defineProperty(exports, "useIsMobile", {
|
|
123
188
|
enumerable: true,
|
|
@@ -131,5 +196,10 @@ Object.defineProperty(exports, "useIsTablet", {
|
|
|
131
196
|
enumerable: true,
|
|
132
197
|
get: function () { return chunk5NYM4UTW_cjs.useIsTablet; }
|
|
133
198
|
});
|
|
199
|
+
exports.ScreenHeader = ScreenHeader;
|
|
200
|
+
exports.ScreenHeaderProvider = ScreenHeaderProvider;
|
|
201
|
+
exports.useScreenHeaderActions = useScreenHeaderActions;
|
|
202
|
+
exports.useScreenHeaderBreadcrumbs = useScreenHeaderBreadcrumbs;
|
|
203
|
+
exports.useScreenHeaderContext = useScreenHeaderContext;
|
|
134
204
|
//# sourceMappingURL=index.cjs.map
|
|
135
205
|
//# sourceMappingURL=index.cjs.map
|
package/dist/shell/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs"}
|
|
1
|
+
{"version":3,"sources":["../../src/shell/ScreenHeaderContext.tsx","../../src/shell/ScreenHeader.tsx"],"names":["createContext","useState","jsx","useContext","useRef","useEffect","useSidebar","jsxs","Fragment","FontAwesomeIcon","faTableLayout"],"mappings":"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","file":"index.cjs","sourcesContent":["\"use client\";\n\nimport {\n createContext,\n useContext,\n useState,\n useEffect,\n useRef,\n type ReactNode,\n} from \"react\";\n\ntype SetActions = (actions: ReactNode) => void;\ntype SetBreadcrumbs = (breadcrumbs: ReactNode) => void;\n\n/**\n * Split into separate read/write contexts so that components calling\n * useScreenHeaderActions (writers) don't re-render when the actions\n * state changes — only the ScreenHeader (reader) re-renders.\n */\nconst ScreenHeaderWriteContext = createContext<SetActions | null>(null);\nconst ScreenHeaderReadContext = createContext<ReactNode>(null);\n\nconst ScreenHeaderBreadcrumbsWriteContext =\n createContext<SetBreadcrumbs | null>(null);\nconst ScreenHeaderBreadcrumbsReadContext = createContext<ReactNode>(null);\n\nexport function ScreenHeaderProvider({ children }: { children: ReactNode }) {\n const [actions, setActions] = useState<ReactNode>(null);\n const [breadcrumbs, setBreadcrumbs] = useState<ReactNode>(null);\n\n return (\n <ScreenHeaderWriteContext.Provider value={setActions}>\n <ScreenHeaderReadContext.Provider value={actions}>\n <ScreenHeaderBreadcrumbsWriteContext.Provider value={setBreadcrumbs}>\n <ScreenHeaderBreadcrumbsReadContext.Provider value={breadcrumbs}>\n {children}\n </ScreenHeaderBreadcrumbsReadContext.Provider>\n </ScreenHeaderBreadcrumbsWriteContext.Provider>\n </ScreenHeaderReadContext.Provider>\n </ScreenHeaderWriteContext.Provider>\n );\n}\n\n/**\n * Sets actions to display in the ScreenHeader.\n * Returns `true` if inside a ScreenHeaderProvider (i.e., in the rep shell),\n * `false` otherwise. Pages can use this boolean to conditionally skip\n * rendering their own PageHeader.\n *\n * Cleans up actions on unmount so navigating away doesn't leave stale actions.\n */\nexport function useScreenHeaderActions(actions: ReactNode): boolean {\n const setActions = useContext(ScreenHeaderWriteContext);\n const setActionsRef = useRef(setActions);\n setActionsRef.current = setActions;\n\n // Update actions when the value changes\n useEffect(() => {\n if (!setActions) return;\n setActions(actions);\n }, [actions, setActions]);\n\n // Clear actions only on unmount\n useEffect(() => {\n return () => setActionsRef.current?.(null);\n }, []);\n\n return setActions !== null;\n}\n\n/**\n * Sets breadcrumbs to display in the ScreenHeader (in place of the plain title).\n * Returns `true` if inside a ScreenHeaderProvider (i.e., in the rep shell),\n * `false` otherwise.\n *\n * Cleans up breadcrumbs on unmount so navigating away doesn't leave stale breadcrumbs.\n */\nexport function useScreenHeaderBreadcrumbs(breadcrumbs: ReactNode): boolean {\n const setBreadcrumbs = useContext(ScreenHeaderBreadcrumbsWriteContext);\n const setBreadcrumbsRef = useRef(setBreadcrumbs);\n setBreadcrumbsRef.current = setBreadcrumbs;\n\n // Update breadcrumbs when the value changes\n useEffect(() => {\n if (!setBreadcrumbs) return;\n setBreadcrumbs(breadcrumbs);\n }, [breadcrumbs, setBreadcrumbs]);\n\n // Clear breadcrumbs only on unmount\n useEffect(() => {\n return () => setBreadcrumbsRef.current?.(null);\n }, []);\n\n return setBreadcrumbs !== null;\n}\n\n/**\n * Reads the current screen header actions and breadcrumbs. Used internally by ScreenHeader.\n */\nexport function useScreenHeaderContext(): {\n actions: ReactNode;\n breadcrumbs: ReactNode;\n} {\n const actions = useContext(ScreenHeaderReadContext);\n const breadcrumbs = useContext(ScreenHeaderBreadcrumbsReadContext);\n return { actions: actions ?? null, breadcrumbs: breadcrumbs ?? null };\n}\n","\"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=\"sticky top-0 z-[15] flex flex-row items-center border-b border-border bg-background px-4 py-3 md:px-6\">\n {!isMobile && (\n <>\n <button\n type=\"button\"\n onClick={toggleSidebar}\n className=\"-ml-1 inline-flex items-center justify-center rounded-md p-1 text-muted-foreground hover:text-foreground\"\n aria-label=\"Toggle Sidebar\"\n >\n <FontAwesomeIcon icon={faTableLayout} className=\"size-4\" />\n </button>\n <div className=\"mx-2 h-4 w-px bg-border\" />\n </>\n )}\n {breadcrumbs ? (\n <div className=\"min-w-0 flex-1\">{breadcrumbs}</div>\n ) : (\n <h1 className=\"text-lg font-semibold text-foreground\">{title}</h1>\n )}\n {actions && (\n <div className=\"ml-auto flex items-center gap-2\">{actions}</div>\n )}\n </div>\n );\n}\n"]}
|
package/dist/shell/index.d.cts
CHANGED
|
@@ -1,8 +1,43 @@
|
|
|
1
1
|
export { AppShellLayout, AppShellLayoutProps } from './AppShellLayout.cjs';
|
|
2
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
3
|
export { Sidebar, SidebarContent, SidebarContext, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, useSidebar } from './sidebar.cjs';
|
|
3
4
|
export { DisplayMode, ThemeMode, ThemeModeContextValue, ThemeModeProvider, getThemeModeAttribute, useThemeMode } from './ThemeModeContext.cjs';
|
|
5
|
+
import { ReactNode } from 'react';
|
|
4
6
|
export { useIsMobile, useIsMobileOrTablet, useIsTablet } from './use-mobile.cjs';
|
|
5
|
-
import 'react/jsx-runtime';
|
|
6
|
-
import 'react';
|
|
7
7
|
import 'class-variance-authority/types';
|
|
8
8
|
import 'class-variance-authority';
|
|
9
|
+
|
|
10
|
+
interface ScreenHeaderProps {
|
|
11
|
+
title?: string;
|
|
12
|
+
}
|
|
13
|
+
declare function ScreenHeader({ title }: ScreenHeaderProps): react_jsx_runtime.JSX.Element | null;
|
|
14
|
+
|
|
15
|
+
declare function ScreenHeaderProvider({ children }: {
|
|
16
|
+
children: ReactNode;
|
|
17
|
+
}): react_jsx_runtime.JSX.Element;
|
|
18
|
+
/**
|
|
19
|
+
* Sets actions to display in the ScreenHeader.
|
|
20
|
+
* Returns `true` if inside a ScreenHeaderProvider (i.e., in the rep shell),
|
|
21
|
+
* `false` otherwise. Pages can use this boolean to conditionally skip
|
|
22
|
+
* rendering their own PageHeader.
|
|
23
|
+
*
|
|
24
|
+
* Cleans up actions on unmount so navigating away doesn't leave stale actions.
|
|
25
|
+
*/
|
|
26
|
+
declare function useScreenHeaderActions(actions: ReactNode): boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Sets breadcrumbs to display in the ScreenHeader (in place of the plain title).
|
|
29
|
+
* Returns `true` if inside a ScreenHeaderProvider (i.e., in the rep shell),
|
|
30
|
+
* `false` otherwise.
|
|
31
|
+
*
|
|
32
|
+
* Cleans up breadcrumbs on unmount so navigating away doesn't leave stale breadcrumbs.
|
|
33
|
+
*/
|
|
34
|
+
declare function useScreenHeaderBreadcrumbs(breadcrumbs: ReactNode): boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Reads the current screen header actions and breadcrumbs. Used internally by ScreenHeader.
|
|
37
|
+
*/
|
|
38
|
+
declare function useScreenHeaderContext(): {
|
|
39
|
+
actions: ReactNode;
|
|
40
|
+
breadcrumbs: ReactNode;
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
export { ScreenHeader, type ScreenHeaderProps, ScreenHeaderProvider, useScreenHeaderActions, useScreenHeaderBreadcrumbs, useScreenHeaderContext };
|
package/dist/shell/index.d.ts
CHANGED
|
@@ -1,8 +1,43 @@
|
|
|
1
1
|
export { AppShellLayout, AppShellLayoutProps } from './AppShellLayout.js';
|
|
2
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
3
|
export { Sidebar, SidebarContent, SidebarContext, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, useSidebar } from './sidebar.js';
|
|
3
4
|
export { DisplayMode, ThemeMode, ThemeModeContextValue, ThemeModeProvider, getThemeModeAttribute, useThemeMode } from './ThemeModeContext.js';
|
|
5
|
+
import { ReactNode } from 'react';
|
|
4
6
|
export { useIsMobile, useIsMobileOrTablet, useIsTablet } from './use-mobile.js';
|
|
5
|
-
import 'react/jsx-runtime';
|
|
6
|
-
import 'react';
|
|
7
7
|
import 'class-variance-authority/types';
|
|
8
8
|
import 'class-variance-authority';
|
|
9
|
+
|
|
10
|
+
interface ScreenHeaderProps {
|
|
11
|
+
title?: string;
|
|
12
|
+
}
|
|
13
|
+
declare function ScreenHeader({ title }: ScreenHeaderProps): react_jsx_runtime.JSX.Element | null;
|
|
14
|
+
|
|
15
|
+
declare function ScreenHeaderProvider({ children }: {
|
|
16
|
+
children: ReactNode;
|
|
17
|
+
}): react_jsx_runtime.JSX.Element;
|
|
18
|
+
/**
|
|
19
|
+
* Sets actions to display in the ScreenHeader.
|
|
20
|
+
* Returns `true` if inside a ScreenHeaderProvider (i.e., in the rep shell),
|
|
21
|
+
* `false` otherwise. Pages can use this boolean to conditionally skip
|
|
22
|
+
* rendering their own PageHeader.
|
|
23
|
+
*
|
|
24
|
+
* Cleans up actions on unmount so navigating away doesn't leave stale actions.
|
|
25
|
+
*/
|
|
26
|
+
declare function useScreenHeaderActions(actions: ReactNode): boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Sets breadcrumbs to display in the ScreenHeader (in place of the plain title).
|
|
29
|
+
* Returns `true` if inside a ScreenHeaderProvider (i.e., in the rep shell),
|
|
30
|
+
* `false` otherwise.
|
|
31
|
+
*
|
|
32
|
+
* Cleans up breadcrumbs on unmount so navigating away doesn't leave stale breadcrumbs.
|
|
33
|
+
*/
|
|
34
|
+
declare function useScreenHeaderBreadcrumbs(breadcrumbs: ReactNode): boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Reads the current screen header actions and breadcrumbs. Used internally by ScreenHeader.
|
|
37
|
+
*/
|
|
38
|
+
declare function useScreenHeaderContext(): {
|
|
39
|
+
actions: ReactNode;
|
|
40
|
+
breadcrumbs: ReactNode;
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
export { ScreenHeader, type ScreenHeaderProps, ScreenHeaderProvider, useScreenHeaderActions, useScreenHeaderBreadcrumbs, useScreenHeaderContext };
|
package/dist/shell/index.js
CHANGED
|
@@ -1,6 +1,76 @@
|
|
|
1
1
|
export { ThemeModeProvider, getThemeModeAttribute, useThemeMode } from '../chunk-2SPTFZRC.js';
|
|
2
|
-
export { AppShellLayout } from '../chunk-
|
|
3
|
-
|
|
2
|
+
export { AppShellLayout } from '../chunk-KZHNZ2NG.js';
|
|
3
|
+
import { useSidebar } from '../chunk-4NBPTMT4.js';
|
|
4
|
+
export { Sidebar, SidebarContent, SidebarContext, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, useSidebar } from '../chunk-4NBPTMT4.js';
|
|
4
5
|
export { useIsMobile, useIsMobileOrTablet, useIsTablet } from '../chunk-HIDJYVKJ.js';
|
|
6
|
+
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
7
|
+
import { faTableLayout } from '@fortawesome/pro-regular-svg-icons';
|
|
8
|
+
import { createContext, useState, useContext, useRef, useEffect } from 'react';
|
|
9
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
10
|
+
|
|
11
|
+
var ScreenHeaderWriteContext = createContext(null);
|
|
12
|
+
var ScreenHeaderReadContext = createContext(null);
|
|
13
|
+
var ScreenHeaderBreadcrumbsWriteContext = createContext(null);
|
|
14
|
+
var ScreenHeaderBreadcrumbsReadContext = createContext(null);
|
|
15
|
+
function ScreenHeaderProvider({ children }) {
|
|
16
|
+
const [actions, setActions] = useState(null);
|
|
17
|
+
const [breadcrumbs, setBreadcrumbs] = useState(null);
|
|
18
|
+
return /* @__PURE__ */ jsx(ScreenHeaderWriteContext.Provider, { value: setActions, children: /* @__PURE__ */ jsx(ScreenHeaderReadContext.Provider, { value: actions, children: /* @__PURE__ */ jsx(ScreenHeaderBreadcrumbsWriteContext.Provider, { value: setBreadcrumbs, children: /* @__PURE__ */ jsx(ScreenHeaderBreadcrumbsReadContext.Provider, { value: breadcrumbs, children }) }) }) });
|
|
19
|
+
}
|
|
20
|
+
function useScreenHeaderActions(actions) {
|
|
21
|
+
const setActions = useContext(ScreenHeaderWriteContext);
|
|
22
|
+
const setActionsRef = useRef(setActions);
|
|
23
|
+
setActionsRef.current = setActions;
|
|
24
|
+
useEffect(() => {
|
|
25
|
+
if (!setActions) return;
|
|
26
|
+
setActions(actions);
|
|
27
|
+
}, [actions, setActions]);
|
|
28
|
+
useEffect(() => {
|
|
29
|
+
return () => setActionsRef.current?.(null);
|
|
30
|
+
}, []);
|
|
31
|
+
return setActions !== null;
|
|
32
|
+
}
|
|
33
|
+
function useScreenHeaderBreadcrumbs(breadcrumbs) {
|
|
34
|
+
const setBreadcrumbs = useContext(ScreenHeaderBreadcrumbsWriteContext);
|
|
35
|
+
const setBreadcrumbsRef = useRef(setBreadcrumbs);
|
|
36
|
+
setBreadcrumbsRef.current = setBreadcrumbs;
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
if (!setBreadcrumbs) return;
|
|
39
|
+
setBreadcrumbs(breadcrumbs);
|
|
40
|
+
}, [breadcrumbs, setBreadcrumbs]);
|
|
41
|
+
useEffect(() => {
|
|
42
|
+
return () => setBreadcrumbsRef.current?.(null);
|
|
43
|
+
}, []);
|
|
44
|
+
return setBreadcrumbs !== null;
|
|
45
|
+
}
|
|
46
|
+
function useScreenHeaderContext() {
|
|
47
|
+
const actions = useContext(ScreenHeaderReadContext);
|
|
48
|
+
const breadcrumbs = useContext(ScreenHeaderBreadcrumbsReadContext);
|
|
49
|
+
return { actions: actions ?? null, breadcrumbs: breadcrumbs ?? null };
|
|
50
|
+
}
|
|
51
|
+
function ScreenHeader({ title }) {
|
|
52
|
+
const { toggleSidebar, isMobile } = useSidebar();
|
|
53
|
+
const { actions, breadcrumbs } = useScreenHeaderContext();
|
|
54
|
+
if (!title && !breadcrumbs) return null;
|
|
55
|
+
return /* @__PURE__ */ jsxs("div", { className: "sticky top-0 z-[15] flex flex-row items-center border-b border-border bg-background px-4 py-3 md:px-6", children: [
|
|
56
|
+
!isMobile && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
57
|
+
/* @__PURE__ */ jsx(
|
|
58
|
+
"button",
|
|
59
|
+
{
|
|
60
|
+
type: "button",
|
|
61
|
+
onClick: toggleSidebar,
|
|
62
|
+
className: "-ml-1 inline-flex items-center justify-center rounded-md p-1 text-muted-foreground hover:text-foreground",
|
|
63
|
+
"aria-label": "Toggle Sidebar",
|
|
64
|
+
children: /* @__PURE__ */ jsx(FontAwesomeIcon, { icon: faTableLayout, className: "size-4" })
|
|
65
|
+
}
|
|
66
|
+
),
|
|
67
|
+
/* @__PURE__ */ jsx("div", { className: "mx-2 h-4 w-px bg-border" })
|
|
68
|
+
] }),
|
|
69
|
+
breadcrumbs ? /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: breadcrumbs }) : /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold text-foreground", children: title }),
|
|
70
|
+
actions && /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center gap-2", children: actions })
|
|
71
|
+
] });
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
export { ScreenHeader, ScreenHeaderProvider, useScreenHeaderActions, useScreenHeaderBreadcrumbs, useScreenHeaderContext };
|
|
5
75
|
//# sourceMappingURL=index.js.map
|
|
6
76
|
//# sourceMappingURL=index.js.map
|