@salt-ds/core 1.47.4 → 1.48.0

package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.js

@@ -0,0 +1,72 @@
+import { jsx } from 'react/jsx-runtime';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef, useRef } from 'react';
+import { makePrefixer } from '../utils/makePrefixer.js';
+import { renderProps } from '../utils/renderProps.js';
+import '../utils/useFloatingUI/useFloatingUI.js';
+import '../utils/useId.js';
+import '../salt-provider/SaltProvider.js';
+import '../viewport/ViewportProvider.js';
+import { useVerticalNavigationItem } from './VerticalNavigationItem.js';
+import css_248z from './VerticalNavigationItemTrigger.css.js';
+
+function ItemAction(props) {
+  return renderProps("a", props);
+}
+const withBaseName = makePrefixer("saltVerticalNavigationItemTrigger");
+const VerticalNavigationItemTrigger = forwardRef(function VerticalNavigationItemTrigger2(props, ref) {
+  const {
+    className,
+    children,
+    render,
+    href,
+    onFocus,
+    onBlur,
+    onMouseDown,
+    ...rest
+  } = props;
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "salt-vertical-navigation-item-trigger",
+    css: css_248z,
+    window: targetWindow
+  });
+  const isLink = href != null;
+  const { active, setFocusVisible } = useVerticalNavigationItem();
+  const wasMouseDownRef = useRef(false);
+  const handleFocus = (event) => {
+    if (!wasMouseDownRef.current) {
+      setFocusVisible(true);
+    }
+    wasMouseDownRef.current = false;
+    onFocus == null ? void 0 : onFocus(event);
+  };
+  const handleBlur = (event) => {
+    setFocusVisible(false);
+    onBlur == null ? void 0 : onBlur(event);
+  };
+  const handleMouseDown = (event) => {
+    wasMouseDownRef.current = true;
+    onMouseDown == null ? void 0 : onMouseDown(event);
+  };
+  return /* @__PURE__ */ jsx(
+    ItemAction,
+    {
+      className: clsx(withBaseName(), className),
+      href,
+      "aria-current": active ? "page" : void 0,
+      render: render ?? (isLink ? void 0 : /* @__PURE__ */ jsx("button", { type: "button" })),
+      ref,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      onMouseDown: handleMouseDown,
+      ...rest,
+      children
+    }
+  );
+});
+
+export { VerticalNavigationItemTrigger };
+//# sourceMappingURL=VerticalNavigationItemTrigger.js.map

