@salt-ds/core 1.8.2 → 1.9.1

package/dist-types/form-field/FormFieldLabel.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { TextProps } from "../text";
 export interface FormFieldLabelProps extends Omit<TextProps<"label">, "variant" | "styleAs"> {
     /**

package/dist-types/form-field-context/FormFieldContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export interface A11yValueProps {
     /**
      * id for FormFieldHelperText

package/dist-types/grid-item/GridItem.d.ts

@@ -1,7 +1,7 @@
 import { ElementType, ReactElement } from "react";
 import { ResponsiveProp, PolymorphicComponentPropWithRef } from "../utils";
 export declare const GRID_ALIGNMENT_BASE: readonly ["start", "end", "center", "stretch"];
-declare type GridAlignment = typeof GRID_ALIGNMENT_BASE[number];
+declare type GridAlignment = (typeof GRID_ALIGNMENT_BASE)[number];
 declare type GridProperty = number | "auto";
 export declare type GridItemProps<T extends ElementType> = PolymorphicComponentPropWithRef<T, {
     /**

package/dist-types/spinner/Spinner.d.ts

@@ -6,7 +6,7 @@ import { HTMLAttributes } from "react";
  * <Spinner size="default | large" />
  */
 export declare const SpinnerSizeValues: readonly ["default", "large"];
-export declare type SpinnerSize = typeof SpinnerSizeValues[number];
+export declare type SpinnerSize = (typeof SpinnerSizeValues)[number];
 export interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)

package/dist-types/status-adornment/ErrorAdornment.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconProps } from "@salt-ds/icons";
 export declare type ErrorAdornmentIconProps = IconProps;
 export declare const ErrorAdornmentIcon: import("react").ForwardRefExoticComponent<IconProps & import("react").RefAttributes<SVGSVGElement>>;

package/dist-types/status-adornment/StatusAdornment.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconProps } from "@salt-ds/icons";
 import { ValidationStatus } from "../status-indicator";
 export declare type AdornmentValidationStatus = Exclude<ValidationStatus, "info">;

package/dist-types/status-adornment/SuccessAdornment.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconProps } from "@salt-ds/icons";
 export declare type SuccessAdornmentIconProps = IconProps;
 export declare const SuccessAdornmentIcon: import("react").ForwardRefExoticComponent<IconProps & import("react").RefAttributes<SVGSVGElement>>;

package/dist-types/status-adornment/WarningAdornment.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconProps } from "@salt-ds/icons";
 export declare type WarningAdornmentIconProps = IconProps;
 export declare const WarningAdornmentIcon: import("react").ForwardRefExoticComponent<IconProps & import("react").RefAttributes<SVGSVGElement>>;

