@splunk/react-ui 4.31.0 → 4.32.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@splunk/react-ui",
-  "version": "4.31.0",
+  "version": "4.32.0",
   "description": "Library of React components that implement the Splunk design language",
   "license": "Apache-2.0",
   "author": "Splunk Inc.",
@@ -43,8 +43,8 @@
     "@dnd-kit/modifiers": "^7.0.0",
     "@dnd-kit/sortable": "^8.0.0",
     "@dnd-kit/utilities": "^3.2.2",
-    "@splunk/react-icons": "^4.4.0",
-    "@splunk/themes": "^0.18.0",
+    "@splunk/react-icons": "^4.5.0",
+    "@splunk/themes": "^0.19.0",
     "@splunk/ui-utils": "^1.6.0",
     "commonmark": "^0.30.0",
     "commonmark-react-renderer": "^4.3.2",
@@ -61,9 +61,9 @@
     "@babel/core": "^7.2.0",
     "@babel/plugin-transform-runtime": "^7.18.6",
     "@splunk/babel-preset": "^4.0.0",
-    "@splunk/docs-gen": "1.0.0-beta.10",
+    "@splunk/docs-gen": "1.0.0-beta.11",
     "@splunk/eslint-config": "^4.0.0",
-    "@splunk/react-docs": "1.0.0-beta.14",
+    "@splunk/react-docs": "1.0.0-beta.15",
     "@splunk/stylelint-config": "^4.0.0",
     "@splunk/test-runner-utils": "^0.4.1",
     "@splunk/webpack-configs": "^7.0.2",

package/types/src/ButtonSimple/mixin.d.ts

@@ -0,0 +1,27 @@
+import { AnyTheme, Interpolation, InterpolationResult, ThemedProps } from '@splunk/themes';
+declare const buttonVariants: readonly ["primary", "secondary", "destructive", "ghost"];
+type ButtonVariant = typeof buttonVariants[number];
+type ButtonStyleProps = ThemedProps & Partial<{
+    $append: boolean;
+    $prepend: boolean;
+    $selected: boolean;
+    $error: boolean;
+    disabled: boolean;
+}>;
+interface ButtonParams<T extends AnyTheme, A extends ThemedProps> {
+    background?: InterpolationResult<T, A>;
+    backgroundActive?: InterpolationResult<T, A>;
+    backgroundDisabled?: InterpolationResult<T, A>;
+    backgroundDisabledSelected?: InterpolationResult<T, A>;
+    backgroundHover?: InterpolationResult<T, A>;
+    backgroundSelected?: InterpolationResult<T, A>;
+    borderColor?: InterpolationResult<T, A>;
+    borderColorDisabled?: InterpolationResult<T, A>;
+    color?: InterpolationResult<T, A>;
+    colorDisabled?: InterpolationResult<T, A>;
+}
+declare function button<T extends AnyTheme, A extends ButtonStyleProps>(): Interpolation<T, A>;
+declare function button<T extends AnyTheme, A extends ButtonStyleProps>(variant: ButtonVariant): Interpolation<T, A>;
+declare function button<T extends AnyTheme, A extends ButtonStyleProps>(params: ButtonParams<T, A>): Interpolation<T, A>;
+declare function button<T extends AnyTheme, A extends ButtonStyleProps>(variant: ButtonVariant, additionalParams: ButtonParams<T, A>): Interpolation<T, A>;
+export default button;

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

@@ -35,7 +35,7 @@ interface CardPropsBase {
      */
     openInNewContext?: boolean;
     /**
-     * Renders `Card` as selected if set to `true`.
+     * Renders `Card` as selected if set to `true`. Use only when `onClick` is also provided.
      */
     selected?: boolean;
     /**
@@ -50,24 +50,32 @@ interface CardPropsBase {
     /** Returns a value on click. Use when composing or if you have more than one selectable `Card`. */
     value?: any;
 }
-declare const defaultProps: Required<Pick<CardPropsBase, 'openInNewContext' | 'selected' | 'showBorder'>>;
+declare const defaultProps: Required<Pick<CardPropsBase, 'openInNewContext' | 'showBorder'>>;
 interface CardPropsBaseNonClickable extends CardPropsBase {
     elementRef?: React.Ref<HTMLDivElement>;
     onClick?: never;
+    selected?: never;
     to?: never;
 }
+interface CardPropsBaseOnClickClickable extends CardPropsBase {
+    elementRef?: React.Ref<HTMLAnchorElement | HTMLButtonElement>;
+    onClick: CardClickHandler;
+    selected?: boolean;
+    to?: string;
+}
 interface CardPropsBaseClickable extends CardPropsBase {
     elementRef?: React.Ref<HTMLAnchorElement | HTMLButtonElement>;
     onClick?: CardClickHandler;
+    selected?: never;
     to?: string;
 }
 type CardNonClickableProps = ClassComponentProps<CardPropsBaseNonClickable, typeof defaultProps, 'div'>;
