@seed-design/stackflow 0.0.0-alpha-20260414104312

package/lib/components/AppBar/AppBar.cjs

@@ -0,0 +1,115 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const reactSlot = require('@radix-ui/react-slot');
+const appBar = require('@seed-design/css/recipes/app-bar');
+const appBarMain = require('@seed-design/css/recipes/app-bar-main');
+const domUtils = require('@seed-design/dom-utils');
+const reactPrimitive = require('@seed-design/react-primitive');
+const clsx = require('clsx');
+const React = require('react');
+const AppBar = require('../../primitive/AppBar/AppBar.cjs');
+const useAppBarContext = require('../../primitive/AppBar/useAppBarContext.cjs');
+const createStyleContext = require('../../utils/createStyleContext.cjs');
+const useTopActivity = require('../../primitive/private/useTopActivity.cjs');
+const react = require('@stackflow/react');
+const styled = require('../../utils/styled.cjs');
+
+const { PropsProvider, ClassNamesProvider, useProps, withContext, useClassNames } = createStyleContext.createStyleContext(appBar.appBar);
+const {
+  PropsProvider: MainPropsProvider,
+  withProvider: withMainProvider,
+  withContext: withMainContext
+} = createStyleContext.createStyleContext(appBarMain.appBarMain);
+const AppBarPropsProvider = PropsProvider;
+const AppBarRoot = React.forwardRef((props, ref) => {
+  const { style: boxStyle, restProps: propsWithoutBoxProps } = styled.useBoxBackgroundProps(props);
+  const contextProps = useProps();
+  const [variantProps, otherProps] = appBar.appBar.splitVariantProps({
+    ...contextProps,
+    ...propsWithoutBoxProps
+  });
+  const topActivityTransitionStyle = useTopActivity.useTopActivity().transitionStyle;
+  const resolvedVariantProps = {
+    // this includes the default transitionStyle decided by theme, from contextProps or props
+    ...variantProps,
+    ...react.useActivity().isTop === false && {
+      transitionStyle: topActivityTransitionStyle
+    }
+  };
+  const classNames = appBar.appBar(resolvedVariantProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(ClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsxRuntime.jsx(MainPropsProvider, { value: resolvedVariantProps, children: /* @__PURE__ */ jsxRuntime.jsx(
+    AppBar.AppBarRoot,
+    {
+      ref,
+      ...domUtils.mergeProps({ className: classNames.root, style: boxStyle }, otherProps)
+    }
+  ) }) });
+});
+AppBarRoot.displayName = "AppBarRoot";
+const AppBarLeft = withContext(
+  AppBar.AppBarLeft,
+  "left"
+);
+const AppBarRight = withContext(
+  AppBar.AppBarRight,
+  "right"
+);
+const AppBarMain = withMainProvider(
+  AppBar.AppBarMain,
+  "root"
+);
+const AppBarTitle = withMainContext(
+  reactPrimitive.Primitive.span,
+  "title"
+);
+const AppBarSubtitle = withMainContext(
+  reactPrimitive.Primitive.span,
+  "subtitle"
+);
+const AppBarIconButton = React.forwardRef(
+  ({ children, className, ...otherProps }, ref) => {
+    const { stateProps } = useAppBarContext.useAppBarContext();
+    const classNames = useClassNames();
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      reactPrimitive.Primitive.button,
+      {
+        ref,
+        type: "button",
+        className: clsx(classNames.iconButton, className),
+        ...domUtils.mergeProps(stateProps, otherProps),
+        children: /* @__PURE__ */ jsxRuntime.jsx(reactSlot.Slot, { className: classNames.icon, ...stateProps, children })
+      }
+    );
+  }
+);
+AppBarIconButton.displayName = "IconButton";
+const AppBarSlot = React.forwardRef(
+  ({ children, className, ...otherProps }, ref) => {
+    const { stateProps } = useAppBarContext.useAppBarContext();
+    const classNames = useClassNames();
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      reactSlot.Slot,
+      {
+        ref,
+        className: clsx(classNames.custom, className),
+        ...domUtils.mergeProps(stateProps, otherProps),
+        children
+      }
+    );
+  }
+);
+AppBarSlot.displayName = "AppBarSlot";
+
+exports.AppBarIconButton = AppBarIconButton;
+exports.AppBarLeft = AppBarLeft;
+exports.AppBarMain = AppBarMain;
+exports.AppBarPropsProvider = AppBarPropsProvider;
+exports.AppBarRight = AppBarRight;
+exports.AppBarRoot = AppBarRoot;
+exports.AppBarSlot = AppBarSlot;
+exports.AppBarSubtitle = AppBarSubtitle;
+exports.AppBarTitle = AppBarTitle;