package/dist-types/status-indicator/StatusIndicator.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconProps } from "@salt-ds/icons";
 import { ValidationStatus } from "./ValidationStatus";
 export interface StatusIndicatorProps extends IconProps {

package/dist-types/status-indicator/ValidationStatus.d.ts

@@ -1,2 +1,2 @@
 export declare const VALIDATION_NAMED_STATUS: readonly ["error", "warning", "success", "info"];
-export declare type ValidationStatus = typeof VALIDATION_NAMED_STATUS[number];
+export declare type ValidationStatus = (typeof VALIDATION_NAMED_STATUS)[number];

package/dist-types/text/Display.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { TextProps } from "./Text";
 export declare const Display1: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"span">, "as">, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
 export declare const Display2: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"span">, "as">, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;

package/dist-types/text/Headings.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { TextProps } from "./Text";
 export declare const H1: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"h1">, "as">, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
 export declare const H2: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"h2">, "as">, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;

package/dist-types/text/Label.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { TextProps } from "./Text";
 export declare const Label: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"label">, "as">, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;

package/dist-types/theme/Density.d.ts

@@ -1,2 +1,2 @@
 export declare const DensityValues: readonly ["high", "medium", "low", "touch"];
-export declare type Density = typeof DensityValues[number];
+export declare type Density = (typeof DensityValues)[number];

package/dist-types/theme/Mode.d.ts

@@ -1,2 +1,2 @@
 export declare const ModeValues: readonly ["light", "dark"];
-export declare type Mode = typeof ModeValues[number];
+export declare type Mode = (typeof ModeValues)[number];

package/dist-types/toast/ToastContent.d.ts

@@ -1,2 +1,8 @@
-/// <reference types="react" />
-export declare const ToastContent: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+export interface ToastContentProps extends ComponentPropsWithoutRef<"div"> {
+    /**
+     * The content of Toast Content
+     */
+    children?: ReactNode;
+}
+export declare const ToastContent: import("react").ForwardRefExoticComponent<ToastContentProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/tooltip/TooltipBase.d.ts

@@ -0,0 +1,12 @@
+import { ValidationStatus } from "../status-indicator";
+import { FloatingArrowProps } from "@floating-ui/react";
+import { TooltipProps } from "./Tooltip";
+interface TooltipBaseProps extends Omit<TooltipProps, "children"> {
+    arrowProps: FloatingArrowProps;
+    /**
+     * A string to determine the status of the Tooltip. Defaults to `info`.
+     */
+    status: ValidationStatus;
+}
+export declare const TooltipBase: (props: TooltipBaseProps) => JSX.Element;
+export {};

package/dist-types/tooltip/useTooltip.d.ts

@@ -26,12 +26,12 @@ export declare function useTooltip(props?: UseTooltipProps): {
         context: {
             x: number | null;
             y: number | null;
-            placement: import("@floating-ui/react").Placement;
-            strategy: import("@floating-ui/react").Strategy;
-            middlewareData: import("@floating-ui/react").MiddlewareData;
-            update: () => void;
+            placement: import("@floating-ui/utils").Placement;
+            strategy: import("@floating-ui/utils").Strategy;
+            middlewareData: import("@floating-ui/core").MiddlewareData;
             reference: (node: import("@floating-ui/react").ReferenceType | null) => void;
             floating: (node: HTMLElement | null) => void;
+            update: () => void;
             isPositioned: boolean;
             open: boolean;
             onOpenChange: (open: boolean) => void;
@@ -43,7 +43,7 @@ export declare function useTooltip(props?: UseTooltipProps): {
             elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
         };
         style: {
-            position: import("@floating-ui/react").Strategy;
+            position: import("@floating-ui/utils").Strategy;
             left: number;
             top: number;
         };
@@ -53,4 +53,11 @@ export declare function useTooltip(props?: UseTooltipProps): {
     reference: (node: import("@floating-ui/react").ReferenceType | null) => void;
     getTooltipProps: () => HTMLProps<HTMLDivElement>;
     getTriggerProps: () => Record<string, unknown>;
+    getTooltipPosition: () => {
+        top: number;
+        left: number;
+        position: import("@floating-ui/utils").Strategy;
+        width: number | undefined;
+        height: number | undefined;
+    };
 };

package/dist-types/utils/useFloatingUI/index.d.ts

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

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

@@ -0,0 +1,77 @@
+import { Middleware, Placement, Platform, Strategy, useFloating } from "@floating-ui/react";
+import { ReactNode, PropsWithChildren, ForwardRefExoticComponent } from "react";
+declare type CombinedFloatingComponentProps = PropsWithChildren<FloatingComponentProps>;
+export interface FloatingComponentProps {
+    /**
+     * Whether the floating component is open (used for determinig whether to show the component)
+     * We pass this as a prop rather than not rendering the component to allow more advanced use-cases e.g.
+     * for caching windows and reusing them, rather than always spawning a new one
+     */
+    open: boolean;
+    /**
+     * Position props for the floating component
+     */
+    top: number;
+    left: number;
+    width?: number;
+    height?: number;
+    position: Strategy;
+}
+export interface FloatingComponentContextType {
+    Component: ForwardRefExoticComponent<CombinedFloatingComponentProps>;
+}
+export interface FloatingComponentProviderProps extends FloatingComponentContextType {
+    children: ReactNode;
+}
+export declare function FloatingComponentProvider(props: FloatingComponentProviderProps): JSX.Element;
+export declare function useFloatingComponent(): FloatingComponentContextType;
+export interface UseFloatingUIProps {
+    /**
+     * Sets position relative to trigger.
+     */
+    placement?: Placement;
+    strategy?: Strategy;
+    /**
+     * Function to update the default middleware used to extend or replace it
+     */
+    middleware?: Middleware[];
+    /**
+     * Sets visible state.
+     */
+    open?: boolean;
+    /**
+     * Callback function triggered when open state changes.
+     */
+    onOpenChange?: (open: boolean) => void;
+}
+declare type GetMiddleware = (middleware: Middleware[]) => Middleware[];
+interface FloatingPlatformContextType {
+    platform: Platform;
+    middleware: GetMiddleware;
+    animationFrame: boolean;
+}
+export interface FloatingPlatformProviderProps {
+    platform?: Platform;
+    middleware?: GetMiddleware;
+    children: ReactNode;
+    animationFrame?: boolean;
+}
+export declare function FloatingPlatformProvider(props: FloatingPlatformProviderProps): JSX.Element;
+export declare function useFloatingPlatform(): FloatingPlatformContextType;
+export declare const DEFAULT_FLOATING_UI_MIDDLEWARE: {
+    name: string;
+    options?: any;
+    fn: (state: {
+        x: number;
+        y: number;
+        initialPlacement: Placement;
+        placement: Placement;
+        strategy: Strategy;
+        middlewareData: import("@floating-ui/core").MiddlewareData;
+        rects: import("@floating-ui/utils").ElementRects;
+        platform: import("@floating-ui/core").Platform;
+        elements: import("@floating-ui/dom").Elements;
+    }) => import("@floating-ui/core").MiddlewareReturn | Promise<import("@floating-ui/core").MiddlewareReturn>;
+}[];
+export declare function useFloatingUI(props: UseFloatingUIProps): ReturnType<typeof useFloating>;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salt-ds/core",
-  "version": "1.8.2",
+  "version": "1.9.1",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -14,7 +14,7 @@
     "@floating-ui/react": "^0.23.0",
     "clsx": "^2.0.0",
     "@salt-ds/window": "^0.1.1",
-    "@salt-ds/styles": "^0.1.1",
+    "@salt-ds/styles": "^0.1.2",
     "@salt-ds/icons": "^1.7.0"
   },
   "peerDependencies": {

package/dist-cjs/utils/useFloatingUI.js

@@ -1,38 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var react = require('@floating-ui/react');
-
-const DEFAULT_FLOATING_UI_MIDDLEWARE = [
-  react.flip(),
-  react.shift({ limiter: react.limitShift() })
-];
-function useFloatingUI(props) {
-  const {
-    placement,
-    strategy,
-    middleware = DEFAULT_FLOATING_UI_MIDDLEWARE,
-    open = false,
-    onOpenChange
-  } = props;
-  const { reference, floating, refs, update, ...rest } = react.useFloating({
-    placement,
-    strategy,
-    middleware,
-    open,
-    onOpenChange,
-    whileElementsMounted: react.autoUpdate
-  });
-  return {
-    reference,
-    floating,
-    refs,
-    update,
-    ...rest
-  };
-}
-
-exports.DEFAULT_FLOATING_UI_MIDDLEWARE = DEFAULT_FLOATING_UI_MIDDLEWARE;
-exports.useFloatingUI = useFloatingUI;
-//# sourceMappingURL=useFloatingUI.js.map

package/dist-cjs/utils/useFloatingUI.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useFloatingUI.js","sources":["../src/utils/useFloatingUI.tsx"],"sourcesContent":["import type { Middleware, Placement, Strategy } from \"@floating-ui/react\";\nimport {\n  autoUpdate,\n  flip,\n  limitShift,\n  shift,\n  useFloating,\n} from \"@floating-ui/react\";\n\nexport type UseFloatingUIProps = {\n  /**\n   * Sets position relative to trigger.\n   */\n  placement?: Placement;\n  strategy?: Strategy;\n  middleware?: Middleware[];\n  /**\n   * Sets visible state.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n};\n\nexport const DEFAULT_FLOATING_UI_MIDDLEWARE = [\n  flip(),\n  shift({ limiter: limitShift() }),\n];\n\nexport function useFloatingUI(\n  props: UseFloatingUIProps\n): ReturnType<typeof useFloating> {\n  const {\n    placement,\n    strategy,\n    middleware = DEFAULT_FLOATING_UI_MIDDLEWARE,\n    open = false,\n    onOpenChange,\n  } = props;\n\n  const { reference, floating, refs, update, ...rest } = useFloating({\n    placement,\n    strategy,\n    middleware,\n    open,\n    onOpenChange,\n    whileElementsMounted: autoUpdate,\n  });\n\n  return {\n    reference,\n    floating,\n    refs,\n    update,\n    ...rest,\n  };\n}\n"],"names":["flip","shift","limitShift","useFloating","autoUpdate"],"mappings":";;;;;;AA0BO,MAAM,8BAAiC,GAAA;AAAA,EAC5CA,UAAK,EAAA;AAAA,EACLC,WAAM,CAAA,EAAE,OAAS,EAAAC,gBAAA,IAAc,CAAA;AACjC,EAAA;AAEO,SAAS,cACd,KACgC,EAAA;AAChC,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAa,GAAA,8BAAA;AAAA,IACb,IAAO,GAAA,KAAA;AAAA,IACP,YAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,MAAM,MAAW,EAAA,GAAA,IAAA,KAASC,iBAAY,CAAA;AAAA,IACjE,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,oBAAsB,EAAAC,gBAAA;AAAA,GACvB,CAAA,CAAA;AAED,EAAO,OAAA;AAAA,IACL,SAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,GAAG,IAAA;AAAA,GACL,CAAA;AACF;;;;;"}

package/dist-es/utils/useFloatingUI.js

@@ -1,33 +0,0 @@
-import { flip, shift, limitShift, useFloating, autoUpdate } from '@floating-ui/react';
-
-const DEFAULT_FLOATING_UI_MIDDLEWARE = [
-  flip(),
-  shift({ limiter: limitShift() })
-];
-function useFloatingUI(props) {
-  const {
-    placement,
-    strategy,
-    middleware = DEFAULT_FLOATING_UI_MIDDLEWARE,
-    open = false,
-    onOpenChange
-  } = props;
-  const { reference, floating, refs, update, ...rest } = useFloating({
-    placement,
-    strategy,
-    middleware,
-    open,
-    onOpenChange,
-    whileElementsMounted: autoUpdate
-  });
-  return {
-    reference,
-    floating,
-    refs,
-    update,
-    ...rest
-  };
-}
-
-export { DEFAULT_FLOATING_UI_MIDDLEWARE, useFloatingUI };
-//# sourceMappingURL=useFloatingUI.js.map

package/dist-es/utils/useFloatingUI.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useFloatingUI.js","sources":["../src/utils/useFloatingUI.tsx"],"sourcesContent":["import type { Middleware, Placement, Strategy } from \"@floating-ui/react\";\nimport {\n  autoUpdate,\n  flip,\n  limitShift,\n  shift,\n  useFloating,\n} from \"@floating-ui/react\";\n\nexport type UseFloatingUIProps = {\n  /**\n   * Sets position relative to trigger.\n   */\n  placement?: Placement;\n  strategy?: Strategy;\n  middleware?: Middleware[];\n  /**\n   * Sets visible state.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n};\n\nexport const DEFAULT_FLOATING_UI_MIDDLEWARE = [\n  flip(),\n  shift({ limiter: limitShift() }),\n];\n\nexport function useFloatingUI(\n  props: UseFloatingUIProps\n): ReturnType<typeof useFloating> {\n  const {\n    placement,\n    strategy,\n    middleware = DEFAULT_FLOATING_UI_MIDDLEWARE,\n    open = false,\n    onOpenChange,\n  } = props;\n\n  const { reference, floating, refs, update, ...rest } = useFloating({\n    placement,\n    strategy,\n    middleware,\n    open,\n    onOpenChange,\n    whileElementsMounted: autoUpdate,\n  });\n\n  return {\n    reference,\n    floating,\n    refs,\n    update,\n    ...rest,\n  };\n}\n"],"names":[],"mappings":";;AA0BO,MAAM,8BAAiC,GAAA;AAAA,EAC5C,IAAK,EAAA;AAAA,EACL,KAAM,CAAA,EAAE,OAAS,EAAA,UAAA,IAAc,CAAA;AACjC,EAAA;AAEO,SAAS,cACd,KACgC,EAAA;AAChC,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAa,GAAA,8BAAA;AAAA,IACb,IAAO,GAAA,KAAA;AAAA,IACP,YAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,MAAM,MAAW,EAAA,GAAA,IAAA,KAAS,WAAY,CAAA;AAAA,IACjE,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,oBAAsB,EAAA,UAAA;AAAA,GACvB,CAAA,CAAA;AAED,EAAO,OAAA;AAAA,IACL,SAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,GAAG,IAAA;AAAA,GACL,CAAA;AACF;;;;"}

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