package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerticalNavigationItemTrigger.js","sources":["../src/vertical-navigation/VerticalNavigationItemTrigger.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  forwardRef,\n  type MouseEvent,\n  useRef,\n} from \"react\";\nimport { makePrefixer, type RenderPropsType, renderProps } from \"../utils\";\nimport { useVerticalNavigationItem } from \"./VerticalNavigationItem\";\nimport verticalNavigationItemTriggerCss from \"./VerticalNavigationItemTrigger.css\";\n\n// biome-ignore lint/suspicious/noExplicitAny: We don't know the exact type here\nfunction ItemAction(props: ComponentPropsWithoutRef<any>) {\n  return renderProps(\"a\", props);\n}\n\nexport interface VerticalNavigationItemTriggerProps\n  extends ComponentPropsWithoutRef<\"a\"> {\n  render?: RenderPropsType[\"render\"];\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemTrigger\");\n\nexport const VerticalNavigationItemTrigger = forwardRef<\n  HTMLAnchorElement,\n  VerticalNavigationItemTriggerProps\n>(function VerticalNavigationItemTrigger(props, ref) {\n  const {\n    className,\n    children,\n    render,\n    href,\n    onFocus,\n    onBlur,\n    onMouseDown,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-vertical-navigation-item-trigger\",\n    css: verticalNavigationItemTriggerCss,\n    window: targetWindow,\n  });\n\n  const isLink = href != null;\n  const { active, setFocusVisible } = useVerticalNavigationItem();\n\n  const wasMouseDownRef = useRef(false);\n\n  const handleFocus = (event: FocusEvent<never>) => {\n    if (!wasMouseDownRef.current) {\n      setFocusVisible(true);\n    }\n    wasMouseDownRef.current = false;\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<never>) => {\n    setFocusVisible(false);\n    onBlur?.(event);\n  };\n\n  const handleMouseDown = (event: MouseEvent<never>) => {\n    wasMouseDownRef.current = true;\n    onMouseDown?.(event);\n  };\n\n  return (\n    <ItemAction\n      className={clsx(withBaseName(), className)}\n      href={href}\n      aria-current={active ? \"page\" : undefined}\n      render={render ?? (isLink ? undefined : <button type=\"button\" />)}\n      ref={ref}\n      onFocus={handleFocus}\n      onBlur={handleBlur}\n      onMouseDown={handleMouseDown}\n      {...rest}\n    >\n      {children}\n    </ItemAction>\n  );\n});\n"],"names":["VerticalNavigationItemTrigger","verticalNavigationItemTriggerCss"],"mappings":";;;;;;;;;;;;;;AAeA,SAAS,WAAW,KAAsC,EAAA;AACxD,EAAO,OAAA,WAAA,CAAY,KAAK,KAAK,CAAA;AAC/B;AAOA,MAAM,YAAA,GAAe,aAAa,mCAAmC,CAAA;AAE9D,MAAM,6BAAgC,GAAA,UAAA,CAG3C,SAASA,8BAAAA,CAA8B,OAAO,GAAK,EAAA;AACnD,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uCAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAS,IAAQ,IAAA,IAAA;AACvB,EAAA,MAAM,EAAE,MAAA,EAAQ,eAAgB,EAAA,GAAI,yBAA0B,EAAA;AAE9D,EAAM,MAAA,eAAA,GAAkB,OAAO,KAAK,CAAA;AAEpC,EAAM,MAAA,WAAA,GAAc,CAAC,KAA6B,KAAA;AAChD,IAAI,IAAA,CAAC,gBAAgB,OAAS,EAAA;AAC5B,MAAA,eAAA,CAAgB,IAAI,CAAA;AAAA;AAEtB,IAAA,eAAA,CAAgB,OAAU,GAAA,KAAA;AAC1B,IAAU,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,KAAA,CAAA;AAAA,GACZ;AAEA,EAAM,MAAA,UAAA,GAAa,CAAC,KAA6B,KAAA;AAC/C,IAAA,eAAA,CAAgB,KAAK,CAAA;AACrB,IAAS,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAA,KAAA,CAAA;AAAA,GACX;AAEA,EAAM,MAAA,eAAA,GAAkB,CAAC,KAA6B,KAAA;AACpD,IAAA,eAAA,CAAgB,OAAU,GAAA,IAAA;AAC1B,IAAc,WAAA,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAA,KAAA,CAAA;AAAA,GAChB;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,IAAA;AAAA,MACA,cAAA,EAAc,SAAS,MAAS,GAAA,MAAA;AAAA,MAChC,QAAQ,MAAW,KAAA,MAAA,GAAS,yBAAa,GAAA,CAAA,QAAA,EAAA,EAAO,MAAK,QAAS,EAAA,CAAA,CAAA;AAAA,MAC9D,GAAA;AAAA,MACA,OAAS,EAAA,WAAA;AAAA,MACT,MAAQ,EAAA,UAAA;AAAA,MACR,WAAa,EAAA,eAAA;AAAA,MACZ,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-es/vertical-navigation/VerticalNavigationSubMenu.css.js

@@ -0,0 +1,4 @@
+var css_248z = ".saltVerticalNavigationSubMenu {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-fixed-100);\n  list-style: none;\n  padding: var(--salt-spacing-fixed-100) 0 0;\n  margin: 0;\n}\n\n.saltVerticalNavigationSubMenu .saltVerticalNavigationItemContent {\n  font-weight: var(--salt-text-h4-fontWeight-small);\n}\n";
+
+export { css_248z as default };
+//# sourceMappingURL=VerticalNavigationSubMenu.css.js.map

