@salt-ds/core 1.70.0 → 1.71.0

package/dist-es/tabs/internal/overflow/useOverflowSelectionState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOverflowSelectionState.js","sources":["../src/tabs/internal/overflow/useOverflowSelectionState.ts"],"sourcesContent":["import {\n  type Dispatch,\n  type MutableRefObject,\n  type SetStateAction,\n  type SyntheticEvent,\n  useCallback,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { useIsomorphicLayoutEffect, usePrevious } from \"../../../utils\";\n\ninterface PendingOverflowSelection {\n  event: SyntheticEvent | null;\n  value: string;\n}\n\ninterface UseOverflowSelectionStateArgs {\n  commitSelection: (event: SyntheticEvent | null, value: string) => void;\n  menuOpen: boolean;\n  selected?: string;\n  setMenuOpen: Dispatch<SetStateAction<boolean>>;\n}\n\ninterface UseOverflowSelectionStateResult {\n  selectionFromOverflowValueRef: MutableRefObject<string | null>;\n  setSelected: (\n    event: SyntheticEvent | null,\n    value: string,\n    source?: \"main\" | \"overflow\",\n  ) => void;\n}\n\nexport function useOverflowSelectionState({\n  commitSelection,\n  menuOpen,\n  selected,\n  setMenuOpen,\n}: UseOverflowSelectionStateArgs): UseOverflowSelectionStateResult {\n  const previousSelected = usePrevious(selected, [selected]);\n  const selectionFromOverflowValueRef = useRef<string | null>(null);\n  const pendingOverflowSelectionRef = useRef<PendingOverflowSelection | null>(\n    null,\n  );\n\n  const setSelected = useCallback(\n    (\n      event: SyntheticEvent | null,\n      value: string,\n      source: \"main\" | \"overflow\" = \"main\",\n    ) => {\n      const selectedFromOverflow = source === \"overflow\";\n      selectionFromOverflowValueRef.current = selectedFromOverflow\n        ? value\n        : null;\n\n      if (selectedFromOverflow) {\n        event?.persist();\n        pendingOverflowSelectionRef.current = { event, value };\n        setMenuOpen(false);\n        return;\n      }\n\n      pendingOverflowSelectionRef.current = null;\n      setMenuOpen(false);\n      commitSelection(event, value);\n    },\n    [commitSelection, setMenuOpen],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (menuOpen) {\n      return;\n    }\n\n    const pendingSelection = pendingOverflowSelectionRef.current;\n    if (!pendingSelection) {\n      return;\n    }\n\n    pendingOverflowSelectionRef.current = null;\n    commitSelection(pendingSelection.event, pendingSelection.value);\n  }, [commitSelection, menuOpen]);\n\n  useEffect(() => {\n    const selectedFromOverflow = selectionFromOverflowValueRef.current;\n    if (selectedFromOverflow == null || pendingOverflowSelectionRef.current) {\n      return;\n    }\n\n    if (selected === selectedFromOverflow && selected !== previousSelected) {\n      return;\n    }\n\n    selectionFromOverflowValueRef.current = null;\n  }, [previousSelected, selected]);\n\n  return {\n    selectionFromOverflowValueRef,\n    setSelected,\n  };\n}\n"],"names":[],"mappings":";;;;;;;;;;AAgCO,SAAS,yBAAA,CAA0B;AAAA,EACxC,eAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,EAAmE;AACjE,EAAA,MAAM,gBAAA,GAAmB,WAAA,CAAY,QAAA,EAAU,CAAC,QAAQ,CAAC,CAAA;AACzD,EAAA,MAAM,6BAAA,GAAgC,OAAsB,IAAI,CAAA;AAChE,EAAA,MAAM,2BAAA,GAA8B,MAAA;AAAA,IAClC;AAAA,GACF;AAEA,EAAA,MAAM,WAAA,GAAc,WAAA;AAAA,IAClB,CACE,KAAA,EACA,KAAA,EACA,MAAA,GAA8B,MAAA,KAC3B;AACH,MAAA,MAAM,uBAAuB,MAAA,KAAW,UAAA;AACxC,MAAA,6BAAA,CAA8B,OAAA,GAAU,uBACpC,KAAA,GACA,IAAA;AAEJ,MAAA,IAAI,oBAAA,EAAsB;AACxB,QAAA,KAAA,IAAA,IAAA,GAAA,MAAA,GAAA,KAAA,CAAO,OAAA,EAAA;AACP,QAAA,2BAAA,CAA4B,OAAA,GAAU,EAAE,KAAA,EAAO,KAAA,EAAM;AACrD,QAAA,WAAA,CAAY,KAAK,CAAA;AACjB,QAAA;AAAA,MACF;AAEA,MAAA,2BAAA,CAA4B,OAAA,GAAU,IAAA;AACtC,MAAA,WAAA,CAAY,KAAK,CAAA;AACjB,MAAA,eAAA,CAAgB,OAAO,KAAK,CAAA;AAAA,IAC9B,CAAA;AAAA,IACA,CAAC,iBAAiB,WAAW;AAAA,GAC/B;AAEA,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,mBAAmB,2BAAA,CAA4B,OAAA;AACrD,IAAA,IAAI,CAAC,gBAAA,EAAkB;AACrB,MAAA;AAAA,IACF;AAEA,IAAA,2BAAA,CAA4B,OAAA,GAAU,IAAA;AACtC,IAAA,eAAA,CAAgB,gBAAA,CAAiB,KAAA,EAAO,gBAAA,CAAiB,KAAK,CAAA;AAAA,EAChE,CAAA,EAAG,CAAC,eAAA,EAAiB,QAAQ,CAAC,CAAA;AAE9B,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,uBAAuB,6BAAA,CAA8B,OAAA;AAC3D,IAAA,IAAI,oBAAA,IAAwB,IAAA,IAAQ,2BAAA,CAA4B,OAAA,EAAS;AACvE,MAAA;AAAA,IACF;AAEA,IAAA,IAAI,QAAA,KAAa,oBAAA,IAAwB,QAAA,KAAa,gBAAA,EAAkB;AACtE,MAAA;AAAA,IACF;AAEA,IAAA,6BAAA,CAA8B,OAAA,GAAU,IAAA;AAAA,EAC1C,CAAA,EAAG,CAAC,gBAAA,EAAkB,QAAQ,CAAC,CAAA;AAE/B,EAAA,OAAO;AAAA,IACL,6BAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"useOverflowSelectionState.js","sources":["../src/tabs/internal/overflow/useOverflowSelectionState.ts"],"sourcesContent":["import {\n  type Dispatch,\n  type MutableRefObject,\n  type SetStateAction,\n  type SyntheticEvent,\n  useCallback,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { useIsomorphicLayoutEffect, usePrevious } from \"../../../utils\";\n\ninterface PendingOverflowSelection {\n  event: SyntheticEvent | null;\n  value: string;\n}\n\ninterface UseOverflowSelectionStateArgs {\n  commitSelection: (event: SyntheticEvent | null, value: string) => void;\n  menuOpen: boolean;\n  selected?: string;\n  setMenuOpen: Dispatch<SetStateAction<boolean>>;\n}\n\ninterface UseOverflowSelectionStateResult {\n  selectionFromOverflowValueRef: MutableRefObject<string | null>;\n  setSelected: (\n    event: SyntheticEvent | null,\n    value: string,\n    source?: \"main\" | \"overflow\",\n  ) => void;\n}\n\nexport function useOverflowSelectionState({\n  commitSelection,\n  menuOpen,\n  selected,\n  setMenuOpen,\n}: UseOverflowSelectionStateArgs): UseOverflowSelectionStateResult {\n  const previousSelected = usePrevious(selected, [selected]);\n  const selectionFromOverflowValueRef = useRef<string | null>(null);\n  const pendingOverflowSelectionRef = useRef<PendingOverflowSelection | null>(\n    null,\n  );\n\n  const setSelected = useCallback(\n    (\n      event: SyntheticEvent | null,\n      value: string,\n      source: \"main\" | \"overflow\" = \"main\",\n    ) => {\n      const selectedFromOverflow = source === \"overflow\";\n      selectionFromOverflowValueRef.current = selectedFromOverflow\n        ? value\n        : null;\n\n      if (selectedFromOverflow) {\n        event?.persist();\n        pendingOverflowSelectionRef.current = { event, value };\n        setMenuOpen(false);\n        return;\n      }\n\n      pendingOverflowSelectionRef.current = null;\n      setMenuOpen(false);\n      commitSelection(event, value);\n    },\n    [commitSelection, setMenuOpen],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (menuOpen) {\n      return;\n    }\n\n    const pendingSelection = pendingOverflowSelectionRef.current;\n    if (!pendingSelection) {\n      return;\n    }\n\n    pendingOverflowSelectionRef.current = null;\n    commitSelection(pendingSelection.event, pendingSelection.value);\n  }, [commitSelection, menuOpen]);\n\n  useEffect(() => {\n    if (menuOpen) {\n      return;\n    }\n\n    const selectedFromOverflow = selectionFromOverflowValueRef.current;\n    if (selectedFromOverflow == null || pendingOverflowSelectionRef.current) {\n      return;\n    }\n\n    if (selected === selectedFromOverflow && selected !== previousSelected) {\n      return;\n    }\n\n    const clearStaleSelection = setTimeout(() => {\n      if (selectionFromOverflowValueRef.current === selectedFromOverflow) {\n        selectionFromOverflowValueRef.current = null;\n      }\n    });\n\n    return () => clearTimeout(clearStaleSelection);\n  }, [menuOpen, previousSelected, selected]);\n\n  return {\n    selectionFromOverflowValueRef,\n    setSelected,\n  };\n}\n"],"names":[],"mappings":";;;;;;;;;;AAgCO,SAAS,yBAAA,CAA0B;AAAA,EACxC,eAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,EAAmE;AACjE,EAAA,MAAM,gBAAA,GAAmB,WAAA,CAAY,QAAA,EAAU,CAAC,QAAQ,CAAC,CAAA;AACzD,EAAA,MAAM,6BAAA,GAAgC,OAAsB,IAAI,CAAA;AAChE,EAAA,MAAM,2BAAA,GAA8B,MAAA;AAAA,IAClC;AAAA,GACF;AAEA,EAAA,MAAM,WAAA,GAAc,WAAA;AAAA,IAClB,CACE,KAAA,EACA,KAAA,EACA,MAAA,GAA8B,MAAA,KAC3B;AACH,MAAA,MAAM,uBAAuB,MAAA,KAAW,UAAA;AACxC,MAAA,6BAAA,CAA8B,OAAA,GAAU,uBACpC,KAAA,GACA,IAAA;AAEJ,MAAA,IAAI,oBAAA,EAAsB;AACxB,QAAA,KAAA,IAAA,IAAA,GAAA,MAAA,GAAA,KAAA,CAAO,OAAA,EAAA;AACP,QAAA,2BAAA,CAA4B,OAAA,GAAU,EAAE,KAAA,EAAO,KAAA,EAAM;AACrD,QAAA,WAAA,CAAY,KAAK,CAAA;AACjB,QAAA;AAAA,MACF;AAEA,MAAA,2BAAA,CAA4B,OAAA,GAAU,IAAA;AACtC,MAAA,WAAA,CAAY,KAAK,CAAA;AACjB,MAAA,eAAA,CAAgB,OAAO,KAAK,CAAA;AAAA,IAC9B,CAAA;AAAA,IACA,CAAC,iBAAiB,WAAW;AAAA,GAC/B;AAEA,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,mBAAmB,2BAAA,CAA4B,OAAA;AACrD,IAAA,IAAI,CAAC,gBAAA,EAAkB;AACrB,MAAA;AAAA,IACF;AAEA,IAAA,2BAAA,CAA4B,OAAA,GAAU,IAAA;AACtC,IAAA,eAAA,CAAgB,gBAAA,CAAiB,KAAA,EAAO,gBAAA,CAAiB,KAAK,CAAA;AAAA,EAChE,CAAA,EAAG,CAAC,eAAA,EAAiB,QAAQ,CAAC,CAAA;AAE9B,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,uBAAuB,6BAAA,CAA8B,OAAA;AAC3D,IAAA,IAAI,oBAAA,IAAwB,IAAA,IAAQ,2BAAA,CAA4B,OAAA,EAAS;AACvE,MAAA;AAAA,IACF;AAEA,IAAA,IAAI,QAAA,KAAa,oBAAA,IAAwB,QAAA,KAAa,gBAAA,EAAkB;AACtE,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,mBAAA,GAAsB,WAAW,MAAM;AAC3C,MAAA,IAAI,6BAAA,CAA8B,YAAY,oBAAA,EAAsB;AAClE,QAAA,6BAAA,CAA8B,OAAA,GAAU,IAAA;AAAA,MAC1C;AAAA,IACF,CAAC,CAAA;AAED,IAAA,OAAO,MAAM,aAAa,mBAAmB,CAAA;AAAA,EAC/C,CAAA,EAAG,CAAC,QAAA,EAAU,gBAAA,EAAkB,QAAQ,CAAC,CAAA;AAEzC,EAAA,OAAO;AAAA,IACL,6BAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}