@@ -1,34 +0,0 @@
-import type { Middleware, Placement, Strategy } from "@floating-ui/react";
-import { useFloating } from "@floating-ui/react";
-export declare type UseFloatingUIProps = {
-    /**
-     * Sets position relative to trigger.
-     */
-    placement?: Placement;
-    strategy?: Strategy;
-    middleware?: Middleware[];
-    /**
-     * Sets visible state.
-     */
-    open?: boolean;
-    /**
-     * Callback function triggered when open state changes.
-     */
-    onOpenChange?: (open: boolean) => void;
-};
-export declare const DEFAULT_FLOATING_UI_MIDDLEWARE: {
-    name: string;
-    options?: any;
-    fn: (state: {
-        x: number;
-        y: number;
-        initialPlacement: Placement;
-        placement: Placement;
-        strategy: Strategy;
-        middlewareData: import("@floating-ui/react").MiddlewareData;
-        rects: import("@floating-ui/react").ElementRects;
-        platform: import("@floating-ui/core").Platform;
-        elements: import("@floating-ui/react").Elements;
-    }) => import("@floating-ui/react").MiddlewareReturn | Promise<import("@floating-ui/react").MiddlewareReturn>;
-}[];
-export declare function useFloatingUI(props: UseFloatingUIProps): ReturnType<typeof useFloating>;