@dxos/react-ui-stack 0.8.3-main.7f5a14c → 0.8.3

package/dist/types/src/components/StackContext.d.ts

@@ -25,6 +25,7 @@ export type StackItemContextValue = {
     setSize: (nextSize: StackItemSize, commit?: boolean) => void;
     state: ItemDragState;
     setState: (state: ItemDragState) => void;
+    role?: string;
 };
 export declare const StackItemContext: import("react").Context<StackItemContextValue>;
 export declare const useStackItem: () => StackItemContextValue;

package/dist/types/src/components/StackContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackContext.d.ts","sourceRoot":"","sources":["../../../../src/components/StackContext.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,IAAI,EAAE,MAAM,SAAS,CAAC;AACtD,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,yBAAyB,EAAE,MAAM,QAAQ,CAAC;AAE5E,MAAM,MAAM,iBAAiB,GAAG;IAC9B,WAAW,EAAE,WAAW,CAAC;IACzB,IAAI,EAAE,OAAO,CAAC;IACd,IAAI,EAAE,IAAI,CAAC;IACX,WAAW,CAAC,EAAE,yBAAyB,CAAC;CACzC,CAAC;AAEF,eAAO,MAAM,YAAY,4CAIvB,CAAC;AAEH,eAAO,MAAM,QAAQ,yBAAiC,CAAC;AAEvD,MAAM,MAAM,aAAa,GACrB;IACE,IAAI,EAAE,MAAM,CAAC;CACd,GACD;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,SAAS,EAAE,WAAW,CAAC;IACvB,IAAI,EAAE,GAAG,CAAC;CACX,GACD;IACE,IAAI,EAAE,aAAa,CAAC;IACpB,IAAI,EAAE,GAAG,CAAC;CACX,CAAC;AAEN,eAAO,MAAM,IAAI,EAAE,aAAgC,CAAC;AAEpD,MAAM,MAAM,qBAAqB,GAAG;IAClC,iBAAiB,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5D,IAAI,EAAE,aAAa,CAAC;IACpB,OAAO,EAAE,CAAC,QAAQ,EAAE,aAAa,EAAE,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7D,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,gBAAgB,gDAM3B,CAAC;AAEH,eAAO,MAAM,YAAY,6BAAqC,CAAC"}
+{"version":3,"file":"StackContext.d.ts","sourceRoot":"","sources":["../../../../src/components/StackContext.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,IAAI,EAAE,MAAM,SAAS,CAAC;AACtD,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,yBAAyB,EAAE,MAAM,QAAQ,CAAC;AAE5E,MAAM,MAAM,iBAAiB,GAAG;IAC9B,WAAW,EAAE,WAAW,CAAC;IACzB,IAAI,EAAE,OAAO,CAAC;IACd,IAAI,EAAE,IAAI,CAAC;IACX,WAAW,CAAC,EAAE,yBAAyB,CAAC;CACzC,CAAC;AAEF,eAAO,MAAM,YAAY,4CAIvB,CAAC;AAEH,eAAO,MAAM,QAAQ,yBAAiC,CAAC;AAEvD,MAAM,MAAM,aAAa,GACrB;IACE,IAAI,EAAE,MAAM,CAAC;CACd,GACD;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,SAAS,EAAE,WAAW,CAAC;IACvB,IAAI,EAAE,GAAG,CAAC;CACX,GACD;IACE,IAAI,EAAE,aAAa,CAAC;IACpB,IAAI,EAAE,GAAG,CAAC;CACX,CAAC;AAEN,eAAO,MAAM,IAAI,EAAE,aAAgC,CAAC;AAEpD,MAAM,MAAM,qBAAqB,GAAG;IAClC,iBAAiB,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5D,IAAI,EAAE,aAAa,CAAC;IACpB,OAAO,EAAE,CAAC,QAAQ,EAAE,aAAa,EAAE,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7D,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,gBAAgB,gDAM3B,CAAC;AAEH,eAAO,MAAM,YAAY,6BAAqC,CAAC"}

package/dist/types/src/components/StackItem/StackItem.d.ts

@@ -33,10 +33,12 @@ export declare const StackItem: {
     } & {
         toolbar?: boolean;
         statusbar?: boolean;
+        layoutManaged?: boolean;
         size?: "intrinsic" | "video" | "square";
     } & React.RefAttributes<HTMLDivElement>>;
-    Heading: ({ children, classNames, asChild, ...props }: StackItemHeadingProps) => React.JSX.Element;
+    Heading: ({ children, classNames, asChild, separateOnScroll, ...props }: StackItemHeadingProps) => React.JSX.Element;
     HeadingLabel: React.ForwardRefExoticComponent<Omit<StackItemHeadingLabelProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+    HeadingStickyContent: ({ children }: React.PropsWithChildren<{}>) => React.JSX.Element;
     ResizeHandle: () => React.JSX.Element;
     DragHandle: ({ asChild, children }: StackItemDragHandleProps) => React.JSX.Element;
     Sigil: React.ForwardRefExoticComponent<{

package/dist/types/src/components/StackItem/StackItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/StackItem/StackItem.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,EAIZ,KAAK,qBAAqB,EAE1B,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,KAAK,eAAe,EAAY,MAAM,gBAAgB,CAAC;AAIhE,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAClF,OAAO,EAAuB,KAAK,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AAC3F,OAAO,EAGL,KAAK,qBAAqB,EAC1B,KAAK,0BAA0B,EAChC,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAyB,KAAK,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AACjG,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,EACzB,KAAK,yBAAyB,EAE/B,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,aAAa,EAAE,MAAM,SAAS,CAAC;AAGjE,eAAO,MAAM,uBAAuB,KAA6B,CAAC;AAClE,eAAO,MAAM,qBAAqB,gBAAwC,CAAC;AAC3E,eAAO,MAAM,sBAAsB,KAAkD,CAAC;AAEtF,KAAK,kBAAkB,GAAG,eAAe,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC,GAAG;IACxE,IAAI,EAAE,IAAI,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,qBAAqB,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;CAC9C,CAAC;AA+LF,KAAK,yBAAyB,GAAG;IAC/B,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE;QAAE,IAAI,EAAE,GAAG,CAAA;KAAE,KAAK,SAAS,CAAC;CAClD,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,cAAc,yBAAyB,6BAG3E,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;gCAL6B,yBAAyB;CAe3E,CAAC;AAEF,YAAY,EACV,kBAAkB,EAClB,qBAAqB,EACrB,qBAAqB,EACrB,0BAA0B,EAC1B,0BAA0B,EAC1B,wBAAwB,EACxB,mBAAmB,EACnB,yBAAyB,EACzB,oBAAoB,EACpB,yBAAyB,GAC1B,CAAC"}
+{"version":3,"file":"StackItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/StackItem/StackItem.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,EAIZ,KAAK,qBAAqB,EAE1B,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,KAAK,eAAe,EAAY,MAAM,gBAAgB,CAAC;AAIhE,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAClF,OAAO,EAAuB,KAAK,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AAC3F,OAAO,EAGL,KAAK,qBAAqB,EAC1B,KAAK,0BAA0B,EAEhC,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAyB,KAAK,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AACjG,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,EACzB,KAAK,yBAAyB,EAE/B,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,aAAa,EAAE,MAAM,SAAS,CAAC;AAGjE,eAAO,MAAM,uBAAuB,KAA6B,CAAC;AAClE,eAAO,MAAM,qBAAqB,gBAAwC,CAAC;AAC3E,eAAO,MAAM,sBAAsB,KAAkD,CAAC;AAEtF,KAAK,kBAAkB,GAAG,eAAe,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC,GAAG;IACxE,IAAI,EAAE,IAAI,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,qBAAqB,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;CAC9C,CAAC;AAqMF,KAAK,yBAAyB,GAAG;IAC/B,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE;QAAE,IAAI,EAAE,GAAG,CAAA;KAAE,KAAK,SAAS,CAAC;CAClD,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,cAAc,yBAAyB,6BAG3E,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;gCAL6B,yBAAyB;CAgB3E,CAAC;AAEF,YAAY,EACV,kBAAkB,EAClB,qBAAqB,EACrB,qBAAqB,EACrB,0BAA0B,EAC1B,0BAA0B,EAC1B,wBAAwB,EACxB,mBAAmB,EACnB,yBAAyB,EACzB,oBAAoB,EACpB,yBAAyB,GAC1B,CAAC"}

package/dist/types/src/components/StackItem/StackItemContent.d.ts

@@ -10,6 +10,10 @@ export type StackItemContentProps = ThemedClassName<ComponentPropsWithoutRef<'di
      * Whether to provide for the layout of a statusbar after the content.
      */
     statusbar?: boolean;
+    /**
+     * Whether the consumer intends to do something custom and typical affordances should not apply
+     */
+    layoutManaged?: boolean;
     /**
      * Whether to set a certain aspect ratio on the content, including the toolbar and statusbar. This is provided for
      * convenience and consistency; it can instead be specified by the `classNames` or `style` props as needed.
@@ -32,6 +36,10 @@ export declare const StackItemContent: React.ForwardRefExoticComponent<Omit<Omit
      * Whether to provide for the layout of a statusbar after the content.
      */
     statusbar?: boolean;
+    /**
+     * Whether the consumer intends to do something custom and typical affordances should not apply
+     */
+    layoutManaged?: boolean;
     /**
      * Whether to set a certain aspect ratio on the content, including the toolbar and statusbar. This is provided for
      * convenience and consistency; it can instead be specified by the `classNames` or `style` props as needed.

package/dist/types/src/components/StackItem/StackItemContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackItemContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/StackItem/StackItemContent.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,KAAK,wBAAwB,EAAc,MAAM,OAAO,CAAC;AAEzE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAKtD,MAAM,MAAM,qBAAqB,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IACrF;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;CACzC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB;;;IAtB3B;;;OAGG;cACO,OAAO;IAEjB;;OAEG;gBACS,OAAO;IAEnB;;;OAGG;WACI,WAAW,GAAG,OAAO,GAAG,QAAQ;wCAmCxC,CAAC"}
+{"version":3,"file":"StackItemContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/StackItem/StackItemContent.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,KAAK,wBAAwB,EAAuB,MAAM,OAAO,CAAC;AAElF,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAKtD,MAAM,MAAM,qBAAqB,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IACrF;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;CACzC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB;;;IA3B3B;;;OAGG;cACO,OAAO;IAEjB;;OAEG;gBACS,OAAO;IAEnB;;OAEG;oBACa,OAAO;IAEvB;;;OAGG;WACI,WAAW,GAAG,OAAO,GAAG,QAAQ;wCA8CxC,CAAC"}

package/dist/types/src/components/StackItem/StackItemHeading.d.ts

@@ -1,10 +1,12 @@
-import React, { type ComponentPropsWithoutRef, type ComponentPropsWithRef } from 'react';
+import React, { type ComponentPropsWithoutRef, type ComponentPropsWithRef, type PropsWithChildren } from 'react';
 import { type ThemedClassName } from '@dxos/react-ui';
 import { type AttendableId, type Related } from '@dxos/react-ui-attention';
 export type StackItemHeadingProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
     asChild?: boolean;
+    separateOnScroll?: boolean;
 };
-export declare const StackItemHeading: ({ children, classNames, asChild, ...props }: StackItemHeadingProps) => React.JSX.Element;
+export declare const StackItemHeading: ({ children, classNames, asChild, separateOnScroll, ...props }: StackItemHeadingProps) => React.JSX.Element;
+export declare const StackItemHeadingStickyContent: ({ children }: PropsWithChildren<{}>) => React.JSX.Element;
 export type StackItemHeadingLabelProps = ThemedClassName<ComponentPropsWithRef<'h1'>> & AttendableId & Related;
 export declare const StackItemHeadingLabel: React.ForwardRefExoticComponent<Omit<StackItemHeadingLabelProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
 //# sourceMappingURL=StackItemHeading.d.ts.map

package/dist/types/src/components/StackItem/StackItemHeading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackItemHeading.d.ts","sourceRoot":"","sources":["../../../../../src/components/StackItem/StackItemHeading.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EAAE,KAAK,wBAAwB,EAAE,KAAK,qBAAqB,EAAc,MAAM,OAAO,CAAC;AAErG,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAgB,KAAK,YAAY,EAAE,KAAK,OAAO,EAAE,MAAM,0BAA0B,CAAC;AAKzF,MAAM,MAAM,qBAAqB,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAE7G,eAAO,MAAM,gBAAgB,GAAI,6CAA6C,qBAAqB,sBAsBlG,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG,eAAe,CAAC,qBAAqB,CAAC,IAAI,CAAC,CAAC,GAAG,YAAY,GAAG,OAAO,CAAC;AAE/G,eAAO,MAAM,qBAAqB,oHAgBjC,CAAC"}
+{"version":3,"file":"StackItemHeading.d.ts","sourceRoot":"","sources":["../../../../../src/components/StackItem/StackItemHeading.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EACZ,KAAK,wBAAwB,EAC7B,KAAK,qBAAqB,EAE1B,KAAK,iBAAiB,EACvB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAgB,KAAK,YAAY,EAAE,KAAK,OAAO,EAAE,MAAM,0BAA0B,CAAC;AAKzF,MAAM,MAAM,qBAAqB,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IACrF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,+DAM9B,qBAAqB,sBAyBvB,CAAC;AAEF,eAAO,MAAM,6BAA6B,GAAI,cAAc,iBAAiB,CAAC,EAAE,CAAC,sBAMhF,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG,eAAe,CAAC,qBAAqB,CAAC,IAAI,CAAC,CAAC,GAAG,YAAY,GAAG,OAAO,CAAC;AAE/G,eAAO,MAAM,qBAAqB,oHAgBjC,CAAC"}

package/dist/types/src/exemplars/Card/Card.d.ts

@@ -28,10 +28,14 @@ export declare const Card: {
     } & React.RefAttributes<HTMLDivElement>>;
     Toolbar: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-toolbar").ToolbarProps, "className"> & {
         classNames?: import("@dxos/react-ui-types").ClassNameValue;
+    } & {
+        layoutManaged?: boolean;
     } & React.RefAttributes<HTMLDivElement>>;
     ToolbarIconButton: React.ForwardRefExoticComponent<Omit<import("@dxos/react-ui").IconButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
     ToolbarSeparator: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-separator").SeparatorProps, "className"> & {
         classNames?: import("@dxos/react-ui-types").ClassNameValue;
+    } & {
+        subdued?: boolean;
     } & {
         variant?: "gap" | "line";
     } & React.RefAttributes<HTMLDivElement>>;

package/dist/types/src/exemplars/Card/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../../src/exemplars/Card/Card.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EAKZ,KAAK,iBAAiB,EACvB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AA6FpG,KAAK,eAAe,GAAG;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAC3B,GAAG,OAAO,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAgD7C,eAAO,MAAM,IAAI;;;;kBA5IqE,OAAO;;;;;kBAAP,OAAO;;oCAiCzC,iBAAiB,CAAC;QAAE,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;;;;kBAjCF,OAAO;;;;;;;;;;;;sBAsExB,OAAO;;;;;;oBAwBjD,eAAe;;;;kBA9F4C,OAAO;;;;;kBAAP,OAAO;;CA0J5F,CAAC;AAEF,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../../src/exemplars/Card/Card.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EAKZ,KAAK,iBAAiB,EACvB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAiGpG,KAAK,eAAe,GAAG;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAC3B,GAAG,OAAO,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAgD7C,eAAO,MAAM,IAAI;;;;kBAhJqE,OAAO;;;;;kBAAP,OAAO;;oCAiCzC,iBAAiB,CAAC;QAAE,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;;;;kBAjCF,OAAO;;;;;;;;;;;;;;;;sBA0ExB,OAAO;;;;;;oBAwBjD,eAAe;;;;kBAlG4C,OAAO;;;;;kBAAP,OAAO;;CA8J5F,CAAC;AAEF,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC"}

package/dist/types/src/exemplars/Card/fragments.d.ts

@@ -1,7 +1,13 @@
 export declare const cardRoot = "contain-layout pli-2 plb-1 first-of-type:pbs-0 last-of-type:pbe-0";
 export declare const cardContent = "rounded overflow-hidden bg-cardSurface border border-separator dark:border-subduedSeparator dx-focus-ring-group-y-indicator relative min-bs-[--rail-item] group/card";
-export declare const cardSpacing = "pli-card-spacing-inline mlb-card-spacing-block";
-export declare const cardText = "pli-card-spacing-inline mlb-card-spacing-block";
+export declare const cardSpacing = "pli-cardSpacingInline mlb-cardSpacingBlock";
+export declare const labelSpacing = "mbs-inputSpacingBlock mbe-labelSpacingBlock";
+export declare const cardDialogContent = "p-0 bs-content min-bs-[8rem] max-bs-full md:max-is-[32rem] overflow-hidden";
+export declare const cardDialogHeader = "pli-cardSpacingInline mbs-cardSpacingBlock flex justify-between";
+export declare const cardDialogOverflow = "overflow-y-auto min-bs-0 flex-1";
+export declare const cardDialogPaddedOverflow = "overflow-y-auto min-bs-0 flex-1 plb-cardSpacingBlock";
+export declare const cardDialogSearchListRoot = "pli-cardSpacingInline pbs-cardSpacingBlock [&>input]:mbe-0 min-bs-0 flex-1 flex flex-col";
+export declare const cardText = "pli-cardSpacingInline mlb-cardSpacingBlock";
 export declare const cardHeading = "text-lg font-medium line-clamp-2";
-export declare const cardChrome = "pli-[--dx-card-spacing-chrome] mlb-[--dx-card-spacing-chrome] [&_.dx-button]:text-start [&_.dx-button]:is-full";
+export declare const cardChrome = "pli-[--dx-cardSpacingChrome] mlb-[--dx-cardSpacingChrome] [&_.dx-button]:text-start [&_.dx-button]:is-full";
 //# sourceMappingURL=fragments.d.ts.map

package/dist/types/src/exemplars/Card/fragments.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fragments.d.ts","sourceRoot":"","sources":["../../../../../src/exemplars/Card/fragments.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,QAAQ,sEAAsE,CAAC;AAE5F,eAAO,MAAM,WAAW,yKACgJ,CAAC;AAEzK,eAAO,MAAM,WAAW,mDAAmD,CAAC;AAE5E,eAAO,MAAM,QAAQ,mDAAc,CAAC;AAEpC,eAAO,MAAM,WAAW,qCAAqC,CAAC;AAE9D,eAAO,MAAM,UAAU,mHAC2F,CAAC"}
+{"version":3,"file":"fragments.d.ts","sourceRoot":"","sources":["../../../../../src/exemplars/Card/fragments.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,QAAQ,sEAAsE,CAAC;AAE5F,eAAO,MAAM,WAAW,yKACgJ,CAAC;AAEzK,eAAO,MAAM,WAAW,+CAA+C,CAAC;AACxE,eAAO,MAAM,YAAY,gDAAgD,CAAC;AAE1E,eAAO,MAAM,iBAAiB,+EAA+E,CAAC;AAC9G,eAAO,MAAM,gBAAgB,oEAAoE,CAAC;AAClG,eAAO,MAAM,kBAAkB,oCAAoC,CAAC;AACpE,eAAO,MAAM,wBAAwB,yDAA+C,CAAC;AACrF,eAAO,MAAM,wBAAwB,6FACuD,CAAC;AAE7F,eAAO,MAAM,QAAQ,+CAAc,CAAC;AAEpC,eAAO,MAAM,WAAW,qCAAqC,CAAC;AAE9D,eAAO,MAAM,UAAU,+GACuF,CAAC"}

package/dist/types/src/exemplars/Card/index.d.ts

@@ -1,3 +1,4 @@
 export * from './Card';
 export * from './CardDragPreview';
+export * from './fragments';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/src/exemplars/Card/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/exemplars/Card/index.ts"],"names":[],"mappings":"AAIA,cAAc,QAAQ,CAAC;AACvB,cAAc,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/exemplars/Card/index.ts"],"names":[],"mappings":"AAIA,cAAc,QAAQ,CAAC;AACvB,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC"}

package/dist/types/src/exemplars/CardStack/CardStack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardStack.d.ts","sourceRoot":"","sources":["../../../../../src/exemplars/CardStack/CardStack.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAoD,MAAM,OAAO,CAAC;AAKzE,OAAO,EAA8C,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AA8B/F,QAAA,MAAM,gBAAgB,qEAAqE,CAAC;AAgB5F,QAAA,MAAM,eAAe,8GACsF,CAAC;AAgB5G,QAAA,MAAM,gBAAgB,UAGrB,CAAC;AAgBF,QAAA,MAAM,aAAa,8BAA8B,CAAC;AAgBlD,eAAO,MAAM,SAAS;;;;kBA/FqE,OAAO;;;;;kBAAP,OAAO;;;;;;kBAAP,OAAO;;;;;kBAAP,OAAO;;;;;CAsGjG,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}
+{"version":3,"file":"CardStack.d.ts","sourceRoot":"","sources":["../../../../../src/exemplars/CardStack/CardStack.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAoD,MAAM,OAAO,CAAC;AAKzE,OAAO,EAA8C,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AA+B/F,QAAA,MAAM,gBAAgB,qEAAqE,CAAC;AAgB5F,QAAA,MAAM,eAAe,8GACsF,CAAC;AAgB5G,QAAA,MAAM,gBAAgB,UAGrB,CAAC;AAgBF,QAAA,MAAM,aAAa,8BAA8B,CAAC;AAgBlD,eAAO,MAAM,SAAS;;;;kBAhGqE,OAAO;;;;;kBAAP,OAAO;;;;;;kBAAP,OAAO;;;;;kBAAP,OAAO;;;;;CAuGjG,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-stack",
-  "version": "0.8.3-main.7f5a14c",
+  "version": "0.8.3",
   "description": "A stack component.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -49,12 +49,12 @@
     "@radix-ui/react-slot": "1.1.2",
     "@radix-ui/react-use-controllable-state": "1.1.0",
     "react-resize-detector": "^11.0.1",
-    "@dxos/echo-schema": "0.8.3-main.7f5a14c",
-    "@dxos/keyboard": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui-attention": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui-dnd": "0.8.3-main.7f5a14c",
-    "@dxos/util": "0.8.3-main.7f5a14c",
-    "@dxos/live-object": "0.8.3-main.7f5a14c"
+    "@dxos/echo-schema": "0.8.3",
+    "@dxos/keyboard": "0.8.3",
+    "@dxos/react-ui-attention": "0.8.3",
+    "@dxos/live-object": "0.8.3",
+    "@dxos/react-ui-dnd": "0.8.3",
+    "@dxos/util": "0.8.3"
   },
   "devDependencies": {
     "@phosphor-icons/react": "^2.1.5",
@@ -63,23 +63,23 @@
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "vite": "5.4.7",
-    "@dxos/app-graph": "0.8.3-main.7f5a14c",
-    "@dxos/client": "0.8.3-main.7f5a14c",
-    "@dxos/echo-schema": "0.8.3-main.7f5a14c",
-    "@dxos/random": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui-theme": "0.8.3-main.7f5a14c",
-    "@dxos/storybook-utils": "0.8.3-main.7f5a14c",
-    "@dxos/test-utils": "0.8.3-main.7f5a14c"
+    "@dxos/app-graph": "0.8.3",
+    "@dxos/client": "0.8.3",
+    "@dxos/echo-schema": "0.8.3",
+    "@dxos/react-ui": "0.8.3",
+    "@dxos/random": "0.8.3",
+    "@dxos/react-ui-theme": "0.8.3",
+    "@dxos/test-utils": "0.8.3",
+    "@dxos/storybook-utils": "0.8.3"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.1.5",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/random": "0.8.3-main.7f5a14c",
-    "@dxos/client": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui-theme": "0.8.3-main.7f5a14c"
+    "@dxos/client": "0.8.3",
+    "@dxos/random": "0.8.3",
+    "@dxos/react-ui-theme": "0.8.3",
+    "@dxos/react-ui": "0.8.3"
   },
   "publishConfig": {
     "access": "public"

package/src/components/StackContext.tsx

@@ -44,6 +44,7 @@ export type StackItemContextValue = {
   setSize: (nextSize: StackItemSize, commit?: boolean) => void;
   state: ItemDragState;
   setState: (state: ItemDragState) => void;
+  role?: string;
 };
 
 export const StackItemContext = createContext<StackItemContextValue>({

package/src/components/StackItem/StackItem.stories.tsx

@@ -23,7 +23,7 @@ const meta: Meta<typeof StackItem.Root> = {
           <DropdownMenu.Root>
             <DropdownMenu.Trigger asChild>
               <StackItem.SigilButton>
-                <Icon icon={'ph--dots-three--regular'} size={5} />
+                <Icon icon='ph--dots-three--regular' size={5} />
               </StackItem.SigilButton>
             </DropdownMenu.Trigger>
           </DropdownMenu.Root>

package/src/components/StackItem/StackItem.tsx

@@ -20,6 +20,7 @@ import React, {
   type ComponentPropsWithRef,
   useCallback,
   type ReactNode,
+  useMemo,
 } from 'react';
 import { createPortal } from 'react-dom';
 
@@ -34,6 +35,7 @@ import {
   StackItemHeadingLabel,
   type StackItemHeadingProps,
   type StackItemHeadingLabelProps,
+  StackItemHeadingStickyContent,
 } from './StackItemHeading';
 import { StackItemResizeHandle, type StackItemResizeHandleProps } from './StackItemResizeHandle';
 import {
@@ -214,8 +216,13 @@ const StackItemRoot = forwardRef<HTMLDivElement, StackItemRootProps>(
       return true;
     };
 
+    const stackItemContextValue = useMemo(
+      () => ({ selfDragHandleRef, size, setSize, state: dragState, setState: setDragState, role }),
+      [selfDragHandleRef, size, setSize, dragState, setDragState, role],
+    );
+
     return (
-      <StackItemContext.Provider value={{ selfDragHandleRef, size, setSize, state: dragState, setState: setDragState }}>
+      <StackItemContext.Provider value={stackItemContextValue}>
         <Root
           {...props}
           tabIndex={0}
@@ -229,6 +236,7 @@ const StackItemRoot = forwardRef<HTMLDivElement, StackItemRootProps>(
                 : 'dx-focus-ring-group-y',
             orientation === 'horizontal' ? 'grid-rows-subgrid' : 'grid-cols-subgrid',
             rail && (orientation === 'horizontal' ? 'row-span-2' : 'col-span-2'),
+            role === 'section' && orientation !== 'horizontal' && 'border-be border-subduedSeparator',
             classNames,
           )}
           data-dx-stack-item
@@ -266,6 +274,7 @@ export const StackItem = {
   Content: StackItemContent,
   Heading: StackItemHeading,
   HeadingLabel: StackItemHeadingLabel,
+  HeadingStickyContent: StackItemHeadingStickyContent,
   ResizeHandle: StackItemResizeHandle,
   DragHandle: StackItemDragHandle,
   Sigil: StackItemSigil,

package/src/components/StackItem/StackItemContent.tsx

@@ -2,12 +2,12 @@
 // Copyright 2024 DXOS.org
 //
 
-import React, { type ComponentPropsWithoutRef, forwardRef } from 'react';
+import React, { type ComponentPropsWithoutRef, forwardRef, useMemo } from 'react';
 
 import { type ThemedClassName } from '@dxos/react-ui';
 import { mx } from '@dxos/react-ui-theme';
 
-import { useStack } from '../StackContext';
+import { useStack, useStackItem } from '../StackContext';
 
 export type StackItemContentProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
   /**
@@ -21,6 +21,11 @@ export type StackItemContentProps = ThemedClassName<ComponentPropsWithoutRef<'di
    */
   statusbar?: boolean;
 
+  /**
+   * Whether the consumer intends to do something custom and typical affordances should not apply
+   */
+  layoutManaged?: boolean;
+
   /**
    * Whether to set a certain aspect ratio on the content, including the toolbar and statusbar. This is provided for
    * convenience and consistency; it can instead be specified by the `classNames` or `style` props as needed.
@@ -33,9 +38,22 @@ export type StackItemContentProps = ThemedClassName<ComponentPropsWithoutRef<'di
  * The `toolbar` flag must be provided since this component provides for the layout of content with the toolbar.
  */
 export const StackItemContent = forwardRef<HTMLDivElement, StackItemContentProps>(
-  ({ children, toolbar, statusbar, classNames, size = 'intrinsic', ...props }, forwardedRef) => {
+  ({ children, toolbar, statusbar, layoutManaged, classNames, size = 'intrinsic', ...props }, forwardedRef) => {
     const { size: stackItemSize } = useStack();
-
+    const { role } = useStackItem();
+    const style = useMemo(
+      () =>
+        layoutManaged
+          ? {}
+          : {
+              gridTemplateRows: [
+                ...(toolbar ? [role === 'section' ? 'calc(var(--toolbar-size) - 1px)' : 'var(--toolbar-size)'] : []),
+                '1fr',
+                ...(statusbar ? ['var(--statusbar-size)'] : []),
+              ].join(' '),
+            },
+      [toolbar, statusbar, layoutManaged],
+    );
     return (
       <div
         role='none'
@@ -44,15 +62,13 @@ export const StackItemContent = forwardRef<HTMLDivElement, StackItemContentProps
           'group grid grid-cols-[100%]',
           stackItemSize === 'contain' && 'min-bs-0 overflow-hidden',
           size === 'video' ? 'aspect-video' : size === 'square' && 'aspect-square',
+          toolbar && '[&_.dx-toolbar]:relative [&_.dx-toolbar]:border-be [&_.dx-toolbar]:border-subduedSeparator',
+          role === 'section' &&
+            toolbar &&
+            '[&_.dx-toolbar]:sticky [&_.dx-toolbar]:z-[1] [&_.dx-toolbar]:block-start-0 [&_.dx-toolbar]:-mbe-px [&_.dx-toolbar]:min-is-0',
           classNames,
         )}
-        style={{
-          gridTemplateRows: [
-            ...(toolbar ? ['var(--rail-action)'] : []),
-            '1fr',
-            ...(statusbar ? ['var(--statusbar-size)'] : []),
-          ].join(' '),
-        }}
+        style={style}
         data-popover-collision-boundary={true}
         ref={forwardedRef}
       >

package/src/components/StackItem/StackItemHeading.tsx

@@ -4,7 +4,12 @@
 
 import { useFocusableGroup } from '@fluentui/react-tabster';
 import { Slot } from '@radix-ui/react-slot';
-import React, { type ComponentPropsWithoutRef, type ComponentPropsWithRef, forwardRef } from 'react';
+import React, {
+  type ComponentPropsWithoutRef,
+  type ComponentPropsWithRef,
+  forwardRef,
+  type PropsWithChildren,
+} from 'react';
 
 import { type ThemedClassName } from '@dxos/react-ui';
 import { useAttention, type AttendableId, type Related } from '@dxos/react-ui-attention';
@@ -12,9 +17,18 @@ import { mx } from '@dxos/react-ui-theme';
 
 import { useStack } from '../StackContext';
 
-export type StackItemHeadingProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { asChild?: boolean };
+export type StackItemHeadingProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
+  asChild?: boolean;
+  separateOnScroll?: boolean;
+};
 
-export const StackItemHeading = ({ children, classNames, asChild, ...props }: StackItemHeadingProps) => {
+export const StackItemHeading = ({
+  children,
+  classNames,
+  asChild,
+  separateOnScroll,
+  ...props
+}: StackItemHeadingProps) => {
   const { orientation } = useStack();
   const focusableGroupAttrs = useFocusableGroup({ tabBehavior: 'limited' });
 
@@ -27,7 +41,10 @@ export const StackItemHeading = ({ children, classNames, asChild, ...props }: St
       tabIndex={0}
       {...focusableGroupAttrs}
       className={mx(
-        'flex items-center dx-focus-ring-inset-over-all relative !border-is-0 bg-headerSurface border-transparent [[data-scroll-separator="true"]_&]:border-subduedSeparator',
+        'flex items-center dx-focus-ring-inset-over-all relative !border-is-0 bg-headerSurface',
+        separateOnScroll
+          ? 'border-transparent [[data-scroll-separator="true"]_&]:border-subduedSeparator'
+          : 'border-subduedSeparator',
         orientation === 'horizontal' ? 'bs-[--rail-size]' : 'is-[--rail-size] flex-col',
         orientation === 'horizontal' ? 'border-be' : 'border-ie',
         classNames,
@@ -38,6 +55,14 @@ export const StackItemHeading = ({ children, classNames, asChild, ...props }: St
   );
 };
 
+export const StackItemHeadingStickyContent = ({ children }: PropsWithChildren<{}>) => {
+  return (
+    <div role='none' className='sticky block-start-0 bg-[--sticky-bg] p-1 is-full'>
+      {children}
+    </div>
+  );
+};
+
 export type StackItemHeadingLabelProps = ThemedClassName<ComponentPropsWithRef<'h1'>> & AttendableId & Related;
 
 export const StackItemHeadingLabel = forwardRef<HTMLHeadingElement, StackItemHeadingLabelProps>(

package/src/exemplars/Card/Card.tsx

@@ -13,7 +13,7 @@ import React, {
 } from 'react';
 
 import { Icon, IconButton, type ThemedClassName, Toolbar, type ToolbarRootProps, useTranslation } from '@dxos/react-ui';
-import { mx } from '@dxos/react-ui-theme';
+import { hoverableControls, mx } from '@dxos/react-ui-theme';
 
 import { cardChrome, cardContent, cardHeading, cardRoot, cardText, cardSpacing } from './fragments';
 import { StackItem } from '../../components';
@@ -60,7 +60,11 @@ const CardConditionalContent = ({ role, children }: PropsWithChildren<{ role?: s
       </div>
     );
   } else {
-    return <CardContent>{children}</CardContent>;
+    return (
+      <CardContent {...(role === 'card--document' && { classNames: ['mlb-[1em]', hoverableControls] })}>
+        {children}
+      </CardContent>
+    );
   }
 };
 

package/src/exemplars/Card/fragments.ts

@@ -7,11 +7,19 @@ export const cardRoot = 'contain-layout pli-2 plb-1 first-of-type:pbs-0 last-of-
 export const cardContent =
   'rounded overflow-hidden bg-cardSurface border border-separator dark:border-subduedSeparator dx-focus-ring-group-y-indicator relative min-bs-[--rail-item] group/card';
 
-export const cardSpacing = 'pli-card-spacing-inline mlb-card-spacing-block';
+export const cardSpacing = 'pli-cardSpacingInline mlb-cardSpacingBlock';
+export const labelSpacing = 'mbs-inputSpacingBlock mbe-labelSpacingBlock';
+
+export const cardDialogContent = 'p-0 bs-content min-bs-[8rem] max-bs-full md:max-is-[32rem] overflow-hidden';
+export const cardDialogHeader = 'pli-cardSpacingInline mbs-cardSpacingBlock flex justify-between';
+export const cardDialogOverflow = 'overflow-y-auto min-bs-0 flex-1';
+export const cardDialogPaddedOverflow = `${cardDialogOverflow} plb-cardSpacingBlock`;
+export const cardDialogSearchListRoot =
+  'pli-cardSpacingInline pbs-cardSpacingBlock [&>input]:mbe-0 min-bs-0 flex-1 flex flex-col';
 
 export const cardText = cardSpacing;
 
 export const cardHeading = 'text-lg font-medium line-clamp-2';
 
 export const cardChrome =
-  'pli-[--dx-card-spacing-chrome] mlb-[--dx-card-spacing-chrome] [&_.dx-button]:text-start [&_.dx-button]:is-full';
+  'pli-[--dx-cardSpacingChrome] mlb-[--dx-cardSpacingChrome] [&_.dx-button]:text-start [&_.dx-button]:is-full';

package/src/exemplars/Card/index.ts

@@ -4,3 +4,4 @@
 
 export * from './Card';
 export * from './CardDragPreview';
+export * from './fragments';

package/src/exemplars/CardStack/CardStack.tsx

@@ -28,6 +28,7 @@ const CardStackStack = forwardRef<
       }
       itemsCount={itemsCount}
       separatorOnScroll={9}
+      data-density='fine'
       {...props}
       ref={forwardedRef}
     >