aidos-ui 3.0.1 → 3.0.2

package/dist/BaseListItem.d.ts

@@ -22,6 +22,5 @@ export interface BaseListItemProps extends RowProps {
     role?: undefined;
     gap?: Spacing;
     selected?: boolean;
-    bare?: boolean;
 }
 export declare const BaseListItem: React.ForwardRefExoticComponent<Omit<BaseListItemProps, "ref"> & React.RefAttributes<HTMLElement>>;

package/dist/BaseListItem.js

@@ -5,7 +5,9 @@ import { Row } from "./Row";
 import { cssVar } from "./jss";
 import { TextPairing } from "./TextPairing";
 import { BaseView } from "./BaseView";
-export const BaseListItem = React.forwardRef(({ children, jsStyle, withDivider = true, headline, headlineSize = "medium", headlineColor = "primary", headlineAddOn, body, bodySize = "small", bodyColor = "secondary", addOn, addOnPosition, outerAddOn, disabled = false, padding = "medium", gap = "medium", selected, bare, headlineBold, ...otherProps }, ref) => {
+import { useListContext } from "./List";
+export const BaseListItem = React.forwardRef(({ children, jsStyle, withDivider = true, headline, headlineSize = "medium", headlineColor = "primary", headlineAddOn, body, bodySize = "small", bodyColor = "secondary", addOn, addOnPosition, outerAddOn, disabled = false, padding = "medium", gap = "medium", selected, headlineBold, ...otherProps }, ref) => {
+    const { bare } = useListContext();
     const content = (_jsx(TextPairing, { headlineBold: headlineBold, padding: padding, gap: gap, addOn: addOn, addOnPosition: addOnPosition, headline: headline, headlineSize: headlineSize, headlineColor: disabled ? "subtle" : bare && selected ? "highlight" : headlineColor, headlineAddOn: headlineAddOn, body: body, bodySize: bodySize, bodyColor: disabled ? "subtle" : bodyColor, grow: true, shrink: false }));
     return (_jsxs(_Fragment, { children: [_jsxs(Row, { ...otherProps, ref: ref, relative: true, tag: "li", role: "row", jsStyle: [
                     !bare && {

package/dist/BaseListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseListItem.js","sourceRoot":"","sources":["../src/BaseListItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,GAAG,EAAY,MAAM,OAAO,CAAC;AACtC,OAAO,EAA+C,MAAM,EAAE,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAyBtC,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EACE,QAAQ,EACR,OAAO,EACP,WAAW,GAAG,IAAI,EAClB,QAAQ,EACR,YAAY,GAAG,QAAQ,EACvB,aAAa,GAAG,SAAS,EACzB,aAAa,EACb,IAAI,EACJ,QAAQ,GAAG,OAAO,EAClB,SAAS,GAAG,WAAW,EACvB,KAAK,EACL,aAAa,EACb,UAAU,EACV,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,QAAQ,EAClB,GAAG,GAAG,QAAQ,EACd,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,GAAG,UAAU,EACK,EACpB,GAA4B,EAC5B,EAAE;IACF,MAAM,OAAO,GAAG,CACd,KAAC,WAAW,IACV,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,aAAa,EACX,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,EAEtE,aAAa,EAAE,aAAa,EAC5B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC1C,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,KAAK,GACb,CACH,CAAC;IAEF,OAAO,CACL,8BACE,MAAC,GAAG,OACE,UAAU,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,QACR,GAAG,EAAC,IAAI,EACR,IAAI,EAAC,KAAK,EACV,OAAO,EAAE;oBACP,CAAC,IAAI,IAAI;wBACP,CAAC,gBAAgB,CAAC,EAAE;4BAClB,mBAAmB,EAAE,MAAM,CAAC,mBAAmB,CAAC;4BAChD,oBAAoB,EAAE,MAAM,CAAC,mBAAmB,CAAC;yBAClD;wBACD,CAAC,eAAe,CAAC,EAAE;4BACjB,sBAAsB,EAAE,MAAM,CAAC,mBAAmB,CAAC;4BACnD,uBAAuB,EAAE,MAAM,CAAC,mBAAmB,CAAC;yBACrD;qBACF;oBACD,OAAO;iBACR,aAED,KAAC,GAAG,IACF,IAAI,QACJ,IAAI,EAAC,UAAU,EACf,OAAO,EAAE;4BACP,QAAQ,EAAE,QAAQ;yBACnB,YAEA,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC,GAClB,EACL,UAAU,IAAI,KAAC,QAAQ,IAAC,IAAI,EAAC,UAAU,YAAE,UAAU,GAAY,IAC5D,EACL,WAAW,IAAI,KAAC,WAAW,KAAG,IAC9B,CACJ,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"BaseListItem.js","sourceRoot":"","sources":["../src/BaseListItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,GAAG,EAAY,MAAM,OAAO,CAAC;AACtC,OAAO,EAA+C,MAAM,EAAE,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAwBxC,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EACE,QAAQ,EACR,OAAO,EACP,WAAW,GAAG,IAAI,EAClB,QAAQ,EACR,YAAY,GAAG,QAAQ,EACvB,aAAa,GAAG,SAAS,EACzB,aAAa,EACb,IAAI,EACJ,QAAQ,GAAG,OAAO,EAClB,SAAS,GAAG,WAAW,EACvB,KAAK,EACL,aAAa,EACb,UAAU,EACV,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,QAAQ,EAClB,GAAG,GAAG,QAAQ,EACd,QAAQ,EACR,YAAY,EACZ,GAAG,UAAU,EACK,EACpB,GAA4B,EAC5B,EAAE;IACF,MAAM,EAAE,IAAI,EAAE,GAAG,cAAc,EAAE,CAAC;IAElC,MAAM,OAAO,GAAG,CACd,KAAC,WAAW,IACV,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,aAAa,EACX,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,EAEtE,aAAa,EAAE,aAAa,EAC5B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC1C,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,KAAK,GACb,CACH,CAAC;IAEF,OAAO,CACL,8BACE,MAAC,GAAG,OACE,UAAU,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,QACR,GAAG,EAAC,IAAI,EACR,IAAI,EAAC,KAAK,EACV,OAAO,EAAE;oBACP,CAAC,IAAI,IAAI;wBACP,CAAC,gBAAgB,CAAC,EAAE;4BAClB,mBAAmB,EAAE,MAAM,CAAC,mBAAmB,CAAC;4BAChD,oBAAoB,EAAE,MAAM,CAAC,mBAAmB,CAAC;yBAClD;wBACD,CAAC,eAAe,CAAC,EAAE;4BACjB,sBAAsB,EAAE,MAAM,CAAC,mBAAmB,CAAC;4BACnD,uBAAuB,EAAE,MAAM,CAAC,mBAAmB,CAAC;yBACrD;qBACF;oBACD,OAAO;iBACR,aAED,KAAC,GAAG,IACF,IAAI,QACJ,IAAI,EAAC,UAAU,EACf,OAAO,EAAE;4BACP,QAAQ,EAAE,QAAQ;yBACnB,YAEA,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC,GAClB,EACL,UAAU,IAAI,KAAC,QAAQ,IAAC,IAAI,EAAC,UAAU,YAAE,UAAU,GAAY,IAC5D,EACL,WAAW,IAAI,KAAC,WAAW,KAAG,IAC9B,CACJ,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/List.d.ts

@@ -8,4 +8,7 @@ interface ListProps extends BaseListProps {
     carded?: boolean;
 }
 export declare function List({ ariaLabel, jsStyle, autofocus, navigation, bare, carded, ...otherProps }: ListProps): import("react/jsx-runtime").JSX.Element;
+export declare const useListContext: () => {
+    bare: boolean;
+};
 export {};

package/dist/List.js

@@ -1,25 +1,29 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useContext, useMemo } from "react";
 import { BaseList } from "./BaseList";
 import { useNavigation } from "./useNavigation";
 import { cssVar } from "./jss";
+const ListContext = React.createContext({ bare: false });
 export function List({ ariaLabel, jsStyle, autofocus = false, navigation = true, bare, carded = true, ...otherProps }) {
     const rootRef = useNavigation({ autofocus, enabled: navigation });
-    return (_jsx(BaseList, { role: "grid", "aria-label": ariaLabel, ref: rootRef, jsStyle: [
-            { overflow: "hidden" },
-            !bare && {
-                backgroundColor: cssVar("--overlay-background"),
-            },
-            !bare &&
-                !carded && {
-                borderBottom: `1px solid ${cssVar("--divider")}`,
-                borderTop: `1px solid ${cssVar("--divider")}`,
-            },
-            !bare &&
-                carded && {
-                border: `1px solid ${cssVar("--divider")}`,
-                borderRadius: cssVar("--border-radius-l"),
-            },
-            jsStyle,
-        ], ...otherProps }));
+    const contextValue = useMemo(() => ({ bare }), [bare]);
+    return (_jsx(ListContext.Provider, { value: contextValue, children: _jsx(BaseList, { role: "grid", "aria-label": ariaLabel, ref: rootRef, jsStyle: [
+                { overflow: "hidden" },
+                !bare && {
+                    backgroundColor: cssVar("--overlay-background"),
+                },
+                !bare &&
+                    !carded && {
+                    borderBottom: `1px solid ${cssVar("--divider")}`,
+                    borderTop: `1px solid ${cssVar("--divider")}`,
+                },
+                !bare &&
+                    carded && {
+                    border: `1px solid ${cssVar("--divider")}`,
+                    borderRadius: cssVar("--border-radius-l"),
+                },
+                jsStyle,
+            ], ...otherProps }) }));
 }
+export const useListContext = () => useContext(ListContext);
 //# sourceMappingURL=List.js.map

package/dist/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sourceRoot":"","sources":["../src/List.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAiB,MAAM,YAAY,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAW/B,MAAM,UAAU,IAAI,CAAC,EACnB,SAAS,EACT,OAAO,EACP,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,IAAI,EACjB,IAAI,EACJ,MAAM,GAAG,IAAI,EACb,GAAG,UAAU,EACH;IACV,MAAM,OAAO,GAAG,aAAa,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAC;IAElE,OAAO,CACL,KAAC,QAAQ,IACP,IAAI,EAAC,MAAM,gBACC,SAAS,EACrB,GAAG,EAAE,OAAO,EACZ,OAAO,EAAE;YACP,EAAE,QAAQ,EAAE,QAAQ,EAAE;YACtB,CAAC,IAAI,IAAI;gBACP,eAAe,EAAE,MAAM,CAAC,sBAAsB,CAAC;aAChD;YACD,CAAC,IAAI;gBACH,CAAC,MAAM,IAAI;gBACT,YAAY,EAAE,aAAa,MAAM,CAAC,WAAW,CAAC,EAAE;gBAChD,SAAS,EAAE,aAAa,MAAM,CAAC,WAAW,CAAC,EAAE;aAC9C;YACH,CAAC,IAAI;gBACH,MAAM,IAAI;gBACR,MAAM,EAAE,aAAa,MAAM,CAAC,WAAW,CAAC,EAAE;gBAC1C,YAAY,EAAE,MAAM,CAAC,mBAAmB,CAAC;aAC1C;YACH,OAAO;SACR,KACG,UAAU,GACd,CACH,CAAC;AACJ,CAAC"}
+{"version":3,"file":"List.js","sourceRoot":"","sources":["../src/List.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAiB,MAAM,YAAY,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAW/B,MAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;AAEzD,MAAM,UAAU,IAAI,CAAC,EACnB,SAAS,EACT,OAAO,EACP,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,IAAI,EACjB,IAAI,EACJ,MAAM,GAAG,IAAI,EACb,GAAG,UAAU,EACH;IACV,MAAM,OAAO,GAAG,aAAa,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAC;IAClE,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEvD,OAAO,CACL,KAAC,WAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,YACvC,KAAC,QAAQ,IACP,IAAI,EAAC,MAAM,gBACC,SAAS,EACrB,GAAG,EAAE,OAAO,EACZ,OAAO,EAAE;gBACP,EAAE,QAAQ,EAAE,QAAQ,EAAE;gBACtB,CAAC,IAAI,IAAI;oBACP,eAAe,EAAE,MAAM,CAAC,sBAAsB,CAAC;iBAChD;gBACD,CAAC,IAAI;oBACH,CAAC,MAAM,IAAI;oBACT,YAAY,EAAE,aAAa,MAAM,CAAC,WAAW,CAAC,EAAE;oBAChD,SAAS,EAAE,aAAa,MAAM,CAAC,WAAW,CAAC,EAAE;iBAC9C;gBACH,CAAC,IAAI;oBACH,MAAM,IAAI;oBACR,MAAM,EAAE,aAAa,MAAM,CAAC,WAAW,CAAC,EAAE;oBAC1C,YAAY,EAAE,MAAM,CAAC,mBAAmB,CAAC;iBAC1C;gBACH,OAAO;aACR,KACG,UAAU,GACd,GACmB,CACxB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC"}

package/dist/ListButtonItem.d.ts

@@ -8,7 +8,6 @@ interface ListButtonItemProps extends BaseListItemProps {
     body?: string;
     disabled?: boolean;
     selected?: boolean;
-    bare?: boolean;
     children?: void;
 }
 export declare const ListButtonItem: React.ForwardRefExoticComponent<Omit<ListButtonItemProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/ListButtonItem.js

@@ -3,7 +3,9 @@ import React from "react";
 import { BaseListItem } from "./BaseListItem";
 import { getGlyphColor, getInteractableListItemJSStyles, } from "./Interactable";
 import { BaseButton } from "./BaseButton";
-export const ListButtonItem = React.forwardRef(({ onClick, color = "secondary", disabled = false, padding = "medium", jsStyle, gap, selected, bare, ...otherProps }, ref) => {
-    return (_jsx(BaseListItem, { withDivider: !bare, disabled: disabled, padding: "none", gap: gap, headlineColor: getGlyphColor(color, disabled, true), bodyColor: getGlyphColor(color, disabled, true), selected: selected, "aria-selected": selected, bare: bare, ...otherProps, jsStyle: jsStyle, children: ({ content }) => (_jsx(BaseButton, { padding: padding, disabled: disabled, animateInteraction: false, bare: true, color: bare ? "secondary" : color, ref: ref, jsStyle: getInteractableListItemJSStyles({ bare, selected }), onClick: onClick, children: content })) }));
+import { useListContext } from "./List";
+export const ListButtonItem = React.forwardRef(({ onClick, color = "secondary", disabled = false, padding = "medium", jsStyle, gap, selected, ...otherProps }, ref) => {
+    const { bare } = useListContext();
+    return (_jsx(BaseListItem, { withDivider: !bare, disabled: disabled, padding: "none", gap: gap, headlineColor: getGlyphColor(color, disabled, true), bodyColor: getGlyphColor(color, disabled, true), selected: selected, "aria-selected": selected, ...otherProps, jsStyle: jsStyle, children: ({ content }) => (_jsx(BaseButton, { padding: padding, disabled: disabled, animateInteraction: false, bare: true, color: bare ? "secondary" : color, ref: ref, jsStyle: getInteractableListItemJSStyles({ bare, selected }), onClick: onClick, children: content })) }));
 });
 //# sourceMappingURL=ListButtonItem.js.map

package/dist/ListButtonItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListButtonItem.js","sourceRoot":"","sources":["../src/ListButtonItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAEL,aAAa,EACb,+BAA+B,GAChC,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAc1C,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAC5C,CACE,EACE,OAAO,EACP,KAAK,GAAG,WAAW,EACnB,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,QAAQ,EAClB,OAAO,EACP,GAAG,EACH,QAAQ,EACR,IAAI,EACJ,GAAG,UAAU,EACO,EACtB,GAAkC,EAClC,EAAE;IACF,OAAO,CACL,KAAC,YAAY,IACX,WAAW,EAAE,CAAC,IAAI,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAC,MAAM,EACd,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,EACnD,SAAS,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,EAC/C,QAAQ,EAAE,QAAQ,mBACH,QAAQ,EACvB,IAAI,EAAE,IAAI,KACN,UAAU,EACd,OAAO,EAAE,OAAO,YAEf,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAChB,KAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,KAAK,EACzB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,EACjC,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,+BAA+B,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAC5D,OAAO,EAAE,OAAO,YAEf,OAAO,GACG,CACd,GACY,CAChB,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"ListButtonItem.js","sourceRoot":"","sources":["../src/ListButtonItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAEL,aAAa,EACb,+BAA+B,GAChC,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAaxC,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAC5C,CACE,EACE,OAAO,EACP,KAAK,GAAG,WAAW,EACnB,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,QAAQ,EAClB,OAAO,EACP,GAAG,EACH,QAAQ,EACR,GAAG,UAAU,EACO,EACtB,GAAkC,EAClC,EAAE;IACF,MAAM,EAAE,IAAI,EAAE,GAAG,cAAc,EAAE,CAAC;IAElC,OAAO,CACL,KAAC,YAAY,IACX,WAAW,EAAE,CAAC,IAAI,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAC,MAAM,EACd,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,EACnD,SAAS,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,EAC/C,QAAQ,EAAE,QAAQ,mBACH,QAAQ,KACnB,UAAU,EACd,OAAO,EAAE,OAAO,YAEf,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAChB,KAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,KAAK,EACzB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,EACjC,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,+BAA+B,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAC5D,OAAO,EAAE,OAAO,YAEf,OAAO,GACG,CACd,GACY,CAChB,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/ListHeaderItem.d.ts

@@ -1,7 +1,6 @@
 import { ReactNode } from "react";
 import { Position } from "./jss";
-export declare function ListHeaderItem({ bare, highlight, headline, body, withDivider, addOn, addOnPosition, }: {
-    bare?: boolean;
+export declare function ListHeaderItem({ highlight, headline, body, withDivider, addOn, addOnPosition, }: {
     highlight?: boolean;
     headline: string;
     body?: string;

package/dist/ListHeaderItem.js

@@ -1,8 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { BaseListItem } from "./BaseListItem";
 import { cssVar } from "./jss";
-export function ListHeaderItem({ bare, highlight, headline, body, withDivider, addOn, addOnPosition, }) {
-    return (_jsx(BaseListItem, { bare: bare, headline: headline, headlineColor: highlight ? (bare ? "highlight" : "light") : "primary", headlineBold: true, body: body, addOn: addOn, addOnPosition: addOnPosition, withDivider: bare ? false : withDivider, jsStyle: bare
+import { useListContext } from "./List";
+export function ListHeaderItem({ highlight, headline, body, withDivider, addOn, addOnPosition, }) {
+    const { bare } = useListContext();
+    return (_jsx(BaseListItem, { headline: headline, headlineColor: highlight ? (bare ? "highlight" : "light") : "primary", headlineBold: true, body: body, addOn: addOn, addOnPosition: addOnPosition, withDivider: bare ? false : withDivider, jsStyle: bare
             ? null
             : {
                 backgroundColor: highlight

package/dist/ListHeaderItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListHeaderItem.js","sourceRoot":"","sources":["../src/ListHeaderItem.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAY,MAAM,EAAE,MAAM,OAAO,CAAC;AAEzC,MAAM,UAAU,cAAc,CAAC,EAC7B,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,KAAK,EACL,aAAa,GASd;IACC,OAAO,CACL,KAAC,YAAY,IACX,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,EACrE,YAAY,EAAE,IAAI,EAClB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,EACvC,OAAO,EACL,IAAI;YACF,CAAC,CAAC,IAAI;YACN,CAAC,CAAC;gBACE,eAAe,EAAE,SAAS;oBACxB,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC;oBACvB,CAAC,CAAC,MAAM,CAAC,wBAAwB,CAAC;aACrC,YAGN,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,OAAO,GACZ,CAChB,CAAC;AACJ,CAAC"}
+{"version":3,"file":"ListHeaderItem.js","sourceRoot":"","sources":["../src/ListHeaderItem.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAY,MAAM,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAExC,MAAM,UAAU,cAAc,CAAC,EAC7B,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,KAAK,EACL,aAAa,GAQd;IACC,MAAM,EAAE,IAAI,EAAE,GAAG,cAAc,EAAE,CAAC;IAElC,OAAO,CACL,KAAC,YAAY,IACX,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,EACrE,YAAY,EAAE,IAAI,EAClB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,EACvC,OAAO,EACL,IAAI;YACF,CAAC,CAAC,IAAI;YACN,CAAC,CAAC;gBACE,eAAe,EAAE,SAAS;oBACxB,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC;oBACvB,CAAC,CAAC,MAAM,CAAC,wBAAwB,CAAC;aACrC,YAGN,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,OAAO,GACZ,CAChB,CAAC;AACJ,CAAC"}

package/dist/ListItem.d.ts

@@ -3,7 +3,6 @@ import { BaseListItemProps } from "./BaseListItem";
 interface ListItemProps extends BaseListItemProps {
     headline: string;
     body?: string;
-    bare?: boolean;
     children?: void;
 }
 export declare const ListItem: React.ForwardRefExoticComponent<Omit<ListItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;

package/dist/ListItem.js

@@ -1,7 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import { BaseListItem } from "./BaseListItem";
+import { useListContext } from "./List";
 export const ListItem = React.forwardRef((props, ref) => {
-    return (_jsx(BaseListItem, { withDivider: !props.bare, ...props, jsStyle: props.jsStyle, ref: ref, children: ({ content }) => content }));
+    const { bare } = useListContext();
+    return (_jsx(BaseListItem, { withDivider: !bare, ...props, jsStyle: props.jsStyle, ref: ref, children: ({ content }) => content }));
 });
 //# sourceMappingURL=ListItem.js.map

package/dist/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../src/ListItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AAWjE,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,CAAC,KAAoB,EAAE,GAA8B,EAAE,EAAE;IACvD,OAAO,CACL,KAAC,YAAY,IACX,WAAW,EAAE,CAAC,KAAK,CAAC,IAAI,KACpB,KAAK,EACT,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,GAAG,EAAE,GAAG,YAEP,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,OAAO,GACZ,CAChB,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../src/ListItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AAEjE,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AASxC,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,CAAC,KAAoB,EAAE,GAA8B,EAAE,EAAE;IACvD,MAAM,EAAE,IAAI,EAAE,GAAG,cAAc,EAAE,CAAC;IAElC,OAAO,CACL,KAAC,YAAY,IACX,WAAW,EAAE,CAAC,IAAI,KACd,KAAK,EACT,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,GAAG,EAAE,GAAG,YAEP,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,OAAO,GACZ,CAChB,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/ListLinkItem.d.ts

@@ -10,7 +10,6 @@ interface ListLinkItemProps extends BaseListItemProps {
     body?: string;
     disabled?: boolean;
     selected?: boolean;
-    bare?: boolean;
     target?: string;
 }
 export declare const ListLinkItem: React.ForwardRefExoticComponent<Omit<ListLinkItemProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;

package/dist/ListLinkItem.js

@@ -3,7 +3,9 @@ import React from "react";
 import { BaseListItem } from "./BaseListItem";
 import { getGlyphColor, getInteractableListItemJSStyles, } from "./Interactable";
 import { BaseLink } from "./BaseLink";
-export const ListLinkItem = React.forwardRef(({ onClick, href, disabled = false, padding = "medium", jsStyle, gap, selected, bare, color = "secondary", target, ...otherProps }, ref) => {
-    return (_jsx(BaseListItem, { withDivider: !bare, disabled: disabled, "aria-selected": selected, padding: "none", gap: gap, headlineColor: getGlyphColor(color, disabled, true), bodyColor: getGlyphColor(color, disabled, true), selected: selected, bare: bare, ...otherProps, jsStyle: jsStyle, children: ({ content }) => (_jsx(BaseLink, { target: target, padding: padding, "aria-current": selected ? "page" : undefined, disabled: disabled, animateInteraction: false, bare: true, color: color, href: href, ref: ref, jsStyle: getInteractableListItemJSStyles({ bare, selected }), onClick: onClick, children: content })) }));
+import { useListContext } from "./List";
+export const ListLinkItem = React.forwardRef(({ onClick, href, disabled = false, padding = "medium", jsStyle, gap, selected, color = "secondary", target, ...otherProps }, ref) => {
+    const { bare } = useListContext();
+    return (_jsx(BaseListItem, { withDivider: !bare, disabled: disabled, "aria-selected": selected, padding: "none", gap: gap, headlineColor: getGlyphColor(color, disabled, true), bodyColor: getGlyphColor(color, disabled, true), selected: selected, ...otherProps, jsStyle: jsStyle, children: ({ content }) => (_jsx(BaseLink, { target: target, padding: padding, "aria-current": selected ? "page" : undefined, disabled: disabled, animateInteraction: false, bare: true, color: color, href: href, ref: ref, jsStyle: getInteractableListItemJSStyles({ bare, selected }), onClick: onClick, children: content })) }));
 });
 //# sourceMappingURL=ListLinkItem.js.map

package/dist/ListLinkItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListLinkItem.js","sourceRoot":"","sources":["../src/ListLinkItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAEL,aAAa,EACb,+BAA+B,GAChC,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAgBtC,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EACE,OAAO,EACP,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,QAAQ,EAClB,OAAO,EACP,GAAG,EACH,QAAQ,EACR,IAAI,EACJ,KAAK,GAAG,WAAW,EACnB,MAAM,EACN,GAAG,UAAU,EACK,EACpB,GAAkC,EAClC,EAAE;IACF,OAAO,CACL,KAAC,YAAY,IACX,WAAW,EAAE,CAAC,IAAI,EAClB,QAAQ,EAAE,QAAQ,mBACH,QAAQ,EACvB,OAAO,EAAC,MAAM,EACd,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,EACnD,SAAS,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,EAC/C,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,KACN,UAAU,EACd,OAAO,EAAE,OAAO,YAEf,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAChB,KAAC,QAAQ,IACP,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,kBACF,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC3C,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,KAAK,EACzB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,+BAA+B,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAC5D,OAAO,EAAE,OAAO,YAEf,OAAO,GACC,CACZ,GACY,CAChB,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"ListLinkItem.js","sourceRoot":"","sources":["../src/ListLinkItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAEL,aAAa,EACb,+BAA+B,GAChC,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAexC,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EACE,OAAO,EACP,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,QAAQ,EAClB,OAAO,EACP,GAAG,EACH,QAAQ,EACR,KAAK,GAAG,WAAW,EACnB,MAAM,EACN,GAAG,UAAU,EACK,EACpB,GAAkC,EAClC,EAAE;IACF,MAAM,EAAE,IAAI,EAAE,GAAG,cAAc,EAAE,CAAC;IAElC,OAAO,CACL,KAAC,YAAY,IACX,WAAW,EAAE,CAAC,IAAI,EAClB,QAAQ,EAAE,QAAQ,mBACH,QAAQ,EACvB,OAAO,EAAC,MAAM,EACd,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,EACnD,SAAS,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,EAC/C,QAAQ,EAAE,QAAQ,KACd,UAAU,EACd,OAAO,EAAE,OAAO,YAEf,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAChB,KAAC,QAAQ,IACP,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,kBACF,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC3C,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,KAAK,EACzB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,+BAA+B,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAC5D,OAAO,EAAE,OAAO,YAEf,OAAO,GACC,CACZ,GACY,CAChB,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/Sublist.d.ts

@@ -1,7 +1,6 @@
 import React, { ReactNode } from "react";
 import { JSStyle } from "./jss";
-export declare function Sublist({ children, label, labelBold, initialState, jsStyle, secondaryAddOn, bare, }: {
-    bare?: boolean;
+export declare function Sublist({ children, label, labelBold, initialState, jsStyle, secondaryAddOn, }: {
     children: React.ReactNode;
     label: string;
     labelBold?: boolean;

package/dist/Sublist.js

@@ -4,9 +4,9 @@ import { ListButtonItem } from "./ListButtonItem";
 import { Icon } from "./Icon";
 import { Box } from "./Box";
 import { Row } from "./Row";
-export function Sublist({ children, label, labelBold, initialState = { collapsed: false }, jsStyle, secondaryAddOn, bare, }) {
+export function Sublist({ children, label, labelBold, initialState = { collapsed: false }, jsStyle, secondaryAddOn, }) {
     const [collapsed, setCollapsed] = React.useState(initialState.collapsed);
-    return (_jsxs(_Fragment, { children: [_jsx(ListButtonItem, { bare: bare, headline: label, headlineBold: labelBold, onClick: () => setCollapsed((x) => !x), jsStyle: jsStyle, addOn: _jsxs(Row, { gap: "medium", align: "center", children: [secondaryAddOn, _jsx(Box, { padding: "medium", jsStyle: [
+    return (_jsxs(_Fragment, { children: [_jsx(ListButtonItem, { headline: label, headlineBold: labelBold, onClick: () => setCollapsed((x) => !x), jsStyle: jsStyle, addOn: _jsxs(Row, { gap: "medium", align: "center", children: [secondaryAddOn, _jsx(Box, { padding: "medium", jsStyle: [
                                 {
                                     transition: "transform 0.15s ease-in",
                                 },

package/dist/Sublist.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sublist.js","sourceRoot":"","sources":["../src/Sublist.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5B,MAAM,UAAU,OAAO,CAAC,EACtB,QAAQ,EACR,KAAK,EACL,SAAS,EACT,YAAY,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,EACnC,OAAO,EACP,cAAc,EACd,IAAI,GAWL;IACC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IAEzE,OAAO,CACL,8BACE,KAAC,cAAc,IACb,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,KAAK,EACf,YAAY,EAAE,SAAS,EACvB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EACtC,OAAO,EAAE,OAAO,EAChB,KAAK,EACH,MAAC,GAAG,IAAC,GAAG,EAAC,QAAQ,EAAC,KAAK,EAAC,QAAQ,aAC7B,cAAc,EACf,KAAC,GAAG,IACF,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE;gCACP;oCACE,UAAU,EAAE,yBAAyB;iCACtC;gCACD,CAAC,SAAS,IAAI;oCACZ,SAAS,EAAE,gBAAgB;iCAC5B;6BACF,YAED,KAAC,IAAI,IACH,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,wBAAwB,GAC7B,GACE,IACF,EAER,aAAa,EAAC,KAAK,EACnB,KAAK,EAAC,WAAW,GACjB,EACD,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,IAC3B,CACJ,CAAC;AACJ,CAAC"}
+{"version":3,"file":"Sublist.js","sourceRoot":"","sources":["../src/Sublist.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAI5B,MAAM,UAAU,OAAO,CAAC,EACtB,QAAQ,EACR,KAAK,EACL,SAAS,EACT,YAAY,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,EACnC,OAAO,EACP,cAAc,GAUf;IACC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACzE,OAAO,CACL,8BACE,KAAC,cAAc,IACb,QAAQ,EAAE,KAAK,EACf,YAAY,EAAE,SAAS,EACvB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EACtC,OAAO,EAAE,OAAO,EAChB,KAAK,EACH,MAAC,GAAG,IAAC,GAAG,EAAC,QAAQ,EAAC,KAAK,EAAC,QAAQ,aAC7B,cAAc,EACf,KAAC,GAAG,IACF,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE;gCACP;oCACE,UAAU,EAAE,yBAAyB;iCACtC;gCACD,CAAC,SAAS,IAAI;oCACZ,SAAS,EAAE,gBAAgB;iCAC5B;6BACF,YAED,KAAC,IAAI,IACH,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,wBAAwB,GAC7B,GACE,IACF,EAER,aAAa,EAAC,KAAK,EACnB,KAAK,EAAC,WAAW,GACjB,EACD,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,IAC3B,CACJ,CAAC;AACJ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aidos-ui",
-  "version": "3.0.1",
+  "version": "3.0.2",
   "description": "A simple UI framework",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -27,9 +27,11 @@
     "@types/react-dom": "^18.0.10",
     "@xenova/transformers": "^2.4.2",
     "csstype": "^3.1.1",
+    "dotenv": "^16.3.1",
     "install": "^0.13.0",
     "next": "latest",
     "npm": "^9.8.0",
+    "openai": "^3.3.0",
     "prismjs": "^1.29.0",
     "process": "^0.11.10",
     "react-dom": "latest",

package/scripts/embeddings.js

@@ -10,7 +10,7 @@ const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 const __rootdir = path.join(__dirname, "..");
 const __pages = path.join(__rootdir, "src", "pages");
-const __public = path.join(__rootdir, "public");
+const __target = path.join(__rootdir, "src", "docs");
 
 const generateEmbeddings = await pipeline(
   "feature-extraction",
@@ -50,8 +50,8 @@ for (const file of files) {
 }
 
 await fs.writeFile(
-  path.join(__public, "index.json"),
-  JSON.stringify({ index })
+  path.join(__target, "searchIndex.ts"),
+  `export const index = ${JSON.stringify({ index })}`
 );
 
 function parseChildren(children) {

package/scripts/openai_embeddings.js

@@ -0,0 +1,100 @@
+import fs from "fs/promises";
+import path from "path";
+import { fileURLToPath } from "url";
+import { unified } from "unified";
+import remarkParse from "remark-parse";
+import remarkMdx from "remark-mdx";
+import { Configuration, OpenAIApi } from "openai";
+import dotenv from "dotenv";
+
+dotenv.config();
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const __rootdir = path.join(__dirname, "..");
+const __pages = path.join(__rootdir, "src", "pages");
+const __target = path.join(__rootdir, "src", "docs");
+
+const configuration = new Configuration({
+  organization: "org-Q89d8tyY2MChQVFEbhp27pB3",
+  apiKey: process.env.OPENAI_API_KEY,
+});
+const openai = new OpenAIApi(configuration);
+
+const files = await fs.readdir(__pages);
+
+const index = [];
+
+for (const file of files) {
+  if (path.extname(file) !== ".mdx") {
+    continue;
+  }
+
+  const filepath = path.join(__pages, file);
+  const filename = path.parse(file).name;
+  const content = await fs.readFile(filepath, "utf-8");
+  const sections = parseContent(content);
+
+  const embeddings = await Promise.all(
+    sections.map(async ({ text, heading, headingDepth }) => {
+      const embedding = await openai
+        .createEmbedding({
+          model: "text-embedding-ada-002",
+          input: text,
+        })
+        .then((response) => response.data[0].embedding);
+
+      return {
+        heading,
+        headingDepth,
+        filename,
+        embedding: Array.from(embedding.data),
+      };
+    })
+  );
+
+  index.push(...embeddings);
+}
+
+await fs.writeFile(
+  path.join(__target, "searchIndex.ts"),
+  `export const index = ${JSON.stringify({ index })}`
+);
+
+function parseChildren(children) {
+  const result = [];
+
+  for (const node of children) {
+    if (node.type === "text") {
+      result.push(node.value);
+    } else if (node.type === "inlineCode") {
+      result.push(node.value);
+    } else if (node.type === "link") {
+      result.push(parseChildren(node.children));
+    }
+  }
+
+  return result.join(" ");
+}
+
+function parseContent(content) {
+  const ast = unified().use(remarkParse).use(remarkMdx).parse(content);
+  const result = [];
+  let headingDepth = 1;
+  let heading = "";
+
+  for (const node of ast.children) {
+    if (node.type === "paragraph") {
+      result.push({
+        text: heading + ": " + parseChildren(node.children),
+        heading,
+        headingDepth,
+      });
+    } else if (node.type === "heading") {
+      headingDepth = node.depth;
+      heading = parseChildren(node.children);
+    }
+  }
+
+  return result;
+}

package/src/BaseListItem.tsx

@@ -6,6 +6,7 @@ import { JSStyle, Size, Position, Spacing, TextColor, cssVar } from "./jss";
 import { InteractableColor } from "./Interactable";
 import { TextPairing } from "./TextPairing";
 import { BaseView } from "./BaseView";
+import { useListContext } from "./List";
 
 // @ts-ignore
 export interface BaseListItemProps extends RowProps {
@@ -27,7 +28,6 @@ export interface BaseListItemProps extends RowProps {
   role?: undefined;
   gap?: Spacing;
   selected?: boolean;
-  bare?: boolean;
 }
 
 export const BaseListItem = React.forwardRef(
@@ -50,12 +50,13 @@ export const BaseListItem = React.forwardRef(
       padding = "medium",
       gap = "medium",
       selected,
-      bare,
       headlineBold,
       ...otherProps
     }: BaseListItemProps,
     ref?: React.Ref<HTMLElement>
   ) => {
+    const { bare } = useListContext();
+
     const content = (
       <TextPairing
         headlineBold={headlineBold}

package/src/List.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useContext, useMemo } from "react";
 import { BaseList, BaseListProps } from "./BaseList";
 import { useNavigation } from "./useNavigation";
 import { cssVar } from "./jss";
@@ -12,6 +12,8 @@ interface ListProps extends BaseListProps {
   carded?: boolean;
 }
 
+const ListContext = React.createContext({ bare: false });
+
 export function List({
   ariaLabel,
   jsStyle,
@@ -22,30 +24,35 @@ export function List({
   ...otherProps
 }: ListProps) {
   const rootRef = useNavigation({ autofocus, enabled: navigation });
+  const contextValue = useMemo(() => ({ bare }), [bare]);
 
   return (
-    <BaseList
-      role="grid"
-      aria-label={ariaLabel}
-      ref={rootRef}
-      jsStyle={[
-        { overflow: "hidden" },
-        !bare && {
-          backgroundColor: cssVar("--overlay-background"),
-        },
-        !bare &&
-          !carded && {
-            borderBottom: `1px solid ${cssVar("--divider")}`,
-            borderTop: `1px solid ${cssVar("--divider")}`,
-          },
-        !bare &&
-          carded && {
-            border: `1px solid ${cssVar("--divider")}`,
-            borderRadius: cssVar("--border-radius-l"),
+    <ListContext.Provider value={contextValue}>
+      <BaseList
+        role="grid"
+        aria-label={ariaLabel}
+        ref={rootRef}
+        jsStyle={[
+          { overflow: "hidden" },
+          !bare && {
+            backgroundColor: cssVar("--overlay-background"),
           },
-        jsStyle,
-      ]}
-      {...otherProps}
-    />
+          !bare &&
+            !carded && {
+              borderBottom: `1px solid ${cssVar("--divider")}`,
+              borderTop: `1px solid ${cssVar("--divider")}`,
+            },
+          !bare &&
+            carded && {
+              border: `1px solid ${cssVar("--divider")}`,
+              borderRadius: cssVar("--border-radius-l"),
+            },
+          jsStyle,
+        ]}
+        {...otherProps}
+      />
+    </ListContext.Provider>
   );
 }
+
+export const useListContext = () => useContext(ListContext);

package/src/ListButtonItem.tsx

@@ -7,6 +7,7 @@ import {
   getInteractableListItemJSStyles,
 } from "./Interactable";
 import { BaseButton } from "./BaseButton";
+import { useListContext } from "./List";
 
 // @ts-ignore
 interface ListButtonItemProps extends BaseListItemProps {
@@ -16,7 +17,6 @@ interface ListButtonItemProps extends BaseListItemProps {
   body?: string;
   disabled?: boolean;
   selected?: boolean;
-  bare?: boolean;
   children?: void;
 }
 
@@ -30,11 +30,12 @@ export const ListButtonItem = React.forwardRef(
       jsStyle,
       gap,
       selected,
-      bare,
       ...otherProps
     }: ListButtonItemProps,
     ref?: React.Ref<HTMLButtonElement>
   ) => {
+    const { bare } = useListContext();
+
     return (
       <BaseListItem
         withDivider={!bare}
@@ -45,7 +46,6 @@ export const ListButtonItem = React.forwardRef(
         bodyColor={getGlyphColor(color, disabled, true)}
         selected={selected}
         aria-selected={selected}
-        bare={bare}
         {...otherProps}
         jsStyle={jsStyle}
       >

package/src/ListHeaderItem.tsx

@@ -1,9 +1,9 @@
 import React, { ReactNode } from "react";
 import { BaseListItem } from "./BaseListItem";
 import { Position, cssVar } from "./jss";
+import { useListContext } from "./List";
 
 export function ListHeaderItem({
-  bare,
   highlight,
   headline,
   body,
@@ -11,7 +11,6 @@ export function ListHeaderItem({
   addOn,
   addOnPosition,
 }: {
-  bare?: boolean;
   highlight?: boolean;
   headline: string;
   body?: string;
@@ -19,9 +18,10 @@ export function ListHeaderItem({
   addOn?: ReactNode;
   addOnPosition?: Position;
 }) {
+  const { bare } = useListContext();
+
   return (
     <BaseListItem
-      bare={bare}
       headline={headline}
       headlineColor={highlight ? (bare ? "highlight" : "light") : "primary"}
       headlineBold={true}

package/src/ListItem.tsx

@@ -2,20 +2,22 @@ import React from "react";
 
 import { BaseListItem, BaseListItemProps } from "./BaseListItem";
 import { cssVar } from "./jss";
+import { useListContext } from "./List";
 
 // @ts-ignore
 interface ListItemProps extends BaseListItemProps {
   headline: string;
   body?: string;
-  bare?: boolean;
   children?: void;
 }
 
 export const ListItem = React.forwardRef(
   (props: ListItemProps, ref?: React.Ref<HTMLLIElement>) => {
+    const { bare } = useListContext();
+
     return (
       <BaseListItem
-        withDivider={!props.bare}
+        withDivider={!bare}
         {...props}
         jsStyle={props.jsStyle}
         ref={ref}

package/src/ListLinkItem.tsx

@@ -7,6 +7,7 @@ import {
   getInteractableListItemJSStyles,
 } from "./Interactable";
 import { BaseLink } from "./BaseLink";
+import { useListContext } from "./List";
 
 // @ts-ignore
 interface ListLinkItemProps extends BaseListItemProps {
@@ -18,7 +19,6 @@ interface ListLinkItemProps extends BaseListItemProps {
   body?: string;
   disabled?: boolean;
   selected?: boolean;
-  bare?: boolean;
   target?: string;
 }
 
@@ -32,13 +32,14 @@ export const ListLinkItem = React.forwardRef(
       jsStyle,
       gap,
       selected,
-      bare,
       color = "secondary",
       target,
       ...otherProps
     }: ListLinkItemProps,
     ref?: React.Ref<HTMLAnchorElement>
   ) => {
+    const { bare } = useListContext();
+
     return (
       <BaseListItem
         withDivider={!bare}
@@ -49,7 +50,6 @@ export const ListLinkItem = React.forwardRef(
         headlineColor={getGlyphColor(color, disabled, true)}
         bodyColor={getGlyphColor(color, disabled, true)}
         selected={selected}
-        bare={bare}
         {...otherProps}
         jsStyle={jsStyle}
       >