package/lib/components/AppBar/AppBar.d.ts

@@ -0,0 +1,34 @@
+import { AppBarVariantProps, AppBarVariant } from '@seed-design/css/recipes/app-bar';
+import { AppBarMainVariantProps } from '@seed-design/css/recipes/app-bar-main';
+import { PrimitiveProps } from '@seed-design/react-primitive';
+import { AppBar as AppBarPrimitive } from '../../primitive';
+import { BoxBackgroundProps } from '../../utils/styled';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export declare const AppBarPropsProvider: ({ children, value }: {
+    children: React.ReactNode;
+    value: Partial< AppBarVariant>;
+}) => import("react/jsx-runtime").JSX.Element;
+export interface AppBarProps extends AppBarVariantProps, AppBarPrimitive.RootProps, BoxBackgroundProps {
+}
+export declare const AppBarRoot: ForwardRefExoticComponent<AppBarProps & RefAttributes<HTMLDivElement>>;
+export interface AppBarLeftProps extends AppBarPrimitive.LeftProps {
+}
+export declare const AppBarLeft: ForwardRefExoticComponent<AppBarLeftProps & RefAttributes<HTMLDivElement>>;
+export interface AppBarRightProps extends AppBarPrimitive.RightProps {
+}
+export declare const AppBarRight: ForwardRefExoticComponent<AppBarRightProps & RefAttributes<HTMLDivElement>>;
+export interface AppBarMainProps extends AppBarMainVariantProps, AppBarPrimitive.MainProps {
+}
+export declare const AppBarMain: ForwardRefExoticComponent<AppBarMainProps & RefAttributes<HTMLDivElement>>;
+export interface AppBarTitleProps extends PrimitiveProps, React.HTMLAttributes<HTMLSpanElement> {
+}
+export declare const AppBarTitle: ForwardRefExoticComponent<AppBarTitleProps & RefAttributes<HTMLSpanElement>>;
+export interface AppBarSubtitleProps extends PrimitiveProps, React.HTMLAttributes<HTMLSpanElement> {
+}
+export declare const AppBarSubtitle: ForwardRefExoticComponent<AppBarSubtitleProps & RefAttributes<HTMLSpanElement>>;
+export interface AppBarIconButtonProps extends PrimitiveProps, React.ButtonHTMLAttributes<HTMLButtonElement> {
+}
+export declare const AppBarIconButton: ForwardRefExoticComponent<AppBarIconButtonProps & RefAttributes<HTMLButtonElement>>;
+export interface AppBarSlotProps extends PrimitiveProps, React.HTMLAttributes<HTMLElement> {
+}
+export declare const AppBarSlot: ForwardRefExoticComponent<AppBarSlotProps & RefAttributes<HTMLElement>>;

package/lib/components/AppBar/AppBar.js