package/dist-es/vertical-navigation/VerticalNavigationSubMenu.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerticalNavigationSubMenu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist-es/vertical-navigation/VerticalNavigationSubMenu.js

@@ -0,0 +1,37 @@
+import { jsx } from 'react/jsx-runtime';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef, useState } from 'react';
+import { makePrefixer } from '../utils/makePrefixer.js';
+import '../utils/useFloatingUI/useFloatingUI.js';
+import '../utils/useId.js';
+import '../salt-provider/SaltProvider.js';
+import '../viewport/ViewportProvider.js';
+import { SubMenuProvider } from './SubMenuContext.js';
+import css_248z from './VerticalNavigationSubMenu.css.js';
+
+const withBaseName = makePrefixer("saltVerticalNavigationSubMenu");
+const VerticalNavigationSubMenu = forwardRef(function VerticalNavigationSubMenu2(props, ref) {
+  const { children, className, ...rest } = props;
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "salt-vertical-navigation-sub-menu",
+    css: css_248z,
+    window: targetWindow
+  });
+  const [directIcons, setDirectIcons] = useState([]);
+  return /* @__PURE__ */ jsx(SubMenuProvider, { directIcons, setDirectIcons, children: /* @__PURE__ */ jsx(
+    "ul",
+    {
+      ref,
+      className: clsx(withBaseName(), className),
+      "data-has-direct-icons": directIcons.length > 0,
+      ...rest,
+      children
+    }
+  ) });
+});
+
+export { VerticalNavigationSubMenu };
+//# sourceMappingURL=VerticalNavigationSubMenu.js.map

package/dist-es/vertical-navigation/VerticalNavigationSubMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerticalNavigationSubMenu.js","sources":["../src/vertical-navigation/VerticalNavigationSubMenu.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef, useState } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { SubMenuProvider } from \"./SubMenuContext\";\nimport verticalNavigationSubMenuCss from \"./VerticalNavigationSubMenu.css\";\n\nexport interface VerticalNavigationSubMenuProps\n  extends ComponentPropsWithoutRef<\"ul\"> {}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationSubMenu\");\n\nexport const VerticalNavigationSubMenu = forwardRef<\n  HTMLUListElement,\n  VerticalNavigationSubMenuProps\n>(function VerticalNavigationSubMenu(props, ref) {\n  const { children, className, ...rest } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-vertical-navigation-sub-menu\",\n    css: verticalNavigationSubMenuCss,\n    window: targetWindow,\n  });\n\n  const [directIcons, setDirectIcons] = useState<string[]>([]);\n\n  return (\n    <SubMenuProvider directIcons={directIcons} setDirectIcons={setDirectIcons}>\n      <ul\n        ref={ref}\n        className={clsx(withBaseName(), className)}\n        data-has-direct-icons={directIcons.length > 0}\n        {...rest}\n      >\n        {children}\n      </ul>\n    </SubMenuProvider>\n  );\n});\n"],"names":["VerticalNavigationSubMenu","verticalNavigationSubMenuCss"],"mappings":";;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,+BAA+B,CAAA;AAE1D,MAAM,yBAA4B,GAAA,UAAA,CAGvC,SAASA,0BAAAA,CAA0B,OAAO,GAAK,EAAA;AAC/C,EAAA,MAAM,EAAE,QAAA,EAAU,SAAW,EAAA,GAAG,MAAS,GAAA,KAAA;AAEzC,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mCAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,CAAC,WAAa,EAAA,cAAc,CAAI,GAAA,QAAA,CAAmB,EAAE,CAAA;AAE3D,EACE,uBAAA,GAAA,CAAC,eAAgB,EAAA,EAAA,WAAA,EAA0B,cACzC,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,uBAAA,EAAuB,YAAY,MAAS,GAAA,CAAA;AAAA,MAC3C,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GAEL,EAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-types/collapsible/Collapsible.d.ts