package/dist-types/card/Card.d.ts

@@ -4,6 +4,14 @@ export interface CardProps extends ComponentPropsWithoutRef<"div"> {
      * If provided an accent is shown in the specified position.
      */
     accent?: "bottom" | "top" | "left" | "right";
+    /**
+     * Visual elevation.
+     */
+    elevation?: "flat" | "raised";
+    /**
+     * Border color strength.
+     */
+    borderColor?: "strong" | "subtle" | "none";
     /**
      * **Deprecated:** Use the InteractableCard component instead
      *
@@ -11,6 +19,8 @@ export interface CardProps extends ComponentPropsWithoutRef<"div"> {
      */
     disabled?: boolean;
     /**
+     * @deprecated since 1.71.0. Use `LinkCard` or `InteractableCard` when the entire card is interactive.
+     *
      * If `true` the card will have hover styling.
      */
     hoverable?: boolean;

package/dist-types/drawer/Drawer.d.ts

@@ -18,7 +18,7 @@ export interface DrawerProps extends ComponentPropsWithoutRef<"div"> {
      */
     variant?: "primary" | "secondary" | "tertiary";
     /**
-     * Prevent the dialog closing on click away
+     * Prevent the drawer closing on click away
      * */
     disableDismiss?: boolean;
     /**

package/dist-types/drawer/DrawerCloseButton.d.ts

@@ -1,2 +1,5 @@
 import { type ButtonProps } from "../button";
+/**
+ * @deprecated since 1.71.0. Use `Button` in `DrawerHeader`'s `actions` instead.
+ */
 export declare const DrawerCloseButton: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist-types/drawer/DrawerContent.d.ts

@@ -0,0 +1,3 @@
+import { type ComponentPropsWithoutRef } from "react";
+export type DrawerContentProps = ComponentPropsWithoutRef<"div">;
+export declare const DrawerContent: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/drawer/DrawerContext.d.ts

@@ -0,0 +1,9 @@
+export interface DrawerContextValue {
+    drawerId?: string;
+    headerId?: string;
+    setHeaderId?: (id: string | undefined) => void;
+    descriptionId?: string;
+    setDescriptionId?: (id: string | undefined) => void;
+}
+export declare const DrawerContext: import("react").Context<DrawerContextValue>;
+export declare const useDrawerContext: () => DrawerContextValue;

package/dist-types/drawer/DrawerFooter.d.ts

@@ -0,0 +1,3 @@
+import { type ComponentPropsWithoutRef } from "react";
+export type DrawerFooterProps = ComponentPropsWithoutRef<"div">;
+export declare const DrawerFooter: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/drawer/DrawerHeader.d.ts

@@ -0,0 +1,24 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from "react";
+export interface DrawerHeaderProps extends ComponentPropsWithoutRef<"div"> {
+    /**
+     * Hides the accent bar in the Drawer Header. Defaults to `false`.
+     */
+    disableAccent?: boolean;
+    /**
+     * Displays the header at the top of the Drawer
+     */
+    header?: ReactNode;
+    /**
+     * Displays the preheader just above the header
+     **/
+    preheader?: ReactNode;
+    /**
+     * Description text is displayed just below the header
+     **/
+    description?: ReactNode;
+    /**
+     * Actions to be displayed in header
+     */
+    actions?: ReactNode;
+}
+export declare const DrawerHeader: import("react").ForwardRefExoticComponent<DrawerHeaderProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/drawer/hasDrawerSection.d.ts

@@ -0,0 +1,2 @@
+import { type ReactNode } from "react";
+export declare function hasDrawerSection(children: ReactNode): boolean;

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

@@ -1,2 +1,5 @@
 export * from "./Drawer";
 export * from "./DrawerCloseButton";
+export * from "./DrawerContent";
+export * from "./DrawerFooter";
+export * from "./DrawerHeader";

package/dist-types/index.d.ts

@@ -28,6 +28,7 @@ export * from "./input";
 export * from "./interactable-card";
 export * from "./kbd";
 export * from "./link";
+export * from "./link-button";
 export * from "./link-card";
 export * from "./list-box";
 export * from "./list-control";

package/dist-types/interactable-card/InteractableCard.d.ts

@@ -2,9 +2,17 @@ import { type ComponentPropsWithoutRef, type SyntheticEvent } from "react";
 import { type InteractableCardValue } from "./InteractableCardGroupContext";
 export interface InteractableCardProps extends ComponentPropsWithoutRef<"div"> {
     /**
-     * Accent border position: defaults to "bottom"
+     * If provided an accent is shown in the specified position.
      */
     accent?: "bottom" | "top" | "left" | "right";
+    /**
+     * Visual elevation.
+     */
+    elevation?: "flat" | "raised";
+    /**
+     * Border color strength.
+     */
+    borderColor?: "strong" | "subtle" | "none";
     /**
      * @deprecated since 1.23.0. Use the `accent` prop instead.
      */

package/dist-types/link-button/LinkButton.d.ts

@@ -0,0 +1,26 @@
+import type { IconProps } from "@salt-ds/icons";
+import { type ComponentPropsWithoutRef, type ComponentType } from "react";
+import { type RenderPropsType } from "../utils";
+export interface LinkButtonProps extends ComponentPropsWithoutRef<"a"> {
+    /**
+     * Icon component displayed when `target="_blank"`. Defaults to `ExternalIcon` from `SemanticIconProvider`.
+     */
+    IconComponent?: ComponentType<IconProps> | null;
+    /**
+     * The sentiment of the button. Options are 'accented' and 'neutral'.
+     * 'neutral' is the default value.
+     */
+    sentiment?: "accented" | "neutral";
+    /**
+     * Render prop to enable customisation of anchor element.
+     */
+    render?: RenderPropsType["render"];
+    /**
+     * Either "default" or "never".
+     * Determines when underline should be applied to the link button.
+     *
+     * @default "default".
+     */
+    underline?: "default" | "never";
+}
+export declare const LinkButton: import("react").ForwardRefExoticComponent<LinkButtonProps & import("react").RefAttributes<HTMLAnchorElement>>;

package/dist-types/link-button/index.d.ts

@@ -0,0 +1 @@
+export * from "./LinkButton";

package/dist-types/link-card/LinkCard.d.ts

@@ -4,6 +4,14 @@ export interface LinkCardProps extends ComponentPropsWithoutRef<"a"> {
      * If provided an accent is shown in the specified position.
      */
     accent?: "bottom" | "top" | "left" | "right";
+    /**
+     * Visual elevation.
+     */
+    elevation?: "flat" | "raised";
+    /**
+     * Border color strength.
+     */
+    borderColor?: "strong" | "subtle" | "none";
     /**
      * Styling variant; defaults to "primary".
      */

package/dist-types/panel/Panel.d.ts

@@ -11,6 +11,10 @@ import { type HTMLAttributes } from "react";
  *
  */
 export interface PanelProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Visual elevation.
+     */
+    elevation?: "flat" | "raised";
     /**
      * Styling variant; defaults to "primary".
      */

package/dist-types/utils/useIsomorphicLayoutEffect.d.ts

@@ -1,2 +1,2 @@
-import { useLayoutEffect } from "react";
-export declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
+import { useEffect } from "react";
+export declare const useIsomorphicLayoutEffect: typeof useEffect;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salt-ds/core",
-  "version": "1.70.0",
+  "version": "1.71.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -8,7 +8,12 @@
     "directory": "packages/core"
   },
   "bugs": "https://github.com/jpmorganchase/salt-ds/issues",
+  "forbiddenDependencies": [
+    "@salt-ds/core",
+    "@salt-ds/lab"
+  ],
   "main": "dist-cjs/index.js",
+  "typings": "dist-types/index.d.ts",
   "sideEffects": [
     "*.css"
   ],
@@ -38,7 +43,8 @@
     }
   },
   "publishConfig": {
-    "directory": "../../dist/salt-ds-core",
+    "main": "dist-cjs/index.js",
+    "module": "dist-es/index.js",
     "provenance": true
   },
   "scripts": {
@@ -49,9 +55,7 @@
     "css",
     "dist-cjs",
     "dist-es",
-    "dist-types",
-    "CHANGELOG.md"
+    "dist-types"
   ],
-  "module": "dist-es/index.js",
-  "typings": "dist-types/index.d.ts"
-}
+  "module": "dist-es/index.js"
+}