@@ -0,0 +1,103 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Slot } from '@radix-ui/react-slot';
+import { appBar } from '@seed-design/css/recipes/app-bar';
+import { appBarMain } from '@seed-design/css/recipes/app-bar-main';
+import { mergeProps } from '@seed-design/dom-utils';
+import { Primitive } from '@seed-design/react-primitive';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { AppBarLeft as AppBarLeft$1, AppBarMain as AppBarMain$1, AppBarRight as AppBarRight$1, AppBarRoot as AppBarRoot$1 } from '../../primitive/AppBar/AppBar.js';
+import { useAppBarContext } from '../../primitive/AppBar/useAppBarContext.js';
+import { createStyleContext } from '../../utils/createStyleContext.js';
+import { useTopActivity } from '../../primitive/private/useTopActivity.js';
+import { useActivity } from '@stackflow/react';
+import { useBoxBackgroundProps } from '../../utils/styled.js';
+
+const { PropsProvider, ClassNamesProvider, useProps, withContext, useClassNames } = createStyleContext(appBar);
+const {
+  PropsProvider: MainPropsProvider,
+  withProvider: withMainProvider,
+  withContext: withMainContext
+} = createStyleContext(appBarMain);
+const AppBarPropsProvider = PropsProvider;
+const AppBarRoot = forwardRef((props, ref) => {
+  const { style: boxStyle, restProps: propsWithoutBoxProps } = useBoxBackgroundProps(props);
+  const contextProps = useProps();
+  const [variantProps, otherProps] = appBar.splitVariantProps({
+    ...contextProps,
+    ...propsWithoutBoxProps
+  });
+  const topActivityTransitionStyle = useTopActivity().transitionStyle;
+  const resolvedVariantProps = {
+    // this includes the default transitionStyle decided by theme, from contextProps or props
+    ...variantProps,
+    ...useActivity().isTop === false && {
+      transitionStyle: topActivityTransitionStyle
+    }
+  };
+  const classNames = appBar(resolvedVariantProps);
+  return /* @__PURE__ */ jsx(ClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsx(MainPropsProvider, { value: resolvedVariantProps, children: /* @__PURE__ */ jsx(
+    AppBarRoot$1,
+    {
+      ref,
+      ...mergeProps({ className: classNames.root, style: boxStyle }, otherProps)
+    }
+  ) }) });
+});
+AppBarRoot.displayName = "AppBarRoot";
+const AppBarLeft = withContext(
+  AppBarLeft$1,
+  "left"
+);
+const AppBarRight = withContext(
+  AppBarRight$1,
+  "right"
+);
+const AppBarMain = withMainProvider(
+  AppBarMain$1,
+  "root"
+);
+const AppBarTitle = withMainContext(
+  Primitive.span,
+  "title"
+);
+const AppBarSubtitle = withMainContext(
+  Primitive.span,
+  "subtitle"
+);
+const AppBarIconButton = forwardRef(
+  ({ children, className, ...otherProps }, ref) => {
+    const { stateProps } = useAppBarContext();
+    const classNames = useClassNames();
+    return /* @__PURE__ */ jsx(
+      Primitive.button,
+      {
+        ref,
+        type: "button",
+        className: clsx(classNames.iconButton, className),
+        ...mergeProps(stateProps, otherProps),
+        children: /* @__PURE__ */ jsx(Slot, { className: classNames.icon, ...stateProps, children })
+      }
+    );
+  }
+);
+AppBarIconButton.displayName = "IconButton";
+const AppBarSlot = forwardRef(
+  ({ children, className, ...otherProps }, ref) => {
+    const { stateProps } = useAppBarContext();
+    const classNames = useClassNames();
+    return /* @__PURE__ */ jsx(
+      Slot,
+      {
+        ref,
+        className: clsx(classNames.custom, className),
+        ...mergeProps(stateProps, otherProps),
+        children
+      }
+    );
+  }
+);
+AppBarSlot.displayName = "AppBarSlot";
+
+export { AppBarIconButton, AppBarLeft, AppBarMain, AppBarPropsProvider, AppBarRight, AppBarRoot, AppBarSlot, AppBarSubtitle, AppBarTitle };