@@ -0,0 +1,16 @@
+import { type ComponentPropsWithoutRef, type SyntheticEvent } from "react";
+export interface CollapsibleProps extends Omit<ComponentPropsWithoutRef<"div">, "onToggle"> {
+    /**
+     * Whether the accordion is open.
+     */
+    open?: boolean;
+    /**
+     * Whether the accordion is open by default.
+     */
+    defaultOpen?: boolean;
+    /**
+     * Callback fired when the accordion is opened or closed.
+     */
+    onOpenChange?: (event: SyntheticEvent<HTMLButtonElement>, open: boolean) => void;
+}
+export declare const Collapsible: import("react").ForwardRefExoticComponent<CollapsibleProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/collapsible/CollapsibleContext.d.ts

@@ -0,0 +1,9 @@
+import { type SyntheticEvent } from "react";
+export type CollapsibleContextValue = {
+    open: boolean;
+    setOpen: (event: SyntheticEvent<HTMLButtonElement>, open: boolean) => void;
+    panelId?: string;
+    setPanelId?: (panelId: string) => void;
+};
+export declare const CollapsibleContext: import("react").Context<CollapsibleContextValue>;
+export declare function useCollapsibleContext(): CollapsibleContextValue;

package/dist-types/collapsible/CollapsiblePanel.d.ts

@@ -0,0 +1,4 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface CollapsiblePanelProps extends ComponentPropsWithoutRef<"div"> {
+}
+export declare const CollapsiblePanel: (props: CollapsiblePanelProps) => import("react/jsx-runtime").JSX.Element;

package/dist-types/collapsible/CollapsibleTrigger.d.ts

@@ -0,0 +1,5 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from "react";
+export interface CollapsibleTriggerProps extends Pick<ComponentPropsWithoutRef<"button">, "className" | "onClick"> {
+    children: ReactNode;
+}
+export declare const CollapsibleTrigger: import("react").ForwardRefExoticComponent<CollapsibleTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist-types/collapsible/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./Collapsible";
+export * from "./CollapsiblePanel";
+export * from "./CollapsibleTrigger";

package/dist-types/index.d.ts

@@ -9,6 +9,7 @@ export { type Breakpoints, DEFAULT_BREAKPOINTS, useBreakpoint, } from "./breakpo
 export * from "./button";
 export * from "./card";
 export * from "./checkbox";
+export * from "./collapsible";
 export * from "./combo-box";
 export * from "./dialog";
 export * from "./divider";
@@ -61,4 +62,5 @@ export * from "./toggle-button-group";
 export * from "./tooltip";
 export * from "./types";
 export * from "./utils";
+export * from "./vertical-navigation";
 export * from "./viewport";

package/dist-types/vertical-navigation/SubMenuContext.d.ts

