@ggui-ai/dev-stack 0.8.0 → 0.10.0

package/dist/hub-preview/client.js

@@ -63,26 +63,26 @@ var require_react_production = __commonJS({
     };
     var assign = Object.assign;
     var emptyObject = {};
-    function Component2(props, context, updater) {
+    function Component(props, context, updater) {
       this.props = props;
       this.context = context;
       this.refs = emptyObject;
       this.updater = updater || ReactNoopUpdateQueue;
     }
-    Component2.prototype.isReactComponent = {};
-    Component2.prototype.setState = function(partialState, callback) {
+    Component.prototype.isReactComponent = {};
+    Component.prototype.setState = function(partialState, callback) {
       if ("object" !== typeof partialState && "function" !== typeof partialState && null != partialState)
         throw Error(
           "takes an object of state variables to update or a function which returns an object of state variables."
         );
       this.updater.enqueueSetState(this, partialState, callback, "setState");
     };
-    Component2.prototype.forceUpdate = function(callback) {
+    Component.prototype.forceUpdate = function(callback) {
       this.updater.enqueueForceUpdate(this, callback, "forceUpdate");
     };
     function ComponentDummy() {
     }
-    ComponentDummy.prototype = Component2.prototype;
+    ComponentDummy.prototype = Component.prototype;
     function PureComponent(props, context, updater) {
       this.props = props;
       this.context = context;
@@ -91,7 +91,7 @@ var require_react_production = __commonJS({
     }
     var pureComponentPrototype = PureComponent.prototype = new ComponentDummy();
     pureComponentPrototype.constructor = PureComponent;
-    assign(pureComponentPrototype, Component2.prototype);
+    assign(pureComponentPrototype, Component.prototype);
     pureComponentPrototype.isPureReactComponent = true;
     var isArrayImpl = Array.isArray;
     function noop() {
@@ -296,7 +296,7 @@ var require_react_production = __commonJS({
     };
     exports.Activity = REACT_ACTIVITY_TYPE;
     exports.Children = Children;
-    exports.Component = Component2;
+    exports.Component = Component;
     exports.Fragment = REACT_FRAGMENT_TYPE;
     exports.Profiler = REACT_PROFILER_TYPE;
     exports.PureComponent = PureComponent;
@@ -2785,9 +2785,9 @@ var require_react_dom_client_production = __commonJS({
     function createFiberImplClass(tag, pendingProps, key, mode) {
       return new FiberNode(tag, pendingProps, key, mode);
     }
-    function shouldConstruct(Component2) {
-      Component2 = Component2.prototype;
-      return !(!Component2 || !Component2.isReactComponent);
+    function shouldConstruct(Component) {
+      Component = Component.prototype;
+      return !(!Component || !Component.isReactComponent);
     }
     function createWorkInProgress(current, pendingProps) {
       var workInProgress2 = current.alternate;
@@ -4157,7 +4157,7 @@ var require_react_dom_client_production = __commonJS({
         if (!objectIs(nextDeps[i], prevDeps[i])) return false;
       return true;
     }
-    function renderWithHooks(current, workInProgress2, Component2, props, secondArg, nextRenderLanes) {
+    function renderWithHooks(current, workInProgress2, Component, props, secondArg, nextRenderLanes) {
       renderLanes = nextRenderLanes;
       currentlyRenderingFiber = workInProgress2;
       workInProgress2.memoizedState = null;
@@ -4165,11 +4165,11 @@ var require_react_dom_client_production = __commonJS({
       workInProgress2.lanes = 0;
       ReactSharedInternals.H = null === current || null === current.memoizedState ? HooksDispatcherOnMount : HooksDispatcherOnUpdate;
       shouldDoubleInvokeUserFnsInHooksDEV = false;
-      nextRenderLanes = Component2(props, secondArg);
+      nextRenderLanes = Component(props, secondArg);
       shouldDoubleInvokeUserFnsInHooksDEV = false;
       didScheduleRenderPhaseUpdateDuringThisPass && (nextRenderLanes = renderWithHooksAgain(
         workInProgress2,
-        Component2,
+        Component,
         props,
         secondArg
       ));
@@ -4187,7 +4187,7 @@ var require_react_dom_client_production = __commonJS({
       if (didRenderTooFewHooks) throw Error(formatProdErrorMessage(300));
       null === current || didReceiveUpdate || (current = current.dependencies, null !== current && checkIfContextChanged(current) && (didReceiveUpdate = true));
     }
-    function renderWithHooksAgain(workInProgress2, Component2, props, secondArg) {
+    function renderWithHooksAgain(workInProgress2, Component, props, secondArg) {
       currentlyRenderingFiber = workInProgress2;
       var numberOfReRenders = 0;
       do {
@@ -4205,7 +4205,7 @@ var require_react_dom_client_production = __commonJS({
           null != children.memoCache && (children.memoCache.index = 0);
         }
         ReactSharedInternals.H = HooksDispatcherOnRerender;
-        children = Component2(props, secondArg);
+        children = Component(props, secondArg);
       } while (didScheduleRenderPhaseUpdateDuringThisPass);
       return children;
     }
@@ -5406,17 +5406,17 @@ var require_react_dom_client_production = __commonJS({
       "function" === typeof instance.UNSAFE_componentWillReceiveProps && instance.UNSAFE_componentWillReceiveProps(newProps, nextContext);
       instance.state !== workInProgress2 && classComponentUpdater.enqueueReplaceState(instance, instance.state, null);
     }
-    function resolveClassComponentProps(Component2, baseProps) {
+    function resolveClassComponentProps(Component, baseProps) {
       var newProps = baseProps;
       if ("ref" in baseProps) {
         newProps = {};
         for (var propName in baseProps)
           "ref" !== propName && (newProps[propName] = baseProps[propName]);
       }
-      if (Component2 = Component2.defaultProps) {
+      if (Component = Component.defaultProps) {
         newProps === baseProps && (newProps = assign({}, newProps));
-        for (var propName$73 in Component2)
-          void 0 === newProps[propName$73] && (newProps[propName$73] = Component2[propName$73]);
+        for (var propName$73 in Component)
+          void 0 === newProps[propName$73] && (newProps[propName$73] = Component[propName$73]);
       }
       return newProps;
     }
@@ -5560,8 +5560,8 @@ var require_react_dom_client_production = __commonJS({
         renderLanes2
       );
     }
-    function updateForwardRef(current, workInProgress2, Component2, nextProps, renderLanes2) {
-      Component2 = Component2.render;
+    function updateForwardRef(current, workInProgress2, Component, nextProps, renderLanes2) {
+      Component = Component.render;
       var ref = workInProgress2.ref;
       if ("ref" in nextProps) {
         var propsWithoutRef = {};
@@ -5572,7 +5572,7 @@ var require_react_dom_client_production = __commonJS({
       nextProps = renderWithHooks(
         current,
         workInProgress2,
-        Component2,
+        Component,
         propsWithoutRef,
         ref,
         renderLanes2
@@ -5585,10 +5585,10 @@ var require_react_dom_client_production = __commonJS({
       reconcileChildren(current, workInProgress2, nextProps, renderLanes2);
       return workInProgress2.child;
     }
-    function updateMemoComponent(current, workInProgress2, Component2, nextProps, renderLanes2) {
+    function updateMemoComponent(current, workInProgress2, Component, nextProps, renderLanes2) {
       if (null === current) {
-        var type = Component2.type;
-        if ("function" === typeof type && !shouldConstruct(type) && void 0 === type.defaultProps && null === Component2.compare)
+        var type = Component.type;
+        if ("function" === typeof type && !shouldConstruct(type) && void 0 === type.defaultProps && null === Component.compare)
           return workInProgress2.tag = 15, workInProgress2.type = type, updateSimpleMemoComponent(
             current,
             workInProgress2,
@@ -5597,7 +5597,7 @@ var require_react_dom_client_production = __commonJS({
             renderLanes2
           );
         current = createFiberFromTypeAndProps(
-          Component2.type,
+          Component.type,
           null,
           nextProps,
           workInProgress2,
@@ -5611,9 +5611,9 @@ var require_react_dom_client_production = __commonJS({
       type = current.child;
       if (!checkScheduledUpdateOrContext(current, renderLanes2)) {
         var prevProps = type.memoizedProps;
-        Component2 = Component2.compare;
-        Component2 = null !== Component2 ? Component2 : shallowEqual;
-        if (Component2(prevProps, nextProps) && current.ref === workInProgress2.ref)
+        Component = Component.compare;
+        Component = null !== Component ? Component : shallowEqual;
+        if (Component(prevProps, nextProps) && current.ref === workInProgress2.ref)
           return bailoutOnAlreadyFinishedWork(current, workInProgress2, renderLanes2);
       }
       workInProgress2.flags |= 1;
@@ -5622,7 +5622,7 @@ var require_react_dom_client_production = __commonJS({
       current.return = workInProgress2;
       return workInProgress2.child = current;
     }
-    function updateSimpleMemoComponent(current, workInProgress2, Component2, nextProps, renderLanes2) {
+    function updateSimpleMemoComponent(current, workInProgress2, Component, nextProps, renderLanes2) {
       if (null !== current) {
         var prevProps = current.memoizedProps;
         if (shallowEqual(prevProps, nextProps) && current.ref === workInProgress2.ref)
@@ -5634,7 +5634,7 @@ var require_react_dom_client_production = __commonJS({
       return updateFunctionComponent(
         current,
         workInProgress2,
-        Component2,
+        Component,
         nextProps,
         renderLanes2
       );
@@ -5794,12 +5794,12 @@ var require_react_dom_client_production = __commonJS({
           workInProgress2.flags |= 4194816;
       }
     }
-    function updateFunctionComponent(current, workInProgress2, Component2, nextProps, renderLanes2) {
+    function updateFunctionComponent(current, workInProgress2, Component, nextProps, renderLanes2) {
       prepareToReadContext(workInProgress2);
-      Component2 = renderWithHooks(
+      Component = renderWithHooks(
         current,
         workInProgress2,
-        Component2,
+        Component,
         nextProps,
         void 0,
         renderLanes2
@@ -5809,33 +5809,33 @@ var require_react_dom_client_production = __commonJS({
         return bailoutHooks(current, workInProgress2, renderLanes2), bailoutOnAlreadyFinishedWork(current, workInProgress2, renderLanes2);
       isHydrating && nextProps && pushMaterializedTreeId(workInProgress2);
       workInProgress2.flags |= 1;
-      reconcileChildren(current, workInProgress2, Component2, renderLanes2);
+      reconcileChildren(current, workInProgress2, Component, renderLanes2);
       return workInProgress2.child;
     }
-    function replayFunctionComponent(current, workInProgress2, nextProps, Component2, secondArg, renderLanes2) {
+    function replayFunctionComponent(current, workInProgress2, nextProps, Component, secondArg, renderLanes2) {
       prepareToReadContext(workInProgress2);
       workInProgress2.updateQueue = null;
       nextProps = renderWithHooksAgain(
         workInProgress2,
-        Component2,
+        Component,
         nextProps,
         secondArg
       );
       finishRenderingHooks(current);
-      Component2 = checkDidRenderIdHook();
+      Component = checkDidRenderIdHook();
       if (null !== current && !didReceiveUpdate)
         return bailoutHooks(current, workInProgress2, renderLanes2), bailoutOnAlreadyFinishedWork(current, workInProgress2, renderLanes2);
-      isHydrating && Component2 && pushMaterializedTreeId(workInProgress2);
+      isHydrating && Component && pushMaterializedTreeId(workInProgress2);
       workInProgress2.flags |= 1;
       reconcileChildren(current, workInProgress2, nextProps, renderLanes2);
       return workInProgress2.child;
     }
-    function updateClassComponent(current, workInProgress2, Component2, nextProps, renderLanes2) {
+    function updateClassComponent(current, workInProgress2, Component, nextProps, renderLanes2) {
       prepareToReadContext(workInProgress2);
       if (null === workInProgress2.stateNode) {
-        var context = emptyContextObject, contextType = Component2.contextType;
+        var context = emptyContextObject, contextType = Component.contextType;
         "object" === typeof contextType && null !== contextType && (context = readContext(contextType));
-        context = new Component2(nextProps, context);
+        context = new Component(nextProps, context);
         workInProgress2.memoizedState = null !== context.state && void 0 !== context.state ? context.state : null;
         context.updater = classComponentUpdater;
         workInProgress2.stateNode = context;
@@ -5845,27 +5845,27 @@ var require_react_dom_client_production = __commonJS({
         context.state = workInProgress2.memoizedState;
         context.refs = {};
         initializeUpdateQueue(workInProgress2);
-        contextType = Component2.contextType;
+        contextType = Component.contextType;
         context.context = "object" === typeof contextType && null !== contextType ? readContext(contextType) : emptyContextObject;
         context.state = workInProgress2.memoizedState;
-        contextType = Component2.getDerivedStateFromProps;
+        contextType = Component.getDerivedStateFromProps;
         "function" === typeof contextType && (applyDerivedStateFromProps(
           workInProgress2,
-          Component2,
+          Component,
           contextType,
           nextProps
         ), context.state = workInProgress2.memoizedState);
-        "function" === typeof Component2.getDerivedStateFromProps || "function" === typeof context.getSnapshotBeforeUpdate || "function" !== typeof context.UNSAFE_componentWillMount && "function" !== typeof context.componentWillMount || (contextType = context.state, "function" === typeof context.componentWillMount && context.componentWillMount(), "function" === typeof context.UNSAFE_componentWillMount && context.UNSAFE_componentWillMount(), contextType !== context.state && classComponentUpdater.enqueueReplaceState(context, context.state, null), processUpdateQueue(workInProgress2, nextProps, context, renderLanes2), suspendIfUpdateReadFromEntangledAsyncAction(), context.state = workInProgress2.memoizedState);
+        "function" === typeof Component.getDerivedStateFromProps || "function" === typeof context.getSnapshotBeforeUpdate || "function" !== typeof context.UNSAFE_componentWillMount && "function" !== typeof context.componentWillMount || (contextType = context.state, "function" === typeof context.componentWillMount && context.componentWillMount(), "function" === typeof context.UNSAFE_componentWillMount && context.UNSAFE_componentWillMount(), contextType !== context.state && classComponentUpdater.enqueueReplaceState(context, context.state, null), processUpdateQueue(workInProgress2, nextProps, context, renderLanes2), suspendIfUpdateReadFromEntangledAsyncAction(), context.state = workInProgress2.memoizedState);
         "function" === typeof context.componentDidMount && (workInProgress2.flags |= 4194308);
         nextProps = true;
       } else if (null === current) {
         context = workInProgress2.stateNode;
-        var unresolvedOldProps = workInProgress2.memoizedProps, oldProps = resolveClassComponentProps(Component2, unresolvedOldProps);
+        var unresolvedOldProps = workInProgress2.memoizedProps, oldProps = resolveClassComponentProps(Component, unresolvedOldProps);
         context.props = oldProps;
-        var oldContext = context.context, contextType$jscomp$0 = Component2.contextType;
+        var oldContext = context.context, contextType$jscomp$0 = Component.contextType;
         contextType = emptyContextObject;
         "object" === typeof contextType$jscomp$0 && null !== contextType$jscomp$0 && (contextType = readContext(contextType$jscomp$0));
-        var getDerivedStateFromProps = Component2.getDerivedStateFromProps;
+        var getDerivedStateFromProps = Component.getDerivedStateFromProps;
         contextType$jscomp$0 = "function" === typeof getDerivedStateFromProps || "function" === typeof context.getSnapshotBeforeUpdate;
         unresolvedOldProps = workInProgress2.pendingProps !== unresolvedOldProps;
         contextType$jscomp$0 || "function" !== typeof context.UNSAFE_componentWillReceiveProps && "function" !== typeof context.componentWillReceiveProps || (unresolvedOldProps || oldContext !== contextType) && callComponentWillReceiveProps(
@@ -5882,12 +5882,12 @@ var require_react_dom_client_production = __commonJS({
         oldContext = workInProgress2.memoizedState;
         unresolvedOldProps || oldState !== oldContext || hasForceUpdate ? ("function" === typeof getDerivedStateFromProps && (applyDerivedStateFromProps(
           workInProgress2,
-          Component2,
+          Component,
           getDerivedStateFromProps,
           nextProps
         ), oldContext = workInProgress2.memoizedState), (oldProps = hasForceUpdate || checkShouldComponentUpdate(
           workInProgress2,
-          Component2,
+          Component,
           oldProps,
           nextProps,
           oldState,
@@ -5898,14 +5898,14 @@ var require_react_dom_client_production = __commonJS({
         context = workInProgress2.stateNode;
         cloneUpdateQueue(current, workInProgress2);
         contextType = workInProgress2.memoizedProps;
-        contextType$jscomp$0 = resolveClassComponentProps(Component2, contextType);
+        contextType$jscomp$0 = resolveClassComponentProps(Component, contextType);
         context.props = contextType$jscomp$0;
         getDerivedStateFromProps = workInProgress2.pendingProps;
         oldState = context.context;
-        oldContext = Component2.contextType;
+        oldContext = Component.contextType;
         oldProps = emptyContextObject;
         "object" === typeof oldContext && null !== oldContext && (oldProps = readContext(oldContext));
-        unresolvedOldProps = Component2.getDerivedStateFromProps;
+        unresolvedOldProps = Component.getDerivedStateFromProps;
         (oldContext = "function" === typeof unresolvedOldProps || "function" === typeof context.getSnapshotBeforeUpdate) || "function" !== typeof context.UNSAFE_componentWillReceiveProps && "function" !== typeof context.componentWillReceiveProps || (contextType !== getDerivedStateFromProps || oldState !== oldProps) && callComponentWillReceiveProps(
           workInProgress2,
           context,
@@ -5920,12 +5920,12 @@ var require_react_dom_client_production = __commonJS({
         var newState = workInProgress2.memoizedState;
         contextType !== getDerivedStateFromProps || oldState !== newState || hasForceUpdate || null !== current && null !== current.dependencies && checkIfContextChanged(current.dependencies) ? ("function" === typeof unresolvedOldProps && (applyDerivedStateFromProps(
           workInProgress2,
-          Component2,
+          Component,
           unresolvedOldProps,
           nextProps
         ), newState = workInProgress2.memoizedState), (contextType$jscomp$0 = hasForceUpdate || checkShouldComponentUpdate(
           workInProgress2,
-          Component2,
+          Component,
           contextType$jscomp$0,
           nextProps,
           oldState,
@@ -5940,7 +5940,7 @@ var require_react_dom_client_production = __commonJS({
       context = nextProps;
       markRef(current, workInProgress2);
       nextProps = 0 !== (workInProgress2.flags & 128);
-      context || nextProps ? (context = workInProgress2.stateNode, Component2 = nextProps && "function" !== typeof Component2.getDerivedStateFromError ? null : context.render(), workInProgress2.flags |= 1, null !== current && nextProps ? (workInProgress2.child = reconcileChildFibers(
+      context || nextProps ? (context = workInProgress2.stateNode, Component = nextProps && "function" !== typeof Component.getDerivedStateFromError ? null : context.render(), workInProgress2.flags |= 1, null !== current && nextProps ? (workInProgress2.child = reconcileChildFibers(
         workInProgress2,
         current.child,
         null,
@@ -5948,9 +5948,9 @@ var require_react_dom_client_production = __commonJS({
       ), workInProgress2.child = reconcileChildFibers(
         workInProgress2,
         null,
-        Component2,
+        Component,
         renderLanes2
-      )) : reconcileChildren(current, workInProgress2, Component2, renderLanes2), workInProgress2.memoizedState = context.state, current = workInProgress2.child) : current = bailoutOnAlreadyFinishedWork(
+      )) : reconcileChildren(current, workInProgress2, Component, renderLanes2), workInProgress2.memoizedState = context.state, current = workInProgress2.child) : current = bailoutOnAlreadyFinishedWork(
         current,
         workInProgress2,
         renderLanes2
@@ -19674,15 +19674,18 @@ var require_jsx_runtime = __commonJS({
 });
 
 // hub-preview-client/main.tsx
-var import_react53 = __toESM(require_react(), 1);
+var import_react43 = __toESM(require_react(), 1);
 var import_client = __toESM(require_client(), 1);
 
-// ../ggui-react/dist/chunk-KUWOYNZT.mjs
-var import_react = __toESM(require_react(), 1);
-var import_react2 = __toESM(require_react(), 1);
+// ../mcp-apps-react/dist/chunk-7P6ASYW6.mjs
+var __defProp2 = Object.defineProperty;
+var __export2 = (target, all) => {
+  for (var name in all)
+    __defProp2(target, name, { get: all[name], enumerable: true });
+};
 
 // ../protocol/dist/version.js
-var PROTOCOL_VERSION = "draft-2026-06-12";
+var PROTOCOL_VERSION = "draft-2026-08-19";
 var PROTOCOL_SCHEMA_VERSION = PROTOCOL_VERSION;
 var CLIENT_SUPPORTED_VERSIONS = Object.freeze([
   PROTOCOL_SCHEMA_VERSION
@@ -34209,7 +34212,7 @@ config(en_default());
 
 // ../protocol/dist/gadgets/stdlib-gadgets.js
 var STDLIB_GADGETS_PACKAGE = "@ggui-ai/gadgets";
-var STDLIB_GADGETS_VERSION = "0.8.0";
+var STDLIB_GADGETS_VERSION = "0.10.0";
 var STDLIB_GADGETS = [
   {
     package: STDLIB_GADGETS_PACKAGE,
@@ -34360,15 +34363,24 @@ var jsonValueSchema = external_exports.lazy(() => external_exports.union([
   // surface as `undefined` at runtime which JSON.stringify drops.
   external_exports.record(external_exports.string(), jsonValueSchema)
 ]));
+var jsonSchemaTypeNameSchema = external_exports.enum([
+  "string",
+  "number",
+  "integer",
+  "boolean",
+  "array",
+  "object",
+  "null"
+]);
 var jsonSchemaSchema = external_exports.lazy(() => external_exports.object({
-  type: external_exports.enum([
-    "string",
-    "number",
-    "integer",
-    "boolean",
-    "array",
-    "object",
-    "null"
+  // Single type OR a draft-07 type array (`['string','null']` —
+  // the canonical nullability form the enforced-props-schema
+  // emission produces). Mirrors `JsonSchemaTypeName | JsonSchemaTypeName[]`
+  // on the TS type — the zod and TS sides are an SSoT pair; widen
+  // both or neither.
+  type: external_exports.union([
+    jsonSchemaTypeNameSchema,
+    external_exports.array(jsonSchemaTypeNameSchema)
   ]).optional(),
   description: external_exports.string().optional(),
   enum: external_exports.array(jsonValueSchema).optional(),
@@ -34536,12 +34548,12 @@ var clientCapabilitiesSpecSchema = external_exports.object({
 }).strict();
 var appPublicEnvSchema = external_exports.record(external_exports.string().regex(PUBLIC_ENV_APP_KEY_RE), external_exports.string()).readonly();
 var dataContractSchema = external_exports.object({
-  propsSpec: propsSpecSchema.optional(),
-  actionSpec: actionSpecSchema.optional(),
-  streamSpec: streamSpecSchema.optional(),
-  contextSpec: contextSpecSchema.optional(),
-  agentCapabilities: agentCapabilitiesSpecSchema.optional(),
-  clientCapabilities: clientCapabilitiesSpecSchema.optional()
+  propsSpec: propsSpecSchema.optional().describe("Initial render data: {description?, properties: {<name>: {schema: <JSON Schema>, required?: boolean, description?, default?, example?}}}. A prop is required at the wire gate ONLY when `required: true`; omitted \u21D2 optional (declare `required: true` for props the render must always pass)."),
+  actionSpec: actionSpecSchema.optional().describe("User gestures the agent reacts to on its next turn: {<action>: {label: string (REQUIRED \u2014 button copy / accessible name), schema?: <payload JSON Schema>, description?, example?, icon?, confirm?, nextStep?: '<agentCapabilities.tools key>'}}. Every action is agent-routed; `nextStep` is a hint, not a dispatch."),
+  streamSpec: streamSpecSchema.optional().describe("Live update channels the agent emits into: {<channel>: {schema: <JSON Schema>, description?, example?, mode?: append|replace, replay?: latest|all|none, complete?, source?: {tool, args?}}}. `source.tool` must be declared in agentCapabilities.tools."),
+  contextSpec: contextSpecSchema.optional().describe("Observable client state the agent reads alongside each action: {<slot>: {schema: <JSON Schema>, description?, default?, debounceMs?, example?}}. State that needs no next-turn reasoning belongs here, not in actionSpec."),
+  agentCapabilities: agentCapabilitiesSpecSchema.optional().describe("MCP tools the AGENT may call: {tools: {<bareToolName>: {toolInfo: {inputSchema (REQUIRED), description?, outputSchema?}, serverInfo?: {name, version?}, usage?, example?: {input, output}}}}. Key by the BARE tool name (after any `mcp__<server>__` prefix); the component never calls these."),
+  clientCapabilities: clientCapabilitiesSpecSchema.optional().describe("Browser-capability gadgets the COMPONENT imports: {gadgets: {<npm package>: {<exportName>: {description?, usage?}}}} \u2014 `use`-prefixed export keys are hooks, PascalCase keys are components; version and transport resolve from the app's registered catalog, never on the wire.")
 }).passthrough();
 
 // ../protocol/dist/schemas/blueprint.js
@@ -34557,11 +34569,17 @@ var blueprintSourceSchema = external_exports.union([
   userBlueprintSourceSchema,
   curatedBlueprintSourceSchema
 ]);
+var BLUEPRINT_VARIANCE_KEYS = ["persona", "aesthetic", "context", "seedPrompt"];
 var blueprintVarianceSchema = external_exports.object({
   persona: external_exports.string().optional().describe('Design persona, e.g. "minimalist" / "data-dense". Part of cache identity.'),
   aesthetic: external_exports.string().optional().describe('Visual aesthetic, e.g. "calm" / "ornate". Part of cache identity.'),
   context: external_exports.record(external_exports.string(), jsonValueSchema).optional().describe('Deliberate design-shaping signals (e.g. {situation:"sad"}) \u2014 part of cache identity. NOT for per-user runtime data; put that in propsSpec/contextSpec.'),
   seedPrompt: external_exports.string().optional().describe("Generation seed directive. Part of cache identity.")
+}, {
+  // A rejection that teaches (ggui#523 item 2): the first live guest
+  // turn sent `mood` and got a bare "Unrecognized key" — name the
+  // legal set and where the misplaced intent belongs.
+  error: (issue2) => issue2.code === "unrecognized_keys" ? `variance: unknown key(s) ${issue2.keys.map((k) => JSON.stringify(k)).join(", ")} \u2014 variance is EXACTLY {${BLUEPRINT_VARIANCE_KEYS.join(", ")}}; put tonal intent in \`aesthetic\`, and per-user runtime data in props / contextSpec, never in variance` : void 0
 }).strict();
 var blueprintSchema = external_exports.object({
   blueprintId: external_exports.string().min(1),
@@ -34622,15 +34640,17 @@ var jsonPatchOpSchema = external_exports.union([
   }).strict()
 ]);
 var jsonPatchSchema = external_exports.array(jsonPatchOpSchema);
+var BLUEPRINT_DRAFT_KEYS = ["contract", "variance", "generator"];
 var blueprintDraftObjectSchema = external_exports.object({
   contract: dataContractSchema,
-  variance: external_exports.object({
-    persona: external_exports.string().optional(),
-    aesthetic: external_exports.string().optional(),
-    context: external_exports.record(external_exports.string(), jsonValueSchema).optional(),
-    seedPrompt: external_exports.string().optional()
-  }).strict().optional(),
+  // ONE declaration of the variance shape, protocol-wide: the same
+  // schema (with its `.describe()` teaching and its legal-set
+  // rejection message) that `blueprintMeta.variance` projects on the
+  // way back out (ggui#523 item 1 — the mirror-of-a-mirror is gone).
+  variance: blueprintVarianceSchema.optional(),
   generator: external_exports.string().optional()
+}, {
+  error: (issue2) => issue2.code === "unrecognized_keys" ? `blueprintDraft: unknown key(s) ${issue2.keys.map((k) => JSON.stringify(k)).join(", ")} \u2014 a draft is EXACTLY {${BLUEPRINT_DRAFT_KEYS.join(", ")}}; \`intent\` is a top-level ggui_handshake field, not a draft field, and the four specs live INSIDE \`contract\`` : void 0
 }).strict();
 var blueprintDraftSchema = blueprintDraftObjectSchema;
 var blueprintMetaSchema = external_exports.object({
@@ -34692,6 +34712,10 @@ var getSessionInputShape = {
   sessionId: external_exports.string().min(1).describe("GguiSession opaque id (UUID) \u2014 returned by ggui_render.")
 };
 var getSessionInputSchema = external_exports.object(getSessionInputShape);
+var getRenderSourceInputShape = {
+  sessionId: external_exports.string().min(1).describe("GguiSession opaque id (UUID) \u2014 returned by ggui_render.")
+};
+var getRenderSourceInputSchema = external_exports.object(getRenderSourceInputShape);
 var listFeaturedBlueprintsInputShape = {};
 var listFeaturedBlueprintsInputSchema = external_exports.object(listFeaturedBlueprintsInputShape);
 var searchBlueprintsInputShape = {
@@ -34726,7 +34750,7 @@ var handshakeInputSchema = external_exports.object({
    * and the contract validators; variance feeds the variance axis
    * and rides through to the suggestion's `blueprintMeta`.
    */
-  blueprintDraft: blueprintDraftSchema.describe("Agent's draft: contract (required) + optional variance + optional generator slug hint. The server combines this with cached blueprints + validator outcomes to produce a three-mode suggestion (cache / agent / synth)."),
+  blueprintDraft: blueprintDraftSchema.describe(`Agent's draft \u2014 a JSON OBJECT, never a JSON-encoded string (pass {contract: {...}}, not "{\\"contract\\":...}"; a string fails input validation with -32602). Fields: contract (required) + optional variance + optional generator slug hint. The server combines this with cached blueprints + validator outcomes to produce a three-mode suggestion (cache / agent / synth).`),
   /**
    * Skip blueprint-search on step-2 and route straight to validation
    * + (if validation passes) agent-mode suggestion against the draft.
@@ -34826,10 +34850,11 @@ var renderErrorCodeSchema = external_exports.enum([
   "PRODUCTION_FAILED",
   "VALIDATION_ERROR",
   "NO_PLATFORM_KEY",
-  "NO_CREDENTIALS"
+  "NO_CREDENTIALS",
+  "GENERATION_QUEUE_OVERLOADED"
 ]);
 var renderErrorSchema = external_exports.object({
-  code: renderErrorCodeSchema.describe("Canonical failure class. PRODUCTION_FAILED: generation did not produce a component. VALIDATION_ERROR: a server-side precondition rejected the render before generation. NO_PLATFORM_KEY: the server's managed provider-key configuration has no key for the resolved route. NO_CREDENTIALS: no generation credentials are configured on the server."),
+  code: renderErrorCodeSchema.describe("Canonical failure class. PRODUCTION_FAILED: generation did not produce a component. VALIDATION_ERROR: a server-side precondition rejected the render before generation. NO_PLATFORM_KEY: the server's managed provider-key configuration has no key for the resolved route. NO_CREDENTIALS: no generation credentials are configured on the server. GENERATION_QUEUE_OVERLOADED: the deployment's admission gate rejected the request before generation started (queue full or wait timed out) \u2014 not a failed attempt; safe to retry immediately."),
   message: external_exports.string().describe("Human-readable failure detail \u2014 fold into the next attempt or surface to the operator.")
 });
 var resourceReadErrorCodeSchema = external_exports.enum([
@@ -34887,33 +34912,78 @@ var renderOutputSchema = external_exports.object({
     description: external_exports.string(),
     example: external_exports.string(),
     args: external_exports.object({
-      sessionId: external_exports.string()
+      sessionId: external_exports.string(),
+      // The per-call long-poll window in seconds. Carried on the hint
+      // because consume's own default is 0 (single non-blocking
+      // drain): an agent copying a timeout-less hint gets an instant
+      // empty result and stops looping.
+      timeout: external_exports.number()
     })
-  }).optional().describe("Recovery hint \u2014 when the rendered contract has actions, points the agent at ggui_consume({sessionId}) for the inbound action loop. Absent for pure-display renders.")
+  }).optional().describe("Required-next-call hint \u2014 when the rendered contract has actions, points the agent at ggui_consume({sessionId, timeout}) for the inbound action loop. Absent for pure-display renders.")
 });
 var updateInputSchema = external_exports.discriminatedUnion("kind", [
   external_exports.object({
     sessionId: external_exports.string().describe("GguiSession opaque id (UUID) \u2014 returned by ggui_render."),
     kind: external_exports.literal("replace"),
-    props: external_exports.record(external_exports.string(), external_exports.unknown()).describe("Full replacement props map. New map IS the new state.")
+    props: external_exports.record(external_exports.string(), external_exports.unknown()).describe("Full replacement props map. New map IS the new state, rendered as a NEW card (a new history entry). For an in-place repaint of the mounted card use ggui_amend.")
+  }).strict(),
+  external_exports.object({
+    sessionId: external_exports.string().describe("GguiSession opaque id (UUID) \u2014 returned by ggui_render."),
+    kind: external_exports.literal("merge"),
+    patch: external_exports.record(external_exports.string(), external_exports.unknown()).describe("RFC 7396 JSON Merge Patch \u2014 null deletes a key; arrays fully replace. The merged state renders as a NEW card (a new history entry). For an in-place repaint of the mounted card use ggui_amend.")
+  }).strict()
+]);
+var amendInputSchema = external_exports.discriminatedUnion("kind", [
+  external_exports.object({
+    sessionId: external_exports.string().describe("GguiSession opaque id (UUID) \u2014 returned by ggui_render."),
+    kind: external_exports.literal("replace"),
+    props: external_exports.record(external_exports.string(), external_exports.unknown()).describe("Full replacement props map, applied to the currently mounted card in place.")
   }).strict(),
   external_exports.object({
     sessionId: external_exports.string().describe("GguiSession opaque id (UUID) \u2014 returned by ggui_render."),
     kind: external_exports.literal("merge"),
-    patch: external_exports.record(external_exports.string(), external_exports.unknown()).describe("RFC 7396 JSON Merge Patch \u2014 null deletes a key; arrays fully replace.")
+    patch: external_exports.record(external_exports.string(), external_exports.unknown()).describe("RFC 7396 JSON Merge Patch \u2014 null deletes a key; arrays fully replace. Applied to the currently mounted card in place.")
   }).strict()
 ]);
 var updateOutputSchema = external_exports.object({
   sessionId: external_exports.string(),
   updated: external_exports.boolean(),
   /**
-   * Unchanged from the initial render — the same `ui://ggui/render/{id}`
-   * URI the mount stamped. Mirrored on the LLM-visible structuredContent
-   * so SDKs that strip `_meta` from tool_results can still reach the
+   * The epoch-pinned URI of the NEW history record this update minted
+   * (`ui://ggui/render/{id}[/{key}]#{epoch}` — see epoch-uri.ts). On a
+   * no-op (`updated: false`) no record is minted and this is the bare
+   * live-head URI. Mirrored on the LLM-visible structuredContent so
+   * SDKs that strip `_meta` from tool_results can still reach the
    * mount URI. Kept in sync with the update handler's wire shape —
    * this export and the handler's inline schema must not drift.
    */
-  resourceUri: external_exports.string()
+  resourceUri: external_exports.string(),
+  /**
+   * The session's head epoch after this call: advanced by one on a
+   * real update (`updated: true`), unchanged on a no-op. `ggui_render`
+   * mints epoch 0. The session ROW is the authority
+   * (`GguiSessionBase.epoch`, absent ⇒ 0); the ledger's `ui.reminted`
+   * events are the wire signal only — the ledger is horizon-bounded
+   * and must never be counted as the source of truth.
+   */
+  epoch: external_exports.number().int().min(0),
+  /**
+   * Present ONLY on a no-op (`updated: false`): the patch conformed to
+   * the contract but left the final props semantically identical to
+   * the current state, so nothing was written, nothing changes on
+   * screen, and NO new history record was minted. Model-visible by
+   * design — the common producer of a no-op is an agent echoing
+   * existing props back believing it changed the UI, and this field is
+   * its feedback channel.
+   */
+  warning: external_exports.string().optional()
+});
+var amendOutputSchema = external_exports.object({
+  sessionId: external_exports.string(),
+  updated: external_exports.boolean(),
+  resourceUri: external_exports.string(),
+  /** Same no-op feedback channel as ggui_update's `warning`. */
+  warning: external_exports.string().optional()
 });
 var declareToolCatalogInputSchema = external_exports.object({
   toolCatalog: external_exports.record(external_exports.string(), external_exports.object({ name: external_exports.string(), version: external_exports.string().optional() }).strict()).describe("Per-app canonical tool identities: bare tool name -> its server's initialize-declared serverInfo. Host/library-supplied; not an agent action.")
@@ -34922,6 +34992,45 @@ var declareToolCatalogOutputSchema = external_exports.object({
   saved: external_exports.boolean(),
   appId: external_exports.string()
 }).strict();
+var RUNTIME_PULL_MAX_LIMIT = 100;
+var RUNTIME_PULL_MAX_WAIT_SECONDS = 20;
+var gguiSessionEventSchema = external_exports.object({
+  seq: external_exports.number().int().min(1).describe('Monotonic, gap-free per render; starts at 1 (0 is the "no events yet" cursor sentinel, never an event).'),
+  type: external_exports.string().min(1).describe("Wire-frame type \u2014 see the canonical GguiSessionEventType taxonomy; plain string so servers can mint new types without a protocol bump."),
+  timestamp: external_exports.string().describe("ISO 8601 UTC timestamp the server stamped on emission."),
+  data: external_exports.unknown().describe("Type-specific payload \u2014 structurally identical to the matching live-channel frame payload.")
+});
+var runtimePullInputShape = {
+  sessionId: external_exports.string().min(1).describe('Active render id \u2014 sourced from `_meta["ai.ggui/render"].sessionId` on the iframe boot envelope. Unknown and cross-tenant ids surface uniformly as session_not_found.'),
+  sinceSequence: external_exports.number().int().min(0).optional().describe("Replay cursor \u2014 only events with seq > sinceSequence return. Omit (= 0) on first pull; advance to the last event's seq (or lastSequence on an empty page) on every subsequent pull."),
+  limit: external_exports.number().int().min(1).optional().describe(`Max events per page. Values above ${RUNTIME_PULL_MAX_LIMIT} are clamped to ${RUNTIME_PULL_MAX_LIMIT}; omit for the default ${RUNTIME_PULL_MAX_LIMIT}. When hasMore is true, immediately re-pull with the advanced cursor.`),
+  wait: external_exports.number().min(0).optional().describe(`Subscription-mode hold, in seconds. When set and the cursor page is empty, the server holds this call until an event lands or the hold elapses (values above ${RUNTIME_PULL_MAX_WAIT_SECONDS} are clamped to ${RUNTIME_PULL_MAX_WAIT_SECONDS}). An empty page after a full hold is a NORMAL result \u2014 immediately re-pull to stay subscribed, or back off to sparse un-held pulls after a few consecutive empties. Omit (= 0) for an immediate return.`)
+};
+var runtimePullInputSchema = external_exports.object(runtimePullInputShape);
+var runtimePullEventsPageSchema = external_exports.object({
+  events: external_exports.array(gguiSessionEventSchema),
+  lastSequence: external_exports.number().int().min(0),
+  hasMore: external_exports.boolean()
+});
+var runtimePullHorizonSchema = external_exports.object({
+  reason: external_exports.literal("REPLAY_HORIZON_PASSED"),
+  currentSequence: external_exports.number().int().min(0)
+});
+var runtimePullOutputSchema = external_exports.union([
+  runtimePullEventsPageSchema,
+  runtimePullHorizonSchema
+]);
+var RUNTIME_TELEMETRY_MAX_EVENTS = 40;
+var runtimeTelemetryInputShape = {
+  sessionId: external_exports.string().min(1).describe("Render id the report concerns \u2014 sourced from the boot envelope. Client-claimed: used as a log tag only."),
+  events: external_exports.array(external_exports.object({
+    at: external_exports.number().min(0).describe("Milliseconds since iframe boot (monotonic, client clock)."),
+    kind: external_exports.string().min(1).max(64).describe("Event name \u2014 e.g. 'boot.path', 'status.connected', 'channel_failover_swap', 'doorbell.ring'."),
+    detail: external_exports.string().max(512).optional().describe("Optional compact context (JSON fragment or message).")
+  })).min(1).max(RUNTIME_TELEMETRY_MAX_EVENTS).describe("Batched ladder/doorbell events, oldest first.")
+};
+var runtimeTelemetryInputSchema = external_exports.object(runtimeTelemetryInputShape);
+var runtimeTelemetryOutputSchema = external_exports.object({ ok: external_exports.literal(true) });
 
 // ../protocol/dist/schemas/invoke.js
 var textBlockSchema = external_exports.object({
@@ -35047,87 +35156,13 @@ var appThemeSchema = external_exports.object({
 // ../protocol/dist/registry/canonicalize-contract.js
 var import_canonicalize = __toESM(require_canonicalize(), 1);
 
+// ../protocol/dist/validation/enforced-props-schema.js
+var import_canonicalize2 = __toESM(require_canonicalize(), 1);
+
 // ../protocol/dist/types/data-contract.js
 var CONTEXT_SLOT_VALUE_MAX_BYTES = 16 * 1024;
 var CONTEXT_SNAPSHOT_MAX_BYTES = 64 * 1024;
 
-// ../protocol/dist/schemas/ops-blueprint.js
-var opsGenerateBlueprintInputSchema = external_exports.object({
-  contract: dataContractSchema,
-  generator: external_exports.string().min(1).optional().describe("Generator slug (e.g. `ui-gen-default-haiku-4-5`). When omitted, dispatches through `GeneratorRegistry.defaultGenerator()`."),
-  persona: external_exports.string().optional().describe("Free-form persona tag (e.g. 'minimalist', 'data-dense'). Normalized via lowercase+trim before persistence; logged as a warning when within Levenshtein distance < 2 of an existing tag for the same appId."),
-  aesthetic: external_exports.string().optional().describe("Free-form aesthetic tag (e.g. 'glassmorphic', 'brutalist', 'editorial'). Persisted on `Blueprint.variance.aesthetic`. Distinct from persona \u2014 persona names the user mental model; aesthetic names the visual treatment."),
-  context: external_exports.record(external_exports.string(), jsonValueSchema).optional().describe("Small structured signal carried alongside the persona. Persisted on `Blueprint.variance.context`."),
-  seedPrompt: external_exports.string().optional().describe("The raw operator prompt that produced this variant. Round-trip input for the variant-selector + audit trail."),
-  setAsOperatorDefault: external_exports.boolean().optional().describe("When true, pins the new blueprint as the operator default for its `(appId, contractHash)` group, clearing any prior default in the same group.")
-}).strict();
-var opsGenerateBlueprintOutputSchema = external_exports.object({
-  blueprintId: external_exports.string().min(1),
-  codeHash: external_exports.string().optional().describe("Content hash of the generated code body. Absent when the generator returned a non-`ok` result and persistence skipped \u2014 the failure mode is surfaced through generator-level error reporting elsewhere."),
-  validatorScore: external_exports.number().min(0).max(1).optional().describe("Advanced generator's iterative-loop validator score (0-1). Absent for default-generator output."),
-  source: llmBlueprintSourceSchema.describe("Provenance stamped on the persisted `Blueprint.source` \u2014 always the `llm` arm on this path: `generator` is the engine slug the dispatch resolved to (stamped from the engine's own metadata claim); `model` is the LLM model id the engine called.")
-}).strict();
-var opsRegisterBlueprintInputSchema = external_exports.object({
-  contract: dataContractSchema,
-  componentCode: external_exports.string().min(1).describe("Verbatim component-code body to persist. Stored as-is \u2014 no LLM call, no validator pass. Operator owns correctness; the handler computes the canonical sha256 codeHash and routes the bytes through the same persistence seams as `*_generate_*`."),
-  persona: external_exports.string().optional().describe("Free-form persona tag (e.g. 'minimalist', 'data-dense'). Normalized via lowercase+trim before persistence; logged as a warning when within Levenshtein distance < 2 of an existing tag for the same appId."),
-  aesthetic: external_exports.string().optional().describe("Free-form aesthetic tag. Persisted on `Blueprint.variance.aesthetic`."),
-  context: external_exports.record(external_exports.string(), jsonValueSchema).optional().describe("Small structured signal carried alongside the persona. Persisted on `Blueprint.variance.context`."),
-  seedPrompt: external_exports.string().optional().describe("Optional originating prompt for audit + round-tripping (e.g. the prose the operator originally fed into `*_generate_*` before exporting)."),
-  setAsOperatorDefault: external_exports.boolean().optional().describe("When true, pins the new blueprint as the operator default for its `(appId, contractHash)` group, clearing any prior default in the same group.")
-}).strict();
-var opsRegisterBlueprintOutputSchema = external_exports.object({
-  blueprintId: external_exports.string().min(1),
-  codeHash: external_exports.string().min(1).describe("Content hash of the persisted code body (full sha256 hex)."),
-  source: userBlueprintSourceSchema.describe('Provenance stamped on the persisted `Blueprint.source` \u2014 always `{kind: "user"}` on this path: operator-supplied bytes, no LLM dispatch, no engine claim to record.')
-}).strict();
-var opsListBlueprintsInputSchema = external_exports.object({
-  contractHash: external_exports.string().min(1).optional().describe("Filter to a single `(appId, contractHash)` group. Combine with `generator` / `persona` to narrow within the group."),
-  generator: external_exports.string().min(1).optional().describe('Filter to engine-generated blueprints (`source.kind === "llm"`) whose `source.generator` equals this slug. `user`-sourced rows never match (they carry no engine provenance).'),
-  persona: external_exports.string().optional().describe("Filter on `variance.persona`. Normalized to match persisted form (lowercase+trim)."),
-  intentKeywords: external_exports.array(external_exports.string().min(1)).optional().describe("Semantic-search tokens. When set, dispatches through `BlueprintSearch.search()` rather than indexed `list()`.")
-}).strict();
-var opsListBlueprintsOutputSchema = external_exports.object({
-  blueprints: external_exports.array(blueprintSchema)
-}).strict();
-var opsUpdateBlueprintInputSchema = external_exports.object({
-  blueprintId: external_exports.string().min(1),
-  isOperatorDefault: external_exports.literal(true).optional().describe("When `true`, pins this blueprint as the operator default for its `(appId, contractHash)` group. Clears any prior default. Cannot set to `false` \u2014 to unpin, set another blueprint in the same group as default, or delete this one."),
-  variance: blueprintVarianceSchema.optional().describe('Partial-merge into the existing variance. Supplied keys overwrite; omitted keys preserve. Pass `{persona: ""}` to clear a persona (handler treats empty string as removal).')
-}).strict();
-var opsUpdateBlueprintOutputSchema = external_exports.object({
-  blueprintId: external_exports.string().min(1),
-  updatedAt: external_exports.string().min(1)
-}).strict();
-var opsDeleteBlueprintInputSchema = external_exports.object({
-  blueprintId: external_exports.string().min(1)
-}).strict();
-var opsDeleteBlueprintOutputSchema = external_exports.object({
-  deleted: external_exports.literal(true)
-}).strict();
-
-// ../protocol/dist/envelopes/builders.js
-function resolveSchemaVersion(parts) {
-  if ("schemaVersion" in parts) {
-    return parts.schemaVersion;
-  }
-  return PROTOCOL_SCHEMA_VERSION;
-}
-function makeActionEnvelope(parts) {
-  const envelope = {
-    sessionId: parts.sessionId,
-    type: parts.type
-  };
-  if (parts.payload !== void 0)
-    envelope.payload = parts.payload;
-  if (parts.clientSeq !== void 0)
-    envelope.clientSeq = parts.clientSeq;
-  const stamp = resolveSchemaVersion(parts);
-  if (stamp !== void 0)
-    envelope.schemaVersion = stamp;
-  return envelope;
-}
-
 // ../protocol/dist/validation/ajv-runtime.js
 var import_ajv = __toESM(require_ajv(), 1);
 var import_ajv_formats = __toESM(require_dist(), 1);
@@ -35170,8 +35205,20 @@ if (!standaloneAjv.getKeyword("example")) {
 if (!standaloneAjv.getKeyword("nullable")) {
   standaloneAjv.addKeyword({ keyword: "nullable" });
 }
+var standaloneCjsAjv = new import_ajv.default({
+  ...AJV_OPTIONS,
+  code: { source: true }
+});
+(0, import_ajv_formats.default)(standaloneCjsAjv);
+if (!standaloneCjsAjv.getKeyword("example")) {
+  standaloneCjsAjv.addKeyword({ keyword: "example" });
+}
+if (!standaloneCjsAjv.getKeyword("nullable")) {
+  standaloneCjsAjv.addKeyword({ keyword: "nullable" });
+}
 function injectClosedShape(schema) {
-  const isObjectNode = schema.type === "object" || schema.properties !== void 0;
+  const typeSet = new Set(Array.isArray(schema.type) ? schema.type : schema.type ? [schema.type] : []);
+  const isObjectNode = typeSet.has("object") || schema.properties !== void 0;
   if (isObjectNode) {
     const out = { ...schema };
     if (out.properties) {
@@ -35192,7 +35239,7 @@ function injectClosedShape(schema) {
       out.anyOf = out.anyOf.map(injectClosedShape);
     return out;
   }
-  if (schema.type === "array" && schema.items) {
+  if (typeSet.has("array") && schema.items) {
     return { ...schema, items: injectClosedShape(schema.items) };
   }
   if (schema.oneOf || schema.anyOf) {
@@ -35212,7 +35259,10 @@ function compileForValidation(schema) {
 function mapAjvErrorsToViolations(errors, data) {
   if (!errors)
     return [];
-  return errors.map((err) => mapOne(err, data));
+  return errors.map((err) => ({
+    ...mapOne(err, data),
+    ...err.keyword ? { keyword: err.keyword } : {}
+  }));
 }
 function prefixViolations(violations, prefix) {
   if (!prefix)
@@ -35559,24 +35609,92 @@ function validateActionEnvelope(envelope, spec, precompiledActions) {
   return validateActionData(envelope.payload, spec, precompiledActions);
 }
 
-// ../ggui-react/dist/chunk-KUWOYNZT.mjs
-var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
-var import_react3 = __toESM(require_react(), 1);
-var GguiContext = (0, import_react.createContext)(null);
-var KNOWN_PERMISSION_NAMES_SET2 = new Set(KNOWN_PERMISSION_NAMES);
-var DECODER = new TextDecoder();
+// ../protocol/dist/schemas/ops-blueprint.js
+var opsGenerateBlueprintInputSchema = external_exports.object({
+  appId: external_exports.string().min(1).optional().describe("Target app for this curation call. Defaults to the caller's bound app identity; callers not bound to an app must provide it. The deployment's authorization policy decides whether the caller may curate the named app."),
+  contract: dataContractSchema,
+  generator: external_exports.string().min(1).optional().describe("Generator slug (e.g. `ui-gen-default-haiku-4-5`). When omitted, dispatches through `GeneratorRegistry.defaultGenerator()`."),
+  persona: external_exports.string().optional().describe("Free-form persona tag (e.g. 'minimalist', 'data-dense'). Normalized via lowercase+trim before persistence; logged as a warning when within Levenshtein distance < 2 of an existing tag for the same appId."),
+  aesthetic: external_exports.string().optional().describe("Free-form aesthetic tag (e.g. 'glassmorphic', 'brutalist', 'editorial'). Persisted on `Blueprint.variance.aesthetic`. Distinct from persona \u2014 persona names the user mental model; aesthetic names the visual treatment."),
+  context: external_exports.record(external_exports.string(), jsonValueSchema).optional().describe("Small structured signal carried alongside the persona. Persisted on `Blueprint.variance.context`."),
+  seedPrompt: external_exports.string().optional().describe("The raw operator prompt that produced this variant. Round-trip input for the variant-selector + audit trail."),
+  setAsOperatorDefault: external_exports.boolean().optional().describe("When true, pins the new blueprint as the operator default for its `(appId, contractHash)` group, clearing any prior default in the same group.")
+}).strict();
+var opsGenerateBlueprintOutputSchema = external_exports.object({
+  blueprintId: external_exports.string().min(1),
+  codeHash: external_exports.string().optional().describe("Content hash of the generated code body. Absent when the generator returned a non-`ok` result and persistence skipped \u2014 the failure mode is surfaced through generator-level error reporting elsewhere."),
+  validatorScore: external_exports.number().min(0).max(1).optional().describe("Advanced generator's iterative-loop validator score (0-1). Absent for default-generator output."),
+  source: llmBlueprintSourceSchema.describe("Provenance stamped on the persisted `Blueprint.source` \u2014 always the `llm` arm on this path: `generator` is the engine slug the dispatch resolved to (stamped from the engine's own metadata claim); `model` is the LLM model id the engine called.")
+}).strict();
+var opsRegisterBlueprintInputSchema = external_exports.object({
+  appId: external_exports.string().min(1).optional().describe("Target app for this curation call. Defaults to the caller's bound app identity; callers not bound to an app must provide it. The deployment's authorization policy decides whether the caller may curate the named app."),
+  contract: dataContractSchema,
+  componentCode: external_exports.string().min(1).describe("Verbatim component-code body to persist. Stored as-is \u2014 no LLM call, no validator pass. Operator owns correctness; the handler computes the canonical sha256 codeHash and routes the bytes through the same persistence seams as `*_generate_*`."),
+  persona: external_exports.string().optional().describe("Free-form persona tag (e.g. 'minimalist', 'data-dense'). Normalized via lowercase+trim before persistence; logged as a warning when within Levenshtein distance < 2 of an existing tag for the same appId."),
+  aesthetic: external_exports.string().optional().describe("Free-form aesthetic tag. Persisted on `Blueprint.variance.aesthetic`."),
+  context: external_exports.record(external_exports.string(), jsonValueSchema).optional().describe("Small structured signal carried alongside the persona. Persisted on `Blueprint.variance.context`."),
+  seedPrompt: external_exports.string().optional().describe("Optional originating prompt for audit + round-tripping (e.g. the prose the operator originally fed into `*_generate_*` before exporting)."),
+  setAsOperatorDefault: external_exports.boolean().optional().describe("When true, pins the new blueprint as the operator default for its `(appId, contractHash)` group, clearing any prior default in the same group.")
+}).strict();
+var opsRegisterBlueprintOutputSchema = external_exports.object({
+  blueprintId: external_exports.string().min(1),
+  codeHash: external_exports.string().min(1).describe("Content hash of the persisted code body (full sha256 hex)."),
+  source: userBlueprintSourceSchema.describe('Provenance stamped on the persisted `Blueprint.source` \u2014 always `{kind: "user"}` on this path: operator-supplied bytes, no LLM dispatch, no engine claim to record.')
+}).strict();
+var opsListBlueprintsInputSchema = external_exports.object({
+  appId: external_exports.string().min(1).optional().describe("Target app for this curation call. Defaults to the caller's bound app identity; callers not bound to an app must provide it. The deployment's authorization policy decides whether the caller may curate the named app."),
+  contractHash: external_exports.string().min(1).optional().describe("Filter to a single `(appId, contractHash)` group. Combine with `generator` / `persona` to narrow within the group."),
+  generator: external_exports.string().min(1).optional().describe('Filter to engine-generated blueprints (`source.kind === "llm"`) whose `source.generator` equals this slug. `user`-sourced rows never match (they carry no engine provenance).'),
+  persona: external_exports.string().optional().describe("Filter on `variance.persona`. Normalized to match persisted form (lowercase+trim)."),
+  intentKeywords: external_exports.array(external_exports.string().min(1)).optional().describe("Semantic-search tokens. When set, dispatches through `BlueprintSearch.search()` rather than indexed `list()`.")
+}).strict();
+var opsListBlueprintsOutputSchema = external_exports.object({
+  blueprints: external_exports.array(blueprintSchema)
+}).strict();
+var opsUpdateBlueprintInputSchema = external_exports.object({
+  appId: external_exports.string().min(1).optional().describe("Target app for this curation call. Defaults to the caller's bound app identity; callers not bound to an app must provide it. The deployment's authorization policy decides whether the caller may curate the named app. Must match the app the addressed blueprint belongs to."),
+  blueprintId: external_exports.string().min(1),
+  isOperatorDefault: external_exports.literal(true).optional().describe("When `true`, pins this blueprint as the operator default for its `(appId, contractHash)` group. Clears any prior default. Cannot set to `false` \u2014 to unpin, set another blueprint in the same group as default, or delete this one."),
+  variance: blueprintVarianceSchema.optional().describe('Partial-merge into the existing variance. Supplied keys overwrite; omitted keys preserve. Pass `{persona: ""}` to clear a persona (handler treats empty string as removal).')
+}).strict();
+var opsUpdateBlueprintOutputSchema = external_exports.object({
+  blueprintId: external_exports.string().min(1),
+  updatedAt: external_exports.string().min(1)
+}).strict();
+var opsDeleteBlueprintInputSchema = external_exports.object({
+  appId: external_exports.string().min(1).optional().describe("Target app for this curation call. Defaults to the caller's bound app identity; callers not bound to an app must provide it. The deployment's authorization policy decides whether the caller may curate the named app. Must match the app the addressed blueprint belongs to."),
+  blueprintId: external_exports.string().min(1)
+}).strict();
+var opsDeleteBlueprintOutputSchema = external_exports.object({
+  deleted: external_exports.literal(true)
+}).strict();
 
-// ../ggui-react/dist/chunk-7P6ASYW6.mjs
-var __defProp2 = Object.defineProperty;
-var __export2 = (target, all) => {
-  for (var name in all)
-    __defProp2(target, name, { get: all[name], enumerable: true });
-};
+// ../protocol/dist/envelopes/builders.js
+function resolveSchemaVersion(parts) {
+  if ("schemaVersion" in parts) {
+    return parts.schemaVersion;
+  }
+  return PROTOCOL_SCHEMA_VERSION;
+}
+function makeActionEnvelope(parts) {
+  const envelope = {
+    sessionId: parts.sessionId,
+    type: parts.type
+  };
+  if (parts.payload !== void 0)
+    envelope.payload = parts.payload;
+  if (parts.clientSeq !== void 0)
+    envelope.clientSeq = parts.clientSeq;
+  const stamp = resolveSchemaVersion(parts);
+  if (stamp !== void 0)
+    envelope.schemaVersion = stamp;
+  return envelope;
+}
 
-// ../ggui-react/dist/index.mjs
-var import_react8 = __toESM(require_react(), 1);
-var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
-var import_react9 = __toESM(require_react(), 1);
+// ../mcp-apps-react/dist/index.mjs
+var import_react5 = __toESM(require_react(), 1);
+var import_react6 = __toESM(require_react(), 1);
+var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
 
 // ../wire/dist/index.js
 var dist_exports = {};
@@ -35602,13 +35720,13 @@ __export(dist_exports, {
 });
 
 // ../wire/dist/WireProvider.js
-var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
+var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
 
 // ../wire/dist/context.js
-var import_react4 = __toESM(require_react(), 1);
-var WireContext = (0, import_react4.createContext)(null);
+var import_react = __toESM(require_react(), 1);
+var WireContext = (0, import_react.createContext)(null);
 function useWireContext() {
-  const ctx = (0, import_react4.useContext)(WireContext);
+  const ctx = (0, import_react.useContext)(WireContext);
   if (!ctx) {
     throw new Error("useWireContext must be used within a WireProvider. Ensure the component is rendered inside a GguiWireProvider.");
   }
@@ -35617,11 +35735,11 @@ function useWireContext() {
 
 // ../wire/dist/WireProvider.js
 function GguiWireProvider({ config: config2, children }) {
-  return (0, import_jsx_runtime2.jsx)(WireContext.Provider, { value: config2, children });
+  return (0, import_jsx_runtime.jsx)(WireContext.Provider, { value: config2, children });
 }
 
 // ../wire/dist/useAction.js
-var import_react5 = __toESM(require_react(), 1);
+var import_react2 = __toESM(require_react(), 1);
 
 // ../wire/dist/dispatch-dedup.js
 var pendingDispatches = /* @__PURE__ */ new Set();
@@ -35655,7 +35773,7 @@ function tryAcceptDispatch(actionName, data) {
 // ../wire/dist/useAction.js
 function useAction(actionName) {
   const { dispatch, onDispatchSuppressed } = useWireContext();
-  return (0, import_react5.useCallback)((data) => {
+  return (0, import_react2.useCallback)((data) => {
     const decision = tryAcceptDispatch(actionName, data);
     if (decision.suppressed) {
       console.warn(`[ggui] useAction('${actionName}') suppressed a duplicate dispatch (same name + payload, same event-loop task). This usually means two interactive elements nest and both wire to the same action (e.g. a Checkbox onChange inside a Card as={Clickable} onClick); the inner gesture bubbles to the outer handler so one user click would fire the action twice. Wire each useAction callback to exactly ONE interactive surface. Tier-0 'double-wired-action' warns on this at gen time; this runtime defense ensures the user-visible behavior stays correct regardless of code shape.`);
@@ -35678,7 +35796,7 @@ function useAction(actionName) {
 }
 
 // ../wire/dist/useGguiContext.js
-var import_react6 = __toESM(require_react(), 1);
+var import_react3 = __toESM(require_react(), 1);
 function useGguiContext(slotName) {
   const contextName = slotName.length === 0 ? "Context" : slotName.charAt(0).toUpperCase() + slotName.slice(1) + "Context";
   const registry2 = globalThis.__ggui__?.contexts;
@@ -35686,19 +35804,19 @@ function useGguiContext(slotName) {
   if (!ctx) {
     throw new Error(`[ggui] useGguiContext('${slotName}'): no Context registered. The contract must declare 'contextSpec.${slotName}' AND the runtime must have synthesized the per-slot React Context at boot. If you see this in production code generated by the LLM, the boilerplate's destructure line drifted from the contract.`);
   }
-  return (0, import_react6.useContext)(ctx);
+  return (0, import_react3.useContext)(ctx);
 }
 
 // ../wire/dist/useStream.js
-var import_react7 = __toESM(require_react(), 1);
+var import_react4 = __toESM(require_react(), 1);
 function useStream(channelName) {
   const { subscribe } = useWireContext();
-  const [latest, setLatest] = (0, import_react7.useState)(null);
-  const [all, setAll] = (0, import_react7.useState)([]);
-  const [isComplete, setIsComplete] = (0, import_react7.useState)(false);
-  const allRef = (0, import_react7.useRef)(all);
+  const [latest, setLatest] = (0, import_react4.useState)(null);
+  const [all, setAll] = (0, import_react4.useState)([]);
+  const [isComplete, setIsComplete] = (0, import_react4.useState)(false);
+  const allRef = (0, import_react4.useRef)(all);
   allRef.current = all;
-  (0, import_react7.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     return subscribe(channelName, (delivery) => {
       const typed = delivery.payload;
       setLatest(typed);
@@ -35871,243 +35989,104 @@ function buildWireConfig(opts) {
   };
 }
 
-// ../ggui-react/dist/index.mjs
-var import_react10 = __toESM(require_react(), 1);
-
-// ../preview-a2ui/dist/components.js
-var ComponentBase = external_exports.object({
-  id: external_exports.string().min(1)
-});
-var ComponentRef = external_exports.string().min(1);
-var Align = external_exports.enum(["start", "center", "end", "stretch"]);
-var Justify = external_exports.enum([
-  "start",
-  "center",
-  "end",
-  "between",
-  "around",
-  "evenly"
-]);
-var RowComponent = ComponentBase.extend({
-  component: external_exports.literal("Row"),
-  children: external_exports.array(ComponentRef).optional(),
-  gap: external_exports.string().optional(),
-  align: Align.optional(),
-  justify: Justify.optional()
-});
-var ColumnComponent = ComponentBase.extend({
-  component: external_exports.literal("Column"),
-  children: external_exports.array(ComponentRef).optional(),
-  gap: external_exports.string().optional(),
-  align: Align.optional(),
-  justify: Justify.optional()
-});
-var CardComponent = ComponentBase.extend({
-  component: external_exports.literal("Card"),
-  child: ComponentRef.optional()
-});
-var ListComponent = ComponentBase.extend({
-  component: external_exports.literal("List"),
-  children: external_exports.array(ComponentRef).optional()
-});
-var DividerComponent = ComponentBase.extend({
-  component: external_exports.literal("Divider"),
-  orientation: external_exports.enum(["horizontal", "vertical"]).optional()
-});
-var TextComponent = ComponentBase.extend({
-  component: external_exports.literal("Text"),
-  text: external_exports.string(),
-  variant: external_exports.string().optional()
-});
-var ImageComponent = ComponentBase.extend({
-  component: external_exports.literal("Image"),
-  src: external_exports.string().min(1),
-  alt: external_exports.string().optional()
-});
-var IconComponent = ComponentBase.extend({
-  component: external_exports.literal("Icon"),
-  name: external_exports.string().min(1)
-});
-var ButtonComponent = ComponentBase.extend({
-  component: external_exports.literal("Button"),
-  label: external_exports.string()
-});
-var TextFieldComponent = ComponentBase.extend({
-  component: external_exports.literal("TextField"),
-  label: external_exports.string().optional(),
-  placeholder: external_exports.string().optional(),
-  value: external_exports.string().optional()
-});
-var CheckBoxComponent = ComponentBase.extend({
-  component: external_exports.literal("CheckBox"),
-  label: external_exports.string().optional(),
-  checked: external_exports.boolean().optional()
-});
-var ChoicePickerOption = external_exports.object({
-  label: external_exports.string(),
-  value: external_exports.string()
-});
-var ChoicePickerComponent = ComponentBase.extend({
-  component: external_exports.literal("ChoicePicker"),
-  label: external_exports.string().optional(),
-  options: external_exports.array(ChoicePickerOption).optional(),
-  value: external_exports.string().optional()
-});
-var ComponentSchema = external_exports.discriminatedUnion("component", [
-  RowComponent,
-  ColumnComponent,
-  CardComponent,
-  ListComponent,
-  DividerComponent,
-  TextComponent,
-  ImageComponent,
-  IconComponent,
-  ButtonComponent,
-  TextFieldComponent,
-  CheckBoxComponent,
-  ChoicePickerComponent
-]);
-
-// ../preview-a2ui/dist/messages.js
-var A2UI_MESSAGE_VERSION = "v0.9";
-var VersionLiteral = external_exports.literal(A2UI_MESSAGE_VERSION);
-var SurfaceId = external_exports.string().min(1);
-var CreateSurfaceMessageSchema = external_exports.object({
-  version: VersionLiteral,
-  createSurface: external_exports.object({
-    surfaceId: SurfaceId,
-    catalogId: external_exports.string().min(1)
-  })
-});
-var UpdateComponentsMessageSchema = external_exports.object({
-  version: VersionLiteral,
-  updateComponents: external_exports.object({
-    surfaceId: SurfaceId,
-    components: external_exports.array(ComponentSchema)
-  })
-});
-var DeleteSurfaceMessageSchema = external_exports.object({
-  version: VersionLiteral,
-  deleteSurface: external_exports.object({
-    surfaceId: SurfaceId
-  })
-});
-var ServerMessageSchema = external_exports.union([
-  CreateSurfaceMessageSchema,
-  UpdateComponentsMessageSchema,
-  DeleteSurfaceMessageSchema
-]);
-
-// ../ggui-react/dist/index.mjs
-var import_react11 = __toESM(require_react(), 1);
+// ../mcp-apps-react/dist/index.mjs
+var import_react7 = __toESM(require_react(), 1);
+var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
+var import_react8 = __toESM(require_react(), 1);
+var import_react9 = __toESM(require_react(), 1);
 var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
-var import_react12 = __toESM(require_react(), 1);
 var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
-var import_react13 = __toESM(require_react(), 1);
-var import_react14 = __toESM(require_react(), 1);
 var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
+var import_react10 = __toESM(require_react(), 1);
+var import_react11 = __toESM(require_react(), 1);
 var import_jsx_runtime7 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime8 = __toESM(require_jsx_runtime(), 1);
-var import_react15 = __toESM(require_react(), 1);
-var import_react16 = __toESM(require_react(), 1);
 var import_jsx_runtime9 = __toESM(require_jsx_runtime(), 1);
+var import_react12 = __toESM(require_react(), 1);
 var import_jsx_runtime10 = __toESM(require_jsx_runtime(), 1);
+var import_react13 = __toESM(require_react(), 1);
 var import_jsx_runtime11 = __toESM(require_jsx_runtime(), 1);
-var import_react17 = __toESM(require_react(), 1);
+var import_react14 = __toESM(require_react(), 1);
 var import_jsx_runtime12 = __toESM(require_jsx_runtime(), 1);
-var import_react18 = __toESM(require_react(), 1);
 var import_jsx_runtime13 = __toESM(require_jsx_runtime(), 1);
-var import_react19 = __toESM(require_react(), 1);
+var import_react15 = __toESM(require_react(), 1);
 var import_jsx_runtime14 = __toESM(require_jsx_runtime(), 1);
+var import_react16 = __toESM(require_react(), 1);
 var import_jsx_runtime15 = __toESM(require_jsx_runtime(), 1);
-var import_react20 = __toESM(require_react(), 1);
+var import_react17 = __toESM(require_react(), 1);
 var import_jsx_runtime16 = __toESM(require_jsx_runtime(), 1);
-var import_react21 = __toESM(require_react(), 1);
 var import_jsx_runtime17 = __toESM(require_jsx_runtime(), 1);
-var import_react22 = __toESM(require_react(), 1);
 var import_jsx_runtime18 = __toESM(require_jsx_runtime(), 1);
+var import_react18 = __toESM(require_react(), 1);
 var import_jsx_runtime19 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime20 = __toESM(require_jsx_runtime(), 1);
-var import_react23 = __toESM(require_react(), 1);
 var import_jsx_runtime21 = __toESM(require_jsx_runtime(), 1);
+var import_react19 = __toESM(require_react(), 1);
 var import_jsx_runtime22 = __toESM(require_jsx_runtime(), 1);
+var import_react20 = __toESM(require_react(), 1);
 var import_jsx_runtime23 = __toESM(require_jsx_runtime(), 1);
-var import_react24 = __toESM(require_react(), 1);
 var import_jsx_runtime24 = __toESM(require_jsx_runtime(), 1);
-var import_react25 = __toESM(require_react(), 1);
+var import_react21 = __toESM(require_react(), 1);
 var import_jsx_runtime25 = __toESM(require_jsx_runtime(), 1);
+var import_react22 = __toESM(require_react(), 1);
 var import_jsx_runtime26 = __toESM(require_jsx_runtime(), 1);
-var import_react26 = __toESM(require_react(), 1);
+var import_react23 = __toESM(require_react(), 1);
 var import_jsx_runtime27 = __toESM(require_jsx_runtime(), 1);
-var import_react27 = __toESM(require_react(), 1);
+var import_react24 = __toESM(require_react(), 1);
 var import_jsx_runtime28 = __toESM(require_jsx_runtime(), 1);
-var import_react28 = __toESM(require_react(), 1);
+var import_react25 = __toESM(require_react(), 1);
+var import_react26 = __toESM(require_react(), 1);
 var import_jsx_runtime29 = __toESM(require_jsx_runtime(), 1);
-var import_react29 = __toESM(require_react(), 1);
+var import_react27 = __toESM(require_react(), 1);
 var import_jsx_runtime30 = __toESM(require_jsx_runtime(), 1);
-var import_react30 = __toESM(require_react(), 1);
-var import_react31 = __toESM(require_react(), 1);
 var import_jsx_runtime31 = __toESM(require_jsx_runtime(), 1);
-var import_react32 = __toESM(require_react(), 1);
 var import_jsx_runtime32 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime33 = __toESM(require_jsx_runtime(), 1);
+var import_react28 = __toESM(require_react(), 1);
 var import_jsx_runtime34 = __toESM(require_jsx_runtime(), 1);
+var import_react29 = __toESM(require_react(), 1);
 var import_jsx_runtime35 = __toESM(require_jsx_runtime(), 1);
-var import_react33 = __toESM(require_react(), 1);
+var import_react30 = __toESM(require_react(), 1);
 var import_jsx_runtime36 = __toESM(require_jsx_runtime(), 1);
-var import_react34 = __toESM(require_react(), 1);
 var import_jsx_runtime37 = __toESM(require_jsx_runtime(), 1);
-var import_react35 = __toESM(require_react(), 1);
 var import_jsx_runtime38 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime39 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime40 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime41 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime42 = __toESM(require_jsx_runtime(), 1);
+var import_react31 = __toESM(require_react(), 1);
 var import_jsx_runtime43 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime44 = __toESM(require_jsx_runtime(), 1);
-var import_react36 = __toESM(require_react(), 1);
+var import_react32 = __toESM(require_react(), 1);
 var import_jsx_runtime45 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime46 = __toESM(require_jsx_runtime(), 1);
-var import_react37 = __toESM(require_react(), 1);
+var import_react33 = __toESM(require_react(), 1);
 var import_jsx_runtime47 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime48 = __toESM(require_jsx_runtime(), 1);
-var import_react38 = __toESM(require_react(), 1);
+var import_react34 = __toESM(require_react(), 1);
 var import_jsx_runtime49 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime50 = __toESM(require_jsx_runtime(), 1);
-var import_react39 = __toESM(require_react(), 1);
+var import_react35 = __toESM(require_react(), 1);
 var import_jsx_runtime51 = __toESM(require_jsx_runtime(), 1);
+var import_react36 = __toESM(require_react(), 1);
 var import_jsx_runtime52 = __toESM(require_jsx_runtime(), 1);
-var import_react40 = __toESM(require_react(), 1);
 var import_jsx_runtime53 = __toESM(require_jsx_runtime(), 1);
-var import_react41 = __toESM(require_react(), 1);
 var import_jsx_runtime54 = __toESM(require_jsx_runtime(), 1);
+var import_react37 = __toESM(require_react(), 1);
 var import_jsx_runtime55 = __toESM(require_jsx_runtime(), 1);
+var import_react38 = __toESM(require_react(), 1);
 var import_jsx_runtime56 = __toESM(require_jsx_runtime(), 1);
-var import_react42 = __toESM(require_react(), 1);
+var import_react39 = __toESM(require_react(), 1);
 var import_jsx_runtime57 = __toESM(require_jsx_runtime(), 1);
-var import_react43 = __toESM(require_react(), 1);
+var import_react40 = __toESM(require_react(), 1);
 var import_jsx_runtime58 = __toESM(require_jsx_runtime(), 1);
-var import_react44 = __toESM(require_react(), 1);
 var import_jsx_runtime59 = __toESM(require_jsx_runtime(), 1);
-var import_react45 = __toESM(require_react(), 1);
+var import_react41 = __toESM(require_react(), 1);
 var import_jsx_runtime60 = __toESM(require_jsx_runtime(), 1);
-var import_react46 = __toESM(require_react(), 1);
 var import_jsx_runtime61 = __toESM(require_jsx_runtime(), 1);
-var import_react47 = __toESM(require_react(), 1);
-var import_jsx_runtime62 = __toESM(require_jsx_runtime(), 1);
-var import_jsx_runtime63 = __toESM(require_jsx_runtime(), 1);
-var import_jsx_runtime64 = __toESM(require_jsx_runtime(), 1);
-var import_react48 = __toESM(require_react(), 1);
-var import_react49 = __toESM(require_react(), 1);
-var import_jsx_runtime65 = __toESM(require_jsx_runtime(), 1);
-var import_react50 = __toESM(require_react(), 1);
-var import_jsx_runtime66 = __toESM(require_jsx_runtime(), 1);
-var import_jsx_runtime67 = __toESM(require_jsx_runtime(), 1);
-var import_react51 = __toESM(require_react(), 1);
-var import_jsx_runtime68 = __toESM(require_jsx_runtime(), 1);
-var import_react52 = __toESM(require_react(), 1);
-var import_jsx_runtime69 = __toESM(require_jsx_runtime(), 1);
-var StreamBusContext = (0, import_react11.createContext)(null);
+var import_react42 = __toESM(require_react(), 1);
+var GguiContext = (0, import_react6.createContext)(null);
+var KNOWN_PERMISSION_NAMES_SET2 = new Set(KNOWN_PERMISSION_NAMES);
 var primitives_exports = {};
 __export2(primitives_exports, {
   Accordion: () => Accordion,
@@ -36220,7 +36199,7 @@ var maxWidthMap = {
 function Container({ children, maxWidth: maxWidth2 = "lg", center = true, padding, style, className }) {
   const resolvedMaxWidth = maxWidthMap[maxWidth2] || maxWidth2;
   const resolvedPadding = resolveSpacing(padding);
-  return (0, import_jsx_runtime5.jsx)("div", { className, style: {
+  return (0, import_jsx_runtime3.jsx)("div", { className, style: {
     maxWidth: resolvedMaxWidth,
     margin: center ? "0 auto" : void 0,
     padding: resolvedPadding,
@@ -36230,9 +36209,9 @@ function Container({ children, maxWidth: maxWidth2 = "lg", center = true, paddin
 }
 function renderWithTrait(trait, traitProps, root, children) {
   if (trait === void 0) {
-    return (0, import_react13.createElement)("div", { className: root.className, style: root.style }, children);
+    return (0, import_react8.createElement)("div", { className: root.className, style: root.style }, children);
   }
-  return (0, import_react13.createElement)(trait, { ...traitProps, className: root.className, style: root.style }, children);
+  return (0, import_react8.createElement)(trait, { ...traitProps, className: root.className, style: root.style }, children);
 }
 function resolveToneCss(tone) {
   switch (tone) {
@@ -36250,7 +36229,7 @@ function resolveToneCss(tone) {
     case "warning":
     case "error":
     case "info":
-      return `var(--ggui-color-${tone}, ${SEMANTIC_TONE_FALLBACK[tone]})`;
+      return `var(--ggui-color-${tone}-500, ${SEMANTIC_TONE_FALLBACK[tone]})`;
     case "inverse":
       return "var(--ggui-color-surface, #ffffff)";
     case "inherit":
@@ -36357,7 +36336,7 @@ function Stack(props) {
   return renderWithTrait(Trait, traitProps, { className, style: composedStyle }, children);
 }
 function Row(props) {
-  return (0, import_react14.createElement)(Stack, { ...props, direction: "horizontal" });
+  return (0, import_react9.createElement)(Stack, { ...props, direction: "horizontal" });
 }
 var BREAKPOINTS = [
   ["sm", 640],
@@ -36401,7 +36380,7 @@ function Grid(props) {
       gap: resolveSpacing(gap),
       ...style
     };
-    return renderWithTrait(Trait, traitProps, { className: className ? `${className} ${cls}` : cls, style: composedStyle2 }, (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [(0, import_jsx_runtime6.jsx)("style", { children: rules.join("") }), children] }));
+    return renderWithTrait(Trait, traitProps, { className: className ? `${className} ${cls}` : cls, style: composedStyle2 }, (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [(0, import_jsx_runtime4.jsx)("style", { children: rules.join("") }), children] }));
   }
   const composedStyle = {
     display: "grid",
@@ -36436,7 +36415,7 @@ function Divider({ orientation = "horizontal", margin = "var(--ggui-spacing-md,
   const resolvedMargin = typeof margin === "number" ? `${margin}px` : margin;
   const dividerColor = tone ? resolveToneCss(tone) : "var(--ggui-color-outlineVariant, #e4e4e7)";
   if (orientation === "vertical") {
-    return (0, import_jsx_runtime7.jsx)("div", { role: "separator", "aria-orientation": "vertical", className, style: {
+    return (0, import_jsx_runtime5.jsx)("div", { role: "separator", "aria-orientation": "vertical", className, style: {
       width: "1px",
       backgroundColor: dividerColor,
       margin: `0 ${resolvedMargin}`,
@@ -36444,7 +36423,7 @@ function Divider({ orientation = "horizontal", margin = "var(--ggui-spacing-md,
       ...style
     } });
   }
-  return (0, import_jsx_runtime7.jsx)("hr", { role: "separator", "aria-orientation": "horizontal", className, style: {
+  return (0, import_jsx_runtime5.jsx)("hr", { role: "separator", "aria-orientation": "horizontal", className, style: {
     border: "none",
     height: "1px",
     backgroundColor: dividerColor,
@@ -36454,12 +36433,12 @@ function Divider({ orientation = "horizontal", margin = "var(--ggui-spacing-md,
 }
 function Spacer({ size = 16, style, className }) {
   if (size === "flex") {
-    return (0, import_jsx_runtime8.jsx)("div", { className, style: {
+    return (0, import_jsx_runtime6.jsx)("div", { className, style: {
       flex: 1,
       ...style
     } });
   }
-  return (0, import_jsx_runtime8.jsx)("div", { className, style: {
+  return (0, import_jsx_runtime6.jsx)("div", { className, style: {
     width: `${size}px`,
     height: `${size}px`,
     flexShrink: 0,
@@ -36513,7 +36492,7 @@ function Text({ children, size = "base", weight = "normal", caps = false, tone,
     ...style
   };
   const elementProps = { id, htmlFor, className, style: textStyle };
-  return (0, import_react15.createElement)(is, elementProps, children);
+  return (0, import_react10.createElement)(is, elementProps, children);
 }
 var fontSize = {
   xs: "12px",
@@ -36596,7 +36575,7 @@ function Heading({ children, level = 2, tone, align, style, className }) {
   const tag = `h${level}`;
   const headingStyle = headingStyles[tag] || headingStyles.h2;
   const resolvedColor = tone ? resolveToneCss(tone) : "var(--ggui-color-onSurface, #18181b)";
-  return (0, import_react16.createElement)(tag, {
+  return (0, import_react11.createElement)(tag, {
     className,
     style: {
       ...headingStyle,
@@ -36609,10 +36588,10 @@ function Heading({ children, level = 2, tone, align, style, className }) {
 }
 function Spinner({ size = 24, tone, style, className }) {
   const spinnerColor = tone === "inherit" ? "currentColor" : tone ? resolveToneCss(tone) : "var(--ggui-color-primary-600, #0284c7)";
-  return (0, import_jsx_runtime10.jsxs)("svg", { className, width: size, height: size, viewBox: "0 0 24 24", fill: "none", role: "status", "aria-label": "Loading", style: {
+  return (0, import_jsx_runtime8.jsxs)("svg", { className, width: size, height: size, viewBox: "0 0 24 24", fill: "none", role: "status", "aria-label": "Loading", style: {
     animation: "ggui-spin 1s linear infinite",
     ...style
-  }, children: [(0, import_jsx_runtime10.jsx)("style", { children: `@keyframes ggui-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }` }), (0, import_jsx_runtime10.jsx)("circle", { cx: "12", cy: "12", r: "10", stroke: "var(--ggui-color-outlineVariant, #e4e4e7)", strokeWidth: "3", fill: "none" }), (0, import_jsx_runtime10.jsx)("path", { d: "M12 2a10 10 0 0 1 10 10", stroke: spinnerColor, strokeWidth: "3", strokeLinecap: "round", fill: "none" })] });
+  }, children: [(0, import_jsx_runtime8.jsx)("style", { children: `@keyframes ggui-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }` }), (0, import_jsx_runtime8.jsx)("circle", { cx: "12", cy: "12", r: "10", stroke: "var(--ggui-color-outlineVariant, #e4e4e7)", strokeWidth: "3", fill: "none" }), (0, import_jsx_runtime8.jsx)("path", { d: "M12 2a10 10 0 0 1 10 10", stroke: spinnerColor, strokeWidth: "3", strokeLinecap: "round", fill: "none" })] });
 }
 var duration3 = {
   instant: "0ms",
@@ -36689,7 +36668,7 @@ var variantStyles = {
 function Button({ children, variant = "primary", size = "md", fullWidth, loading, disabled, leftIcon, rightIcon, type = "button", onClick, onPress, style, className, ...rest }) {
   const isDisabled = disabled || loading;
   const handleClick = onClick ?? onPress;
-  return (0, import_jsx_runtime9.jsx)("button", { type, onClick: isDisabled ? void 0 : handleClick, disabled: isDisabled, className, style: {
+  return (0, import_jsx_runtime7.jsx)("button", { type, onClick: isDisabled ? void 0 : handleClick, disabled: isDisabled, className, style: {
     ...sizeStyles[size],
     ...variantStyles[variant],
     display: "inline-flex",
@@ -36704,7 +36683,7 @@ function Button({ children, variant = "primary", size = "md", fullWidth, loading
     transition: `background-color ${duration3.normal} ${easing.easeInOut}, box-shadow ${duration3.normal} ${easing.easeInOut}, opacity ${duration3.normal} ${easing.easeInOut}`,
     boxShadow: "var(--ggui-shape-shadow-sm, 0 1px 2px rgba(0,0,0,0.05))",
     ...style
-  }, ...rest, children: loading ? (0, import_jsx_runtime9.jsx)(Spinner, { size: 16, tone: "inherit" }) : (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [leftIcon, children, rightIcon] }) });
+  }, ...rest, children: loading ? (0, import_jsx_runtime7.jsx)(Spinner, { size: 16, tone: "inherit" }) : (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [leftIcon, children, rightIcon] }) });
 }
 var sizeStyles2 = {
   sm: {
@@ -36721,21 +36700,21 @@ var sizeStyles2 = {
   }
 };
 function Input({ label, placeholder, value, onChange, type = "text", error: error210, helperText, required: required2, disabled, size = "md", style, className, ...rest }) {
-  const uniqueId = (0, import_react17.useId)();
+  const uniqueId = (0, import_react12.useId)();
   const inputId = `${uniqueId}-input`;
   const messageId = `${uniqueId}-message`;
   const hasError = Boolean(error210);
   const hasMessage = Boolean(error210 || helperText);
-  return (0, import_jsx_runtime11.jsxs)("div", { className, style: {
+  return (0, import_jsx_runtime9.jsxs)("div", { className, style: {
     display: "flex",
     flexDirection: "column",
     gap: "var(--ggui-spacing-1, 4px)",
     ...style
-  }, children: [label && (0, import_jsx_runtime11.jsxs)("label", { htmlFor: inputId, style: {
+  }, children: [label && (0, import_jsx_runtime9.jsxs)("label", { htmlFor: inputId, style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
-  }, children: [label, required2 && (0, import_jsx_runtime11.jsx)("span", { "aria-hidden": "true", style: { color: "var(--ggui-color-error-500, #ef4444)", marginLeft: "2px" }, children: "*" })] }), (0, import_jsx_runtime11.jsx)("input", { id: inputId, type, placeholder, value, onChange: (e) => onChange?.(e.target.value), disabled, required: required2, "aria-invalid": hasError || void 0, "aria-describedby": hasMessage ? messageId : void 0, style: {
+  }, children: [label, required2 && (0, import_jsx_runtime9.jsx)("span", { "aria-hidden": "true", style: { color: "var(--ggui-color-error-500, #ef4444)", marginLeft: "2px" }, children: "*" })] }), (0, import_jsx_runtime9.jsx)("input", { id: inputId, type, placeholder, value, onChange: (e) => onChange?.(e.target.value), disabled, required: required2, "aria-invalid": hasError || void 0, "aria-describedby": hasMessage ? messageId : void 0, style: {
     ...sizeStyles2[size],
     width: "100%",
     borderRadius: "var(--ggui-shape-radius-md, 8px)",
@@ -36744,28 +36723,28 @@ function Input({ label, placeholder, value, onChange, type = "text", error: erro
     color: "var(--ggui-color-onSurface, #18181b)",
     transition: `border-color ${duration3.normal} ${easing.easeInOut}, box-shadow ${duration3.normal} ${easing.easeInOut}`,
     boxSizing: "border-box"
-  }, ...rest }), hasMessage && (0, import_jsx_runtime11.jsx)("span", { id: messageId, role: hasError ? "alert" : void 0, style: {
+  }, ...rest }), hasMessage && (0, import_jsx_runtime9.jsx)("span", { id: messageId, role: hasError ? "alert" : void 0, style: {
     fontSize: "var(--ggui-font-size-xs, 12px)",
     color: hasError ? "var(--ggui-color-error-500, #ef4444)" : "var(--ggui-color-onSurfaceVariant, #52525b)"
   }, children: error210 || helperText })] });
 }
 function TextArea({ label, placeholder, value, onChange, rows = 4, error: error210, helperText, required: required2, disabled, maxLength, showCount, autoResize, style, className, ...rest }) {
-  const uniqueId = (0, import_react18.useId)();
+  const uniqueId = (0, import_react13.useId)();
   const textareaId = `${uniqueId}-textarea`;
   const messageId = `${uniqueId}-message`;
   const hasError = Boolean(error210);
   const hasMessage = Boolean(error210 || helperText);
   const charCount = value?.length || 0;
-  return (0, import_jsx_runtime12.jsxs)("div", { className, style: {
+  return (0, import_jsx_runtime10.jsxs)("div", { className, style: {
     display: "flex",
     flexDirection: "column",
     gap: "var(--ggui-spacing-1, 4px)",
     ...style
-  }, children: [label && (0, import_jsx_runtime12.jsxs)("label", { htmlFor: textareaId, style: {
+  }, children: [label && (0, import_jsx_runtime10.jsxs)("label", { htmlFor: textareaId, style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
-  }, children: [label, required2 && (0, import_jsx_runtime12.jsx)("span", { "aria-hidden": "true", style: { color: "var(--ggui-color-error-500, #ef4444)", marginLeft: "2px" }, children: "*" })] }), (0, import_jsx_runtime12.jsx)("textarea", { id: textareaId, placeholder, value, onChange: (e) => onChange?.(e.target.value), rows, disabled, required: required2, maxLength, "aria-invalid": hasError || void 0, "aria-describedby": hasMessage ? messageId : void 0, style: {
+  }, children: [label, required2 && (0, import_jsx_runtime10.jsx)("span", { "aria-hidden": "true", style: { color: "var(--ggui-color-error-500, #ef4444)", marginLeft: "2px" }, children: "*" })] }), (0, import_jsx_runtime10.jsx)("textarea", { id: textareaId, placeholder, value, onChange: (e) => onChange?.(e.target.value), rows, disabled, required: required2, maxLength, "aria-invalid": hasError || void 0, "aria-describedby": hasMessage ? messageId : void 0, style: {
     padding: "10px 12px",
     width: "100%",
     borderRadius: "var(--ggui-shape-radius-md, 8px)",
@@ -36777,10 +36756,10 @@ function TextArea({ label, placeholder, value, onChange, rows = 4, error: error2
     transition: `border-color ${duration3.normal} ${easing.easeInOut}, box-shadow ${duration3.normal} ${easing.easeInOut}`,
     boxSizing: "border-box",
     resize: autoResize ? "none" : "vertical"
-  }, ...rest }), (0, import_jsx_runtime12.jsxs)("div", { style: { display: "flex", justifyContent: "space-between" }, children: [hasMessage && (0, import_jsx_runtime12.jsx)("span", { id: messageId, role: hasError ? "alert" : void 0, style: {
+  }, ...rest }), (0, import_jsx_runtime10.jsxs)("div", { style: { display: "flex", justifyContent: "space-between" }, children: [hasMessage && (0, import_jsx_runtime10.jsx)("span", { id: messageId, role: hasError ? "alert" : void 0, style: {
     fontSize: "var(--ggui-font-size-xs, 12px)",
     color: hasError ? "var(--ggui-color-error-500, #ef4444)" : "var(--ggui-color-onSurfaceVariant, #52525b)"
-  }, children: error210 || helperText }), showCount && maxLength && (0, import_jsx_runtime12.jsxs)("span", { style: {
+  }, children: error210 || helperText }), showCount && maxLength && (0, import_jsx_runtime10.jsxs)("span", { style: {
     fontSize: "var(--ggui-font-size-xs, 12px)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)",
     marginLeft: "auto"
@@ -36792,16 +36771,16 @@ var sizeStyles3 = {
   lg: { padding: "12px 14px", fontSize: "var(--ggui-font-size-base, 16px)" }
 };
 function Select({ label, value, onChange, options, placeholder, error: error210, helperText, required: required2, disabled, size = "md", style, className, ...rest }) {
-  const uniqueId = (0, import_react19.useId)();
+  const uniqueId = (0, import_react14.useId)();
   const selectId = `${uniqueId}-select`;
   const messageId = `${uniqueId}-message`;
   const hasError = Boolean(error210);
   const hasMessage = Boolean(error210 || helperText);
-  return (0, import_jsx_runtime13.jsxs)("div", { className, style: { display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-1, 4px)", ...style }, children: [label && (0, import_jsx_runtime13.jsxs)("label", { htmlFor: selectId, style: {
+  return (0, import_jsx_runtime11.jsxs)("div", { className, style: { display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-1, 4px)", ...style }, children: [label && (0, import_jsx_runtime11.jsxs)("label", { htmlFor: selectId, style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
-  }, children: [label, required2 && (0, import_jsx_runtime13.jsx)("span", { "aria-hidden": "true", style: { color: "var(--ggui-color-error-500, #ef4444)", marginLeft: "2px" }, children: "*" })] }), (0, import_jsx_runtime13.jsxs)("select", { id: selectId, value, onChange: (e) => onChange?.(e.target.value), disabled, required: required2, "aria-invalid": hasError || void 0, "aria-describedby": hasMessage ? messageId : void 0, style: {
+  }, children: [label, required2 && (0, import_jsx_runtime11.jsx)("span", { "aria-hidden": "true", style: { color: "var(--ggui-color-error-500, #ef4444)", marginLeft: "2px" }, children: "*" })] }), (0, import_jsx_runtime11.jsxs)("select", { id: selectId, value, onChange: (e) => onChange?.(e.target.value), disabled, required: required2, "aria-invalid": hasError || void 0, "aria-describedby": hasMessage ? messageId : void 0, style: {
     ...sizeStyles3[size],
     width: "100%",
     borderRadius: "var(--ggui-shape-radius-md, 8px)",
@@ -36816,26 +36795,26 @@ function Select({ label, value, onChange, options, placeholder, error: error210,
     paddingRight: "36px",
     boxSizing: "border-box",
     transition: `border-color ${duration3.normal} ${easing.easeInOut}, box-shadow ${duration3.normal} ${easing.easeInOut}`
-  }, ...rest, children: [placeholder && (0, import_jsx_runtime13.jsx)("option", { value: "", disabled: true, children: placeholder }), options.map((opt) => (0, import_jsx_runtime13.jsx)("option", { value: opt.value, disabled: opt.disabled, children: opt.label }, opt.value))] }), hasMessage && (0, import_jsx_runtime13.jsx)("span", { id: messageId, role: hasError ? "alert" : void 0, style: {
+  }, ...rest, children: [placeholder && (0, import_jsx_runtime11.jsx)("option", { value: "", disabled: true, children: placeholder }), options.map((opt) => (0, import_jsx_runtime11.jsx)("option", { value: opt.value, disabled: opt.disabled, children: opt.label }, opt.value))] }), hasMessage && (0, import_jsx_runtime11.jsx)("span", { id: messageId, role: hasError ? "alert" : void 0, style: {
     fontSize: "var(--ggui-font-size-xs, 12px)",
     color: hasError ? "var(--ggui-color-error-500, #ef4444)" : "var(--ggui-color-onSurfaceVariant, #52525b)"
   }, children: error210 || helperText })] });
 }
 function Checkbox({ label, checked, onChange, disabled, description, indeterminate, style, className }) {
-  return (0, import_jsx_runtime14.jsxs)("label", { className, style: {
+  return (0, import_jsx_runtime12.jsxs)("label", { className, style: {
     display: "flex",
     alignItems: "flex-start",
     gap: "var(--ggui-spacing-2, 8px)",
     cursor: disabled ? "not-allowed" : "pointer",
     opacity: disabled ? 0.5 : 1,
     ...style
-  }, children: [(0, import_jsx_runtime14.jsxs)("div", { style: {
+  }, children: [(0, import_jsx_runtime12.jsxs)("div", { style: {
     position: "relative",
     width: "18px",
     height: "18px",
     flexShrink: 0,
     marginTop: "2px"
-  }, children: [(0, import_jsx_runtime14.jsx)("input", { type: "checkbox", checked, onChange: (e) => onChange?.(e.target.checked), disabled, ref: (el) => {
+  }, children: [(0, import_jsx_runtime12.jsx)("input", { type: "checkbox", checked, onChange: (e) => onChange?.(e.target.checked), disabled, ref: (el) => {
     if (el)
       el.indeterminate = indeterminate || false;
   }, style: {
@@ -36845,7 +36824,7 @@ function Checkbox({ label, checked, onChange, disabled, description, indetermina
     margin: 0,
     opacity: 0,
     cursor: disabled ? "not-allowed" : "pointer"
-  } }), (0, import_jsx_runtime14.jsx)("div", { style: {
+  } }), (0, import_jsx_runtime12.jsx)("div", { style: {
     width: "18px",
     height: "18px",
     borderRadius: "var(--ggui-shape-radius-sm, 4px)",
@@ -36855,11 +36834,11 @@ function Checkbox({ label, checked, onChange, disabled, description, indetermina
     alignItems: "center",
     justifyContent: "center",
     transition: "all 0.2s"
-  }, children: (checked || indeterminate) && (0, import_jsx_runtime14.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", style: { color: "#ffffff" }, children: indeterminate ? (0, import_jsx_runtime14.jsx)("path", { d: "M2.5 6H9.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) : (0, import_jsx_runtime14.jsx)("path", { d: "M2.5 6L5 8.5L9.5 3.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] }), (label || description) && (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: [label && (0, import_jsx_runtime14.jsx)("span", { style: {
+  }, children: (checked || indeterminate) && (0, import_jsx_runtime12.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", style: { color: "#ffffff" }, children: indeterminate ? (0, import_jsx_runtime12.jsx)("path", { d: "M2.5 6H9.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) : (0, import_jsx_runtime12.jsx)("path", { d: "M2.5 6L5 8.5L9.5 3.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] }), (label || description) && (0, import_jsx_runtime12.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: [label && (0, import_jsx_runtime12.jsx)("span", { style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
-  }, children: label }), description && (0, import_jsx_runtime14.jsx)("span", { style: {
+  }, children: label }), description && (0, import_jsx_runtime12.jsx)("span", { style: {
     fontSize: "var(--ggui-font-size-xs, 12px)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
   }, children: description })] })] });
@@ -36871,15 +36850,15 @@ var sizeConfig = {
 };
 function Toggle({ label, checked, onChange, disabled, size = "md", style, className }) {
   const config2 = sizeConfig[size];
-  const [focused, setFocused] = (0, import_react20.useState)(false);
-  return (0, import_jsx_runtime15.jsxs)("label", { className, style: {
+  const [focused, setFocused] = (0, import_react15.useState)(false);
+  return (0, import_jsx_runtime13.jsxs)("label", { className, style: {
     display: "flex",
     alignItems: "center",
     gap: "var(--ggui-spacing-2, 8px)",
     cursor: disabled ? "not-allowed" : "pointer",
     opacity: disabled ? 0.5 : 1,
     ...style
-  }, children: [(0, import_jsx_runtime15.jsx)("div", { role: "switch", "aria-checked": checked, "aria-label": label, tabIndex: disabled ? -1 : 0, onClick: () => !disabled && onChange?.(!checked), onKeyDown: (e) => {
+  }, children: [(0, import_jsx_runtime13.jsx)("div", { role: "switch", "aria-checked": checked, "aria-label": label, tabIndex: disabled ? -1 : 0, onClick: () => !disabled && onChange?.(!checked), onKeyDown: (e) => {
     if (disabled)
       return;
     if (e.key === " " || e.key === "Enter") {
@@ -36896,7 +36875,7 @@ function Toggle({ label, checked, onChange, disabled, size = "md", style, classN
     flexShrink: 0,
     outline: "none",
     boxShadow: focused ? "0 0 0 3px var(--ggui-color-primary-200, #bae6fd)" : void 0
-  }, children: (0, import_jsx_runtime15.jsx)("div", { style: {
+  }, children: (0, import_jsx_runtime13.jsx)("div", { style: {
     width: config2.knob,
     height: config2.knob,
     borderRadius: "50%",
@@ -36906,23 +36885,23 @@ function Toggle({ label, checked, onChange, disabled, size = "md", style, classN
     left: checked ? config2.width - config2.knob - (config2.height - config2.knob) / 2 : (config2.height - config2.knob) / 2,
     transition: `left ${duration3.normal} ${easing.easeInOut}`,
     boxShadow: "var(--ggui-shape-shadow-sm, 0 1px 2px rgba(0,0,0,0.05))"
-  } }) }), label && (0, import_jsx_runtime15.jsx)("span", { style: {
+  } }) }), label && (0, import_jsx_runtime13.jsx)("span", { style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
   }, children: label })] });
 }
 function RadioGroup({ label, value, onChange, options, direction = "vertical", disabled, error: error210, style, className }) {
-  const uniqueId = (0, import_react21.useId)();
+  const uniqueId = (0, import_react16.useId)();
   const labelId = `${uniqueId}-label`;
   const errorId = `${uniqueId}-error`;
   const groupName = `${uniqueId}-radio`;
   const hasError = Boolean(error210);
-  return (0, import_jsx_runtime16.jsxs)("div", { role: "radiogroup", "aria-labelledby": label ? labelId : void 0, "aria-describedby": hasError ? errorId : void 0, className, style: { display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-2, 8px)", ...style }, children: [label && (0, import_jsx_runtime16.jsx)("span", { id: labelId, style: {
+  return (0, import_jsx_runtime14.jsxs)("div", { role: "radiogroup", "aria-labelledby": label ? labelId : void 0, "aria-describedby": hasError ? errorId : void 0, className, style: { display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-2, 8px)", ...style }, children: [label && (0, import_jsx_runtime14.jsx)("span", { id: labelId, style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
-  }, children: label }), (0, import_jsx_runtime16.jsx)("div", { style: {
+  }, children: label }), (0, import_jsx_runtime14.jsx)("div", { style: {
     display: "flex",
     flexDirection: direction === "vertical" ? "column" : "row",
     gap: direction === "vertical" ? "var(--ggui-spacing-2, 8px)" : "var(--ggui-spacing-4, 16px)",
@@ -36930,26 +36909,26 @@ function RadioGroup({ label, value, onChange, options, direction = "vertical", d
   }, children: options.map((option) => {
     const isSelected = value === option.value;
     const isDisabled = disabled || option.disabled;
-    return (0, import_jsx_runtime16.jsxs)("label", { style: {
+    return (0, import_jsx_runtime14.jsxs)("label", { style: {
       display: "flex",
       alignItems: "flex-start",
       gap: "var(--ggui-spacing-2, 8px)",
       cursor: isDisabled ? "not-allowed" : "pointer",
       opacity: isDisabled ? 0.5 : 1
-    }, children: [(0, import_jsx_runtime16.jsxs)("div", { style: {
+    }, children: [(0, import_jsx_runtime14.jsxs)("div", { style: {
       position: "relative",
       width: "18px",
       height: "18px",
       flexShrink: 0,
       marginTop: "2px"
-    }, children: [(0, import_jsx_runtime16.jsx)("input", { type: "radio", name: groupName, value: option.value, checked: isSelected, onChange: () => onChange?.(option.value), disabled: isDisabled, style: {
+    }, children: [(0, import_jsx_runtime14.jsx)("input", { type: "radio", name: groupName, value: option.value, checked: isSelected, onChange: () => onChange?.(option.value), disabled: isDisabled, style: {
       position: "absolute",
       width: "18px",
       height: "18px",
       margin: 0,
       opacity: 0,
       cursor: isDisabled ? "not-allowed" : "pointer"
-    } }), (0, import_jsx_runtime16.jsx)("div", { style: {
+    } }), (0, import_jsx_runtime14.jsx)("div", { style: {
       width: "18px",
       height: "18px",
       borderRadius: "var(--ggui-shape-radius-full, 9999px)",
@@ -36959,51 +36938,51 @@ function RadioGroup({ label, value, onChange, options, direction = "vertical", d
       alignItems: "center",
       justifyContent: "center",
       transition: "all 0.2s"
-    }, children: isSelected && (0, import_jsx_runtime16.jsx)("div", { style: {
+    }, children: isSelected && (0, import_jsx_runtime14.jsx)("div", { style: {
       width: "8px",
       height: "8px",
       borderRadius: "var(--ggui-shape-radius-full, 9999px)",
       backgroundColor: "var(--ggui-color-primary-600, #0284c7)"
-    } }) })] }), (0, import_jsx_runtime16.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: [(0, import_jsx_runtime16.jsx)("span", { style: {
+    } }) })] }), (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: [(0, import_jsx_runtime14.jsx)("span", { style: {
       fontSize: "var(--ggui-font-size-sm, 14px)",
       fontWeight: "var(--ggui-font-weight-medium, 500)",
       color: "var(--ggui-color-onSurfaceVariant, #52525b)"
-    }, children: option.label }), option.description && (0, import_jsx_runtime16.jsx)("span", { style: {
+    }, children: option.label }), option.description && (0, import_jsx_runtime14.jsx)("span", { style: {
       fontSize: "var(--ggui-font-size-xs, 12px)",
       color: "var(--ggui-color-onSurfaceVariant, #52525b)"
     }, children: option.description })] })] }, option.value);
-  }) }), error210 && (0, import_jsx_runtime16.jsx)("span", { id: errorId, role: "alert", style: {
+  }) }), error210 && (0, import_jsx_runtime14.jsx)("span", { id: errorId, role: "alert", style: {
     fontSize: "var(--ggui-font-size-xs, 12px)",
     color: "var(--ggui-color-error-500, #ef4444)"
   }, children: error210 })] });
 }
 function Slider({ label, value = 0, onChange, min = 0, max = 100, step = 1, disabled, showValue, style, className }) {
-  const uniqueId = (0, import_react22.useId)();
+  const uniqueId = (0, import_react17.useId)();
   const sliderId = `${uniqueId}-slider`;
   const labelId = `${uniqueId}-label`;
   const percentage = (value - min) / (max - min) * 100;
-  return (0, import_jsx_runtime17.jsxs)("div", { className, style: { display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-2, 8px)", ...style }, children: [(label || showValue) && (0, import_jsx_runtime17.jsxs)("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [label && (0, import_jsx_runtime17.jsx)("span", { id: labelId, style: {
+  return (0, import_jsx_runtime15.jsxs)("div", { className, style: { display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-2, 8px)", ...style }, children: [(label || showValue) && (0, import_jsx_runtime15.jsxs)("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [label && (0, import_jsx_runtime15.jsx)("span", { id: labelId, style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
-  }, children: label }), showValue && (0, import_jsx_runtime17.jsx)("span", { style: {
+  }, children: label }), showValue && (0, import_jsx_runtime15.jsx)("span", { style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-primary-600, #0284c7)"
-  }, children: value })] }), (0, import_jsx_runtime17.jsxs)("div", { style: { position: "relative", height: "20px", display: "flex", alignItems: "center" }, children: [(0, import_jsx_runtime17.jsx)("div", { style: {
+  }, children: value })] }), (0, import_jsx_runtime15.jsxs)("div", { style: { position: "relative", height: "20px", display: "flex", alignItems: "center" }, children: [(0, import_jsx_runtime15.jsx)("div", { style: {
     position: "absolute",
     width: "100%",
     height: "6px",
     borderRadius: "3px",
     backgroundColor: "var(--ggui-color-outlineVariant, #e4e4e7)"
-  } }), (0, import_jsx_runtime17.jsx)("div", { style: {
+  } }), (0, import_jsx_runtime15.jsx)("div", { style: {
     position: "absolute",
     width: `${percentage}%`,
     height: "6px",
     borderRadius: "3px",
     backgroundColor: disabled ? "var(--ggui-color-outline, #d4d4d8)" : "var(--ggui-color-primary-600, #0284c7)",
     transition: "width 0.1s"
-  } }), (0, import_jsx_runtime17.jsx)("input", { id: sliderId, type: "range", min, max, step, value, onChange: (e) => onChange?.(Number(e.target.value)), disabled, "aria-labelledby": label ? labelId : void 0, "aria-label": label ? void 0 : "Slider", "aria-valuenow": value, "aria-valuemin": min, "aria-valuemax": max, style: {
+  } }), (0, import_jsx_runtime15.jsx)("input", { id: sliderId, type: "range", min, max, step, value, onChange: (e) => onChange?.(Number(e.target.value)), disabled, "aria-labelledby": label ? labelId : void 0, "aria-label": label ? void 0 : "Slider", "aria-valuenow": value, "aria-valuemin": min, "aria-valuemax": max, style: {
     position: "absolute",
     width: "100%",
     height: "20px",
@@ -37011,7 +36990,7 @@ function Slider({ label, value = 0, onChange, min = 0, max = 100, step = 1, disa
     opacity: 0,
     cursor: disabled ? "not-allowed" : "pointer",
     zIndex: 1
-  } }), (0, import_jsx_runtime17.jsx)("div", { style: {
+  } }), (0, import_jsx_runtime15.jsx)("div", { style: {
     position: "absolute",
     left: `calc(${percentage}% - 10px)`,
     width: "20px",
@@ -37060,7 +37039,7 @@ var sizeStyles4 = {
   lg: { padding: "4px 10px", fontSize: "var(--ggui-font-size-sm, 14px)" }
 };
 function Badge({ children, variant = "default", size = "md", pill = true, style, className }) {
-  return (0, import_jsx_runtime18.jsx)("span", { className, style: {
+  return (0, import_jsx_runtime16.jsx)("span", { className, style: {
     ...variantStyles2[variant],
     ...sizeStyles4[size],
     display: "inline-flex",
@@ -37087,7 +37066,7 @@ function Skeleton({ variant = "rect", width, height, radius: radius2 = "sm", sty
     animation: "ggui-skeleton-pulse 1.5s ease-in-out infinite",
     ...style
   };
-  return (0, import_jsx_runtime19.jsx)("div", { className, style: composedStyle, "aria-hidden": "true", children: (0, import_jsx_runtime19.jsx)("style", { children: `@keyframes ggui-skeleton-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }` }) });
+  return (0, import_jsx_runtime17.jsx)("div", { className, style: composedStyle, "aria-hidden": "true", children: (0, import_jsx_runtime17.jsx)("style", { children: `@keyframes ggui-skeleton-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }` }) });
 }
 var sizeMap2 = {
   xs: 24,
@@ -37104,7 +37083,7 @@ var avatarColors = [
   "var(--ggui-color-info-500, #06b6d4)"
 ];
 function Avatar({ src, name, size = "md", shape = "circle", style, className }) {
-  const [imageError, setImageError] = (0, import_react23.useState)(false);
+  const [imageError, setImageError] = (0, import_react18.useState)(false);
   const resolvedSize = typeof size === "number" ? size : sizeMap2[size] || 40;
   const initials = name ? name.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2) : "?";
   const getColorFromName = (name2) => {
@@ -37114,7 +37093,7 @@ function Avatar({ src, name, size = "md", shape = "circle", style, className })
     return avatarColors[hash2 % avatarColors.length];
   };
   const showInitials = !src || imageError;
-  return (0, import_jsx_runtime20.jsx)("div", { role: "img", "aria-label": name || "Avatar", className, style: {
+  return (0, import_jsx_runtime18.jsx)("div", { role: "img", "aria-label": name || "Avatar", className, style: {
     width: resolvedSize,
     height: resolvedSize,
     borderRadius: shape === "circle" ? "50%" : "var(--ggui-shape-radius-md, 8px)",
@@ -37128,7 +37107,7 @@ function Avatar({ src, name, size = "md", shape = "circle", style, className })
     overflow: "hidden",
     flexShrink: 0,
     ...style
-  }, children: showInitials ? initials : (0, import_jsx_runtime20.jsx)("img", { src, alt: name || "Avatar", onError: () => setImageError(true), style: {
+  }, children: showInitials ? initials : (0, import_jsx_runtime18.jsx)("img", { src, alt: name || "Avatar", onError: () => setImageError(true), style: {
     width: "100%",
     height: "100%",
     objectFit: "cover"
@@ -37161,14 +37140,14 @@ var variantStyles3 = {
   }
 };
 var defaultIcons = {
-  info: (0, import_jsx_runtime21.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime21.jsx)("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) }),
-  success: (0, import_jsx_runtime21.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime21.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z", clipRule: "evenodd" }) }),
-  warning: (0, import_jsx_runtime21.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime21.jsx)("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) }),
-  error: (0, import_jsx_runtime21.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime21.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z", clipRule: "evenodd" }) })
+  info: (0, import_jsx_runtime19.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime19.jsx)("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) }),
+  success: (0, import_jsx_runtime19.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime19.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z", clipRule: "evenodd" }) }),
+  warning: (0, import_jsx_runtime19.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime19.jsx)("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) }),
+  error: (0, import_jsx_runtime19.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime19.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z", clipRule: "evenodd" }) })
 };
 function Alert({ children, variant = "info", title, closable, onClose, icon, style, className }) {
   const variantStyle = variantStyles3[variant];
-  return (0, import_jsx_runtime21.jsxs)("div", { role: "alert", className, style: {
+  return (0, import_jsx_runtime19.jsxs)("div", { role: "alert", className, style: {
     display: "flex",
     gap: "12px",
     padding: "12px 16px",
@@ -37177,10 +37156,10 @@ function Alert({ children, variant = "info", title, closable, onClose, icon, sty
     border: `1px solid ${variantStyle.border}`,
     color: variantStyle.text,
     ...style
-  }, children: [(0, import_jsx_runtime21.jsx)("div", { style: { color: variantStyle.icon, flexShrink: 0 }, children: icon || defaultIcons[variant] }), (0, import_jsx_runtime21.jsxs)("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-1, 4px)" }, children: [title && (0, import_jsx_runtime21.jsx)("div", { style: {
+  }, children: [(0, import_jsx_runtime19.jsx)("div", { style: { color: variantStyle.icon, flexShrink: 0 }, children: icon || defaultIcons[variant] }), (0, import_jsx_runtime19.jsxs)("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-1, 4px)" }, children: [title && (0, import_jsx_runtime19.jsx)("div", { style: {
     fontWeight: "var(--ggui-font-weight-semibold, 600)",
     fontSize: "var(--ggui-font-size-sm, 14px)"
-  }, children: title }), (0, import_jsx_runtime21.jsx)("div", { style: { fontSize: "var(--ggui-font-size-sm, 14px)" }, children })] }), closable && (0, import_jsx_runtime21.jsx)("button", { onClick: onClose, "aria-label": "Close", style: {
+  }, children: title }), (0, import_jsx_runtime19.jsx)("div", { style: { fontSize: "var(--ggui-font-size-sm, 14px)" }, children })] }), closable && (0, import_jsx_runtime19.jsx)("button", { onClick: onClose, "aria-label": "Close", style: {
     background: "none",
     border: "none",
     padding: "4px",
@@ -37195,7 +37174,7 @@ function Alert({ children, variant = "info", title, closable, onClose, icon, sty
     alignItems: "center",
     justifyContent: "center",
     borderRadius: "var(--ggui-shape-radius-sm, 4px)"
-  }, children: (0, import_jsx_runtime21.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime21.jsx)("path", { fillRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z", clipRule: "evenodd" }) }) })] });
+  }, children: (0, import_jsx_runtime19.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime19.jsx)("path", { fillRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z", clipRule: "evenodd" }) }) })] });
 }
 var variantColors = {
   default: "var(--ggui-color-primary-600, #0284c7)",
@@ -37213,17 +37192,17 @@ function Progress({ value, max = 100, variant = "default", size = "md", label, s
   const height = sizeHeights[size];
   const barColor = variantColors[variant];
   const accessibleName = label ?? "Progress";
-  return (0, import_jsx_runtime22.jsxs)("div", { className, style: { display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-1, 4px)", ...style }, children: [showLabel && (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [(0, import_jsx_runtime22.jsx)("span", { style: { fontSize: "var(--ggui-font-size-sm, 14px)", color: "var(--ggui-color-onSurfaceVariant, #52525b)" }, children: accessibleName }), (0, import_jsx_runtime22.jsxs)("span", { style: {
+  return (0, import_jsx_runtime20.jsxs)("div", { className, style: { display: "flex", flexDirection: "column", gap: "var(--ggui-spacing-1, 4px)", ...style }, children: [showLabel && (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [(0, import_jsx_runtime20.jsx)("span", { style: { fontSize: "var(--ggui-font-size-sm, 14px)", color: "var(--ggui-color-onSurfaceVariant, #52525b)" }, children: accessibleName }), (0, import_jsx_runtime20.jsxs)("span", { style: {
     fontSize: "var(--ggui-font-size-sm, 14px)",
     fontWeight: "var(--ggui-font-weight-medium, 500)",
     color: "var(--ggui-color-onSurface, #18181b)"
-  }, children: [Math.round(percentage), "%"] })] }), (0, import_jsx_runtime22.jsxs)("div", { role: "progressbar", "aria-valuenow": indeterminate ? void 0 : value, "aria-valuemin": 0, "aria-valuemax": max, "aria-label": accessibleName, style: {
+  }, children: [Math.round(percentage), "%"] })] }), (0, import_jsx_runtime20.jsxs)("div", { role: "progressbar", "aria-valuenow": indeterminate ? void 0 : value, "aria-valuemin": 0, "aria-valuemax": max, "aria-label": accessibleName, style: {
     width: "100%",
     height,
     borderRadius: height / 2,
     backgroundColor: "var(--ggui-color-outlineVariant, #e4e4e7)",
     overflow: "hidden"
-  }, children: [(0, import_jsx_runtime22.jsx)("div", { style: {
+  }, children: [(0, import_jsx_runtime20.jsx)("div", { style: {
     height: "100%",
     borderRadius: height / 2,
     backgroundColor: barColor,
@@ -37234,23 +37213,23 @@ function Progress({ value, max = 100, variant = "default", size = "md", label, s
     } : {
       width: `${percentage}%`
     }
-  } }), indeterminate && (0, import_jsx_runtime22.jsx)("style", { children: `@keyframes ggui-progress-indeterminate {
+  } }), indeterminate && (0, import_jsx_runtime20.jsx)("style", { children: `@keyframes ggui-progress-indeterminate {
               0% { transform: translateX(-100%); }
               100% { transform: translateX(400%); }
             }` })] })] });
 }
 function Image({ src, alt, width, height, objectFit = "cover", radius: radius2, fallback, style, className }) {
-  const [error210, setError] = (0, import_react24.useState)(false);
+  const [error210, setError] = (0, import_react19.useState)(false);
   const resolveSize2 = (value) => {
     if (value === void 0)
       return void 0;
     return typeof value === "number" ? `${value}px` : value;
   };
   if (error210 && fallback) {
-    return (0, import_jsx_runtime23.jsx)(import_jsx_runtime23.Fragment, { children: fallback });
+    return (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, { children: fallback });
   }
   if (error210) {
-    return (0, import_jsx_runtime23.jsx)("div", { role: "img", "aria-label": `${alt} (failed to load)`, className, style: {
+    return (0, import_jsx_runtime21.jsx)("div", { role: "img", "aria-label": `${alt} (failed to load)`, className, style: {
       width: resolveSize2(width) || "100%",
       height: resolveSize2(height) || "auto",
       borderRadius: resolveRadius(radius2),
@@ -37260,9 +37239,9 @@ function Image({ src, alt, width, height, objectFit = "cover", radius: radius2,
       justifyContent: "center",
       color: "var(--ggui-color-outline, #d4d4d8)",
       ...style
-    }, children: (0, import_jsx_runtime23.jsx)("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "currentColor", children: (0, import_jsx_runtime23.jsx)("path", { d: "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z" }) }) });
+    }, children: (0, import_jsx_runtime21.jsx)("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "currentColor", children: (0, import_jsx_runtime21.jsx)("path", { d: "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z" }) }) });
   }
-  return (0, import_jsx_runtime23.jsx)("img", { src, alt, onError: () => setError(true), className, style: {
+  return (0, import_jsx_runtime21.jsx)("img", { src, alt, onError: () => setError(true), className, style: {
     width: resolveSize2(width) || "100%",
     height: resolveSize2(height) || "auto",
     objectFit,
@@ -41253,7 +41232,7 @@ function resolveLucideName(name) {
   return LUCIDE_LOOKUP.get(normalized);
 }
 function renderLucideIcon(data, size, color) {
-  return (0, import_jsx_runtime24.jsx)("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: data.map(([tag, attrs], i) => import_react25.default.createElement(tag, { key: i, ...attrs })) });
+  return (0, import_jsx_runtime22.jsx)("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: data.map(([tag, attrs], i) => import_react20.default.createElement(tag, { key: i, ...attrs })) });
 }
 function Icon({ name, size = 24, tone, children, style, className, "aria-label": ariaLabel }) {
   const iconColor = tone ? resolveToneCss(tone) : "currentColor";
@@ -41268,22 +41247,22 @@ function Icon({ name, size = 24, tone, children, style, className, "aria-label":
     ...style
   };
   if (children) {
-    return (0, import_jsx_runtime24.jsx)("span", { className, style: wrapStyle, ...a11yProps, children });
+    return (0, import_jsx_runtime22.jsx)("span", { className, style: wrapStyle, ...a11yProps, children });
   }
   if (name) {
     const lucideKey = resolveLucideName(name);
     if (lucideKey) {
-      return (0, import_jsx_runtime24.jsx)("span", { className, style: wrapStyle, ...a11yProps, children: renderLucideIcon(LUCIDE_ICONS[lucideKey], size, iconColor) });
+      return (0, import_jsx_runtime22.jsx)("span", { className, style: wrapStyle, ...a11yProps, children: renderLucideIcon(LUCIDE_ICONS[lucideKey], size, iconColor) });
     }
   }
   if (name && /[^\x00-\x7F]/.test(name)) {
-    return (0, import_jsx_runtime24.jsx)("span", { className, ...a11yProps, style: {
+    return (0, import_jsx_runtime22.jsx)("span", { className, ...a11yProps, style: {
       ...wrapStyle,
       fontSize: size * 0.75,
       lineHeight: 1
     }, children: name });
   }
-  return (0, import_jsx_runtime24.jsx)("span", { className, ...a11yProps, style: {
+  return (0, import_jsx_runtime22.jsx)("span", { className, ...a11yProps, style: {
     ...wrapStyle,
     backgroundColor: "var(--ggui-color-outlineVariant, #e4e4e7)",
     borderRadius: "var(--ggui-shape-radius-sm, 4px)",
@@ -41298,7 +41277,7 @@ function Link({ children, href, external, tone, underline = "hover", style, clas
     hover: "none",
     none: "none"
   }[underline];
-  return (0, import_jsx_runtime25.jsxs)("a", { href, target: external ? "_blank" : void 0, rel: external ? "noopener noreferrer" : void 0, className, style: {
+  return (0, import_jsx_runtime23.jsxs)("a", { href, target: external ? "_blank" : void 0, rel: external ? "noopener noreferrer" : void 0, className, style: {
     color: linkColor,
     textDecoration: underlineStyle,
     cursor: "pointer",
@@ -41312,13 +41291,13 @@ function Link({ children, href, external, tone, underline = "hover", style, clas
     if (underline === "hover") {
       e.target.style.textDecoration = "none";
     }
-  }, ...rest, children: [children, external && (0, import_jsx_runtime25.jsxs)("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", style: { marginLeft: "4px", verticalAlign: "middle" }, children: [(0, import_jsx_runtime25.jsx)("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }), (0, import_jsx_runtime25.jsx)("polyline", { points: "15 3 21 3 21 9" }), (0, import_jsx_runtime25.jsx)("line", { x1: "10", y1: "14", x2: "21", y2: "3" })] })] });
+  }, ...rest, children: [children, external && (0, import_jsx_runtime23.jsxs)("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", style: { marginLeft: "4px", verticalAlign: "middle" }, children: [(0, import_jsx_runtime23.jsx)("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }), (0, import_jsx_runtime23.jsx)("polyline", { points: "15 3 21 3 21 9" }), (0, import_jsx_runtime23.jsx)("line", { x1: "10", y1: "14", x2: "21", y2: "3" })] })] });
 }
 function Tooltip({ children, content, position = "top", delay = 200, style, className }) {
-  const [visible, setVisible] = (0, import_react26.useState)(false);
-  const [coords, setCoords] = (0, import_react26.useState)({ top: 0, left: 0 });
-  const triggerRef = (0, import_react26.useRef)(null);
-  const timeoutRef = (0, import_react26.useRef)(null);
+  const [visible, setVisible] = (0, import_react21.useState)(false);
+  const [coords, setCoords] = (0, import_react21.useState)({ top: 0, left: 0 });
+  const triggerRef = (0, import_react21.useRef)(null);
+  const timeoutRef = (0, import_react21.useRef)(null);
   const showTooltip = () => {
     timeoutRef.current = setTimeout(() => {
       setVisible(true);
@@ -41330,7 +41309,7 @@ function Tooltip({ children, content, position = "top", delay = 200, style, clas
     }
     setVisible(false);
   };
-  (0, import_react26.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (visible && triggerRef.current) {
       const rect = triggerRef.current.getBoundingClientRect();
       const offset = 8;
@@ -41357,7 +41336,7 @@ function Tooltip({ children, content, position = "top", delay = 200, style, clas
       setCoords({ top, left });
     }
   }, [visible, position]);
-  (0, import_react26.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     return () => {
       if (timeoutRef.current) {
         clearTimeout(timeoutRef.current);
@@ -41376,10 +41355,10 @@ function Tooltip({ children, content, position = "top", delay = 200, style, clas
         return "translateY(-50%)";
     }
   };
-  return (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [(0, import_jsx_runtime26.jsx)("div", { ref: triggerRef, onMouseEnter: showTooltip, onMouseLeave: hideTooltip, onFocus: showTooltip, onBlur: hideTooltip, className, style: {
+  return (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [(0, import_jsx_runtime24.jsx)("div", { ref: triggerRef, onMouseEnter: showTooltip, onMouseLeave: hideTooltip, onFocus: showTooltip, onBlur: hideTooltip, className, style: {
     display: "inline-block",
     ...style
-  }, children }), visible && (0, import_jsx_runtime26.jsx)("div", { role: "tooltip", style: {
+  }, children }), visible && (0, import_jsx_runtime24.jsx)("div", { role: "tooltip", style: {
     position: "fixed",
     top: coords.top,
     left: coords.left,
@@ -41395,16 +41374,16 @@ function Tooltip({ children, content, position = "top", delay = 200, style, clas
     whiteSpace: "nowrap"
   }, children: content })] });
 }
-var sortIndicator = (active, direction) => (0, import_jsx_runtime27.jsxs)("span", { "aria-hidden": "true", style: {
+var sortIndicator = (active, direction) => (0, import_jsx_runtime25.jsxs)("span", { "aria-hidden": "true", style: {
   display: "inline-flex",
   flexDirection: "column",
   marginLeft: "4px",
   fontSize: "10px",
   lineHeight: 1,
   opacity: active ? 1 : 0.3
-}, children: [(0, import_jsx_runtime27.jsx)("span", { style: { opacity: active && direction === "asc" ? 1 : 0.4 }, children: "\u25B2" }), (0, import_jsx_runtime27.jsx)("span", { style: { opacity: active && direction === "desc" ? 1 : 0.4 }, children: "\u25BC" })] });
+}, children: [(0, import_jsx_runtime25.jsx)("span", { style: { opacity: active && direction === "asc" ? 1 : 0.4 }, children: "\u25B2" }), (0, import_jsx_runtime25.jsx)("span", { style: { opacity: active && direction === "desc" ? 1 : 0.4 }, children: "\u25BC" })] });
 function Table({ columns, data, sortKey, sortDirection = "asc", onSort, striped = false, hoverable = true, compact = false, bordered = false, caption, style, className }) {
-  const [hoveredRow, setHoveredRow] = (0, import_react27.useState)(null);
+  const [hoveredRow, setHoveredRow] = (0, import_react22.useState)(null);
   const cellPadding = compact ? "var(--ggui-spacing-1, 4px) var(--ggui-spacing-2, 8px)" : "var(--ggui-spacing-2, 8px) var(--ggui-spacing-4, 16px)";
   const handleSort = (key) => {
     if (!onSort)
@@ -41412,7 +41391,7 @@ function Table({ columns, data, sortKey, sortDirection = "asc", onSort, striped
     const newDirection = sortKey === key && sortDirection === "asc" ? "desc" : "asc";
     onSort(key, newDirection);
   };
-  const headerStyle2 = {
+  const headerStyle = {
     padding: cellPadding,
     textAlign: "left",
     fontWeight: "var(--ggui-font-weight-semibold, 600)",
@@ -41424,36 +41403,36 @@ function Table({ columns, data, sortKey, sortDirection = "asc", onSort, striped
     whiteSpace: "nowrap",
     userSelect: "none"
   };
-  return (0, import_jsx_runtime27.jsx)("div", { className, style: {
+  return (0, import_jsx_runtime25.jsx)("div", { className, style: {
     overflowX: "auto",
     borderRadius: "var(--ggui-shape-radius-lg, 8px)",
     border: bordered ? "1px solid var(--ggui-color-outlineVariant, #e4e4e7)" : void 0,
     ...style
-  }, children: (0, import_jsx_runtime27.jsxs)("table", { role: "table", style: {
+  }, children: (0, import_jsx_runtime25.jsxs)("table", { role: "table", style: {
     width: "100%",
     borderCollapse: "collapse",
     fontSize: "var(--ggui-font-size-sm, 14px)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)"
-  }, children: [caption && (0, import_jsx_runtime27.jsx)("caption", { style: {
+  }, children: [caption && (0, import_jsx_runtime25.jsx)("caption", { style: {
     padding: cellPadding,
     fontSize: "var(--ggui-font-size-sm, 14px)",
     color: "var(--ggui-color-onSurfaceVariant, #52525b)",
     textAlign: "left",
     captionSide: "top"
-  }, children: caption }), (0, import_jsx_runtime27.jsx)("thead", { children: (0, import_jsx_runtime27.jsx)("tr", { children: columns.map((col) => (0, import_jsx_runtime27.jsx)("th", { scope: "col", "aria-sort": sortKey === col.key ? sortDirection === "asc" ? "ascending" : "descending" : void 0, onClick: col.sortable ? () => handleSort(col.key) : void 0, onKeyDown: col.sortable ? (e) => {
+  }, children: caption }), (0, import_jsx_runtime25.jsx)("thead", { children: (0, import_jsx_runtime25.jsx)("tr", { children: columns.map((col) => (0, import_jsx_runtime25.jsx)("th", { scope: "col", "aria-sort": sortKey === col.key ? sortDirection === "asc" ? "ascending" : "descending" : void 0, onClick: col.sortable ? () => handleSort(col.key) : void 0, onKeyDown: col.sortable ? (e) => {
     if (e.key === "Enter" || e.key === " ") {
       e.preventDefault();
       handleSort(col.key);
     }
   } : void 0, tabIndex: col.sortable ? 0 : void 0, style: {
-    ...headerStyle2,
+    ...headerStyle,
     textAlign: col.align || "left",
     width: col.width,
     cursor: col.sortable ? "pointer" : "default"
-  }, children: (0, import_jsx_runtime27.jsxs)("span", { style: { display: "inline-flex", alignItems: "center" }, children: [col.header, col.sortable && sortIndicator(sortKey === col.key, sortDirection)] }) }, col.key)) }) }), (0, import_jsx_runtime27.jsx)("tbody", { children: data.map((row, rowIndex) => (0, import_jsx_runtime27.jsx)("tr", { onMouseEnter: hoverable ? () => setHoveredRow(rowIndex) : void 0, onMouseLeave: hoverable ? () => setHoveredRow(null) : void 0, style: {
+  }, children: (0, import_jsx_runtime25.jsxs)("span", { style: { display: "inline-flex", alignItems: "center" }, children: [col.header, col.sortable && sortIndicator(sortKey === col.key, sortDirection)] }) }, col.key)) }) }), (0, import_jsx_runtime25.jsx)("tbody", { children: data.map((row, rowIndex) => (0, import_jsx_runtime25.jsx)("tr", { onMouseEnter: hoverable ? () => setHoveredRow(rowIndex) : void 0, onMouseLeave: hoverable ? () => setHoveredRow(null) : void 0, style: {
     backgroundColor: hoverable && hoveredRow === rowIndex ? "var(--ggui-color-surface, #fafafa)" : striped && rowIndex % 2 === 1 ? "var(--ggui-color-surface, #fafafa)" : "transparent",
     transition: "background-color 0.15s ease"
-  }, children: columns.map((col) => (0, import_jsx_runtime27.jsx)("td", { style: {
+  }, children: columns.map((col) => (0, import_jsx_runtime25.jsx)("td", { style: {
     padding: cellPadding,
     textAlign: col.align || "left",
     borderBottom: "1px solid var(--ggui-color-surfaceVariant, #f4f4f5)",
@@ -41475,10 +41454,10 @@ var sizeStyles5 = {
   }
 };
 function Tabs({ items, activeKey, onChange, variant = "line", size = "md", fullWidth = false, style, className }) {
-  const uniqueId = (0, import_react28.useId)();
-  const [internalKey, setInternalKey] = (0, import_react28.useState)(items[0]?.key);
+  const uniqueId = (0, import_react23.useId)();
+  const [internalKey, setInternalKey] = (0, import_react23.useState)(items[0]?.key);
   const currentKey = activeKey ?? internalKey;
-  const handleChange = (0, import_react28.useCallback)((key) => {
+  const handleChange = (0, import_react23.useCallback)((key) => {
     if (onChange) {
       onChange(key);
     } else {
@@ -41486,8 +41465,8 @@ function Tabs({ items, activeKey, onChange, variant = "line", size = "md", fullW
     }
   }, [onChange]);
   const activeItem = items.find((item) => item.key === currentKey);
-  const tabListRef = (0, import_react28.useRef)(null);
-  const handleTabKeyDown = (0, import_react28.useCallback)((e) => {
+  const tabListRef = (0, import_react23.useRef)(null);
+  const handleTabKeyDown = (0, import_react23.useCallback)((e) => {
     const enabledItems = items.filter((item) => !item.disabled);
     const currentIndex = enabledItems.findIndex((item) => item.key === currentKey);
     let nextIndex;
@@ -41561,11 +41540,11 @@ function Tabs({ items, activeKey, onChange, variant = "line", size = "md", fullW
     borderRadius: variant === "pills" ? "var(--ggui-shape-radius-lg, 8px)" : void 0,
     padding: variant === "pills" ? "var(--ggui-spacing-1, 4px)" : void 0
   };
-  return (0, import_jsx_runtime28.jsxs)("div", { className, style, children: [(0, import_jsx_runtime28.jsx)("div", { ref: tabListRef, role: "tablist", "aria-orientation": "horizontal", style: tabListStyle, children: items.map((item) => {
+  return (0, import_jsx_runtime26.jsxs)("div", { className, style, children: [(0, import_jsx_runtime26.jsx)("div", { ref: tabListRef, role: "tablist", "aria-orientation": "horizontal", style: tabListStyle, children: items.map((item) => {
     const isActive = item.key === currentKey;
     const isDisabled = !!item.disabled;
-    return (0, import_jsx_runtime28.jsxs)("button", { role: "tab", id: `${uniqueId}-tab-${item.key}`, "aria-selected": isActive, "aria-controls": `${uniqueId}-panel-${item.key}`, "aria-disabled": isDisabled, tabIndex: isActive ? 0 : -1, onClick: isDisabled ? void 0 : () => handleChange(item.key), onKeyDown: isDisabled ? void 0 : handleTabKeyDown, style: getTabStyle(isActive, isDisabled), children: [item.icon, item.label] }, item.key);
-  }) }), activeItem && (0, import_jsx_runtime28.jsx)("div", { role: "tabpanel", id: `${uniqueId}-panel-${activeItem.key}`, "aria-labelledby": `${uniqueId}-tab-${activeItem.key}`, tabIndex: 0, style: {
+    return (0, import_jsx_runtime26.jsxs)("button", { role: "tab", id: `${uniqueId}-tab-${item.key}`, "aria-selected": isActive, "aria-controls": `${uniqueId}-panel-${item.key}`, "aria-disabled": isDisabled, tabIndex: isActive ? 0 : -1, onClick: isDisabled ? void 0 : () => handleChange(item.key), onKeyDown: isDisabled ? void 0 : handleTabKeyDown, style: getTabStyle(isActive, isDisabled), children: [item.icon, item.label] }, item.key);
+  }) }), activeItem && (0, import_jsx_runtime26.jsx)("div", { role: "tabpanel", id: `${uniqueId}-panel-${activeItem.key}`, "aria-labelledby": `${uniqueId}-tab-${activeItem.key}`, tabIndex: 0, style: {
     padding: "var(--ggui-spacing-4, 16px) 0"
   }, children: activeItem.content })] });
 }
@@ -41745,20 +41724,20 @@ var variantStyles4 = {
   }
 };
 var defaultIcons2 = {
-  info: (0, import_jsx_runtime29.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime29.jsx)("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) }),
-  success: (0, import_jsx_runtime29.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime29.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z", clipRule: "evenodd" }) }),
-  warning: (0, import_jsx_runtime29.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime29.jsx)("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) }),
-  error: (0, import_jsx_runtime29.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime29.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z", clipRule: "evenodd" }) })
+  info: (0, import_jsx_runtime27.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime27.jsx)("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) }),
+  success: (0, import_jsx_runtime27.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime27.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z", clipRule: "evenodd" }) }),
+  warning: (0, import_jsx_runtime27.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime27.jsx)("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) }),
+  error: (0, import_jsx_runtime27.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime27.jsx)("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z", clipRule: "evenodd" }) })
 };
 function Toast({ message, variant = "info", title, duration: duration22 = 5e3, onClose, visible = true, style, className }) {
-  (0, import_react29.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     if (!visible || duration22 === 0 || !onClose)
       return;
     const timer = setTimeout(onClose, duration22);
     return () => clearTimeout(timer);
   }, [visible, duration22, onClose]);
   if (!visible) {
-    return (0, import_jsx_runtime29.jsx)("div", { role: "alert", "aria-live": "assertive", className, style: {
+    return (0, import_jsx_runtime27.jsx)("div", { role: "alert", "aria-live": "assertive", className, style: {
       position: "absolute",
       width: "1px",
       height: "1px",
@@ -41783,10 +41762,10 @@ function Toast({ message, variant = "info", title, duration: duration22 = 5e3, o
     animation: animation.slideInUp,
     ...style
   };
-  return (0, import_jsx_runtime29.jsxs)("div", { role: "alert", "aria-live": "assertive", className, style: toastStyle, children: [(0, import_jsx_runtime29.jsx)("div", { style: { color: vs.icon, flexShrink: 0, marginTop: "2px" }, children: defaultIcons2[variant] }), (0, import_jsx_runtime29.jsxs)("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "2px" }, children: [title && (0, import_jsx_runtime29.jsx)("div", { style: {
+  return (0, import_jsx_runtime27.jsxs)("div", { role: "alert", "aria-live": "assertive", className, style: toastStyle, children: [(0, import_jsx_runtime27.jsx)("div", { style: { color: vs.icon, flexShrink: 0, marginTop: "2px" }, children: defaultIcons2[variant] }), (0, import_jsx_runtime27.jsxs)("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "2px" }, children: [title && (0, import_jsx_runtime27.jsx)("div", { style: {
     fontWeight: "var(--ggui-font-weight-semibold, 600)",
     fontSize: "var(--ggui-font-size-sm, 14px)"
-  }, children: title }), (0, import_jsx_runtime29.jsx)("div", { style: { fontSize: "var(--ggui-font-size-sm, 14px)" }, children: message })] }), onClose && (0, import_jsx_runtime29.jsx)("button", { onClick: onClose, "aria-label": "Dismiss notification", style: {
+  }, children: title }), (0, import_jsx_runtime27.jsx)("div", { style: { fontSize: "var(--ggui-font-size-sm, 14px)" }, children: message })] }), onClose && (0, import_jsx_runtime27.jsx)("button", { onClick: onClose, "aria-label": "Dismiss notification", style: {
     background: "none",
     border: "none",
     padding: "4px",
@@ -41801,16 +41780,16 @@ function Toast({ message, variant = "info", title, duration: duration22 = 5e3, o
     alignItems: "center",
     justifyContent: "center",
     borderRadius: "var(--ggui-shape-radius-sm, 4px)"
-  }, children: (0, import_jsx_runtime29.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime29.jsx)("path", { fillRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z", clipRule: "evenodd" }) }) })] });
+  }, children: (0, import_jsx_runtime27.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "currentColor", children: (0, import_jsx_runtime27.jsx)("path", { fillRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z", clipRule: "evenodd" }) }) })] });
 }
-var chevron = (expanded) => (0, import_jsx_runtime30.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", style: {
+var chevron = (expanded) => (0, import_jsx_runtime28.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", style: {
   transition: `transform ${duration3.normal} ${easing.easeInOut}`,
   transform: expanded ? "rotate(180deg)" : "rotate(0deg)",
   flexShrink: 0
-}, children: (0, import_jsx_runtime30.jsx)("path", { fillRule: "evenodd", d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z", clipRule: "evenodd" }) });
+}, children: (0, import_jsx_runtime28.jsx)("path", { fillRule: "evenodd", d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z", clipRule: "evenodd" }) });
 function Accordion({ items, expandedKeys, onChange, multiple = false, variant = "default", style, className }) {
-  const uniqueId = (0, import_react30.useId)();
-  const [internalExpanded, setInternalExpanded] = (0, import_react30.useState)([]);
+  const uniqueId = (0, import_react25.useId)();
+  const [internalExpanded, setInternalExpanded] = (0, import_react25.useState)([]);
   const currentExpanded = expandedKeys ?? internalExpanded;
   const handleToggle = (key) => {
     let newExpanded;
@@ -41858,12 +41837,12 @@ function Accordion({ items, expandedKeys, onChange, multiple = false, variant =
       borderTop: isFirst ? "1px solid var(--ggui-color-outlineVariant, #e4e4e7)" : void 0
     };
   };
-  return (0, import_jsx_runtime30.jsx)("div", { className, style: containerStyle, children: items.map((item, index) => {
+  return (0, import_jsx_runtime28.jsx)("div", { className, style: containerStyle, children: items.map((item, index) => {
     const isExpanded = currentExpanded.includes(item.key);
     const isDisabled = !!item.disabled;
     const isFirst = index === 0;
     const isLast = index === items.length - 1;
-    return (0, import_jsx_runtime30.jsxs)("div", { style: getItemStyle(isFirst, isLast), children: [(0, import_jsx_runtime30.jsx)("h3", { style: { margin: 0 }, children: (0, import_jsx_runtime30.jsxs)("button", { id: `${uniqueId}-header-${item.key}`, "aria-expanded": isExpanded, "aria-controls": `${uniqueId}-panel-${item.key}`, "aria-disabled": isDisabled, onClick: isDisabled ? void 0 : () => handleToggle(item.key), style: {
+    return (0, import_jsx_runtime28.jsxs)("div", { style: getItemStyle(isFirst, isLast), children: [(0, import_jsx_runtime28.jsx)("h3", { style: { margin: 0 }, children: (0, import_jsx_runtime28.jsxs)("button", { id: `${uniqueId}-header-${item.key}`, "aria-expanded": isExpanded, "aria-controls": `${uniqueId}-panel-${item.key}`, "aria-disabled": isDisabled, onClick: isDisabled ? void 0 : () => handleToggle(item.key), style: {
       display: "flex",
       alignItems: "center",
       justifyContent: "space-between",
@@ -41878,9 +41857,9 @@ function Accordion({ items, expandedKeys, onChange, multiple = false, variant =
       color: "var(--ggui-color-onSurface, #18181b)",
       textAlign: "left",
       transition: `background-color ${duration3.fast} ${easing.easeInOut}`
-    }, children: [(0, import_jsx_runtime30.jsx)("span", { children: item.title }), chevron(isExpanded)] }) }), (0, import_jsx_runtime30.jsx)("div", { id: `${uniqueId}-panel-${item.key}`, role: "region", "aria-labelledby": `${uniqueId}-header-${item.key}`, hidden: !isExpanded, style: {
+    }, children: [(0, import_jsx_runtime28.jsx)("span", { children: item.title }), chevron(isExpanded)] }) }), (0, import_jsx_runtime28.jsx)("div", { id: `${uniqueId}-panel-${item.key}`, role: "region", "aria-labelledby": `${uniqueId}-header-${item.key}`, hidden: !isExpanded, style: {
       overflow: "hidden"
-    }, children: isExpanded && (0, import_jsx_runtime30.jsx)("div", { style: {
+    }, children: isExpanded && (0, import_jsx_runtime28.jsx)("div", { style: {
       padding: "0 var(--ggui-spacing-4, 16px) var(--ggui-spacing-4, 16px)",
       fontSize: "var(--ggui-font-size-sm, 14px)",
       color: "var(--ggui-color-onSurfaceVariant, #52525b)",
@@ -41890,7 +41869,7 @@ function Accordion({ items, expandedKeys, onChange, multiple = false, variant =
 }
 var STYLE_ID = "ggui-motion-keyframes";
 function MotionKeyframes() {
-  (0, import_react31.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     if (document.getElementById(STYLE_ID))
       return;
     const styleEl = document.createElement("style");
@@ -41907,12 +41886,12 @@ function MotionKeyframes() {
   return null;
 }
 function useMotion() {
-  const [motionEnabled, setMotionEnabled] = (0, import_react31.useState)(() => {
+  const [motionEnabled, setMotionEnabled] = (0, import_react26.useState)(() => {
     if (typeof window === "undefined")
       return true;
     return !window.matchMedia("(prefers-reduced-motion: reduce)").matches;
   });
-  (0, import_react31.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     const mq = window.matchMedia("(prefers-reduced-motion: reduce)");
     const handler = (e) => setMotionEnabled(!e.matches);
     mq.addEventListener("change", handler);
@@ -41921,9 +41900,9 @@ function useMotion() {
   return { motionEnabled };
 }
 function useAnimationKey(dep) {
-  const [key, setKey] = (0, import_react31.useState)(0);
-  const isFirst = (0, import_react31.useRef)(true);
-  (0, import_react31.useEffect)(() => {
+  const [key, setKey] = (0, import_react26.useState)(0);
+  const isFirst = (0, import_react26.useRef)(true);
+  (0, import_react26.useEffect)(() => {
     if (isFirst.current) {
       isFirst.current = false;
       return;
@@ -42061,7 +42040,7 @@ var colors = {
   transparent: "transparent"
 };
 function SearchField({ value: controlledValue, onChange, onSearch, placeholder = "Search...", showButton = false, buttonText = "Search", loading, disabled, size = "md", style, className }) {
-  const [internalValue, setInternalValue] = (0, import_react32.useState)("");
+  const [internalValue, setInternalValue] = (0, import_react27.useState)("");
   const value = controlledValue !== void 0 ? controlledValue : internalValue;
   const handleChange = (newValue) => {
     if (controlledValue === void 0) {
@@ -42082,12 +42061,12 @@ function SearchField({ value: controlledValue, onChange, onSearch, placeholder =
     md: "md",
     lg: "md"
   };
-  return (0, import_jsx_runtime31.jsxs)("div", { className, style: {
+  return (0, import_jsx_runtime29.jsxs)("div", { className, style: {
     display: "flex",
     gap: "8px",
     alignItems: "flex-end",
     ...style
-  }, children: [(0, import_jsx_runtime31.jsxs)("div", { style: { position: "relative", flex: 1 }, children: [(0, import_jsx_runtime31.jsx)("div", { style: {
+  }, children: [(0, import_jsx_runtime29.jsxs)("div", { style: { position: "relative", flex: 1 }, children: [(0, import_jsx_runtime29.jsx)("div", { style: {
     position: "absolute",
     left: "12px",
     top: "50%",
@@ -42096,7 +42075,7 @@ function SearchField({ value: controlledValue, onChange, onSearch, placeholder =
     pointerEvents: "none",
     display: "flex",
     alignItems: "center"
-  }, children: loading ? (0, import_jsx_runtime31.jsx)(Spinner, { size: 16 }) : (0, import_jsx_runtime31.jsx)(Icon, { name: "search", size: 16 }) }), (0, import_jsx_runtime31.jsx)("input", { type: "search", value, onChange: (e) => handleChange(e.target.value), onKeyDown: handleKeyDown, placeholder, disabled: disabled || loading, style: {
+  }, children: loading ? (0, import_jsx_runtime29.jsx)(Spinner, { size: 16 }) : (0, import_jsx_runtime29.jsx)(Icon, { name: "search", size: 16 }) }), (0, import_jsx_runtime29.jsx)("input", { type: "search", value, onChange: (e) => handleChange(e.target.value), onKeyDown: handleKeyDown, placeholder, disabled: disabled || loading, style: {
     width: "100%",
     padding: size === "sm" ? "6px 10px 6px 36px" : size === "lg" ? "12px 14px 12px 40px" : "10px 12px 10px 38px",
     paddingLeft: "36px",
@@ -42107,24 +42086,24 @@ function SearchField({ value: controlledValue, onChange, onSearch, placeholder =
     color: colors.gray[900],
     outline: "none",
     boxSizing: "border-box"
-  } })] }), showButton && (0, import_jsx_runtime31.jsx)(Button, { onClick: handleSubmit, disabled: disabled || loading, size: buttonSizes[size], loading, children: buttonText })] });
+  } })] }), showButton && (0, import_jsx_runtime29.jsx)(Button, { onClick: handleSubmit, disabled: disabled || loading, size: buttonSizes[size], loading, children: buttonText })] });
 }
 function FormField({ label, children, error: error210, helperText, required: required2, description, style, className }) {
   const hasError = Boolean(error210);
-  return (0, import_jsx_runtime32.jsxs)("div", { className, style: {
+  return (0, import_jsx_runtime30.jsxs)("div", { className, style: {
     display: "flex",
     flexDirection: "column",
     gap: "4px",
     ...style
-  }, children: [(0, import_jsx_runtime32.jsxs)("label", { style: {
+  }, children: [(0, import_jsx_runtime30.jsxs)("label", { style: {
     fontSize: fontSize.sm,
     fontWeight: fontWeight.medium,
     color: colors.gray[700]
-  }, children: [label, required2 && (0, import_jsx_runtime32.jsx)("span", { style: { color: colors.error[500], marginLeft: "2px" }, children: "*" })] }), description && (0, import_jsx_runtime32.jsx)("span", { style: {
+  }, children: [label, required2 && (0, import_jsx_runtime30.jsx)("span", { style: { color: colors.error[500], marginLeft: "2px" }, children: "*" })] }), description && (0, import_jsx_runtime30.jsx)("span", { style: {
     fontSize: fontSize.xs,
     color: colors.gray[500],
     marginBottom: "4px"
-  }, children: description }), children, (error210 || helperText) && (0, import_jsx_runtime32.jsx)("span", { style: {
+  }, children: description }), children, (error210 || helperText) && (0, import_jsx_runtime30.jsx)("span", { style: {
     fontSize: fontSize.xs,
     color: hasError ? colors.error[500] : colors.gray[500]
   }, children: error210 || helperText })] });
@@ -42133,7 +42112,7 @@ function MenuItem({ label, icon, rightElement, onClick, disabled, active, danger
   const baseColor = danger ? colors.error[600] : colors.gray[700];
   const hoverBg = danger ? colors.error[50] : colors.gray[100];
   const activeBg = danger ? colors.error[100] : colors.primary[50];
-  return (0, import_jsx_runtime33.jsxs)("button", { onClick: disabled ? void 0 : onClick, disabled, className, style: {
+  return (0, import_jsx_runtime31.jsxs)("button", { onClick: disabled ? void 0 : onClick, disabled, className, style: {
     display: "flex",
     alignItems: "center",
     gap: "8px",
@@ -42157,7 +42136,7 @@ function MenuItem({ label, icon, rightElement, onClick, disabled, active, danger
     if (!disabled && !active) {
       e.target.style.backgroundColor = "transparent";
     }
-  }, children: [icon && (0, import_jsx_runtime33.jsx)("span", { style: { display: "flex", flexShrink: 0 }, children: icon }), (0, import_jsx_runtime33.jsx)("span", { style: { flex: 1 }, children: label }), rightElement && (0, import_jsx_runtime33.jsx)("span", { style: { display: "flex", flexShrink: 0, color: colors.gray[400] }, children: rightElement })] });
+  }, children: [icon && (0, import_jsx_runtime31.jsx)("span", { style: { display: "flex", flexShrink: 0 }, children: icon }), (0, import_jsx_runtime31.jsx)("span", { style: { flex: 1 }, children: label }), rightElement && (0, import_jsx_runtime31.jsx)("span", { style: { display: "flex", flexShrink: 0, color: colors.gray[400] }, children: rightElement })] });
 }
 var variantStyles5 = {
   default: {
@@ -42198,7 +42177,7 @@ var sizeStyles6 = {
 };
 function Tag({ children, variant = "default", size = "md", closable, onClose, icon, style, className }) {
   const sizeStyle = sizeStyles6[size];
-  return (0, import_jsx_runtime34.jsxs)("span", { className, style: {
+  return (0, import_jsx_runtime32.jsxs)("span", { className, style: {
     display: "inline-flex",
     alignItems: "center",
     gap: sizeStyle.gap,
@@ -42208,7 +42187,7 @@ function Tag({ children, variant = "default", size = "md", closable, onClose, ic
     borderRadius: "6px",
     ...variantStyles5[variant],
     ...style
-  }, children: [icon && (0, import_jsx_runtime34.jsx)("span", { style: { display: "flex" }, children: icon }), children, closable && (0, import_jsx_runtime34.jsx)("button", { onClick: onClose, style: {
+  }, children: [icon && (0, import_jsx_runtime32.jsx)("span", { style: { display: "flex" }, children: icon }), children, closable && (0, import_jsx_runtime32.jsx)("button", { onClick: onClose, style: {
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
@@ -42219,12 +42198,12 @@ function Tag({ children, variant = "default", size = "md", closable, onClose, ic
     cursor: "pointer",
     opacity: 0.7,
     marginLeft: "2px"
-  }, "aria-label": "Remove", children: (0, import_jsx_runtime34.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "currentColor", children: (0, import_jsx_runtime34.jsx)("path", { d: "M9.5 3.205L8.795 2.5 6 5.295 3.205 2.5l-.705.705L5.295 6 2.5 8.795l.705.705L6 6.705 8.795 9.5l.705-.705L6.705 6 9.5 3.205z" }) }) })] });
+  }, "aria-label": "Remove", children: (0, import_jsx_runtime32.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "currentColor", children: (0, import_jsx_runtime32.jsx)("path", { d: "M9.5 3.205L8.795 2.5 6 5.295 3.205 2.5l-.705.705L5.295 6 2.5 8.795l.705.705L6 6.705 8.795 9.5l.705-.705L6.705 6 9.5 3.205z" }) }) })] });
 }
 function Dropdown({ trigger, options, value, onChange, placement = "bottom-start", disabled, style, className }) {
-  const [isOpen, setIsOpen] = (0, import_react33.useState)(false);
-  const containerRef = (0, import_react33.useRef)(null);
-  (0, import_react33.useEffect)(() => {
+  const [isOpen, setIsOpen] = (0, import_react28.useState)(false);
+  const containerRef = (0, import_react28.useRef)(null);
+  (0, import_react28.useEffect)(() => {
     const handleClickOutside = (event) => {
       if (containerRef.current && !containerRef.current.contains(event.target)) {
         setIsOpen(false);
@@ -42235,7 +42214,7 @@ function Dropdown({ trigger, options, value, onChange, placement = "bottom-start
       return () => document.removeEventListener("mousedown", handleClickOutside);
     }
   }, [isOpen]);
-  (0, import_react33.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     const handleEscape = (event) => {
       if (event.key === "Escape") {
         setIsOpen(false);
@@ -42264,11 +42243,11 @@ function Dropdown({ trigger, options, value, onChange, placement = "bottom-start
         return { top: "100%", left: 0, marginTop: "4px" };
     }
   };
-  return (0, import_jsx_runtime35.jsxs)("div", { ref: containerRef, className, style: {
+  return (0, import_jsx_runtime33.jsxs)("div", { ref: containerRef, className, style: {
     position: "relative",
     display: "inline-block",
     ...style
-  }, children: [(0, import_jsx_runtime35.jsx)("div", { onClick: () => !disabled && setIsOpen(!isOpen), style: { cursor: disabled ? "not-allowed" : "pointer" }, children: trigger }), isOpen && (0, import_jsx_runtime35.jsx)("div", { style: {
+  }, children: [(0, import_jsx_runtime33.jsx)("div", { onClick: () => !disabled && setIsOpen(!isOpen), style: { cursor: disabled ? "not-allowed" : "pointer" }, children: trigger }), isOpen && (0, import_jsx_runtime33.jsx)("div", { style: {
     position: "absolute",
     ...getMenuPosition(),
     minWidth: "160px",
@@ -42278,19 +42257,19 @@ function Dropdown({ trigger, options, value, onChange, placement = "bottom-start
     boxShadow: shadow.lg,
     zIndex: zIndex.dropdown,
     padding: "4px"
-  }, children: options.map((option) => (0, import_jsx_runtime35.jsx)(MenuItem, { label: option.label, icon: option.icon, onClick: () => handleSelect(option.value), disabled: option.disabled, active: value === option.value, danger: option.danger }, option.value)) })] });
+  }, children: options.map((option) => (0, import_jsx_runtime33.jsx)(MenuItem, { label: option.label, icon: option.icon, onClick: () => handleSelect(option.value), disabled: option.disabled, active: value === option.value, danger: option.danger }, option.value)) })] });
 }
 function Autocomplete({ value = "", onChange, onSelect, options, placeholder, label, loading, disabled, error: error210, noResultsText = "No results found", style, className }) {
-  const [isOpen, setIsOpen] = (0, import_react34.useState)(false);
-  const [highlightedIndex, setHighlightedIndex] = (0, import_react34.useState)(-1);
-  const containerRef = (0, import_react34.useRef)(null);
-  const filteredOptions = (0, import_react34.useMemo)(() => {
+  const [isOpen, setIsOpen] = (0, import_react29.useState)(false);
+  const [highlightedIndex, setHighlightedIndex] = (0, import_react29.useState)(-1);
+  const containerRef = (0, import_react29.useRef)(null);
+  const filteredOptions = (0, import_react29.useMemo)(() => {
     if (!value)
       return options;
     const lowerValue = value.toLowerCase();
     return options.filter((opt) => opt.label.toLowerCase().includes(lowerValue) || opt.value.toLowerCase().includes(lowerValue));
   }, [options, value]);
-  (0, import_react34.useEffect)(() => {
+  (0, import_react29.useEffect)(() => {
     const handleClickOutside = (event) => {
       if (containerRef.current && !containerRef.current.contains(event.target)) {
         setIsOpen(false);
@@ -42338,10 +42317,10 @@ function Autocomplete({ value = "", onChange, onSelect, options, placeholder, la
         break;
     }
   };
-  return (0, import_jsx_runtime36.jsxs)("div", { ref: containerRef, className, style: {
+  return (0, import_jsx_runtime34.jsxs)("div", { ref: containerRef, className, style: {
     position: "relative",
     ...style
-  }, children: [(0, import_jsx_runtime36.jsx)("div", { onKeyDown: handleKeyDown, children: (0, import_jsx_runtime36.jsx)(Input, { label, value, onChange: handleInputChange, onFocus: () => setIsOpen(true), placeholder, disabled, error: error210 }) }), isOpen && (0, import_jsx_runtime36.jsx)("div", { style: {
+  }, children: [(0, import_jsx_runtime34.jsx)("div", { onKeyDown: handleKeyDown, children: (0, import_jsx_runtime34.jsx)(Input, { label, value, onChange: handleInputChange, onFocus: () => setIsOpen(true), placeholder, disabled, error: error210 }) }), isOpen && (0, import_jsx_runtime34.jsx)("div", { style: {
     position: "absolute",
     top: "100%",
     left: 0,
@@ -42354,12 +42333,12 @@ function Autocomplete({ value = "", onChange, onSelect, options, placeholder, la
     zIndex: zIndex.dropdown,
     maxHeight: "240px",
     overflow: "auto"
-  }, children: loading ? (0, import_jsx_runtime36.jsx)("div", { style: { padding: "12px", display: "flex", justifyContent: "center" }, children: (0, import_jsx_runtime36.jsx)(Spinner, { size: 20 }) }) : filteredOptions.length === 0 ? (0, import_jsx_runtime36.jsx)("div", { style: {
+  }, children: loading ? (0, import_jsx_runtime34.jsx)("div", { style: { padding: "12px", display: "flex", justifyContent: "center" }, children: (0, import_jsx_runtime34.jsx)(Spinner, { size: 20 }) }) : filteredOptions.length === 0 ? (0, import_jsx_runtime34.jsx)("div", { style: {
     padding: "12px",
     textAlign: "center",
     color: colors.gray[500],
     fontSize: fontSize.sm
-  }, children: noResultsText }) : filteredOptions.map((option, index) => (0, import_jsx_runtime36.jsxs)("div", { onClick: () => !option.disabled && handleSelect(option), style: {
+  }, children: noResultsText }) : filteredOptions.map((option, index) => (0, import_jsx_runtime34.jsxs)("div", { onClick: () => !option.disabled && handleSelect(option), style: {
     padding: "8px 12px",
     cursor: option.disabled ? "not-allowed" : "pointer",
     backgroundColor: highlightedIndex === index ? colors.gray[100] : "transparent",
@@ -42368,10 +42347,10 @@ function Autocomplete({ value = "", onChange, onSelect, options, placeholder, la
     display: "flex",
     alignItems: "center",
     gap: "8px"
-  }, onMouseEnter: () => setHighlightedIndex(index), children: [option.icon && (0, import_jsx_runtime36.jsx)("span", { style: { flexShrink: 0 }, children: option.icon }), (0, import_jsx_runtime36.jsxs)("div", { style: { flex: 1 }, children: [(0, import_jsx_runtime36.jsx)("div", { children: option.label }), option.description && (0, import_jsx_runtime36.jsx)("div", { style: { fontSize: fontSize.xs, color: colors.gray[500] }, children: option.description })] })] }, option.value)) })] });
+  }, onMouseEnter: () => setHighlightedIndex(index), children: [option.icon && (0, import_jsx_runtime34.jsx)("span", { style: { flexShrink: 0 }, children: option.icon }), (0, import_jsx_runtime34.jsxs)("div", { style: { flex: 1 }, children: [(0, import_jsx_runtime34.jsx)("div", { children: option.label }), option.description && (0, import_jsx_runtime34.jsx)("div", { style: { fontSize: fontSize.xs, color: colors.gray[500] }, children: option.description })] })] }, option.value)) })] });
 }
 function Breadcrumb({ items, separator = "/", onItemClick, style, className }) {
-  return (0, import_jsx_runtime37.jsx)("nav", { "aria-label": "Breadcrumb", className, style: {
+  return (0, import_jsx_runtime35.jsx)("nav", { "aria-label": "Breadcrumb", className, style: {
     display: "flex",
     alignItems: "center",
     gap: "8px",
@@ -42379,19 +42358,19 @@ function Breadcrumb({ items, separator = "/", onItemClick, style, className }) {
     ...style
   }, children: items.map((item, index) => {
     const isLast = index === items.length - 1;
-    return (0, import_jsx_runtime37.jsxs)(import_react35.Fragment, { children: [index > 0 && (0, import_jsx_runtime37.jsx)("span", { style: { color: colors.gray[400] }, children: separator }), item.icon && (0, import_jsx_runtime37.jsx)("span", { style: {
+    return (0, import_jsx_runtime35.jsxs)(import_react30.Fragment, { children: [index > 0 && (0, import_jsx_runtime35.jsx)("span", { style: { color: colors.gray[400] }, children: separator }), item.icon && (0, import_jsx_runtime35.jsx)("span", { style: {
       display: "flex",
       alignItems: "center",
       color: isLast ? colors.gray[900] : colors.gray[500]
-    }, children: item.icon }), isLast ? (0, import_jsx_runtime37.jsx)("span", { style: {
+    }, children: item.icon }), isLast ? (0, import_jsx_runtime35.jsx)("span", { style: {
       color: colors.gray[900],
       fontWeight: 500
-    }, "aria-current": "page", children: item.label }) : item.href ? (0, import_jsx_runtime37.jsx)(Link, { href: item.href, tone: "muted", underline: "hover", onClick: (e) => {
+    }, "aria-current": "page", children: item.label }) : item.href ? (0, import_jsx_runtime35.jsx)(Link, { href: item.href, tone: "muted", underline: "hover", onClick: (e) => {
       if (onItemClick) {
         e.preventDefault();
         onItemClick(item, index);
       }
-    }, children: item.label }) : (0, import_jsx_runtime37.jsx)("button", { onClick: () => onItemClick?.(item, index), style: {
+    }, children: item.label }) : (0, import_jsx_runtime35.jsx)("button", { onClick: () => onItemClick?.(item, index), style: {
       background: "none",
       border: "none",
       padding: 0,
@@ -42434,7 +42413,7 @@ function Pagination({ currentPage, totalPages, onPageChange, showFirstLast = tru
   };
   const buttonSize = size === "sm" ? "xs" : size === "lg" ? "md" : "sm";
   const iconSize = size === "sm" ? 14 : size === "lg" ? 20 : 16;
-  const PageButton = ({ page, active }) => (0, import_jsx_runtime38.jsx)("button", { onClick: () => !disabled && onPageChange?.(page), disabled, style: {
+  const PageButton = ({ page, active }) => (0, import_jsx_runtime36.jsx)("button", { onClick: () => !disabled && onPageChange?.(page), disabled, style: {
     minWidth: size === "sm" ? "28px" : size === "lg" ? "40px" : "32px",
     height: size === "sm" ? "28px" : size === "lg" ? "40px" : "32px",
     padding: "0 8px",
@@ -42448,15 +42427,15 @@ function Pagination({ currentPage, totalPages, onPageChange, showFirstLast = tru
     opacity: disabled ? 0.5 : 1,
     transition: "all 0.15s"
   }, children: page });
-  return (0, import_jsx_runtime38.jsxs)("nav", { "aria-label": "Pagination", className, style: {
+  return (0, import_jsx_runtime36.jsxs)("nav", { "aria-label": "Pagination", className, style: {
     display: "flex",
     alignItems: "center",
     gap: "4px",
     ...style
-  }, children: [showFirstLast && (0, import_jsx_runtime38.jsxs)(Button, { variant: "ghost", size: buttonSize, onClick: () => onPageChange?.(1), disabled: disabled || currentPage === 1, "aria-label": "First page", children: [(0, import_jsx_runtime38.jsx)(Icon, { name: "chevron-left", size: iconSize }), (0, import_jsx_runtime38.jsx)(Icon, { name: "chevron-left", size: iconSize, style: { marginLeft: "-8px" } })] }), (0, import_jsx_runtime38.jsx)(Button, { variant: "ghost", size: buttonSize, onClick: () => onPageChange?.(currentPage - 1), disabled: disabled || currentPage === 1, "aria-label": "Previous page", children: (0, import_jsx_runtime38.jsx)(Icon, { name: "chevron-left", size: iconSize }) }), getVisiblePages().map((page, index) => page === "ellipsis" ? (0, import_jsx_runtime38.jsx)("span", { style: {
+  }, children: [showFirstLast && (0, import_jsx_runtime36.jsxs)(Button, { variant: "ghost", size: buttonSize, onClick: () => onPageChange?.(1), disabled: disabled || currentPage === 1, "aria-label": "First page", children: [(0, import_jsx_runtime36.jsx)(Icon, { name: "chevron-left", size: iconSize }), (0, import_jsx_runtime36.jsx)(Icon, { name: "chevron-left", size: iconSize, style: { marginLeft: "-8px" } })] }), (0, import_jsx_runtime36.jsx)(Button, { variant: "ghost", size: buttonSize, onClick: () => onPageChange?.(currentPage - 1), disabled: disabled || currentPage === 1, "aria-label": "Previous page", children: (0, import_jsx_runtime36.jsx)(Icon, { name: "chevron-left", size: iconSize }) }), getVisiblePages().map((page, index) => page === "ellipsis" ? (0, import_jsx_runtime36.jsx)("span", { style: {
     padding: "0 4px",
     color: colors.gray[400]
-  }, children: "..." }, `ellipsis-${index}`) : (0, import_jsx_runtime38.jsx)(PageButton, { page, active: page === currentPage }, page)), (0, import_jsx_runtime38.jsx)(Button, { variant: "ghost", size: buttonSize, onClick: () => onPageChange?.(currentPage + 1), disabled: disabled || currentPage === totalPages, "aria-label": "Next page", children: (0, import_jsx_runtime38.jsx)(Icon, { name: "chevron-right", size: iconSize }) }), showFirstLast && (0, import_jsx_runtime38.jsxs)(Button, { variant: "ghost", size: buttonSize, onClick: () => onPageChange?.(totalPages), disabled: disabled || currentPage === totalPages, "aria-label": "Last page", children: [(0, import_jsx_runtime38.jsx)(Icon, { name: "chevron-right", size: iconSize }), (0, import_jsx_runtime38.jsx)(Icon, { name: "chevron-right", size: iconSize, style: { marginLeft: "-8px" } })] })] });
+  }, children: "..." }, `ellipsis-${index}`) : (0, import_jsx_runtime36.jsx)(PageButton, { page, active: page === currentPage }, page)), (0, import_jsx_runtime36.jsx)(Button, { variant: "ghost", size: buttonSize, onClick: () => onPageChange?.(currentPage + 1), disabled: disabled || currentPage === totalPages, "aria-label": "Next page", children: (0, import_jsx_runtime36.jsx)(Icon, { name: "chevron-right", size: iconSize }) }), showFirstLast && (0, import_jsx_runtime36.jsxs)(Button, { variant: "ghost", size: buttonSize, onClick: () => onPageChange?.(totalPages), disabled: disabled || currentPage === totalPages, "aria-label": "Last page", children: [(0, import_jsx_runtime36.jsx)(Icon, { name: "chevron-right", size: iconSize }), (0, import_jsx_runtime36.jsx)(Icon, { name: "chevron-right", size: iconSize, style: { marginLeft: "-8px" } })] })] });
 }
 function EmptyState({ icon, title, description, action, style, className }) {
   const composedStyle = {
@@ -42464,11 +42443,11 @@ function EmptyState({ icon, title, description, action, style, className }) {
     padding: "var(--ggui-spacing-xl, 32px)",
     ...style
   };
-  return (0, import_jsx_runtime39.jsxs)(Stack, { align: "center", gap: "sm", className, style: composedStyle, children: [icon !== void 0 && (typeof icon === "string" ? (0, import_jsx_runtime39.jsx)(Icon, { name: icon, size: 40, tone: "subtle" }) : icon), (0, import_jsx_runtime39.jsx)(Heading, { level: 3, children: title }), description !== void 0 && (0, import_jsx_runtime39.jsx)(Text, { tone: "muted", children: description }), action !== void 0 && (0, import_jsx_runtime39.jsx)("div", { style: { marginTop: "var(--ggui-spacing-sm, 8px)" }, children: action })] });
+  return (0, import_jsx_runtime37.jsxs)(Stack, { align: "center", gap: "sm", className, style: composedStyle, children: [icon !== void 0 && (typeof icon === "string" ? (0, import_jsx_runtime37.jsx)(Icon, { name: icon, size: 40, tone: "subtle" }) : icon), (0, import_jsx_runtime37.jsx)(Heading, { level: 3, children: title }), description !== void 0 && (0, import_jsx_runtime37.jsx)(Text, { tone: "muted", children: description }), action !== void 0 && (0, import_jsx_runtime37.jsx)("div", { style: { marginTop: "var(--ggui-spacing-sm, 8px)" }, children: action })] });
 }
 function Stat({ label, value, delta, trend = "neutral", icon, style, className }) {
   const deltaTone = trend === "up" ? "success" : trend === "down" ? "error" : "muted";
-  return (0, import_jsx_runtime40.jsxs)(Stack, { gap: "xs", className, style, children: [(0, import_jsx_runtime40.jsxs)(Row, { gap: "xs", align: "center", children: [icon !== void 0 && (typeof icon === "string" ? (0, import_jsx_runtime40.jsx)(Icon, { name: icon, size: 16, tone: "muted" }) : icon), (0, import_jsx_runtime40.jsx)(Text, { size: "xs", weight: "semibold", caps: true, tone: "muted", children: label })] }), (0, import_jsx_runtime40.jsxs)(Row, { gap: "sm", align: "end", children: [(0, import_jsx_runtime40.jsx)(Text, { size: "3xl", weight: "bold", children: value }), delta !== void 0 && (0, import_jsx_runtime40.jsx)(Text, { size: "sm", weight: "semibold", tone: deltaTone, children: delta })] })] });
+  return (0, import_jsx_runtime38.jsxs)(Stack, { gap: "xs", className, style, children: [(0, import_jsx_runtime38.jsxs)(Row, { gap: "xs", align: "center", children: [icon !== void 0 && (typeof icon === "string" ? (0, import_jsx_runtime38.jsx)(Icon, { name: icon, size: 16, tone: "muted" }) : icon), (0, import_jsx_runtime38.jsx)(Text, { size: "xs", weight: "semibold", caps: true, tone: "muted", children: label })] }), (0, import_jsx_runtime38.jsxs)(Row, { gap: "sm", align: "end", children: [(0, import_jsx_runtime38.jsx)(Text, { size: "3xl", weight: "bold", children: value }), delta !== void 0 && (0, import_jsx_runtime38.jsx)(Text, { size: "sm", weight: "semibold", tone: deltaTone, children: delta })] })] });
 }
 var MARKER_SIZE = 28;
 function stepState(index, current) {
@@ -42496,7 +42475,7 @@ var markerStyles = {
   }
 };
 function Marker({ index, state }) {
-  return (0, import_jsx_runtime41.jsx)("span", { "aria-hidden": "true", style: {
+  return (0, import_jsx_runtime39.jsx)("span", { "aria-hidden": "true", style: {
     width: MARKER_SIZE,
     height: MARKER_SIZE,
     borderRadius: "50%",
@@ -42507,19 +42486,19 @@ function Marker({ index, state }) {
     boxSizing: "border-box",
     transition: "background-color 0.2s, border-color 0.2s, color 0.2s",
     ...markerStyles[state]
-  }, children: state === "completed" ? (0, import_jsx_runtime41.jsx)(Icon, { name: "check", size: 16, tone: "inherit" }) : (0, import_jsx_runtime41.jsx)(Text, { is: "span", size: "sm", weight: "semibold", tone: "inherit", children: index + 1 }) });
+  }, children: state === "completed" ? (0, import_jsx_runtime39.jsx)(Icon, { name: "check", size: 16, tone: "inherit" }) : (0, import_jsx_runtime39.jsx)(Text, { is: "span", size: "sm", weight: "semibold", tone: "inherit", children: index + 1 }) });
 }
 function StepLabel({ label, state }) {
-  return (0, import_jsx_runtime41.jsx)(Text, { is: "span", size: "sm", weight: state === "current" ? "semibold" : "normal", tone: state === "upcoming" ? "muted" : "default", children: label });
+  return (0, import_jsx_runtime39.jsx)(Text, { is: "span", size: "sm", weight: state === "current" ? "semibold" : "normal", tone: state === "upcoming" ? "muted" : "default", children: label });
 }
 function Stepper({ steps, current, orientation = "horizontal", onStepClick, style, className }) {
   const renderStep = (label, index) => {
     const state = stepState(index, current);
-    const content = (0, import_jsx_runtime41.jsxs)(Row, { gap: "sm", align: "center", children: [(0, import_jsx_runtime41.jsx)(Marker, { index, state }), (0, import_jsx_runtime41.jsx)(StepLabel, { label, state })] });
+    const content = (0, import_jsx_runtime39.jsxs)(Row, { gap: "sm", align: "center", children: [(0, import_jsx_runtime39.jsx)(Marker, { index, state }), (0, import_jsx_runtime39.jsx)(StepLabel, { label, state })] });
     if (onStepClick === void 0) {
-      return (0, import_jsx_runtime41.jsx)("span", { "aria-current": state === "current" ? "step" : void 0, children: content });
+      return (0, import_jsx_runtime39.jsx)("span", { "aria-current": state === "current" ? "step" : void 0, children: content });
     }
-    return (0, import_jsx_runtime41.jsx)("button", { type: "button", onClick: () => onStepClick(index), "aria-current": state === "current" ? "step" : void 0, style: {
+    return (0, import_jsx_runtime39.jsx)("button", { type: "button", onClick: () => onStepClick(index), "aria-current": state === "current" ? "step" : void 0, style: {
       background: "none",
       border: "none",
       padding: 0,
@@ -42530,14 +42509,14 @@ function Stepper({ steps, current, orientation = "horizontal", onStepClick, styl
     }, children: content });
   };
   if (orientation === "vertical") {
-    return (0, import_jsx_runtime41.jsx)("nav", { "aria-label": "Progress", className, style, children: (0, import_jsx_runtime41.jsx)(Stack, { gap: "none", align: "start", children: steps.map((label, index) => (0, import_jsx_runtime41.jsxs)(Stack, { gap: "none", align: "start", children: [index > 0 && (0, import_jsx_runtime41.jsx)("span", { style: {
+    return (0, import_jsx_runtime39.jsx)("nav", { "aria-label": "Progress", className, style, children: (0, import_jsx_runtime39.jsx)(Stack, { gap: "none", align: "start", children: steps.map((label, index) => (0, import_jsx_runtime39.jsxs)(Stack, { gap: "none", align: "start", children: [index > 0 && (0, import_jsx_runtime39.jsx)("span", { style: {
       width: MARKER_SIZE,
       height: 16,
       display: "inline-flex",
       justifyContent: "center"
-    }, children: (0, import_jsx_runtime41.jsx)(Divider, { orientation: "vertical", margin: 0 }) }), renderStep(label, index)] }, index)) }) });
+    }, children: (0, import_jsx_runtime39.jsx)(Divider, { orientation: "vertical", margin: 0 }) }), renderStep(label, index)] }, index)) }) });
   }
-  return (0, import_jsx_runtime41.jsx)("nav", { "aria-label": "Progress", className, style, children: (0, import_jsx_runtime41.jsx)(Row, { gap: "sm", align: "center", children: steps.map((label, index) => (0, import_jsx_runtime41.jsxs)(Row, { gap: "sm", align: "center", style: index > 0 ? { flex: 1 } : void 0, children: [index > 0 && (0, import_jsx_runtime41.jsx)(Divider, { style: { flex: 1, minWidth: 16, margin: 0 } }), renderStep(label, index)] }, index)) }) });
+  return (0, import_jsx_runtime39.jsx)("nav", { "aria-label": "Progress", className, style, children: (0, import_jsx_runtime39.jsx)(Row, { gap: "sm", align: "center", children: steps.map((label, index) => (0, import_jsx_runtime39.jsxs)(Row, { gap: "sm", align: "center", style: index > 0 ? { flex: 1 } : void 0, children: [index > 0 && (0, import_jsx_runtime39.jsx)(Divider, { style: { flex: 1, minWidth: 16, margin: 0 } }), renderStep(label, index)] }, index)) }) });
 }
 var SAFE_HREF = /^(?:https?:\/\/|mailto:)[^\s\x00-\x1f]+$/i;
 function safeHref(raw) {
@@ -42846,16 +42825,16 @@ function renderRichTextInlines(inlines) {
       case "text":
         return node.text;
       case "break":
-        return (0, import_jsx_runtime42.jsx)("br", {}, i);
+        return (0, import_jsx_runtime40.jsx)("br", {}, i);
       case "strong":
-        return (0, import_jsx_runtime42.jsx)("strong", { children: renderRichTextInlines(node.children) }, i);
+        return (0, import_jsx_runtime40.jsx)("strong", { children: renderRichTextInlines(node.children) }, i);
       case "em":
-        return (0, import_jsx_runtime42.jsx)("em", { children: renderRichTextInlines(node.children) }, i);
+        return (0, import_jsx_runtime40.jsx)("em", { children: renderRichTextInlines(node.children) }, i);
       case "code":
-        return (0, import_jsx_runtime42.jsx)("code", { style: CODE_INLINE, children: node.code }, i);
+        return (0, import_jsx_runtime40.jsx)("code", { style: CODE_INLINE, children: node.code }, i);
       case "link": {
         const children = renderRichTextInlines(node.children);
-        return node.href !== void 0 ? (0, import_jsx_runtime42.jsx)(Link, { href: node.href, external: true, children }, i) : (0, import_jsx_runtime42.jsx)("span", { style: LINK_INERT, children }, i);
+        return node.href !== void 0 ? (0, import_jsx_runtime40.jsx)(Link, { href: node.href, external: true, children }, i) : (0, import_jsx_runtime40.jsx)("span", { style: LINK_INERT, children }, i);
       }
     }
   });
@@ -42863,20 +42842,20 @@ function renderRichTextInlines(inlines) {
 function renderBlock(block, key) {
   switch (block.type) {
     case "paragraph":
-      return (0, import_jsx_runtime42.jsx)(Text, { children: renderRichTextInlines(block.children) }, key);
+      return (0, import_jsx_runtime40.jsx)(Text, { children: renderRichTextInlines(block.children) }, key);
     case "heading":
-      return (0, import_jsx_runtime42.jsx)(Heading, { level: block.level, children: renderRichTextInlines(block.children) }, key);
+      return (0, import_jsx_runtime40.jsx)(Heading, { level: block.level, children: renderRichTextInlines(block.children) }, key);
     case "code-fence":
-      return (0, import_jsx_runtime42.jsx)("pre", { style: CODE_FENCE, "data-lang": block.lang, children: (0, import_jsx_runtime42.jsx)("code", { children: block.code }) }, key);
+      return (0, import_jsx_runtime40.jsx)("pre", { style: CODE_FENCE, "data-lang": block.lang, children: (0, import_jsx_runtime40.jsx)("code", { children: block.code }) }, key);
     case "list": {
-      const items = block.items.map((item, i) => (0, import_jsx_runtime42.jsx)("li", { children: renderRichTextInlines(item.children) }, i));
-      return block.ordered ? (0, import_jsx_runtime42.jsx)("ol", { start: block.start, style: LIST, children: items }, key) : (0, import_jsx_runtime42.jsx)("ul", { style: LIST, children: items }, key);
+      const items = block.items.map((item, i) => (0, import_jsx_runtime40.jsx)("li", { children: renderRichTextInlines(item.children) }, i));
+      return block.ordered ? (0, import_jsx_runtime40.jsx)("ol", { start: block.start, style: LIST, children: items }, key) : (0, import_jsx_runtime40.jsx)("ul", { style: LIST, children: items }, key);
     }
   }
 }
 function Markdown({ markdown, className, style }) {
   const blocks = parseRichText(markdown);
-  return (0, import_jsx_runtime42.jsx)("div", { className, "data-ggui-markdown": "", style: {
+  return (0, import_jsx_runtime40.jsx)("div", { className, "data-ggui-markdown": "", style: {
     display: "flex",
     flexDirection: "column",
     gap: "var(--ggui-spacing-sm, 12px)",
@@ -42884,7 +42863,7 @@ function Markdown({ markdown, className, style }) {
   }, children: blocks.map(renderBlock) });
 }
 function MarkdownInline({ markdown }) {
-  return (0, import_jsx_runtime42.jsx)(import_jsx_runtime42.Fragment, { children: renderRichTextInlines(parseInlineRichText(markdown)) });
+  return (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: renderRichTextInlines(parseInlineRichText(markdown)) });
 }
 var compositions_exports = {};
 __export2(compositions_exports, {
@@ -42903,7 +42882,7 @@ __export2(compositions_exports, {
   Sidebar: () => Sidebar
 });
 function Header({ logo, navigation: navigation2, actions, sticky = false, background, bordered = true, style, className }) {
-  return (0, import_jsx_runtime43.jsxs)("header", { className, style: {
+  return (0, import_jsx_runtime41.jsxs)("header", { className, style: {
     display: "flex",
     alignItems: "center",
     justifyContent: "space-between",
@@ -42917,10 +42896,10 @@ function Header({ logo, navigation: navigation2, actions, sticky = false, backgr
       boxShadow: shadow.sm
     },
     ...style
-  }, children: [logo && (0, import_jsx_runtime43.jsx)("div", { style: { flexShrink: 0 }, children: logo }), navigation2 && (0, import_jsx_runtime43.jsx)("nav", { style: { display: "flex", alignItems: "center", flex: 1, marginLeft: "32px" }, children: navigation2 }), actions && (0, import_jsx_runtime43.jsx)("div", { style: { display: "flex", alignItems: "center", gap: "12px", flexShrink: 0 }, children: actions })] });
+  }, children: [logo && (0, import_jsx_runtime41.jsx)("div", { style: { flexShrink: 0 }, children: logo }), navigation2 && (0, import_jsx_runtime41.jsx)("nav", { style: { display: "flex", alignItems: "center", flex: 1, marginLeft: "32px" }, children: navigation2 }), actions && (0, import_jsx_runtime41.jsx)("div", { style: { display: "flex", alignItems: "center", gap: "12px", flexShrink: 0 }, children: actions })] });
 }
 function SidebarItem({ item, activeId, onItemClick, collapsed, depth = 0 }) {
-  const [expanded, setExpanded] = (0, import_react36.useState)(false);
+  const [expanded, setExpanded] = (0, import_react31.useState)(false);
   const hasChildren = item.children && item.children.length > 0;
   const isActive = activeId === item.id;
   const handleClick = () => {
@@ -42929,7 +42908,7 @@ function SidebarItem({ item, activeId, onItemClick, collapsed, depth = 0 }) {
     }
     onItemClick?.(item);
   };
-  return (0, import_jsx_runtime44.jsxs)("div", { children: [(0, import_jsx_runtime44.jsxs)("button", { onClick: handleClick, disabled: item.disabled, style: {
+  return (0, import_jsx_runtime42.jsxs)("div", { children: [(0, import_jsx_runtime42.jsxs)("button", { onClick: handleClick, disabled: item.disabled, style: {
     display: "flex",
     alignItems: "center",
     gap: "12px",
@@ -42946,11 +42925,11 @@ function SidebarItem({ item, activeId, onItemClick, collapsed, depth = 0 }) {
     cursor: item.disabled ? "not-allowed" : "pointer",
     transition: "all 0.15s",
     justifyContent: collapsed ? "center" : "flex-start"
-  }, children: [item.icon && (0, import_jsx_runtime44.jsx)("span", { style: { display: "flex", flexShrink: 0 }, children: item.icon }), !collapsed && (0, import_jsx_runtime44.jsxs)(import_jsx_runtime44.Fragment, { children: [(0, import_jsx_runtime44.jsx)("span", { style: { flex: 1 }, children: item.label }), item.badge && (0, import_jsx_runtime44.jsx)("span", { children: item.badge }), hasChildren && (0, import_jsx_runtime44.jsx)(Icon, { name: expanded ? "chevron-down" : "chevron-right", size: 14, tone: "subtle" })] })] }), hasChildren && expanded && !collapsed && (0, import_jsx_runtime44.jsx)("div", { style: { marginTop: "4px" }, children: item.children.map((child) => (0, import_jsx_runtime44.jsx)(SidebarItem, { item: child, activeId, onItemClick, collapsed, depth: depth + 1 }, child.id)) })] });
+  }, children: [item.icon && (0, import_jsx_runtime42.jsx)("span", { style: { display: "flex", flexShrink: 0 }, children: item.icon }), !collapsed && (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [(0, import_jsx_runtime42.jsx)("span", { style: { flex: 1 }, children: item.label }), item.badge && (0, import_jsx_runtime42.jsx)("span", { children: item.badge }), hasChildren && (0, import_jsx_runtime42.jsx)(Icon, { name: expanded ? "chevron-down" : "chevron-right", size: 14, tone: "subtle" })] })] }), hasChildren && expanded && !collapsed && (0, import_jsx_runtime42.jsx)("div", { style: { marginTop: "4px" }, children: item.children.map((child) => (0, import_jsx_runtime42.jsx)(SidebarItem, { item: child, activeId, onItemClick, collapsed, depth: depth + 1 }, child.id)) })] });
 }
 function Sidebar({ items, activeId, onItemClick, collapsed = false, header, footer, width = 256, collapsedWidth = 64, style, className }) {
   const currentWidth = collapsed ? collapsedWidth : width;
-  return (0, import_jsx_runtime44.jsxs)("aside", { className, style: {
+  return (0, import_jsx_runtime42.jsxs)("aside", { className, style: {
     width: currentWidth,
     minWidth: currentWidth,
     height: "100%",
@@ -42961,15 +42940,15 @@ function Sidebar({ items, activeId, onItemClick, collapsed = false, header, foot
     transition: "width 0.2s",
     overflow: "hidden",
     ...style
-  }, children: [header && (0, import_jsx_runtime44.jsx)("div", { style: {
+  }, children: [header && (0, import_jsx_runtime42.jsx)("div", { style: {
     padding: collapsed ? "16px 8px" : "16px",
     borderBottom: `1px solid ${colors.gray[200]}`
-  }, children: header }), (0, import_jsx_runtime44.jsx)("nav", { style: {
+  }, children: header }), (0, import_jsx_runtime42.jsx)("nav", { style: {
     flex: 1,
     padding: "8px",
     overflowY: "auto",
     overflowX: "hidden"
-  }, children: (0, import_jsx_runtime44.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: items.map((item) => (0, import_jsx_runtime44.jsx)(SidebarItem, { item, activeId, onItemClick, collapsed }, item.id)) }) }), footer && (0, import_jsx_runtime44.jsx)("div", { style: {
+  }, children: (0, import_jsx_runtime42.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: items.map((item) => (0, import_jsx_runtime42.jsx)(SidebarItem, { item, activeId, onItemClick, collapsed }, item.id)) }) }), footer && (0, import_jsx_runtime42.jsx)("div", { style: {
     padding: collapsed ? "16px 8px" : "16px",
     borderTop: `1px solid ${colors.gray[200]}`
   }, children: footer })] });
@@ -42981,7 +42960,7 @@ function CardGrid({ children, columns = 3, gap = 16, style, className }) {
     }
     return `repeat(auto-fit, minmax(280px, 1fr))`;
   };
-  return (0, import_jsx_runtime45.jsx)("div", { className, style: {
+  return (0, import_jsx_runtime43.jsx)("div", { className, style: {
     display: "grid",
     gridTemplateColumns: getGridColumns(),
     gap: `${gap}px`,
@@ -42989,8 +42968,8 @@ function CardGrid({ children, columns = 3, gap = 16, style, className }) {
   }, children });
 }
 function CommentItem({ comment, onReply, onReaction, depth = 0 }) {
-  const [showReplyInput, setShowReplyInput] = (0, import_react37.useState)(false);
-  const [replyContent, setReplyContent] = (0, import_react37.useState)("");
+  const [showReplyInput, setShowReplyInput] = (0, import_react32.useState)(false);
+  const [replyContent, setReplyContent] = (0, import_react32.useState)("");
   const handleSubmitReply = () => {
     if (replyContent.trim()) {
       onReply?.(comment.id, replyContent);
@@ -42999,30 +42978,30 @@ function CommentItem({ comment, onReply, onReaction, depth = 0 }) {
     }
   };
   const timestamp = comment.timestamp instanceof Date ? comment.timestamp.toLocaleString() : comment.timestamp;
-  return (0, import_jsx_runtime46.jsxs)("div", { style: { marginLeft: depth > 0 ? "40px" : 0 }, children: [(0, import_jsx_runtime46.jsxs)("div", { style: { display: "flex", gap: "12px" }, children: [(0, import_jsx_runtime46.jsx)(Avatar, { name: comment.author.name, src: comment.author.avatar, size: "sm" }), (0, import_jsx_runtime46.jsxs)("div", { style: { flex: 1 }, children: [(0, import_jsx_runtime46.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [(0, import_jsx_runtime46.jsx)("span", { style: { fontWeight: 500, fontSize: fontSize.sm }, children: comment.author.name }), (0, import_jsx_runtime46.jsx)("span", { style: { color: colors.gray[500], fontSize: fontSize.xs }, children: timestamp })] }), (0, import_jsx_runtime46.jsx)("p", { style: { margin: "4px 0 8px", fontSize: fontSize.sm, color: colors.gray[700] }, children: comment.content }), (0, import_jsx_runtime46.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: [comment.reactions?.map((reaction) => (0, import_jsx_runtime46.jsxs)("button", { onClick: () => onReaction?.(comment.id, reaction.emoji), style: {
+  return (0, import_jsx_runtime44.jsxs)("div", { style: { marginLeft: depth > 0 ? "40px" : 0 }, children: [(0, import_jsx_runtime44.jsxs)("div", { style: { display: "flex", gap: "12px" }, children: [(0, import_jsx_runtime44.jsx)(Avatar, { name: comment.author.name, src: comment.author.avatar, size: "sm" }), (0, import_jsx_runtime44.jsxs)("div", { style: { flex: 1 }, children: [(0, import_jsx_runtime44.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [(0, import_jsx_runtime44.jsx)("span", { style: { fontWeight: 500, fontSize: fontSize.sm }, children: comment.author.name }), (0, import_jsx_runtime44.jsx)("span", { style: { color: colors.gray[500], fontSize: fontSize.xs }, children: timestamp })] }), (0, import_jsx_runtime44.jsx)("p", { style: { margin: "4px 0 8px", fontSize: fontSize.sm, color: colors.gray[700] }, children: comment.content }), (0, import_jsx_runtime44.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: [comment.reactions?.map((reaction) => (0, import_jsx_runtime44.jsxs)("button", { onClick: () => onReaction?.(comment.id, reaction.emoji), style: {
     padding: "2px 8px",
     border: `1px solid ${colors.gray[200]}`,
     borderRadius: "12px",
     backgroundColor: colors.gray[50],
     fontSize: fontSize.xs,
     cursor: "pointer"
-  }, children: [reaction.emoji, " ", reaction.count] }, reaction.emoji)), (0, import_jsx_runtime46.jsx)("button", { onClick: () => setShowReplyInput(!showReplyInput), style: {
+  }, children: [reaction.emoji, " ", reaction.count] }, reaction.emoji)), (0, import_jsx_runtime44.jsx)("button", { onClick: () => setShowReplyInput(!showReplyInput), style: {
     background: "none",
     border: "none",
     color: colors.gray[500],
     fontSize: fontSize.xs,
     cursor: "pointer"
-  }, children: "Reply" })] }), showReplyInput && (0, import_jsx_runtime46.jsxs)("div", { style: { marginTop: "12px" }, children: [(0, import_jsx_runtime46.jsx)(TextArea, { value: replyContent, onChange: setReplyContent, placeholder: "Write a reply...", rows: 2 }), (0, import_jsx_runtime46.jsxs)("div", { style: { display: "flex", gap: "8px", marginTop: "8px" }, children: [(0, import_jsx_runtime46.jsx)(Button, { size: "sm", onClick: handleSubmitReply, children: "Reply" }), (0, import_jsx_runtime46.jsx)(Button, { size: "sm", variant: "ghost", onClick: () => setShowReplyInput(false), children: "Cancel" })] })] })] })] }), comment.replies?.map((reply) => (0, import_jsx_runtime46.jsx)("div", { style: { marginTop: "16px" }, children: (0, import_jsx_runtime46.jsx)(CommentItem, { comment: reply, onReply, onReaction, depth: depth + 1 }) }, reply.id))] });
+  }, children: "Reply" })] }), showReplyInput && (0, import_jsx_runtime44.jsxs)("div", { style: { marginTop: "12px" }, children: [(0, import_jsx_runtime44.jsx)(TextArea, { value: replyContent, onChange: setReplyContent, placeholder: "Write a reply...", rows: 2 }), (0, import_jsx_runtime44.jsxs)("div", { style: { display: "flex", gap: "8px", marginTop: "8px" }, children: [(0, import_jsx_runtime44.jsx)(Button, { size: "sm", onClick: handleSubmitReply, children: "Reply" }), (0, import_jsx_runtime44.jsx)(Button, { size: "sm", variant: "ghost", onClick: () => setShowReplyInput(false), children: "Cancel" })] })] })] })] }), comment.replies?.map((reply) => (0, import_jsx_runtime44.jsx)("div", { style: { marginTop: "16px" }, children: (0, import_jsx_runtime44.jsx)(CommentItem, { comment: reply, onReply, onReaction, depth: depth + 1 }) }, reply.id))] });
 }
 function CommentThread({ comments, currentUser, onAddComment, onReply, onReaction, loading, style, className }) {
-  const [newComment, setNewComment] = (0, import_react37.useState)("");
+  const [newComment, setNewComment] = (0, import_react32.useState)("");
   const handleSubmit = () => {
     if (newComment.trim()) {
       onAddComment?.(newComment);
       setNewComment("");
     }
   };
-  return (0, import_jsx_runtime46.jsxs)("div", { className, style: { ...style }, children: [currentUser && (0, import_jsx_runtime46.jsxs)("div", { style: { display: "flex", gap: "12px", marginBottom: "24px" }, children: [(0, import_jsx_runtime46.jsx)(Avatar, { name: currentUser.name, src: currentUser.avatar, size: "sm" }), (0, import_jsx_runtime46.jsxs)("div", { style: { flex: 1 }, children: [(0, import_jsx_runtime46.jsx)(TextArea, { value: newComment, onChange: setNewComment, placeholder: "Write a comment...", rows: 3 }), (0, import_jsx_runtime46.jsx)("div", { style: { marginTop: "8px", display: "flex", justifyContent: "flex-end" }, children: (0, import_jsx_runtime46.jsx)(Button, { onClick: handleSubmit, disabled: !newComment.trim(), children: "Comment" }) })] })] }), loading ? (0, import_jsx_runtime46.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "24px" }, children: (0, import_jsx_runtime46.jsx)(Spinner, { size: 24 }) }) : (0, import_jsx_runtime46.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: "20px" }, children: comments.map((comment) => (0, import_jsx_runtime46.jsx)(CommentItem, { comment, onReply, onReaction }, comment.id)) })] });
+  return (0, import_jsx_runtime44.jsxs)("div", { className, style: { ...style }, children: [currentUser && (0, import_jsx_runtime44.jsxs)("div", { style: { display: "flex", gap: "12px", marginBottom: "24px" }, children: [(0, import_jsx_runtime44.jsx)(Avatar, { name: currentUser.name, src: currentUser.avatar, size: "sm" }), (0, import_jsx_runtime44.jsxs)("div", { style: { flex: 1 }, children: [(0, import_jsx_runtime44.jsx)(TextArea, { value: newComment, onChange: setNewComment, placeholder: "Write a comment...", rows: 3 }), (0, import_jsx_runtime44.jsx)("div", { style: { marginTop: "8px", display: "flex", justifyContent: "flex-end" }, children: (0, import_jsx_runtime44.jsx)(Button, { onClick: handleSubmit, disabled: !newComment.trim(), children: "Comment" }) })] })] }), loading ? (0, import_jsx_runtime44.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "24px" }, children: (0, import_jsx_runtime44.jsx)(Spinner, { size: 24 }) }) : (0, import_jsx_runtime44.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: "20px" }, children: comments.map((comment) => (0, import_jsx_runtime44.jsx)(CommentItem, { comment, onReply, onReaction }, comment.id)) })] });
 }
 function DataTable({ columns, data, rowKey = "id", loading, emptyText = "No data", onSort, sortKey, sortDirection, onRowClick, selectable, selectedKeys = [], onSelectionChange, style, className }) {
   const getRowKey = (row, index) => {
@@ -43047,16 +43026,16 @@ function DataTable({ columns, data, rowKey = "id", loading, emptyText = "No data
   };
   const allSelected = data.length > 0 && selectedKeys.length === data.length;
   const someSelected = selectedKeys.length > 0 && selectedKeys.length < data.length;
-  return (0, import_jsx_runtime47.jsx)("div", { className, style: {
+  return (0, import_jsx_runtime45.jsx)("div", { className, style: {
     border: `1px solid ${colors.gray[200]}`,
     borderRadius: "8px",
     overflow: "hidden",
     ...style
-  }, children: (0, import_jsx_runtime47.jsxs)("table", { style: {
+  }, children: (0, import_jsx_runtime45.jsxs)("table", { style: {
     width: "100%",
     borderCollapse: "collapse",
     fontSize: fontSize.sm
-  }, children: [(0, import_jsx_runtime47.jsx)("thead", { children: (0, import_jsx_runtime47.jsxs)("tr", { style: { backgroundColor: colors.gray[50] }, children: [selectable && (0, import_jsx_runtime47.jsx)("th", { style: { width: "40px", padding: "12px" }, children: (0, import_jsx_runtime47.jsx)(Checkbox, { checked: allSelected, indeterminate: someSelected, onChange: handleSelectAll }) }), columns.map((col) => (0, import_jsx_runtime47.jsx)("th", { style: {
+  }, children: [(0, import_jsx_runtime45.jsx)("thead", { children: (0, import_jsx_runtime45.jsxs)("tr", { style: { backgroundColor: colors.gray[50] }, children: [selectable && (0, import_jsx_runtime45.jsx)("th", { style: { width: "40px", padding: "12px" }, children: (0, import_jsx_runtime45.jsx)(Checkbox, { checked: allSelected, indeterminate: someSelected, onChange: handleSelectAll }) }), columns.map((col) => (0, import_jsx_runtime45.jsx)("th", { style: {
     padding: "12px 16px",
     textAlign: col.align || "left",
     fontWeight: fontWeight.semibold,
@@ -43064,14 +43043,14 @@ function DataTable({ columns, data, rowKey = "id", loading, emptyText = "No data
     borderBottom: `1px solid ${colors.gray[200]}`,
     cursor: col.sortable ? "pointer" : void 0,
     width: col.width
-  }, onClick: () => col.sortable && onSort?.(col.key, sortKey === col.key && sortDirection === "asc" ? "desc" : "asc"), children: (0, import_jsx_runtime47.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [col.header, col.sortable && sortKey === col.key && (0, import_jsx_runtime47.jsx)(Icon, { name: sortDirection === "asc" ? "chevron-up" : "chevron-down", size: 14 })] }) }, col.key))] }) }), (0, import_jsx_runtime47.jsx)("tbody", { children: loading ? (0, import_jsx_runtime47.jsx)("tr", { children: (0, import_jsx_runtime47.jsx)("td", { colSpan: columns.length + (selectable ? 1 : 0), style: { padding: "48px", textAlign: "center" }, children: (0, import_jsx_runtime47.jsx)(Spinner, { size: 24 }) }) }) : data.length === 0 ? (0, import_jsx_runtime47.jsx)("tr", { children: (0, import_jsx_runtime47.jsx)("td", { colSpan: columns.length + (selectable ? 1 : 0), style: { padding: "48px", textAlign: "center", color: colors.gray[500] }, children: emptyText }) }) : data.map((row, index) => {
+  }, onClick: () => col.sortable && onSort?.(col.key, sortKey === col.key && sortDirection === "asc" ? "desc" : "asc"), children: (0, import_jsx_runtime45.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [col.header, col.sortable && sortKey === col.key && (0, import_jsx_runtime45.jsx)(Icon, { name: sortDirection === "asc" ? "chevron-up" : "chevron-down", size: 14 })] }) }, col.key))] }) }), (0, import_jsx_runtime45.jsx)("tbody", { children: loading ? (0, import_jsx_runtime45.jsx)("tr", { children: (0, import_jsx_runtime45.jsx)("td", { colSpan: columns.length + (selectable ? 1 : 0), style: { padding: "48px", textAlign: "center" }, children: (0, import_jsx_runtime45.jsx)(Spinner, { size: 24 }) }) }) : data.length === 0 ? (0, import_jsx_runtime45.jsx)("tr", { children: (0, import_jsx_runtime45.jsx)("td", { colSpan: columns.length + (selectable ? 1 : 0), style: { padding: "48px", textAlign: "center", color: colors.gray[500] }, children: emptyText }) }) : data.map((row, index) => {
     const key = getRowKey(row, index);
     const isSelected = selectedKeys.includes(key);
-    return (0, import_jsx_runtime47.jsxs)("tr", { onClick: () => onRowClick?.(row, index), style: {
+    return (0, import_jsx_runtime45.jsxs)("tr", { onClick: () => onRowClick?.(row, index), style: {
       backgroundColor: isSelected ? colors.primary[50] : void 0,
       cursor: onRowClick ? "pointer" : void 0,
       transition: "background-color 0.15s"
-    }, children: [selectable && (0, import_jsx_runtime47.jsx)("td", { style: { padding: "12px" }, children: (0, import_jsx_runtime47.jsx)(Checkbox, { checked: isSelected, onChange: (checked) => handleSelectRow(key, checked) }) }), columns.map((col) => (0, import_jsx_runtime47.jsx)("td", { style: {
+    }, children: [selectable && (0, import_jsx_runtime45.jsx)("td", { style: { padding: "12px" }, children: (0, import_jsx_runtime45.jsx)(Checkbox, { checked: isSelected, onChange: (checked) => handleSelectRow(key, checked) }) }), columns.map((col) => (0, import_jsx_runtime45.jsx)("td", { style: {
       padding: "12px 16px",
       textAlign: col.align || "left",
       color: colors.gray[900],
@@ -43080,9 +43059,9 @@ function DataTable({ columns, data, rowKey = "id", loading, emptyText = "No data
   }) })] }) });
 }
 function ChatWindow({ messages, currentUserId, onSendMessage, loading, typing, placeholder = "Type a message...", header, style, className }) {
-  const [inputValue, setInputValue] = (0, import_react38.useState)("");
-  const messagesEndRef = (0, import_react38.useRef)(null);
-  (0, import_react38.useEffect)(() => {
+  const [inputValue, setInputValue] = (0, import_react33.useState)("");
+  const messagesEndRef = (0, import_react33.useRef)(null);
+  (0, import_react33.useEffect)(() => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages]);
   const handleSend = () => {
@@ -43097,7 +43076,7 @@ function ChatWindow({ messages, currentUserId, onSendMessage, loading, typing, p
       handleSend();
     }
   };
-  return (0, import_jsx_runtime48.jsxs)("div", { className, style: {
+  return (0, import_jsx_runtime46.jsxs)("div", { className, style: {
     display: "flex",
     flexDirection: "column",
     height: "100%",
@@ -43106,51 +43085,51 @@ function ChatWindow({ messages, currentUserId, onSendMessage, loading, typing, p
     backgroundColor: colors.white,
     overflow: "hidden",
     ...style
-  }, children: [header && (0, import_jsx_runtime48.jsx)("div", { style: {
+  }, children: [header && (0, import_jsx_runtime46.jsx)("div", { style: {
     padding: "12px 16px",
     borderBottom: `1px solid ${colors.gray[200]}`
-  }, children: header }), (0, import_jsx_runtime48.jsxs)("div", { style: {
+  }, children: header }), (0, import_jsx_runtime46.jsxs)("div", { style: {
     flex: 1,
     padding: "16px",
     overflowY: "auto",
     display: "flex",
     flexDirection: "column",
     gap: "12px"
-  }, children: [loading ? (0, import_jsx_runtime48.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "24px" }, children: (0, import_jsx_runtime48.jsx)(Spinner, { size: 24 }) }) : messages.map((message) => {
+  }, children: [loading ? (0, import_jsx_runtime46.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "24px" }, children: (0, import_jsx_runtime46.jsx)(Spinner, { size: 24 }) }) : messages.map((message) => {
     const isOwn = message.sender.id === currentUserId;
     const timestamp = message.timestamp instanceof Date ? message.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) : message.timestamp;
-    return (0, import_jsx_runtime48.jsxs)("div", { style: {
+    return (0, import_jsx_runtime46.jsxs)("div", { style: {
       display: "flex",
       flexDirection: isOwn ? "row-reverse" : "row",
       alignItems: "flex-end",
       gap: "8px"
-    }, children: [!isOwn && (0, import_jsx_runtime48.jsx)(Avatar, { name: message.sender.name, src: message.sender.avatar, size: "xs" }), (0, import_jsx_runtime48.jsxs)("div", { style: {
+    }, children: [!isOwn && (0, import_jsx_runtime46.jsx)(Avatar, { name: message.sender.name, src: message.sender.avatar, size: "xs" }), (0, import_jsx_runtime46.jsxs)("div", { style: {
       maxWidth: "70%",
       padding: "10px 14px",
       borderRadius: radius.lg,
       backgroundColor: isOwn ? colors.primary[600] : colors.gray[100],
       color: isOwn ? colors.white : colors.gray[900]
-    }, children: [(0, import_jsx_runtime48.jsx)("p", { style: { margin: 0, fontSize: fontSize.sm }, children: message.content }), (0, import_jsx_runtime48.jsxs)("div", { style: {
+    }, children: [(0, import_jsx_runtime46.jsx)("p", { style: { margin: 0, fontSize: fontSize.sm }, children: message.content }), (0, import_jsx_runtime46.jsxs)("div", { style: {
       display: "flex",
       alignItems: "center",
       gap: "4px",
       marginTop: "4px",
       fontSize: fontSize.xs,
       opacity: 0.7
-    }, children: [(0, import_jsx_runtime48.jsx)("span", { children: timestamp }), isOwn && message.status && (0, import_jsx_runtime48.jsxs)("span", { children: [message.status === "sending" && "\u2022", message.status === "sent" && "\u2713", message.status === "delivered" && "\u2713\u2713", message.status === "read" && "\u2713\u2713", message.status === "error" && "!"] })] })] })] }, message.id);
-  }), typing && (0, import_jsx_runtime48.jsx)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: (0, import_jsx_runtime48.jsxs)("span", { style: { fontSize: fontSize.xs, color: colors.gray[500] }, children: [typing.name, " is typing..."] }) }), (0, import_jsx_runtime48.jsx)("div", { ref: messagesEndRef })] }), (0, import_jsx_runtime48.jsxs)("div", { style: {
+    }, children: [(0, import_jsx_runtime46.jsx)("span", { children: timestamp }), isOwn && message.status && (0, import_jsx_runtime46.jsxs)("span", { children: [message.status === "sending" && "\u2022", message.status === "sent" && "\u2713", message.status === "delivered" && "\u2713\u2713", message.status === "read" && "\u2713\u2713", message.status === "error" && "!"] })] })] })] }, message.id);
+  }), typing && (0, import_jsx_runtime46.jsx)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: (0, import_jsx_runtime46.jsxs)("span", { style: { fontSize: fontSize.xs, color: colors.gray[500] }, children: [typing.name, " is typing..."] }) }), (0, import_jsx_runtime46.jsx)("div", { ref: messagesEndRef })] }), (0, import_jsx_runtime46.jsxs)("div", { style: {
     padding: "12px 16px",
     borderTop: `1px solid ${colors.gray[200]}`,
     display: "flex",
     gap: "8px"
-  }, children: [(0, import_jsx_runtime48.jsx)("input", { type: "text", value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: handleKeyDown, placeholder, style: {
+  }, children: [(0, import_jsx_runtime46.jsx)("input", { type: "text", value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: handleKeyDown, placeholder, style: {
     flex: 1,
     padding: "10px 14px",
     border: `1px solid ${colors.gray[300]}`,
     borderRadius: radius.full,
     fontSize: fontSize.sm,
     outline: "none"
-  } }), (0, import_jsx_runtime48.jsx)(Button, { onClick: handleSend, disabled: !inputValue.trim(), children: (0, import_jsx_runtime48.jsx)(Icon, { name: "chevron-right", size: 18 }) })] })] });
+  } }), (0, import_jsx_runtime46.jsx)(Button, { onClick: handleSend, disabled: !inputValue.trim(), children: (0, import_jsx_runtime46.jsx)(Icon, { name: "chevron-right", size: 18 }) })] })] });
 }
 function NavigationBar({ items, activeId, onItemClick, orientation = "horizontal", variant = "default", style, className }) {
   const renderItem = (item) => {
@@ -43192,16 +43171,16 @@ function NavigationBar({ items, activeId, onItemClick, orientation = "horizontal
         onItemClick?.(item);
       }
     };
-    const content = (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [item.icon && (0, import_jsx_runtime49.jsx)("span", { style: { display: "flex" }, children: item.icon }), (0, import_jsx_runtime49.jsx)("span", { children: item.label })] });
+    const content = (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [item.icon && (0, import_jsx_runtime47.jsx)("span", { style: { display: "flex" }, children: item.icon }), (0, import_jsx_runtime47.jsx)("span", { children: item.label })] });
     if (item.href) {
-      return (0, import_jsx_runtime49.jsx)("a", { href: item.href, onClick: (e) => {
+      return (0, import_jsx_runtime47.jsx)("a", { href: item.href, onClick: (e) => {
         e.preventDefault();
         handleClick();
       }, style: { ...baseStyle, ...variantStyles6[variant] }, children: content }, item.id);
     }
-    return (0, import_jsx_runtime49.jsx)("button", { onClick: handleClick, disabled: item.disabled, style: { ...baseStyle, ...variantStyles6[variant] }, children: content }, item.id);
+    return (0, import_jsx_runtime47.jsx)("button", { onClick: handleClick, disabled: item.disabled, style: { ...baseStyle, ...variantStyles6[variant] }, children: content }, item.id);
   };
-  return (0, import_jsx_runtime49.jsx)("nav", { className, style: {
+  return (0, import_jsx_runtime47.jsx)("nav", { className, style: {
     display: "flex",
     flexDirection: orientation === "horizontal" ? "row" : "column",
     gap: orientation === "horizontal" ? "4px" : "2px",
@@ -43220,8 +43199,8 @@ function formatFileSize(bytes) {
   return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
 }
 function FileUploader({ files = [], onFilesSelected, onFileRemove, accept, multiple = true, maxSize, maxFiles, disabled, dragDrop = true, style, className }) {
-  const [isDragOver, setIsDragOver] = (0, import_react39.useState)(false);
-  const inputRef = (0, import_react39.useRef)(null);
+  const [isDragOver, setIsDragOver] = (0, import_react34.useState)(false);
+  const inputRef = (0, import_react34.useRef)(null);
   const handleFiles = (fileList) => {
     if (!fileList)
       return;
@@ -43250,7 +43229,7 @@ function FileUploader({ files = [], onFilesSelected, onFileRemove, accept, multi
   const handleDragLeave = () => {
     setIsDragOver(false);
   };
-  return (0, import_jsx_runtime50.jsxs)("div", { className, style: { ...style }, children: [(0, import_jsx_runtime50.jsxs)("div", { onClick: () => !disabled && inputRef.current?.click(), onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, style: {
+  return (0, import_jsx_runtime48.jsxs)("div", { className, style: { ...style }, children: [(0, import_jsx_runtime48.jsxs)("div", { onClick: () => !disabled && inputRef.current?.click(), onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, style: {
     border: `2px dashed ${isDragOver ? colors.primary[400] : colors.gray[300]}`,
     borderRadius: radius.lg,
     padding: "32px",
@@ -43259,7 +43238,7 @@ function FileUploader({ files = [], onFilesSelected, onFileRemove, accept, multi
     cursor: disabled ? "not-allowed" : "pointer",
     transition: "all 0.2s",
     opacity: disabled ? 0.5 : 1
-  }, children: [(0, import_jsx_runtime50.jsx)("input", { ref: inputRef, type: "file", accept, multiple, onChange: (e) => handleFiles(e.target.files), disabled, style: { display: "none" } }), (0, import_jsx_runtime50.jsx)(Icon, { name: "plus", size: 32, tone: "subtle" }), (0, import_jsx_runtime50.jsx)("p", { style: { margin: "12px 0 4px", color: colors.gray[700], fontSize: fontSize.sm }, children: dragDrop ? "Drag and drop files here, or click to browse" : "Click to browse files" }), (0, import_jsx_runtime50.jsxs)("p", { style: { margin: 0, color: colors.gray[500], fontSize: fontSize.xs }, children: [accept && `Accepted: ${accept}`, maxSize && ` \u2022 Max size: ${formatFileSize(maxSize)}`, maxFiles && ` \u2022 Max files: ${maxFiles}`] })] }), files.length > 0 && (0, import_jsx_runtime50.jsx)("div", { style: { marginTop: "16px", display: "flex", flexDirection: "column", gap: "8px" }, children: files.map((file2) => (0, import_jsx_runtime50.jsxs)("div", { style: {
+  }, children: [(0, import_jsx_runtime48.jsx)("input", { ref: inputRef, type: "file", accept, multiple, onChange: (e) => handleFiles(e.target.files), disabled, style: { display: "none" } }), (0, import_jsx_runtime48.jsx)(Icon, { name: "plus", size: 32, tone: "subtle" }), (0, import_jsx_runtime48.jsx)("p", { style: { margin: "12px 0 4px", color: colors.gray[700], fontSize: fontSize.sm }, children: dragDrop ? "Drag and drop files here, or click to browse" : "Click to browse files" }), (0, import_jsx_runtime48.jsxs)("p", { style: { margin: 0, color: colors.gray[500], fontSize: fontSize.xs }, children: [accept && `Accepted: ${accept}`, maxSize && ` \u2022 Max size: ${formatFileSize(maxSize)}`, maxFiles && ` \u2022 Max files: ${maxFiles}`] })] }), files.length > 0 && (0, import_jsx_runtime48.jsx)("div", { style: { marginTop: "16px", display: "flex", flexDirection: "column", gap: "8px" }, children: files.map((file2) => (0, import_jsx_runtime48.jsxs)("div", { style: {
     display: "flex",
     alignItems: "center",
     gap: "12px",
@@ -43267,14 +43246,14 @@ function FileUploader({ files = [], onFilesSelected, onFileRemove, accept, multi
     border: `1px solid ${colors.gray[200]}`,
     borderRadius: radius.md,
     backgroundColor: colors.white
-  }, children: [(0, import_jsx_runtime50.jsx)(Icon, { name: "menu", size: 20, tone: "subtle" }), (0, import_jsx_runtime50.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [(0, import_jsx_runtime50.jsx)("p", { style: {
+  }, children: [(0, import_jsx_runtime48.jsx)(Icon, { name: "menu", size: 20, tone: "subtle" }), (0, import_jsx_runtime48.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [(0, import_jsx_runtime48.jsx)("p", { style: {
     margin: 0,
     fontSize: fontSize.sm,
     color: colors.gray[900],
     whiteSpace: "nowrap",
     overflow: "hidden",
     textOverflow: "ellipsis"
-  }, children: file2.name }), (0, import_jsx_runtime50.jsxs)("p", { style: { margin: "2px 0 0", fontSize: fontSize.xs, color: colors.gray[500] }, children: [formatFileSize(file2.size), file2.error && (0, import_jsx_runtime50.jsx)("span", { style: { color: colors.error[500], marginLeft: "8px" }, children: file2.error })] }), file2.status === "uploading" && file2.progress !== void 0 && (0, import_jsx_runtime50.jsx)(Progress, { value: file2.progress, size: "sm", style: { marginTop: "8px" } })] }), (0, import_jsx_runtime50.jsx)(Button, { variant: "ghost", size: "sm", onClick: () => onFileRemove?.(file2.id), children: (0, import_jsx_runtime50.jsx)(Icon, { name: "x", size: 16 }) })] }, file2.id)) })] });
+  }, children: file2.name }), (0, import_jsx_runtime48.jsxs)("p", { style: { margin: "2px 0 0", fontSize: fontSize.xs, color: colors.gray[500] }, children: [formatFileSize(file2.size), file2.error && (0, import_jsx_runtime48.jsx)("span", { style: { color: colors.error[500], marginLeft: "8px" }, children: file2.error })] }), file2.status === "uploading" && file2.progress !== void 0 && (0, import_jsx_runtime48.jsx)(Progress, { value: file2.progress, size: "sm", style: { marginTop: "8px" } })] }), (0, import_jsx_runtime48.jsx)(Button, { variant: "ghost", size: "sm", onClick: () => onFileRemove?.(file2.id), children: (0, import_jsx_runtime48.jsx)(Icon, { name: "x", size: 16 }) })] }, file2.id)) })] });
 }
 var variantColors2 = {
   info: colors.info[500],
@@ -43285,44 +43264,44 @@ var variantColors2 = {
 function NotificationItem({ notification, onMarkAsRead, onDismiss }) {
   const timestamp = notification.timestamp instanceof Date ? notification.timestamp.toLocaleString() : notification.timestamp;
   const typeColor = variantColors2[notification.type || "info"];
-  return (0, import_jsx_runtime51.jsxs)("div", { style: {
+  return (0, import_jsx_runtime49.jsxs)("div", { style: {
     display: "flex",
     gap: "12px",
     padding: "12px",
     backgroundColor: notification.read ? "transparent" : colors.primary[50],
     borderRadius: radius.md,
     transition: "background-color 0.15s"
-  }, children: [(0, import_jsx_runtime51.jsx)("div", { style: {
+  }, children: [(0, import_jsx_runtime49.jsx)("div", { style: {
     width: "8px",
     height: "8px",
     borderRadius: "50%",
     backgroundColor: notification.read ? "transparent" : typeColor,
     flexShrink: 0,
     marginTop: "6px"
-  } }), (0, import_jsx_runtime51.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [(0, import_jsx_runtime51.jsxs)("div", { style: { display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: "8px" }, children: [(0, import_jsx_runtime51.jsx)("p", { style: {
+  } }), (0, import_jsx_runtime49.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [(0, import_jsx_runtime49.jsxs)("div", { style: { display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: "8px" }, children: [(0, import_jsx_runtime49.jsx)("p", { style: {
     margin: 0,
     fontWeight: fontWeight.medium,
     color: colors.gray[900],
     fontSize: fontSize.sm
-  }, children: notification.title }), (0, import_jsx_runtime51.jsx)("button", { onClick: () => onDismiss?.(notification.id), style: {
+  }, children: notification.title }), (0, import_jsx_runtime49.jsx)("button", { onClick: () => onDismiss?.(notification.id), style: {
     background: "none",
     border: "none",
     padding: "2px",
     cursor: "pointer",
     color: colors.gray[400],
     flexShrink: 0
-  }, children: (0, import_jsx_runtime51.jsx)(Icon, { name: "x", size: 14 }) })] }), notification.message && (0, import_jsx_runtime51.jsx)("p", { style: {
+  }, children: (0, import_jsx_runtime49.jsx)(Icon, { name: "x", size: 14 }) })] }), notification.message && (0, import_jsx_runtime49.jsx)("p", { style: {
     margin: "4px 0 0",
     color: colors.gray[600],
     fontSize: fontSize.xs
-  }, children: notification.message }), (0, import_jsx_runtime51.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "12px", marginTop: "8px" }, children: [(0, import_jsx_runtime51.jsx)("span", { style: { color: colors.gray[400], fontSize: fontSize.xs }, children: timestamp }), !notification.read && (0, import_jsx_runtime51.jsx)("button", { onClick: () => onMarkAsRead?.(notification.id), style: {
+  }, children: notification.message }), (0, import_jsx_runtime49.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "12px", marginTop: "8px" }, children: [(0, import_jsx_runtime49.jsx)("span", { style: { color: colors.gray[400], fontSize: fontSize.xs }, children: timestamp }), !notification.read && (0, import_jsx_runtime49.jsx)("button", { onClick: () => onMarkAsRead?.(notification.id), style: {
     background: "none",
     border: "none",
     padding: 0,
     color: colors.primary[600],
     fontSize: fontSize.xs,
     cursor: "pointer"
-  }, children: "Mark as read" }), notification.action && (0, import_jsx_runtime51.jsx)("button", { onClick: notification.action.onClick, style: {
+  }, children: "Mark as read" }), notification.action && (0, import_jsx_runtime49.jsx)("button", { onClick: notification.action.onClick, style: {
     background: "none",
     border: "none",
     padding: 0,
@@ -43333,24 +43312,24 @@ function NotificationItem({ notification, onMarkAsRead, onDismiss }) {
 }
 function NotificationCenter({ notifications, onMarkAsRead, onMarkAllAsRead, onDismiss, onClearAll, emptyText = "No notifications", loading, style, className }) {
   const unreadCount = notifications.filter((n) => !n.read).length;
-  return (0, import_jsx_runtime51.jsxs)("div", { className, style: {
+  return (0, import_jsx_runtime49.jsxs)("div", { className, style: {
     display: "flex",
     flexDirection: "column",
     ...style
-  }, children: [(0, import_jsx_runtime51.jsxs)("div", { style: {
+  }, children: [(0, import_jsx_runtime49.jsxs)("div", { style: {
     display: "flex",
     alignItems: "center",
     justifyContent: "space-between",
     padding: "12px 16px",
     borderBottom: `1px solid ${colors.gray[200]}`
-  }, children: [(0, import_jsx_runtime51.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [(0, import_jsx_runtime51.jsx)("span", { style: { fontWeight: fontWeight.semibold, color: colors.gray[900] }, children: "Notifications" }), unreadCount > 0 && (0, import_jsx_runtime51.jsx)("span", { style: {
+  }, children: [(0, import_jsx_runtime49.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [(0, import_jsx_runtime49.jsx)("span", { style: { fontWeight: fontWeight.semibold, color: colors.gray[900] }, children: "Notifications" }), unreadCount > 0 && (0, import_jsx_runtime49.jsx)("span", { style: {
     padding: "2px 8px",
     borderRadius: "12px",
     backgroundColor: colors.primary[100],
     color: colors.primary[700],
     fontSize: fontSize.xs,
     fontWeight: fontWeight.medium
-  }, children: unreadCount })] }), (0, import_jsx_runtime51.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [unreadCount > 0 && (0, import_jsx_runtime51.jsx)(Button, { variant: "ghost", size: "sm", onClick: onMarkAllAsRead, children: "Mark all read" }), notifications.length > 0 && (0, import_jsx_runtime51.jsx)(Button, { variant: "ghost", size: "sm", onClick: onClearAll, children: "Clear all" })] })] }), (0, import_jsx_runtime51.jsx)("div", { style: { flex: 1, overflowY: "auto", padding: "8px" }, children: loading ? (0, import_jsx_runtime51.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "32px" }, children: (0, import_jsx_runtime51.jsx)(Spinner, { size: 24 }) }) : notifications.length === 0 ? (0, import_jsx_runtime51.jsx)("div", { style: { textAlign: "center", padding: "32px", color: colors.gray[500] }, children: emptyText }) : (0, import_jsx_runtime51.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: "4px" }, children: notifications.map((notification) => (0, import_jsx_runtime51.jsx)(NotificationItem, { notification, onMarkAsRead, onDismiss }, notification.id)) }) })] });
+  }, children: unreadCount })] }), (0, import_jsx_runtime49.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [unreadCount > 0 && (0, import_jsx_runtime49.jsx)(Button, { variant: "ghost", size: "sm", onClick: onMarkAllAsRead, children: "Mark all read" }), notifications.length > 0 && (0, import_jsx_runtime49.jsx)(Button, { variant: "ghost", size: "sm", onClick: onClearAll, children: "Clear all" })] })] }), (0, import_jsx_runtime49.jsx)("div", { style: { flex: 1, overflowY: "auto", padding: "8px" }, children: loading ? (0, import_jsx_runtime49.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "32px" }, children: (0, import_jsx_runtime49.jsx)(Spinner, { size: 24 }) }) : notifications.length === 0 ? (0, import_jsx_runtime49.jsx)("div", { style: { textAlign: "center", padding: "32px", color: colors.gray[500] }, children: emptyText }) : (0, import_jsx_runtime49.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: "4px" }, children: notifications.map((notification) => (0, import_jsx_runtime49.jsx)(NotificationItem, { notification, onMarkAsRead, onDismiss }, notification.id)) }) })] });
 }
 var sizeWidths = {
   sm: "400px",
@@ -43360,12 +43339,12 @@ var sizeWidths = {
   full: "100vw"
 };
 function Modal({ open, onClose, title, children, footer, size = "md", closeOnOverlayClick = true, closeOnEscape = true, showCloseButton = true, style, className }) {
-  const handleEscape = (0, import_react40.useCallback)((e) => {
+  const handleEscape = (0, import_react35.useCallback)((e) => {
     if (e.key === "Escape" && closeOnEscape) {
       onClose();
     }
   }, [closeOnEscape, onClose]);
-  (0, import_react40.useEffect)(() => {
+  (0, import_react35.useEffect)(() => {
     if (open) {
       document.addEventListener("keydown", handleEscape);
       document.body.style.overflow = "hidden";
@@ -43383,7 +43362,7 @@ function Modal({ open, onClose, title, children, footer, size = "md", closeOnOve
     }
   };
   const isFullscreen = size === "full";
-  return (0, import_jsx_runtime52.jsxs)("div", { style: {
+  return (0, import_jsx_runtime50.jsxs)("div", { style: {
     position: "fixed",
     inset: 0,
     zIndex: zIndex.modal,
@@ -43391,12 +43370,12 @@ function Modal({ open, onClose, title, children, footer, size = "md", closeOnOve
     alignItems: isFullscreen ? "stretch" : "center",
     justifyContent: "center",
     padding: isFullscreen ? 0 : "24px"
-  }, children: [(0, import_jsx_runtime52.jsx)("div", { onClick: handleOverlayClick, style: {
+  }, children: [(0, import_jsx_runtime50.jsx)("div", { onClick: handleOverlayClick, style: {
     position: "absolute",
     inset: 0,
     backgroundColor: "rgba(0, 0, 0, 0.5)",
     animation: animation.fadeIn
-  } }), (0, import_jsx_runtime52.jsxs)("div", { role: "dialog", "aria-modal": "true", className, style: {
+  } }), (0, import_jsx_runtime50.jsxs)("div", { role: "dialog", "aria-modal": "true", className, style: {
     position: "relative",
     width: sizeWidths[size],
     maxWidth: isFullscreen ? "100%" : "calc(100vw - 48px)",
@@ -43409,17 +43388,17 @@ function Modal({ open, onClose, title, children, footer, size = "md", closeOnOve
     overflow: "hidden",
     animation: animation.scaleIn,
     ...style
-  }, children: [(title || showCloseButton) && (0, import_jsx_runtime52.jsxs)("div", { style: {
+  }, children: [(title || showCloseButton) && (0, import_jsx_runtime50.jsxs)("div", { style: {
     display: "flex",
     alignItems: "center",
     justifyContent: "space-between",
     padding: "16px 20px",
     borderBottom: `1px solid ${colors.gray[200]}`
-  }, children: [title && (0, import_jsx_runtime52.jsx)(Heading, { level: 4, children: title }), showCloseButton && (0, import_jsx_runtime52.jsx)(Button, { variant: "ghost", size: "sm", onClick: onClose, "aria-label": "Close modal", style: { marginLeft: "auto" }, children: (0, import_jsx_runtime52.jsx)(Icon, { name: "x", size: 20 }) })] }), (0, import_jsx_runtime52.jsx)("div", { style: {
+  }, children: [title && (0, import_jsx_runtime50.jsx)(Heading, { level: 4, children: title }), showCloseButton && (0, import_jsx_runtime50.jsx)(Button, { variant: "ghost", size: "sm", onClick: onClose, "aria-label": "Close modal", style: { marginLeft: "auto" }, children: (0, import_jsx_runtime50.jsx)(Icon, { name: "x", size: 20 }) })] }), (0, import_jsx_runtime50.jsx)("div", { style: {
     flex: 1,
     padding: "20px",
     overflowY: "auto"
-  }, children }), footer && (0, import_jsx_runtime52.jsx)("div", { style: {
+  }, children }), footer && (0, import_jsx_runtime50.jsx)("div", { style: {
     display: "flex",
     alignItems: "center",
     justifyContent: "flex-end",
@@ -43429,9 +43408,9 @@ function Modal({ open, onClose, title, children, footer, size = "md", closeOnOve
   }, children: footer })] })] });
 }
 function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Search commands...", recentIds = [], loading, style, className }) {
-  const [query, setQuery] = (0, import_react41.useState)("");
-  const [selectedIndex, setSelectedIndex] = (0, import_react41.useState)(0);
-  const filteredCommands = (0, import_react41.useMemo)(() => {
+  const [query, setQuery] = (0, import_react36.useState)("");
+  const [selectedIndex, setSelectedIndex] = (0, import_react36.useState)(0);
+  const filteredCommands = (0, import_react36.useMemo)(() => {
     const filtered = query ? commands.filter((cmd) => cmd.label.toLowerCase().includes(query.toLowerCase()) || cmd.description?.toLowerCase().includes(query.toLowerCase())) : commands;
     const groups = /* @__PURE__ */ new Map();
     if (!query && recentIds.length > 0) {
@@ -43452,21 +43431,21 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
     });
     return groups;
   }, [commands, query, recentIds]);
-  const flatCommands = (0, import_react41.useMemo)(() => {
+  const flatCommands = (0, import_react36.useMemo)(() => {
     const flat = [];
     filteredCommands.forEach((cmds) => flat.push(...cmds));
     return flat;
   }, [filteredCommands]);
-  (0, import_react41.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     setSelectedIndex(0);
   }, [query]);
-  (0, import_react41.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     if (open) {
       setQuery("");
       setSelectedIndex(0);
     }
   }, [open]);
-  const handleKeyDown = (0, import_react41.useCallback)((e) => {
+  const handleKeyDown = (0, import_react36.useCallback)((e) => {
     if (e.key === "Escape") {
       onClose();
       return;
@@ -43486,7 +43465,7 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
       }
     }
   }, [flatCommands, selectedIndex, onSelect, onClose]);
-  (0, import_react41.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     if (open) {
       document.addEventListener("keydown", handleKeyDown);
       return () => document.removeEventListener("keydown", handleKeyDown);
@@ -43495,7 +43474,7 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
   if (!open)
     return null;
   let currentIndex = 0;
-  return (0, import_jsx_runtime53.jsxs)("div", { style: {
+  return (0, import_jsx_runtime51.jsxs)("div", { style: {
     position: "fixed",
     inset: 0,
     zIndex: zIndex.modal,
@@ -43503,11 +43482,11 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
     alignItems: "flex-start",
     justifyContent: "center",
     paddingTop: "15vh"
-  }, children: [(0, import_jsx_runtime53.jsx)("div", { onClick: onClose, style: {
+  }, children: [(0, import_jsx_runtime51.jsx)("div", { onClick: onClose, style: {
     position: "absolute",
     inset: 0,
     backgroundColor: "rgba(0, 0, 0, 0.5)"
-  } }), (0, import_jsx_runtime53.jsxs)("div", { role: "dialog", className, style: {
+  } }), (0, import_jsx_runtime51.jsxs)("div", { role: "dialog", className, style: {
     position: "relative",
     width: "560px",
     maxWidth: "calc(100vw - 48px)",
@@ -43519,19 +43498,19 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
     display: "flex",
     flexDirection: "column",
     ...style
-  }, children: [(0, import_jsx_runtime53.jsx)("div", { style: { padding: "12px", borderBottom: `1px solid ${colors.gray[200]}` }, children: (0, import_jsx_runtime53.jsxs)("div", { style: { position: "relative" }, children: [(0, import_jsx_runtime53.jsx)(Icon, { name: "search", size: 18, tone: "subtle", style: {
+  }, children: [(0, import_jsx_runtime51.jsx)("div", { style: { padding: "12px", borderBottom: `1px solid ${colors.gray[200]}` }, children: (0, import_jsx_runtime51.jsxs)("div", { style: { position: "relative" }, children: [(0, import_jsx_runtime51.jsx)(Icon, { name: "search", size: 18, tone: "subtle", style: {
     position: "absolute",
     left: "12px",
     top: "50%",
     transform: "translateY(-50%)"
-  } }), (0, import_jsx_runtime53.jsx)("input", { type: "text", value: query, onChange: (e) => setQuery(e.target.value), placeholder, autoFocus: true, style: {
+  } }), (0, import_jsx_runtime51.jsx)("input", { type: "text", value: query, onChange: (e) => setQuery(e.target.value), placeholder, autoFocus: true, style: {
     width: "100%",
     padding: "12px 12px 12px 42px",
     border: "none",
     fontSize: fontSize.base,
     outline: "none",
     backgroundColor: "transparent"
-  } })] }) }), (0, import_jsx_runtime53.jsx)("div", { style: { flex: 1, overflowY: "auto", padding: "8px" }, children: loading ? (0, import_jsx_runtime53.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "32px" }, children: (0, import_jsx_runtime53.jsx)(Spinner, { size: 24 }) }) : flatCommands.length === 0 ? (0, import_jsx_runtime53.jsx)("div", { style: { textAlign: "center", padding: "32px", color: colors.gray[500] }, children: "No commands found" }) : Array.from(filteredCommands.entries()).map(([group, cmds]) => (0, import_jsx_runtime53.jsxs)("div", { style: { marginBottom: "8px" }, children: [(0, import_jsx_runtime53.jsx)("div", { style: {
+  } })] }) }), (0, import_jsx_runtime51.jsx)("div", { style: { flex: 1, overflowY: "auto", padding: "8px" }, children: loading ? (0, import_jsx_runtime51.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "32px" }, children: (0, import_jsx_runtime51.jsx)(Spinner, { size: 24 }) }) : flatCommands.length === 0 ? (0, import_jsx_runtime51.jsx)("div", { style: { textAlign: "center", padding: "32px", color: colors.gray[500] }, children: "No commands found" }) : Array.from(filteredCommands.entries()).map(([group, cmds]) => (0, import_jsx_runtime51.jsxs)("div", { style: { marginBottom: "8px" }, children: [(0, import_jsx_runtime51.jsx)("div", { style: {
     padding: "8px 12px",
     fontSize: fontSize.xs,
     fontWeight: fontWeight.semibold,
@@ -43541,7 +43520,7 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
   }, children: group }), cmds.map((cmd) => {
     const index = currentIndex++;
     const isSelected = index === selectedIndex;
-    return (0, import_jsx_runtime53.jsxs)("button", { onClick: () => {
+    return (0, import_jsx_runtime51.jsxs)("button", { onClick: () => {
       if (!cmd.disabled) {
         onSelect(cmd);
         onClose();
@@ -43558,7 +43537,7 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
       color: cmd.disabled ? colors.gray[400] : colors.gray[900],
       textAlign: "left",
       cursor: cmd.disabled ? "not-allowed" : "pointer"
-    }, children: [cmd.icon && (0, import_jsx_runtime53.jsx)("span", { style: { display: "flex", color: colors.gray[500] }, children: cmd.icon }), (0, import_jsx_runtime53.jsxs)("div", { style: { flex: 1 }, children: [(0, import_jsx_runtime53.jsx)("div", { style: { fontSize: fontSize.sm }, children: cmd.label }), cmd.description && (0, import_jsx_runtime53.jsx)("div", { style: { fontSize: fontSize.xs, color: colors.gray[500] }, children: cmd.description })] }), cmd.shortcut && (0, import_jsx_runtime53.jsx)("kbd", { style: {
+    }, children: [cmd.icon && (0, import_jsx_runtime51.jsx)("span", { style: { display: "flex", color: colors.gray[500] }, children: cmd.icon }), (0, import_jsx_runtime51.jsxs)("div", { style: { flex: 1 }, children: [(0, import_jsx_runtime51.jsx)("div", { style: { fontSize: fontSize.sm }, children: cmd.label }), cmd.description && (0, import_jsx_runtime51.jsx)("div", { style: { fontSize: fontSize.xs, color: colors.gray[500] }, children: cmd.description })] }), cmd.shortcut && (0, import_jsx_runtime51.jsx)("kbd", { style: {
       padding: "2px 6px",
       backgroundColor: colors.gray[100],
       borderRadius: radius.sm,
@@ -43566,7 +43545,7 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
       color: colors.gray[500],
       fontFamily: "inherit"
     }, children: cmd.shortcut })] }, cmd.id);
-  })] }, group)) }), (0, import_jsx_runtime53.jsxs)("div", { style: {
+  })] }, group)) }), (0, import_jsx_runtime51.jsxs)("div", { style: {
     padding: "8px 12px",
     borderTop: `1px solid ${colors.gray[200]}`,
     display: "flex",
@@ -43574,35 +43553,35 @@ function CommandPalette({ open, onClose, commands, onSelect, placeholder = "Sear
     gap: "16px",
     fontSize: fontSize.xs,
     color: colors.gray[500]
-  }, children: [(0, import_jsx_runtime53.jsx)("span", { children: "\u2191\u2193 Navigate" }), (0, import_jsx_runtime53.jsx)("span", { children: "\u21B5 Select" }), (0, import_jsx_runtime53.jsx)("span", { children: "Esc Close" })] })] })] });
+  }, children: [(0, import_jsx_runtime51.jsx)("span", { children: "\u2191\u2193 Navigate" }), (0, import_jsx_runtime51.jsx)("span", { children: "\u21B5 Select" }), (0, import_jsx_runtime51.jsx)("span", { children: "Esc Close" })] })] })] });
 }
 function Footer({ brand, columns, socialLinks, bottomText, bottomLinks, background, bordered = true, style, className }) {
-  return (0, import_jsx_runtime54.jsxs)("footer", { className, role: "contentinfo", style: {
+  return (0, import_jsx_runtime52.jsxs)("footer", { className, role: "contentinfo", style: {
     backgroundColor: background || colors.gray[50],
     borderTop: bordered ? `1px solid ${colors.gray[200]}` : void 0,
     ...style
-  }, children: [(0, import_jsx_runtime54.jsxs)("div", { style: {
+  }, children: [(0, import_jsx_runtime52.jsxs)("div", { style: {
     display: "flex",
     flexWrap: "wrap",
     gap: "48px",
     padding: "48px 24px",
     maxWidth: "1280px",
     margin: "0 auto"
-  }, children: [brand && (0, import_jsx_runtime54.jsx)("div", { style: { flex: "1 1 280px", minWidth: "200px" }, children: brand }), columns?.map((column, colIdx) => (0, import_jsx_runtime54.jsxs)("div", { style: { flex: "0 1 180px", minWidth: "140px" }, children: [column.title && (0, import_jsx_runtime54.jsx)("h4", { style: {
+  }, children: [brand && (0, import_jsx_runtime52.jsx)("div", { style: { flex: "1 1 280px", minWidth: "200px" }, children: brand }), columns?.map((column, colIdx) => (0, import_jsx_runtime52.jsxs)("div", { style: { flex: "0 1 180px", minWidth: "140px" }, children: [column.title && (0, import_jsx_runtime52.jsx)("h4", { style: {
     fontSize: fontSize.sm,
     fontWeight: fontWeight.semibold,
     color: colors.gray[900],
     lineHeight: lineHeight.normal,
     margin: "0 0 16px 0",
     padding: 0
-  }, children: column.title }), (0, import_jsx_runtime54.jsx)("ul", { style: {
+  }, children: column.title }), (0, import_jsx_runtime52.jsx)("ul", { style: {
     listStyle: "none",
     margin: 0,
     padding: 0,
     display: "flex",
     flexDirection: "column",
     gap: "10px"
-  }, children: column.links.map((link, linkIdx) => (0, import_jsx_runtime54.jsx)("li", { children: (0, import_jsx_runtime54.jsx)("a", { href: link.href, onClick: link.onClick ? (e) => {
+  }, children: column.links.map((link, linkIdx) => (0, import_jsx_runtime52.jsx)("li", { children: (0, import_jsx_runtime52.jsx)("a", { href: link.href, onClick: link.onClick ? (e) => {
     e.preventDefault();
     link.onClick?.();
   } : void 0, style: {
@@ -43611,7 +43590,7 @@ function Footer({ brand, columns, socialLinks, bottomText, bottomLinks, backgrou
     textDecoration: "none",
     transition: "color 0.15s",
     lineHeight: lineHeight.normal
-  }, "aria-label": link.label, children: link.label }) }, linkIdx)) })] }, colIdx))] }), (bottomText || bottomLinks || socialLinks) && (0, import_jsx_runtime54.jsxs)("div", { style: {
+  }, "aria-label": link.label, children: link.label }) }, linkIdx)) })] }, colIdx))] }), (bottomText || bottomLinks || socialLinks) && (0, import_jsx_runtime52.jsxs)("div", { style: {
     display: "flex",
     flexWrap: "wrap",
     alignItems: "center",
@@ -43621,17 +43600,17 @@ function Footer({ brand, columns, socialLinks, bottomText, bottomLinks, backgrou
     maxWidth: "1280px",
     margin: "0 auto",
     borderTop: `1px solid ${colors.gray[200]}`
-  }, children: [bottomText && (0, import_jsx_runtime54.jsx)("span", { style: {
+  }, children: [bottomText && (0, import_jsx_runtime52.jsx)("span", { style: {
     fontSize: fontSize.sm,
     color: colors.gray[500],
     lineHeight: lineHeight.normal
-  }, children: bottomText }), (0, import_jsx_runtime54.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "20px" }, children: [socialLinks?.map((social, idx) => (0, import_jsx_runtime54.jsx)("a", { href: social.href, "aria-label": social.label, style: {
+  }, children: bottomText }), (0, import_jsx_runtime52.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "20px" }, children: [socialLinks?.map((social, idx) => (0, import_jsx_runtime52.jsx)("a", { href: social.href, "aria-label": social.label, style: {
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
     color: colors.gray[500],
     transition: "color 0.15s"
-  }, children: social.icon }, idx)), bottomLinks?.map((link, idx) => (0, import_jsx_runtime54.jsx)("a", { href: link.href, onClick: link.onClick ? (e) => {
+  }, children: social.icon }, idx)), bottomLinks?.map((link, idx) => (0, import_jsx_runtime52.jsx)("a", { href: link.href, onClick: link.onClick ? (e) => {
     e.preventDefault();
     link.onClick?.();
   } : void 0, style: {
@@ -43650,7 +43629,7 @@ function Hero({ heading, description, primaryAction, secondaryAction, media, ali
   const sizeConfig2 = sizeStyles7[size] || sizeStyles7.md;
   const hasImage = !!backgroundImage;
   const showOverlay = hasImage && overlay;
-  return (0, import_jsx_runtime55.jsxs)("section", { className, style: {
+  return (0, import_jsx_runtime53.jsxs)("section", { className, style: {
     position: "relative",
     backgroundColor: background || (hasImage ? void 0 : colors.white),
     ...hasImage && {
@@ -43660,11 +43639,11 @@ function Hero({ heading, description, primaryAction, secondaryAction, media, ali
     },
     overflow: "hidden",
     ...style
-  }, children: [showOverlay && (0, import_jsx_runtime55.jsx)("div", { "aria-hidden": "true", style: {
+  }, children: [showOverlay && (0, import_jsx_runtime53.jsx)("div", { "aria-hidden": "true", style: {
     position: "absolute",
     inset: 0,
     backgroundColor: "rgba(0, 0, 0, 0.5)"
-  } }), (0, import_jsx_runtime55.jsxs)("div", { style: {
+  } }), (0, import_jsx_runtime53.jsxs)("div", { style: {
     position: "relative",
     maxWidth: "1280px",
     margin: "0 auto",
@@ -43674,10 +43653,10 @@ function Hero({ heading, description, primaryAction, secondaryAction, media, ali
     alignItems: align === "center" ? "center" : "center",
     gap: "48px",
     textAlign: align === "center" ? "center" : "left"
-  }, children: [(0, import_jsx_runtime55.jsxs)("div", { style: {
+  }, children: [(0, import_jsx_runtime53.jsxs)("div", { style: {
     flex: align === "left" && media ? "1 1 50%" : void 0,
     maxWidth: align === "center" ? "800px" : void 0
-  }, children: [heading && (0, import_jsx_runtime55.jsx)("h1", { style: {
+  }, children: [heading && (0, import_jsx_runtime53.jsx)("h1", { style: {
     fontSize: sizeConfig2.headingSize,
     fontWeight: fontWeight.bold,
     lineHeight: lineHeight.tight,
@@ -43685,7 +43664,7 @@ function Hero({ heading, description, primaryAction, secondaryAction, media, ali
     color: showOverlay ? colors.white : colors.gray[900],
     margin: "0 0 16px 0",
     padding: 0
-  }, children: heading }), description && (0, import_jsx_runtime55.jsx)("p", { style: {
+  }, children: heading }), description && (0, import_jsx_runtime53.jsx)("p", { style: {
     fontSize: sizeConfig2.descSize,
     lineHeight: lineHeight.relaxed,
     color: showOverlay ? "rgba(255,255,255,0.9)" : colors.gray[600],
@@ -43693,12 +43672,12 @@ function Hero({ heading, description, primaryAction, secondaryAction, media, ali
     padding: 0,
     maxWidth: align === "center" ? "640px" : void 0,
     ...align === "center" && { marginLeft: "auto", marginRight: "auto" }
-  }, children: description }), (primaryAction || secondaryAction) && (0, import_jsx_runtime55.jsxs)("div", { style: {
+  }, children: description }), (primaryAction || secondaryAction) && (0, import_jsx_runtime53.jsxs)("div", { style: {
     display: "flex",
     flexWrap: "wrap",
     gap: "12px",
     justifyContent: align === "center" ? "center" : "flex-start"
-  }, children: [primaryAction && (0, import_jsx_runtime55.jsx)("button", { onClick: primaryAction.onClick, style: {
+  }, children: [primaryAction && (0, import_jsx_runtime53.jsx)("button", { onClick: primaryAction.onClick, style: {
     padding: "12px 28px",
     fontSize: fontSize.base,
     fontWeight: fontWeight.semibold,
@@ -43709,7 +43688,7 @@ function Hero({ heading, description, primaryAction, secondaryAction, media, ali
     cursor: "pointer",
     transition: "background-color 0.15s",
     lineHeight: lineHeight.normal
-  }, children: primaryAction.label }), secondaryAction && (0, import_jsx_runtime55.jsx)("button", { onClick: secondaryAction.onClick, style: {
+  }, children: primaryAction.label }), secondaryAction && (0, import_jsx_runtime53.jsx)("button", { onClick: secondaryAction.onClick, style: {
     padding: "12px 28px",
     fontSize: fontSize.base,
     fontWeight: fontWeight.semibold,
@@ -43720,7 +43699,7 @@ function Hero({ heading, description, primaryAction, secondaryAction, media, ali
     cursor: "pointer",
     transition: "all 0.15s",
     lineHeight: lineHeight.normal
-  }, children: secondaryAction.label })] })] }), media && (0, import_jsx_runtime55.jsx)("div", { style: {
+  }, children: secondaryAction.label })] })] }), media && (0, import_jsx_runtime53.jsx)("div", { style: {
     flex: align === "left" ? "1 1 50%" : void 0,
     display: "flex",
     justifyContent: "center",
@@ -43734,9 +43713,9 @@ __export2(interact_exports, {
   Hoverable: () => Hoverable,
   Pressable: () => Pressable
 });
-var Clickable = (0, import_react42.forwardRef)(function Clickable2({ children, onClick, onDoubleClick, hoverStyle, activeStyle, cursor, transition: transition2 = "all 200ms ease", disabled = false, role, "aria-label": ariaLabel, tabIndex, style, className, ...rest }, ref) {
-  const [hovered, setHovered] = (0, import_react42.useState)(false);
-  const [active, setActive] = (0, import_react42.useState)(false);
+var Clickable = (0, import_react37.forwardRef)(function Clickable2({ children, onClick, onDoubleClick, hoverStyle, activeStyle, cursor, transition: transition2 = "all 200ms ease", disabled = false, role, "aria-label": ariaLabel, tabIndex, style, className, ...rest }, ref) {
+  const [hovered, setHovered] = (0, import_react37.useState)(false);
+  const [active, setActive] = (0, import_react37.useState)(false);
   const hasClick = !!onClick;
   const resolvedCursor = disabled ? "not-allowed" : cursor ?? (hasClick ? "pointer" : void 0);
   const resolvedRole = role ?? (hasClick ? "button" : void 0);
@@ -43757,19 +43736,19 @@ var Clickable = (0, import_react42.forwardRef)(function Clickable2({ children, o
     ...hovered && !disabled ? hoverStyle : {},
     ...active && !disabled ? activeStyle : {}
   };
-  return (0, import_jsx_runtime56.jsx)("div", { ref, className, style: mergedStyle, onClick: disabled ? void 0 : onClick, onDoubleClick: disabled ? void 0 : onDoubleClick, onMouseEnter: () => setHovered(true), onMouseLeave: () => {
+  return (0, import_jsx_runtime54.jsx)("div", { ref, className, style: mergedStyle, onClick: disabled ? void 0 : onClick, onDoubleClick: disabled ? void 0 : onDoubleClick, onMouseEnter: () => setHovered(true), onMouseLeave: () => {
     setHovered(false);
     setActive(false);
   }, onMouseDown: () => setActive(true), onMouseUp: () => setActive(false), onKeyDown: handleKeyDown, role: resolvedRole, "aria-label": ariaLabel, "aria-disabled": disabled || void 0, tabIndex: resolvedTabIndex, ...rest, children });
 });
-var Hoverable = (0, import_react43.forwardRef)(function Hoverable2({ children, hoverStyle, onHoverChange, transition: transition2 = "all 200ms ease", style, className, ...rest }, ref) {
-  const [hovered, setHovered] = (0, import_react43.useState)(false);
+var Hoverable = (0, import_react38.forwardRef)(function Hoverable2({ children, hoverStyle, onHoverChange, transition: transition2 = "all 200ms ease", style, className, ...rest }, ref) {
+  const [hovered, setHovered] = (0, import_react38.useState)(false);
   const mergedStyle = {
     ...style,
     transition: transition2,
     ...hovered ? hoverStyle : {}
   };
-  return (0, import_jsx_runtime57.jsx)("div", { ref, className, style: mergedStyle, onMouseEnter: () => {
+  return (0, import_jsx_runtime55.jsx)("div", { ref, className, style: mergedStyle, onMouseEnter: () => {
     setHovered(true);
     onHoverChange?.(true);
   }, onMouseLeave: () => {
@@ -43777,10 +43756,10 @@ var Hoverable = (0, import_react43.forwardRef)(function Hoverable2({ children, h
     onHoverChange?.(false);
   }, ...rest, children });
 });
-var Pressable = (0, import_react44.forwardRef)(function Pressable2({ children, onPress, onLongPress, longPressDelay = 500, hoverStyle, pressStyle, disabled = false, transition: transition2 = "all 150ms ease", role, "aria-label": ariaLabel, tabIndex, style, className, ...rest }, ref) {
-  const [hovered, setHovered] = (0, import_react44.useState)(false);
-  const [pressed, setPressed] = (0, import_react44.useState)(false);
-  const [longPressTimer, setLongPressTimer] = (0, import_react44.useState)(null);
+var Pressable = (0, import_react39.forwardRef)(function Pressable2({ children, onPress, onLongPress, longPressDelay = 500, hoverStyle, pressStyle, disabled = false, transition: transition2 = "all 150ms ease", role, "aria-label": ariaLabel, tabIndex, style, className, ...rest }, ref) {
+  const [hovered, setHovered] = (0, import_react39.useState)(false);
+  const [pressed, setPressed] = (0, import_react39.useState)(false);
+  const [longPressTimer, setLongPressTimer] = (0, import_react39.useState)(null);
   const hasPress = !!onPress || !!onLongPress;
   const handleMouseDown = (e) => {
     if (disabled)
@@ -43823,7 +43802,7 @@ var Pressable = (0, import_react44.forwardRef)(function Pressable2({ children, o
     ...pressed && !disabled ? pressStyle : {}
   };
   const content = typeof children === "function" ? children({ pressed, hovered }) : children;
-  return (0, import_jsx_runtime58.jsx)("div", { ref, className, style: mergedStyle, onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, onMouseEnter: () => setHovered(true), onMouseLeave: () => {
+  return (0, import_jsx_runtime56.jsx)("div", { ref, className, style: mergedStyle, onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, onMouseEnter: () => setHovered(true), onMouseLeave: () => {
     setHovered(false);
     setPressed(false);
     if (longPressTimer)
@@ -46667,7 +46646,7 @@ function getTheme(id, mode = "light") {
 function getDefaultThemeId() {
   return "ggui";
 }
-var ThemeContext = (0, import_react45.createContext)(null);
+var ThemeContext = (0, import_react40.createContext)(null);
 var COLOR_MIX_SUPPORTS = "@supports (color: color-mix(in srgb, red, blue))";
 function resolvePrimary500Hex(cssVariables) {
   const match = cssVariables.match(/--ggui-color-primary-500:\s*(#[0-9a-fA-F]{3}|#[0-9a-fA-F]{6})\s*;/);
@@ -46992,19 +46971,26 @@ function replaceSpecifier(code, specifier, replacement) {
 function globalExpr(gguiKey, legacyName) {
   return `(globalThis.__ggui__&&globalThis.__ggui__["${gguiKey}"]||window["${legacyName}"])`;
 }
-function buildDataUrlReactShim(globalName) {
+function toDataUrl(js) {
+  return `data:text/javascript,${encodeURIComponent(js)}`;
+}
+function jsReactShim(globalName) {
   const namedExports = REACT_EXPORTS.map((e) => `export const ${e} = R.${e};`).join(" ");
   const resolve = globalExpr("react", globalName);
-  const js = `const R = ${resolve}; export default R; ${namedExports}`;
-  return `data:text/javascript,${encodeURIComponent(js)}`;
+  return `const R = ${resolve}; export default R; ${namedExports}`;
 }
-function buildDataUrlReactDomShim() {
+function buildDataUrlReactShim(globalName) {
+  return toDataUrl(jsReactShim(globalName));
+}
+function jsReactDomShim() {
   const REACT_DOM_EXPORTS = ["createPortal", "flushSync", "unstable_batchedUpdates"];
   const namedExports = REACT_DOM_EXPORTS.map((e) => `export const ${e} = D.${e};`).join(" ");
-  const js = `const D = globalThis.__ggui__["reactDom"]; export default D; ${namedExports}`;
-  return `data:text/javascript,${encodeURIComponent(js)}`;
+  return `const D = globalThis.__ggui__["reactDom"]; export default D; ${namedExports}`;
 }
-function buildDataUrlJsxShim(globalName) {
+function buildDataUrlReactDomShim() {
+  return toDataUrl(jsReactDomShim());
+}
+function jsJsxShim(globalName) {
   const resolve = globalExpr("react", globalName);
   const js = [
     `const R = ${resolve};`,
@@ -47017,9 +47003,12 @@ function buildDataUrlJsxShim(globalName) {
     `export{jsx,jsx as jsxs,jsx as jsxDEV};`,
     `export const Fragment=R.Fragment;`
   ].join("");
-  return `data:text/javascript,${encodeURIComponent(js)}`;
+  return js;
 }
-function buildDataUrlGlobalShim(globalName, gguiKey, exportNames, fallbackGlobals, fallbackGguiKeys) {
+function buildDataUrlJsxShim(globalName) {
+  return toDataUrl(jsJsxShim(globalName));
+}
+function jsGlobalShim(globalName, gguiKey, exportNames, fallbackGlobals, fallbackGguiKeys) {
   if (exportNames && exportNames.length > 0) {
     const globals = [globalName, ...fallbackGlobals || []];
     const gguiKeys = [gguiKey, ...fallbackGguiKeys || []];
@@ -47030,17 +47019,20 @@ function buildDataUrlGlobalShim(globalName, gguiKey, exportNames, fallbackGlobal
     ));
     const mergeExpr = resolveExprs.join(",");
     const named = exportNames.map((n) => `export const ${n} = M["${n}"];`).join(" ");
-    const js2 = resolveExprs.length > 1 ? `const M = Object.assign({}, ${mergeExpr}); ${named} export default M;` : `const M = ${resolveExprs[0]}; ${named} export default M;`;
-    return `data:text/javascript,${encodeURIComponent(js2)}`;
+    return resolveExprs.length > 1 ? `const M = Object.assign({}, ${mergeExpr}); ${named} export default M;` : `const M = ${resolveExprs[0]}; ${named} export default M;`;
   }
   const resolve = globalExpr(gguiKey, globalName);
-  const js = `const M = ${resolve} || {}; const handler = { get(_, key) { return M[key]; } }; export default new Proxy({}, handler);`;
-  return `data:text/javascript,${encodeURIComponent(js)}`;
+  return `const M = ${resolve} || {}; const handler = { get(_, key) { return M[key]; } }; export default new Proxy({}, handler);`;
 }
-function buildDataUrlWireShim() {
+function buildDataUrlGlobalShim(globalName, gguiKey, exportNames, fallbackGlobals, fallbackGguiKeys) {
+  return toDataUrl(jsGlobalShim(globalName, gguiKey, exportNames, fallbackGlobals, fallbackGguiKeys));
+}
+function jsWireShim() {
   const named = WIRE_EXPORTS.map((e) => `export const ${e} = w.${e};`).join(" ");
-  const js = `const w = globalThis.__ggui__.wire; ${named} export default w;`;
-  return `data:text/javascript,${encodeURIComponent(js)}`;
+  return `const w = globalThis.__ggui__.wire; ${named} export default w;`;
+}
+function buildDataUrlWireShim() {
+  return toDataUrl(jsWireShim());
 }
 function extractNamedImports(code, specifier) {
   const esc2 = specifier.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
@@ -47057,7 +47049,7 @@ function extractNamedImports(code, specifier) {
   }
   return [...names];
 }
-function buildGadgetPackageShim(packageName, exportNames) {
+function jsGadgetPackageShim(packageName, exportNames) {
   const pkgLit = JSON.stringify(packageName);
   const hasComponent = exportNames.some((n) => /^[A-Z]/.test(n));
   const parts = [];
@@ -47074,7 +47066,10 @@ function buildGadgetPackageShim(packageName, exportNames) {
     parts.push(`export const ${name}=${factory}(${JSON.stringify(name)});`);
   }
   parts.push(`export default new Proxy({},{get:function(_,k){return NS()[k];}});`);
-  return `data:text/javascript,${encodeURIComponent(parts.join(""))}`;
+  return parts.join("");
+}
+function buildGadgetPackageShim(packageName, exportNames) {
+  return toDataUrl(jsGadgetPackageShim(packageName, exportNames));
 }
 function rewriteDataUrl(code, opts) {
   const reactGlobal = opts.reactGlobal ?? "__REACT";
@@ -47109,6 +47104,29 @@ function rewriteDataUrl(code, opts) {
   }
   return code;
 }
+var ASSET_SHIM_FOR_SPECIFIER = {
+  "react/jsx-runtime": "jsx-runtime",
+  "react/jsx-dev-runtime": "jsx-runtime",
+  "react-dom": "react-dom",
+  react: "react",
+  "@ggui-ai/design/primitives": "primitives",
+  "@ggui-ai/design/components": "components",
+  "@ggui-ai/design/compositions": "compositions",
+  "@ggui-ai/design/interact": "interact",
+  "@ggui-ai/design/templates": "templates",
+  "@ggui-ai/design/app-components": "app-components",
+  "@ggui-ai/design/tokens": "tokens",
+  "@ggui-ai/design": "design",
+  "@ggui-ai/wire": "wire",
+  "@ggui-ai/gadgets": "gadgets"
+};
+function rewriteAssetUrl(code, opts) {
+  const base = opts.shimBaseUrl.replace(/\/$/, "");
+  for (const [specifier, shimName] of Object.entries(ASSET_SHIM_FOR_SPECIFIER)) {
+    code = replaceSpecifier(code, specifier, `${base}/${shimName}.js`);
+  }
+  return code;
+}
 function rewriteImportmap(code, opts) {
   const base = opts.reactBaseUrl ?? "https://esm.sh/react@18.2.0";
   code = replaceSpecifier(code, "react/jsx-runtime", `${base}/jsx-runtime`);
@@ -47122,6 +47140,8 @@ function rewriteImports(code, options) {
       return rewriteDataUrl(code, options);
     case "importmap":
       return rewriteImportmap(code, options);
+    case "asset-url":
+      return rewriteAssetUrl(code, options);
   }
 }
 function hoistImports(code) {
@@ -47159,7 +47179,7 @@ function makeScopeClass(reactId) {
 }
 var AUTO_RETRY_LIMIT = 1;
 var AUTO_RETRY_DELAY = 500;
-var ErrorBoundary = class extends import_react12.default.Component {
+var ErrorBoundary = class extends import_react7.default.Component {
   state = { error: null, catchCount: 0, autoRetrying: false };
   retryTimer = null;
   static getDerivedStateFromError(error210) {
@@ -47181,10 +47201,10 @@ var ErrorBoundary = class extends import_react12.default.Component {
     if (this.retryTimer) clearTimeout(this.retryTimer);
   }
   render() {
-    const { error: error210, autoRetrying, catchCount } = this.state;
+    const { error: error210, autoRetrying } = this.state;
     if (!error210) return this.props.children;
     if (autoRetrying) {
-      return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { style: {
+      return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { style: {
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
@@ -47193,21 +47213,22 @@ var ErrorBoundary = class extends import_react12.default.Component {
         gap: 8,
         fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
         fontSize: 13,
-        color: "rgba(255,255,255,0.4)"
+        color: "var(--ggui-color-onSurface, inherit)",
+        opacity: 0.6
       }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { style: {
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { style: {
           width: 16,
           height: 16,
-          border: "2px solid rgba(255,255,255,0.15)",
-          borderTopColor: "rgba(255,255,255,0.5)",
+          border: "2px solid rgba(128,128,128,0.25)",
+          borderTopColor: "currentColor",
           borderRadius: "50%",
           animation: "ggui-err-spin 0.6s linear infinite"
         } }),
         "Retrying...",
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("style", { children: `@keyframes ggui-err-spin { to { transform: rotate(360deg); } }` })
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("style", { children: `@keyframes ggui-err-spin { to { transform: rotate(360deg); } }` })
       ] });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { style: {
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { style: {
       display: "flex",
       flexDirection: "column",
       alignItems: "center",
@@ -47216,21 +47237,23 @@ var ErrorBoundary = class extends import_react12.default.Component {
       minHeight: 120,
       gap: 12,
       textAlign: "center",
-      fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
+      fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      color: "var(--ggui-color-onSurface, inherit)"
     }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { style: {
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { style: {
         width: 48,
         height: 48,
         borderRadius: 14,
         background: "rgba(239, 68, 68, 0.1)",
+        color: "#ef4444",
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
         fontSize: 22
       }, children: "!" }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { style: { fontSize: 14, fontWeight: 600, color: "rgba(255,255,255,0.8)" }, children: "Something went wrong" }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { style: { fontSize: 12, color: "rgba(255,255,255,0.4)", maxWidth: 280, lineHeight: 1.4 }, children: "This component encountered an error. Try asking for a different view." }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { style: { fontSize: 14, fontWeight: 600, opacity: 0.9 }, children: "Something went wrong" }),
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { style: { fontSize: 12, opacity: 0.6, maxWidth: 280, lineHeight: 1.4 }, children: "This component encountered an error. Try asking for a different view." }),
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
         "button",
         {
           onClick: () => this.setState({ error: null, catchCount: 0 }),
@@ -47238,9 +47261,10 @@ var ErrorBoundary = class extends import_react12.default.Component {
             marginTop: 4,
             padding: "8px 20px",
             borderRadius: 8,
-            border: "1px solid rgba(255,255,255,0.15)",
-            background: "rgba(255,255,255,0.08)",
-            color: "rgba(255,255,255,0.7)",
+            border: "1px solid currentColor",
+            background: "transparent",
+            color: "inherit",
+            opacity: 0.75,
             fontSize: 13,
             fontWeight: 500,
             cursor: "pointer"
@@ -47248,7 +47272,18 @@ var ErrorBoundary = class extends import_react12.default.Component {
           children: "Retry"
         }
       ),
-      catchCount > 1 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { style: { fontSize: 11, color: "rgba(255,255,255,0.2)" }, children: error210.message })
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("details", { style: { marginTop: 8, maxWidth: 320, width: "100%", textAlign: "left", opacity: 0.65 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("summary", { style: { fontSize: 11, cursor: "pointer" }, children: "Error details" }),
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("pre", { style: {
+          fontSize: 11,
+          fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace",
+          whiteSpace: "pre-wrap",
+          overflowWrap: "anywhere",
+          margin: "6px 0 0",
+          maxHeight: 140,
+          overflow: "auto"
+        }, children: error210.message })
+      ] })
     ] });
   }
 };
@@ -47257,15 +47292,15 @@ function ReactComponentRenderer({
   props = {},
   themeId,
   cssOverrides,
-  fallback = /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { children: "Loading component..." }),
+  fallback = /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { children: "Loading component..." }),
   onError
 }) {
-  const reactId = (0, import_react12.useId)();
-  const [scopeClass] = (0, import_react12.useState)(() => makeScopeClass(reactId) || `ggui-rcr-${++scopeCounter}`);
-  const [Component2, setComponent] = (0, import_react12.useState)(null);
-  const [error210, setError] = (0, import_react12.useState)(null);
-  const [loading, setLoading] = (0, import_react12.useState)(true);
-  (0, import_react12.useEffect)(() => {
+  const reactId = (0, import_react7.useId)();
+  const [scopeClass] = (0, import_react7.useState)(() => makeScopeClass(reactId) || `ggui-rcr-${++scopeCounter}`);
+  const [Component, setComponent] = (0, import_react7.useState)(null);
+  const [error210, setError] = (0, import_react7.useState)(null);
+  const [loading, setLoading] = (0, import_react7.useState)(true);
+  (0, import_react7.useEffect)(() => {
     if (!code || code.trim().length === 0) {
       setComponent(null);
       setLoading(false);
@@ -47293,7 +47328,7 @@ function ReactComponentRenderer({
         } catch {
         }
         w.__ggui__ = {
-          react: import_react12.default,
+          react: import_react7.default,
           reactDom: reactDomModule,
           primitives: primitives_exports,
           components: components_exports,
@@ -47301,7 +47336,7 @@ function ReactComponentRenderer({
           interact: interact_exports,
           wire: dist_exports
         };
-        w.__REACT = import_react12.default;
+        w.__REACT = import_react7.default;
         w.__GGUI_PRIMITIVES = primitives_exports;
         w.__GGUI_COMPONENTS = components_exports;
         w.__GGUI_COMPOSITIONS = compositions_exports;
@@ -47337,13 +47372,13 @@ function ReactComponentRenderer({
   }, [code]);
   const themeCss = themeId ? getScopedThemeCss(themeId, scopeClass) : getScopedCssTokens(scopeClass);
   if (!code || code.trim().length === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { children: fallback });
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { children: fallback });
   }
   if (loading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { children: fallback });
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { children: fallback });
   }
   if (error210) {
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { style: {
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { style: {
       display: "flex",
       flexDirection: "column",
       alignItems: "center",
@@ -47354,7 +47389,7 @@ function ReactComponentRenderer({
       textAlign: "center",
       fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
     }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { style: {
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { style: {
         width: 48,
         height: 48,
         borderRadius: 14,
@@ -47364,52 +47399,26 @@ function ReactComponentRenderer({
         justifyContent: "center",
         fontSize: 22
       }, children: "!" }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { style: { fontSize: 14, fontWeight: 600, color: "rgba(255,255,255,0.8)" }, children: "Failed to load component" }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { style: { fontSize: 12, color: "rgba(255,255,255,0.4)", maxWidth: 280, lineHeight: 1.4 }, children: error210.message })
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { style: { fontSize: 14, fontWeight: 600, color: "rgba(255,255,255,0.8)" }, children: "Failed to load component" }),
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { style: { fontSize: 12, color: "rgba(255,255,255,0.4)", maxWidth: 280, lineHeight: 1.4 }, children: error210.message })
     ] });
   }
-  if (!Component2) {
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { children: fallback });
+  if (!Component) {
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { children: fallback });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: scopeClass, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("style", { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: scopeClass, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("style", { children: [
       themeCss,
       cssOverrides ?? ""
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(ErrorBoundary, { onError, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Component2, { ...props }) }, code.length)
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(ErrorBoundary, { onError, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Component, { ...props }) }, code.length)
   ] });
 }
-var previewShimmerKeyframes = `@keyframes ggui-preview-shimmer {
-  0%   { transform: translateX(-100%); }
-  100% { transform: translateX(100%); }
-}`;
-var previewCaretKeyframes = `@keyframes ggui-preview-caret {
-  0%, 45%  { opacity: 1; }
-  55%, 100% { opacity: 0; }
-}`;
-var previewFragmentEnterKeyframes = `@keyframes ggui-preview-fragment-enter {
-  from { opacity: 0; transform: scale(0.97); }
-  to   { opacity: 1; transform: scale(1); }
-}`;
-var previewReducedMotionCSS = `@media (prefers-reduced-motion: reduce) {
-  [data-ggui-preview] *,
-  [data-ggui-preview]::before,
-  [data-ggui-preview]::after {
-    animation-duration: 0.01ms !important;
-    animation-iteration-count: 1 !important;
-    transition-duration: 0.01ms !important;
-  }
-}`;
-var previewKeyframesCss = [
-  previewShimmerKeyframes,
-  previewCaretKeyframes,
-  previewFragmentEnterKeyframes,
-  previewReducedMotionCSS
-].join("\n\n");
 var DynamicComponent = ReactComponentRenderer;
+var DECODER = new TextDecoder();
 
 // hub-preview-client/main.tsx
-var import_jsx_runtime70 = __toESM(require_jsx_runtime(), 1);
+var import_jsx_runtime62 = __toESM(require_jsx_runtime(), 1);
 function bootstrap() {
   const boot = window.__GGUI_DEV_PREVIEW__;
   return {
@@ -47473,11 +47482,11 @@ function PreviewApp({
   token,
   selectedId
 }) {
-  const [state, setState] = (0, import_react53.useState)(
+  const [state, setState] = (0, import_react43.useState)(
     selectedId ? { kind: "loading" } : { kind: "idle" }
   );
-  const [version2, setVersion] = (0, import_react53.useState)(0);
-  (0, import_react53.useEffect)(() => {
+  const [version2, setVersion] = (0, import_react43.useState)(0);
+  (0, import_react43.useEffect)(() => {
     if (!selectedId) {
       setState({ kind: "idle" });
       return;
@@ -47490,7 +47499,7 @@ function PreviewApp({
     });
     return () => controller.abort();
   }, [selectedId, token, version2]);
-  (0, import_react53.useEffect)(() => {
+  (0, import_react43.useEffect)(() => {
     if (!selectedId) return;
     const controller = new AbortController();
     subscribeToRegistry(token, controller.signal, (event) => {
@@ -47500,90 +47509,90 @@ function PreviewApp({
     return () => controller.abort();
   }, [selectedId, token]);
   if (state.kind === "idle") {
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Pane, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Meta, { children: "No UI selected" }),
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Status, { children: "Pick a UI from the Discovered UIs panel to preview it here." })
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Pane, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Meta, { children: "No UI selected" }),
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Status, { children: "Pick a UI from the Discovered UIs panel to preview it here." })
     ] });
   }
   if (state.kind === "loading") {
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Pane, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Meta, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Pane, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Meta, { children: [
         "Preview of ",
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("code", { children: selectedId })
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("code", { children: selectedId })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Status, { children: "Loading bundle\u2026" })
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Status, { children: "Loading bundle\u2026" })
     ] });
   }
   if (state.kind === "ready") {
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "surface", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(DynamicComponent, { code: state.code }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "surface", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(DynamicComponent, { code: state.code }) });
   }
   if (state.kind === "not-found") {
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Pane, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Meta, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Pane, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Meta, { children: [
         "Preview of ",
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("code", { children: selectedId })
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("code", { children: selectedId })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Status, { children: "The server doesn't know this id. It may have been removed from the registry." })
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Status, { children: "The server doesn't know this id. It may have been removed from the registry." })
     ] });
   }
   if (state.kind === "missing") {
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Pane, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Meta, { children: "No renderable entry" }),
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Status, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Pane, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Meta, { children: "No renderable entry" }),
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Status, { children: [
         "Declare ",
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("code", { children: "entryPoint" }),
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("code", { children: "entryPoint" }),
         " in ",
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("code", { children: "ggui.ui.json" }),
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("code", { children: "ggui.ui.json" }),
         ", or colocate a ",
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("code", { children: "ggui.ui.tsx" }),
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("code", { children: "ggui.ui.tsx" }),
         " beside the manifest."
       ] }),
-      state.tried.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("pre", { className: "tried", children: state.tried.join("\n") })
+      state.tried.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("pre", { className: "tried", children: state.tried.join("\n") })
     ] });
   }
   if (state.kind === "compile") {
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Pane, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Meta, { children: "Local compile failed" }),
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("ul", { className: "errors", children: state.detail.errors.map((err, i) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Pane, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Meta, { children: "Local compile failed" }),
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("ul", { className: "errors", children: state.detail.errors.map((err, i) => {
         const loc = err.location;
         const locLine = loc ? `${loc.file ?? state.detail.entry}:${loc.line ?? "?"}:${loc.column ?? "?"}` : state.detail.entry;
-        return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("li", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("pre", { className: "location", children: locLine }),
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("pre", { className: "error", children: err.text }),
-          loc?.lineText && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("pre", { className: "line-text", children: loc.lineText })
+        return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("li", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("pre", { className: "location", children: locLine }),
+          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("pre", { className: "error", children: err.text }),
+          loc?.lineText && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("pre", { className: "line-text", children: loc.lineText })
         ] }, i);
       }) })
     ] });
   }
   if (state.kind === "http") {
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Pane, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Meta, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Pane, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Meta, { children: [
         "Bundle fetch failed (HTTP ",
         state.status,
         ")"
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Status, { children: state.message })
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Status, { children: state.message })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Pane, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Meta, { children: "Local ggui dev server is unreachable" }),
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Status, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Pane, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Meta, { children: "Local ggui dev server is unreachable" }),
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Status, { children: [
       "Studio could not reach the server \u2014 is ",
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("code", { children: "ggui dev" }),
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("code", { children: "ggui dev" }),
       " still running?",
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("br", {}),
-      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "dim", children: state.message })
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("br", {}),
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: "dim", children: state.message })
     ] })
   ] });
 }
 function Pane({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "frame", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "pane", children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "frame", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "pane", children }) });
 }
 function Meta({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "meta", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "meta", children });
 }
 function Status({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "status", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "status", children });
 }
 async function subscribeToRegistry(token, signal, onEvent) {
   let backoff = 500;
@@ -47652,7 +47661,7 @@ function mount() {
   if (!root) throw new Error("preview-root element not found in shell");
   const { token, selectedId } = bootstrap();
   (0, import_client.createRoot)(root).render(
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react53.StrictMode, { children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(PreviewApp, { token, selectedId }) })
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react43.StrictMode, { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(PreviewApp, { token, selectedId }) })
   );
 }
 mount();