package/lib/components/AppBar/AppBar.namespace.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const AppBar = require('./AppBar.cjs');
+
+
+
+exports.IconButton = AppBar.AppBarIconButton;
+exports.Left = AppBar.AppBarLeft;
+exports.Main = AppBar.AppBarMain;
+exports.Right = AppBar.AppBarRight;
+exports.Root = AppBar.AppBarRoot;
+exports.Slot = AppBar.AppBarSlot;
+exports.Subtitle = AppBar.AppBarSubtitle;
+exports.Title = AppBar.AppBarTitle;

package/lib/components/AppBar/AppBar.namespace.d.ts

@@ -0,0 +1,2 @@
+export { AppBarIconButton as IconButton, AppBarLeft as Left, AppBarMain as Main, AppBarRight as Right, AppBarRoot as Root, AppBarSlot as Slot, AppBarSubtitle as Subtitle, AppBarTitle as Title, } from './AppBar';
+export type { AppBarIconButtonProps as IconButtonProps, AppBarLeftProps as LeftProps, AppBarMainProps as MainProps, AppBarRightProps as RightProps, AppBarProps as RootProps, AppBarSlotProps as SlotProps, AppBarSubtitleProps as SubtitleProps, AppBarTitleProps as TitleProps, } from './AppBar';

package/lib/components/AppBar/AppBar.namespace.js

@@ -0,0 +1 @@
+export { AppBarIconButton as IconButton, AppBarLeft as Left, AppBarMain as Main, AppBarRight as Right, AppBarRoot as Root, AppBarSlot as Slot, AppBarSubtitle as Subtitle, AppBarTitle as Title } from './AppBar.js';

package/lib/components/AppBar/index.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const AppBar = require('./AppBar.cjs');
+const AppBar_namespace = require('./AppBar.namespace.cjs');
+
+
+
+exports.AppBarIconButton = AppBar.AppBarIconButton;
+exports.AppBarLeft = AppBar.AppBarLeft;
+exports.AppBarMain = AppBar.AppBarMain;
+exports.AppBarRight = AppBar.AppBarRight;
+exports.AppBarRoot = AppBar.AppBarRoot;
+exports.AppBarSlot = AppBar.AppBarSlot;
+exports.AppBarSubtitle = AppBar.AppBarSubtitle;
+exports.AppBarTitle = AppBar.AppBarTitle;
+exports.AppBar = AppBar_namespace;

package/lib/components/AppBar/index.d.ts

@@ -0,0 +1,3 @@
+export { AppBarIconButton, AppBarLeft, AppBarMain, AppBarRight, AppBarRoot, AppBarSlot, AppBarSubtitle, AppBarTitle, } from './AppBar';
+export type { AppBarIconButtonProps, AppBarLeftProps, AppBarMainProps, AppBarProps, AppBarRightProps, AppBarSlotProps, AppBarSubtitleProps, AppBarTitleProps, } from './AppBar';
+export * as AppBar from './AppBar.namespace';

package/lib/components/AppBar/index.js

@@ -0,0 +1,3 @@
+export { AppBarIconButton, AppBarLeft, AppBarMain, AppBarRight, AppBarRoot, AppBarSlot, AppBarSubtitle, AppBarTitle } from './AppBar.js';
+import * as AppBar_namespace from './AppBar.namespace.js';
+export { AppBar_namespace as AppBar };

package/lib/components/AppScreen/AppScreen.cjs