@@ -0,0 +1,14 @@
+import { type Dispatch, type ReactNode, type SetStateAction } from "react";
+type SubMenuContextValue = {
+    depth: number;
+    iconPaddingCount: number;
+    setDirectIcons?: Dispatch<SetStateAction<string[]>>;
+};
+export declare const SubMenuContext: import("react").Context<SubMenuContextValue>;
+export declare const useSubMenuContext: () => SubMenuContextValue;
+export declare function SubMenuProvider({ children, directIcons, setDirectIcons, }: {
+    children: ReactNode;
+    directIcons: string[];
+    setDirectIcons?: Dispatch<SetStateAction<string[]>>;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist-types/vertical-navigation/VerticalNavigation.d.ts

@@ -0,0 +1,8 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface VerticalNavigationProps extends ComponentPropsWithoutRef<"nav"> {
+    /**
+     * The appearance of the tabs. Defaults to "bordered".
+     */
+    appearance?: "indicator" | "bordered";
+}
+export declare const VerticalNavigation: import("react").ForwardRefExoticComponent<VerticalNavigationProps & import("react").RefAttributes<HTMLElement>>;

package/dist-types/vertical-navigation/VerticalNavigationItem.d.ts

@@ -0,0 +1,12 @@
+import { type ComponentPropsWithoutRef, type Dispatch, type SetStateAction } from "react";
+export interface VerticalNavigationItemProps extends ComponentPropsWithoutRef<"li"> {
+    active?: boolean;
+}
+type VerticalNavigationItemContextType = {
+    active: boolean;
+    focusVisible: boolean;
+    setFocusVisible: Dispatch<SetStateAction<boolean>>;
+};
+export declare function useVerticalNavigationItem(): VerticalNavigationItemContextType;
+export declare const VerticalNavigationItem: import("react").ForwardRefExoticComponent<VerticalNavigationItemProps & import("react").RefAttributes<HTMLLIElement>>;
+export {};

package/dist-types/vertical-navigation/VerticalNavigationItemContent.d.ts

@@ -0,0 +1,4 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface VerticalNavigationItemContentProps extends ComponentPropsWithoutRef<"span"> {
+}
+export declare const VerticalNavigationItemContent: import("react").ForwardRefExoticComponent<VerticalNavigationItemContentProps & import("react").RefAttributes<HTMLSpanElement>>;

package/dist-types/vertical-navigation/VerticalNavigationItemExpansionIcon.d.ts

@@ -0,0 +1,2 @@
+import type { IconProps } from "@salt-ds/icons";
+export declare const VerticalNavigationItemExpansionIcon: (props: IconProps) => import("react/jsx-runtime").JSX.Element;

package/dist-types/vertical-navigation/VerticalNavigationItemLabel.d.ts

@@ -0,0 +1,4 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface VerticalNavigationItemLabelProps extends ComponentPropsWithoutRef<"span"> {
+}
+export declare const VerticalNavigationItemLabel: import("react").ForwardRefExoticComponent<VerticalNavigationItemLabelProps & import("react").RefAttributes<HTMLSpanElement>>;

package/dist-types/vertical-navigation/VerticalNavigationItemTrigger.d.ts

@@ -0,0 +1,6 @@
+import { type ComponentPropsWithoutRef } from "react";
+import { type RenderPropsType } from "../utils";
+export interface VerticalNavigationItemTriggerProps extends ComponentPropsWithoutRef<"a"> {
+    render?: RenderPropsType["render"];
+}
+export declare const VerticalNavigationItemTrigger: import("react").ForwardRefExoticComponent<VerticalNavigationItemTriggerProps & import("react").RefAttributes<HTMLAnchorElement>>;

package/dist-types/vertical-navigation/VerticalNavigationSubMenu.d.ts

@@ -0,0 +1,4 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface VerticalNavigationSubMenuProps extends ComponentPropsWithoutRef<"ul"> {
+}
+export declare const VerticalNavigationSubMenu: import("react").ForwardRefExoticComponent<VerticalNavigationSubMenuProps & import("react").RefAttributes<HTMLUListElement>>;

package/dist-types/vertical-navigation/index.d.ts

@@ -0,0 +1,7 @@
+export * from "./VerticalNavigation";
+export * from "./VerticalNavigationItem";
+export * from "./VerticalNavigationItemContent";
+export * from "./VerticalNavigationItemExpansionIcon";
+export * from "./VerticalNavigationItemLabel";
+export * from "./VerticalNavigationItemTrigger";
+export * from "./VerticalNavigationSubMenu";

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@salt-ds/core",
-  "version": "1.47.4",
+  "version": "1.48.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
-    "url": "https://github.com/jpmorganchase/salt-ds.git",
+    "url": "git+https://github.com/jpmorganchase/salt-ds.git",
     "directory": "packages/core"
   },
   "bugs": "https://github.com/jpmorganchase/salt-ds/issues",