-type CardClickableButtonProps = ClassComponentProps<CardPropsBaseClickable, typeof defaultProps, 'button'>;
-type CardClickableLinkProps = ClassComponentProps<CardPropsBaseClickable, typeof defaultProps, 'a', 'href'>;
+type CardClickableButtonProps = ClassComponentProps<CardPropsBaseOnClickClickable | CardPropsBaseClickable, typeof defaultProps, 'button'>;
+type CardClickableLinkProps = ClassComponentProps<CardPropsBaseOnClickClickable | CardPropsBaseClickable, typeof defaultProps, 'a', 'href'>;
 type CardProps = CardNonClickableProps | CardClickableButtonProps | CardClickableLinkProps;
 declare class Card extends Component<CardProps, {}> {
     static propTypes: React.WeakValidationMap<CardProps>;
-    static defaultProps: Required<Pick<CardPropsBase, "selected" | "openInNewContext" | "showBorder">>;
+    static defaultProps: Required<Pick<CardPropsBase, "openInNewContext" | "showBorder">>;
     static Header: typeof Header;
     static Body: typeof Body;
     static Footer: typeof Footer;

package/types/src/Clickable/Clickable.d.ts

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import { legacyRefMode } from '@splunk/react-ui/Dropdown';
-import { NavigationContext, NavigationProviderClickHandler } from './NavigationProvider';
+import { NavigationContext } from './NavigationProvider';
 import { ClassComponentProps } from '../utils/types';
 export declare const isRootRelativeLink: (to: string | undefined) => boolean;
 export declare const isInternalLink: (to: string | undefined) => boolean;
@@ -56,14 +56,10 @@ declare class Clickable extends Component<ClickableProps> {
     private el;
     context: React.ContextType<typeof NavigationContext>;
     static contextType: React.Context<{
-        onClick?: NavigationProviderClickHandler | undefined;
+        onClick?: import("./NavigationProvider").NavigationProviderClickHandler | undefined;
+        onLinkClick?: import("./NavigationProvider").NavigationProviderClickHandler | undefined;
         prefix?: string | undefined;
-        transformUrl?: import("./NavigationProvider").NavigationProviderTransformUrl | undefined; /**
-         * The text representation of the navigational link.
-         * This should be provided if child content is not a string.
-         *
-         * Ignored if not in link mode.
-         */
+        transformUrl?: import("./NavigationProvider").NavigationProviderTransformUrl | undefined;
     }>;
     static propTypes: React.WeakValidationMap<ClickableProps>;
     static defaultProps: Required<Pick<ClickablePropsBase, "disabled" | "openInNewContext">>;

package/types/src/Clickable/NavigationProvider.d.ts

@@ -18,6 +18,11 @@ interface NavigationProviderPropsBase {
      * The function takes the event and an options argument with `to` and `openInNewContext`
      */
     onClick?: NavigationProviderClickHandler;
+    /**
+     * Triggers when a link is clicked, even if the link has its own `onClick` handler.
+     * The function takes the event and an options argument with `to` and `openInNewContext`
+     */
+    onLinkClick?: NavigationProviderClickHandler;
     /**
      * @deprecated Use the `transformUrl` prop instead.
      * If set, all links that use the NavigationProvider's context will have this prepended to them.
@@ -39,6 +44,7 @@ interface NavigationProviderPropsWithoutPrefix extends NavigationProviderPropsBa
 }
 type NavigationContextValue = {
     onClick?: NavigationProviderClickHandler;
+    onLinkClick?: NavigationProviderClickHandler;
     prefix?: string;
     transformUrl?: NavigationProviderTransformUrl;
 };
@@ -48,11 +54,12 @@ type NavigationProviderProps = NavigationProviderPropsWithPrefix | NavigationPro
  * Used to provide an override for the `onClick` for links for single page applications so that
  * internal links can navigate without a page reload.
  */
-declare function NavigationProvider({ children, onClick, prefix, transformUrl }: NavigationProviderProps): JSX.Element;
+declare function NavigationProvider({ children, onClick, onLinkClick, prefix, transformUrl, }: NavigationProviderProps): JSX.Element;
 declare namespace NavigationProvider {
     var propTypes: {
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onLinkClick: PropTypes.Requireable<(...args: any[]) => any>;
         prefix: PropTypes.Requireable<string>;
         transformUrl: PropTypes.Requireable<(...args: any[]) => any>;
     };