@@ -0,0 +1,68 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const appScreen = require('@seed-design/css/recipes/app-screen');
+const domUtils = require('@seed-design/dom-utils');
+const React = require('react');
+const AppScreen = require('../../primitive/AppScreen/AppScreen.cjs');
+const createStyleContext = require('../../utils/createStyleContext.cjs');
+const AppBar = require('../AppBar/AppBar.cjs');
+const useTopActivity = require('../../primitive/private/useTopActivity.cjs');
+const react = require('@stackflow/react');
+const appBar = require('@seed-design/css/recipes/app-bar');
+
+const { ClassNamesProvider, PropsProvider, withContext, useProps } = createStyleContext.createStyleContext(appScreen.appScreen);
+const AppScreenPropsProvider = PropsProvider;
+const AppScreenRoot = React.forwardRef((props, ref) => {
+  const contextProps = useProps();
+  const [variantProps, otherProps] = appScreen.appScreen.splitVariantProps({ ...contextProps, ...props });
+  const transitionStyle = variantProps.transitionStyle ?? (variantProps.theme === "cupertino" ? "slideFromRightIOS" : "fadeFromBottomAndroid");
+  const topActivityTransitionStyle = useTopActivity.useTopActivity().transitionStyle;
+  const classNames = appScreen.appScreen({
+    ...variantProps,
+    transitionStyle: react.useActivity().isTop ? transitionStyle : topActivityTransitionStyle
+  });
+  const [appBarVariantProps] = React.useMemo(
+    () => appBar.appBar.splitVariantProps(variantProps),
+    [variantProps]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(ClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsxRuntime.jsx(
+    AppBar.AppBarPropsProvider,
+    {
+      value: React.useMemo(
+        () => ({ ...appBarVariantProps, transitionStyle }),
+        [appBarVariantProps, transitionStyle]
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        AppScreen.AppScreenRoot,
+        {
+          ref,
+          "data-transition-style": transitionStyle,
+          ...domUtils.mergeProps({ className: classNames.root }, otherProps)
+        }
+      )
+    }
+  ) });
+});
+AppScreenRoot.displayName = "AppScreenRoot";
+const AppScreenDim = withContext(
+  AppScreen.AppScreenDim,
+  "dim"
+);
+const AppScreenEdge = withContext(
+  AppScreen.AppScreenEdge,
+  "edge"
+);
+const AppScreenLayer = withContext(
+  AppScreen.AppScreenLayer,
+  "layer"
+);
+
+exports.AppScreenDim = AppScreenDim;
+exports.AppScreenEdge = AppScreenEdge;
+exports.AppScreenLayer = AppScreenLayer;
+exports.AppScreenPropsProvider = AppScreenPropsProvider;
+exports.AppScreenRoot = AppScreenRoot;

package/lib/components/AppScreen/AppScreen.d.ts

@@ -0,0 +1,23 @@
+import { AppScreenVariantProps, AppScreenVariant } from '@seed-design/css/recipes/app-screen';
+import { AppScreen as AppScreenPrimitive } from '../../primitive';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export declare const AppScreenPropsProvider: ({ children, value }: {
+    children: React.ReactNode;
+    value: Partial< AppScreenVariant>;
+}) => import("react/jsx-runtime").JSX.Element;
+export interface AppScreenRootProps extends AppScreenVariantProps, AppScreenPrimitive.RootProps {
+    /**
+     * @default "layer"
+     */
+    tone?: "layer" | "transparent";
+}
+export declare const AppScreenRoot: ForwardRefExoticComponent<AppScreenRootProps & RefAttributes<HTMLDivElement>>;
+export interface AppScreenDimProps extends AppScreenPrimitive.DimProps {
+}
+export declare const AppScreenDim: ForwardRefExoticComponent<AppScreenDimProps & RefAttributes<HTMLDivElement>>;
+export interface AppScreenEdgeProps extends AppScreenPrimitive.EdgeProps {
+}
+export declare const AppScreenEdge: ForwardRefExoticComponent<AppScreenEdgeProps & RefAttributes<HTMLDivElement>>;
+export interface AppScreenLayerProps extends AppScreenPrimitive.LayerProps {
+}
+export declare const AppScreenLayer: ForwardRefExoticComponent<AppScreenLayerProps & RefAttributes<HTMLDivElement>>;

package/lib/components/AppScreen/AppScreen.js

@@ -0,0 +1,60 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { appScreen } from '@seed-design/css/recipes/app-screen';
+import { mergeProps } from '@seed-design/dom-utils';
+import { forwardRef, useMemo } from 'react';
+import { AppScreenDim as AppScreenDim$1, AppScreenEdge as AppScreenEdge$1, AppScreenLayer as AppScreenLayer$1, AppScreenRoot as AppScreenRoot$1 } from '../../primitive/AppScreen/AppScreen.js';
+import { createStyleContext } from '../../utils/createStyleContext.js';
+import { AppBarPropsProvider } from '../AppBar/AppBar.js';
+import { useTopActivity } from '../../primitive/private/useTopActivity.js';
+import { useActivity } from '@stackflow/react';
+import { appBar } from '@seed-design/css/recipes/app-bar';
+
+const { ClassNamesProvider, PropsProvider, withContext, useProps } = createStyleContext(appScreen);
+const AppScreenPropsProvider = PropsProvider;
+const AppScreenRoot = forwardRef((props, ref) => {
+  const contextProps = useProps();
+  const [variantProps, otherProps] = appScreen.splitVariantProps({ ...contextProps, ...props });
+  const transitionStyle = variantProps.transitionStyle ?? (variantProps.theme === "cupertino" ? "slideFromRightIOS" : "fadeFromBottomAndroid");
+  const topActivityTransitionStyle = useTopActivity().transitionStyle;
+  const classNames = appScreen({
+    ...variantProps,
+    transitionStyle: useActivity().isTop ? transitionStyle : topActivityTransitionStyle
+  });
+  const [appBarVariantProps] = useMemo(
+    () => appBar.splitVariantProps(variantProps),
+    [variantProps]
+  );
+  return /* @__PURE__ */ jsx(ClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsx(
+    AppBarPropsProvider,
+    {
+      value: useMemo(
+        () => ({ ...appBarVariantProps, transitionStyle }),
+        [appBarVariantProps, transitionStyle]
+      ),
+      children: /* @__PURE__ */ jsx(
+        AppScreenRoot$1,
+        {
+          ref,
+          "data-transition-style": transitionStyle,
+          ...mergeProps({ className: classNames.root }, otherProps)
+        }
+      )
+    }
+  ) });
+});
+AppScreenRoot.displayName = "AppScreenRoot";
+const AppScreenDim = withContext(
+  AppScreenDim$1,
+  "dim"
+);
+const AppScreenEdge = withContext(
+  AppScreenEdge$1,
+  "edge"
+);
+const AppScreenLayer = withContext(
+  AppScreenLayer$1,
+  "layer"
+);
+
+export { AppScreenDim, AppScreenEdge, AppScreenLayer, AppScreenPropsProvider, AppScreenRoot };

package/lib/components/AppScreen/AppScreen.namespace.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const AppScreen = require('./AppScreen.cjs');
+
+
+
+exports.Dim = AppScreen.AppScreenDim;
+exports.Edge = AppScreen.AppScreenEdge;
+exports.Layer = AppScreen.AppScreenLayer;
+exports.PropsProvider = AppScreen.AppScreenPropsProvider;
+exports.Root = AppScreen.AppScreenRoot;

package/lib/components/AppScreen/AppScreen.namespace.d.ts

@@ -0,0 +1,2 @@
+export { AppScreenDim as Dim, AppScreenEdge as Edge, AppScreenLayer as Layer, AppScreenRoot as Root, AppScreenPropsProvider as PropsProvider, } from './AppScreen';
+export type { AppScreenDimProps as DimProps, AppScreenEdgeProps as EdgeProps, AppScreenLayerProps as LayerProps, AppScreenRootProps as RootProps, } from './AppScreen';

package/lib/components/AppScreen/AppScreen.namespace.js

@@ -0,0 +1 @@
+export { AppScreenDim as Dim, AppScreenEdge as Edge, AppScreenLayer as Layer, AppScreenPropsProvider as PropsProvider, AppScreenRoot as Root } from './AppScreen.js';

package/lib/components/AppScreen/index.cjs

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const AppScreen = require('./AppScreen.cjs');
+const AppScreen_namespace = require('./AppScreen.namespace.cjs');
+
+
+
+exports.AppScreenDim = AppScreen.AppScreenDim;
+exports.AppScreenEdge = AppScreen.AppScreenEdge;
+exports.AppScreenLayer = AppScreen.AppScreenLayer;
+exports.AppScreenPropsProvider = AppScreen.AppScreenPropsProvider;
+exports.AppScreenRoot = AppScreen.AppScreenRoot;
+exports.AppScreen = AppScreen_namespace;

package/lib/components/AppScreen/index.d.ts

@@ -0,0 +1,3 @@
+export { AppScreenDim, AppScreenEdge, AppScreenLayer, AppScreenRoot, AppScreenPropsProvider, } from './AppScreen';
+export type { AppScreenDimProps, AppScreenEdgeProps, AppScreenLayerProps, AppScreenRootProps, } from './AppScreen';
+export * as AppScreen from './AppScreen.namespace';

package/lib/components/AppScreen/index.js

@@ -0,0 +1,3 @@
+export { AppScreenDim, AppScreenEdge, AppScreenLayer, AppScreenPropsProvider, AppScreenRoot } from './AppScreen.js';
+import * as AppScreen_namespace from './AppScreen.namespace.js';
+export { AppScreen_namespace as AppScreen };

package/lib/components/index.cjs

@@ -0,0 +1,26 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const AppBar = require('./AppBar/AppBar.cjs');
+const AppBar_namespace = require('./AppBar/AppBar.namespace.cjs');
+const AppScreen = require('./AppScreen/AppScreen.cjs');
+const AppScreen_namespace = require('./AppScreen/AppScreen.namespace.cjs');
+
+
+
+exports.AppBarIconButton = AppBar.AppBarIconButton;
+exports.AppBarLeft = AppBar.AppBarLeft;
+exports.AppBarMain = AppBar.AppBarMain;
+exports.AppBarRight = AppBar.AppBarRight;
+exports.AppBarRoot = AppBar.AppBarRoot;
+exports.AppBarSlot = AppBar.AppBarSlot;
+exports.AppBarSubtitle = AppBar.AppBarSubtitle;
+exports.AppBarTitle = AppBar.AppBarTitle;
+exports.AppBar = AppBar_namespace;
+exports.AppScreenDim = AppScreen.AppScreenDim;
+exports.AppScreenEdge = AppScreen.AppScreenEdge;
+exports.AppScreenLayer = AppScreen.AppScreenLayer;
+exports.AppScreenPropsProvider = AppScreen.AppScreenPropsProvider;
+exports.AppScreenRoot = AppScreen.AppScreenRoot;
+exports.AppScreen = AppScreen_namespace;

package/lib/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './AppBar';
+export * from './AppScreen';

package/lib/components/index.js

@@ -0,0 +1,6 @@
+export { AppBarIconButton, AppBarLeft, AppBarMain, AppBarRight, AppBarRoot, AppBarSlot, AppBarSubtitle, AppBarTitle } from './AppBar/AppBar.js';
+import * as AppBar_namespace from './AppBar/AppBar.namespace.js';
+export { AppBar_namespace as AppBar };
+export { AppScreenDim, AppScreenEdge, AppScreenLayer, AppScreenPropsProvider, AppScreenRoot } from './AppScreen/AppScreen.js';
+import * as AppScreen_namespace from './AppScreen/AppScreen.namespace.js';
+export { AppScreen_namespace as AppScreen };

package/lib/hooks/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const useActivityZIndexBase = require('./useActivityZIndexBase.cjs');
+
+
+
+exports.useActivityZIndexBase = useActivityZIndexBase.useActivityZIndexBase;

package/lib/hooks/index.d.ts

@@ -0,0 +1 @@
+export { useActivityZIndexBase } from './useActivityZIndexBase';

package/lib/hooks/index.js

@@ -0,0 +1 @@
+export { useActivityZIndexBase } from './useActivityZIndexBase.js';

package/lib/hooks/useActivityZIndexBase.cjs

@@ -0,0 +1,14 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const reactUiCore = require('@stackflow/react-ui-core');
+
+const Z_INDEX_SPACING = 5;
+function useActivityZIndexBase(params) {
+  const activity = reactUiCore.useNullableActivity();
+  return ((activity?.zIndex ?? 0) + (params?.activityOffset ?? 0)) * Z_INDEX_SPACING;
+}
+
+exports.useActivityZIndexBase = useActivityZIndexBase;

package/lib/hooks/useActivityZIndexBase.d.ts

@@ -0,0 +1,18 @@
+interface UseActivityZIndexBaseParams {
+    /**
+     * Offset from the current activity's position in the stack.
+     *
+     * - `0` (default): Current activity's z-index base
+     * - `1`: Next activity's z-index base (common for overlay components)
+     *
+     * @default 0
+     */
+    activityOffset?: number;
+}
+/**
+ * Returns the base z-index which is calculated by multiplying the activity's index by 5.
+ * This value is used to give proper z-index values to elements of AppScreen (e.g. app-bar, dim, edge, layer). See the stylesheet of AppScreen for more details.
+ * This value can be provided to layerIndex of various overlay components (e.g. AlertDialog, BottomSheet, MenuSheet) to ensure correct stacking order.
+ */
+export declare function useActivityZIndexBase(params?: UseActivityZIndexBaseParams): number;
+export {};

package/lib/hooks/useActivityZIndexBase.js

@@ -0,0 +1,10 @@
+'use client';
+import { useNullableActivity } from '@stackflow/react-ui-core';
+
+const Z_INDEX_SPACING = 5;
+function useActivityZIndexBase(params) {
+  const activity = useNullableActivity();
+  return ((activity?.zIndex ?? 0) + (params?.activityOffset ?? 0)) * Z_INDEX_SPACING;
+}
+
+export { useActivityZIndexBase };

package/lib/index.cjs

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const plugin = require('./plugin.cjs');
+const AppBar = require('./components/AppBar/AppBar.cjs');
+const AppBar_namespace = require('./components/AppBar/AppBar.namespace.cjs');
+const AppScreen = require('./components/AppScreen/AppScreen.cjs');
+const AppScreen_namespace = require('./components/AppScreen/AppScreen.namespace.cjs');
+const useActivityZIndexBase = require('./hooks/useActivityZIndexBase.cjs');
+const index = require('./primitive/index.cjs');
+
+
+
+exports.seedPlugin = plugin.seedPlugin;
+exports.AppBarIconButton = AppBar.AppBarIconButton;
+exports.AppBarLeft = AppBar.AppBarLeft;
+exports.AppBarMain = AppBar.AppBarMain;
+exports.AppBarRight = AppBar.AppBarRight;
+exports.AppBarRoot = AppBar.AppBarRoot;
+exports.AppBarSlot = AppBar.AppBarSlot;
+exports.AppBarSubtitle = AppBar.AppBarSubtitle;
+exports.AppBarTitle = AppBar.AppBarTitle;
+exports.AppBar = AppBar_namespace;
+exports.AppScreenDim = AppScreen.AppScreenDim;
+exports.AppScreenEdge = AppScreen.AppScreenEdge;
+exports.AppScreenLayer = AppScreen.AppScreenLayer;
+exports.AppScreenPropsProvider = AppScreen.AppScreenPropsProvider;
+exports.AppScreenRoot = AppScreen.AppScreenRoot;
+exports.AppScreen = AppScreen_namespace;
+exports.useActivityZIndexBase = useActivityZIndexBase.useActivityZIndexBase;
+exports.Primitive = index;

package/lib/index.d.ts

@@ -0,0 +1,4 @@
+export { seedPlugin, type SeedPluginOptions } from './plugin';
+export * from './components';
+export * from './hooks';
+export * as Primitive from './primitive';