@workday/canvas-kit-preview-react 12.2.2 → 12.3.0

package/InformationHighlight/lib/InformationHighlight.tsx

@@ -0,0 +1,118 @@
+import * as React from 'react';
+import {createContainer} from '@workday/canvas-kit-react/common';
+import {cssVar, createStencil, handleCsProp, CSProps} from '@workday/canvas-kit-styling';
+import {base, system} from '@workday/canvas-tokens-web';
+
+import {InformationHighlightHeading} from './parts/Heading';
+import {Body} from './parts/Body';
+import {Icon} from './parts/Icon';
+import {Link} from './parts/Link';
+import {useInformationHighlightModel} from './hooks/useInformationHighlightModel';
+import {systemIconStencil} from '@workday/canvas-kit-react/icon';
+
+interface InformationHighlightProps extends CSProps {}
+
+export const informationHighlightStencil = createStencil({
+  base: {
+    display: 'grid',
+    gridTemplateColumns: 'min-content',
+    columnGap: system.space.x4,
+    rowGap: system.space.x2,
+    padding: system.space.x4,
+    borderRadius: system.shape.x1,
+  },
+  modifiers: {
+    informational: {
+      low: {
+        borderInlineStart: `solid ${cssVar(system.space.x1)} ${cssVar(
+          system.color.bg.primary.default
+        )}`,
+        backgroundColor: system.color.bg.alt.soft,
+        '& [data-part="information-highlight-icon"]': {
+          [systemIconStencil.vars.accentColor]: system.color.bg.primary.default,
+          [systemIconStencil.vars.color]: system.color.bg.primary.default,
+          [systemIconStencil.vars.backgroundColor]: 'none',
+        },
+      },
+      high: {
+        borderInlineStart: `solid ${cssVar(system.space.x1)} ${cssVar(
+          system.color.bg.primary.default
+        )}`,
+        backgroundColor: base.blueberry100,
+        '& [data-part="information-highlight-icon"]': {
+          [systemIconStencil.vars.accentColor]: system.color.icon.inverse,
+          [systemIconStencil.vars.color]: system.color.bg.primary.default,
+          [systemIconStencil.vars.backgroundColor]: system.color.bg.primary.default,
+        },
+      },
+    },
+    caution: {
+      low: {
+        borderInlineStart: `solid ${cssVar(system.space.x1)} ${cssVar(
+          system.color.border.caution.default
+        )}`,
+        backgroundColor: system.color.bg.alt.soft,
+        '& [data-part="information-highlight-icon"]': {
+          [systemIconStencil.vars.accentColor]: system.color.fg.contrast.default,
+          [systemIconStencil.vars.color]: system.color.fg.contrast.default,
+          [systemIconStencil.vars.backgroundColor]: 'none',
+        },
+      },
+      high: {
+        borderInlineStart: `solid ${cssVar(system.space.x1)} ${cssVar(
+          system.color.border.caution.default
+        )}`,
+        backgroundColor: base.sourLemon100,
+        '& [data-part="information-highlight-icon"]': {
+          [systemIconStencil.vars.accentColor]: system.color.icon.inverse,
+          [systemIconStencil.vars.color]: system.color.fg.contrast.default,
+          [systemIconStencil.vars.backgroundColor]: system.color.fg.contrast.default,
+        },
+      },
+    },
+    critical: {
+      low: {
+        borderInlineStart: `solid ${cssVar(system.space.x1)} ${cssVar(
+          system.color.border.critical.default
+        )}`,
+        backgroundColor: system.color.bg.alt.soft,
+        '& [data-part="information-highlight-icon"]': {
+          [systemIconStencil.vars.accentColor]: system.color.bg.critical.default,
+          [systemIconStencil.vars.color]: system.color.bg.critical.default,
+          [systemIconStencil.vars.backgroundColor]: 'none',
+        },
+      },
+      high: {
+        borderInlineStart: `solid ${cssVar(system.space.x1)} ${cssVar(
+          system.color.border.critical.default
+        )}`,
+        backgroundColor: base.peach100,
+        '& [data-part="information-highlight-icon"]': {
+          [systemIconStencil.vars.accentColor]: system.color.icon.inverse,
+          [systemIconStencil.vars.color]: system.color.bg.critical.default,
+          [systemIconStencil.vars.backgroundColor]: system.color.bg.critical.default,
+        },
+      },
+    },
+  },
+});
+
+export const InformationHighlight = createContainer('section')({
+  displayName: 'InformationHighlight',
+  modelHook: useInformationHighlightModel,
+  subComponents: {
+    Icon: Icon,
+    Heading: InformationHighlightHeading,
+    Body: Body,
+    Link: Link,
+  },
+})(({...elemProps}: InformationHighlightProps, Element, model) => {
+  return (
+    <Element
+      {...handleCsProp(
+        elemProps,
+        informationHighlightStencil({[model.state.variant]: model.state.emphasis})
+      )}
+    />
+  );
+});

package/InformationHighlight/lib/hooks/useInformationHighlightModel.ts

@@ -0,0 +1,16 @@
+import {createModelHook} from '@workday/canvas-kit-react/common';
+
+export const useInformationHighlightModel = createModelHook({
+  defaultConfig: {
+    variant: 'informational' as 'informational' | 'caution' | 'critical',
+    emphasis: 'low' as 'low' | 'high',
+  },
+})(config => {
+  return {
+    state: {
+      variant: config.variant,
+      emphasis: config.emphasis,
+    },
+    events: {},
+  };
+});

package/InformationHighlight/lib/parts/Body.tsx

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import {createComponent, ExtractProps} from '@workday/canvas-kit-react/common';
+import {createStencil, cssVar, handleCsProp} from '@workday/canvas-kit-styling';
+import {system} from '@workday/canvas-tokens-web';
+import {Text} from '@workday/canvas-kit-react/text';
+
+const informationHighlightBodyStencil = createStencil({
+  base: () => {
+    return {
+      ...system.type.subtext.large,
+      color: system.color.text.strong,
+      gridColumn: '2',
+      margin: `0 0 ${cssVar(system.space.x2)} 0`,
+    };
+  },
+});
+
+export const Body = createComponent('p')({
+  displayName: 'Body',
+  Component: ({...elemProps}: ExtractProps<typeof Text, never>, ref, Element) => {
+    return (
+      <Text
+        as={Element}
+        ref={ref}
+        {...handleCsProp(elemProps, informationHighlightBodyStencil())}
+      />
+    );
+  },
+});

package/InformationHighlight/lib/parts/Heading.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import {createComponent, ExtractProps} from '@workday/canvas-kit-react/common';
+import {createStencil, handleCsProp} from '@workday/canvas-kit-styling';
+import {system} from '@workday/canvas-tokens-web';
+import {Heading} from '@workday/canvas-kit-react/text';
+
+const informationHighlightHeadingStencil = createStencil({
+  base: () => {
+    return {
+      ...system.type.body.small,
+      color: system.color.text.strong,
+      gridColumn: '2',
+      fontWeight: system.fontWeight.bold,
+      marginTop: system.space.zero,
+      marginBottom: system.space.zero,
+    };
+  },
+});
+
+export interface InformationHighlightHeadingProps
+  extends Partial<ExtractProps<typeof Heading, never>> {}
+
+export const InformationHighlightHeading = createComponent('h3')({
+  displayName: 'Heading',
+  Component: ({size = 'small', ...elemProps}: InformationHighlightHeadingProps, ref, Element) => {
+    return (
+      <Heading
+        as={Element}
+        ref={ref}
+        size={size}
+        {...handleCsProp(elemProps, informationHighlightHeadingStencil())}
+      />
+    );
+  },
+});

package/InformationHighlight/lib/parts/Icon.tsx

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import {SystemIcon} from '@workday/canvas-kit-react/icon';
+import {createSubcomponent, ExtractProps} from '@workday/canvas-kit-react/common';
+import {
+  infoIcon,
+  exclamationCircleIcon,
+  exclamationTriangleIcon,
+} from '@workday/canvas-system-icons-web';
+import {useInformationHighlightModel} from '../hooks/useInformationHighlightModel';
+
+export interface IconProps extends Partial<ExtractProps<typeof SystemIcon, never>> {}
+const defaultIcons = {
+  informational: infoIcon,
+  caution: exclamationTriangleIcon,
+  critical: exclamationCircleIcon,
+};
+
+export const Icon = createSubcomponent('span')({
+  displayName: 'Icon',
+  modelHook: useInformationHighlightModel,
+})(({icon, ...props}: IconProps, Element, model) => {
+  return (
+    <SystemIcon
+      as={Element}
+      icon={icon ? icon : defaultIcons[model.state.variant]}
+      data-part="information-highlight-icon"
+      {...props}
+    />
+  );
+});

package/InformationHighlight/lib/parts/Link.tsx

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import {Hyperlink} from '@workday/canvas-kit-react/button';
+import {createComponent, ExtractProps} from '@workday/canvas-kit-react/common';
+import {createStencil, handleCsProp} from '@workday/canvas-kit-styling';
+import {system} from '@workday/canvas-tokens-web';
+
+const informationHighlightLinkStencil = createStencil({
+  base: () => {
+    return {
+      ...system.type.subtext.large,
+      gridColumn: '2',
+      justifySelf: 'start',
+      color: system.color.text.strong,
+      fontWeight: system.fontWeight.bold,
+    };
+  },
+});
+
+export const Link = createComponent('a')({
+  displayName: 'Link',
+  Component: ({...elemProps}: ExtractProps<typeof Hyperlink, never>, ref, Element) => {
+    return (
+      <Hyperlink
+        as={Element}
+        ref={ref}
+        {...handleCsProp(elemProps, informationHighlightLinkStencil())}
+      />
+    );
+  },
+});

package/dist/commonjs/InformationHighlight/index.d.ts

@@ -0,0 +1,6 @@
+export * from './lib/InformationHighlight';
+export * from './lib/parts/Body';
+export * from './lib/parts/Heading';
+export * from './lib/parts/Icon';
+export * from './lib/parts/Link';
+//# sourceMappingURL=index.d.ts.map

package/dist/commonjs/InformationHighlight/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../InformationHighlight/index.tsx"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC;AAC3C,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC"}

package/dist/commonjs/InformationHighlight/index.js

@@ -0,0 +1,21 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./lib/InformationHighlight"), exports);
+__exportStar(require("./lib/parts/Body"), exports);
+__exportStar(require("./lib/parts/Heading"), exports);
+__exportStar(require("./lib/parts/Icon"), exports);
+__exportStar(require("./lib/parts/Link"), exports);

package/dist/commonjs/InformationHighlight/lib/InformationHighlight.d.ts

@@ -0,0 +1,76 @@
+import { CSProps } from '@workday/canvas-kit-styling';
+interface InformationHighlightProps extends CSProps {
+}
+export declare const informationHighlightStencil: import("@workday/canvas-kit-styling").Stencil<{
+    informational: {
+        low: {
+            borderInlineStart: string;
+            backgroundColor: "--cnvs-sys-color-bg-alt-soft";
+            '& [data-part="information-highlight-icon"]': {
+                [x: string]: string;
+            };
+        };
+        high: {
+            borderInlineStart: string;
+            backgroundColor: "--cnvs-base-palette-blueberry-100";
+            '& [data-part="information-highlight-icon"]': {
+                [x: string]: "--cnvs-sys-color-bg-primary-default" | "--cnvs-sys-color-icon-inverse";
+            };
+        };
+    };
+    caution: {
+        low: {
+            borderInlineStart: string;
+            backgroundColor: "--cnvs-sys-color-bg-alt-soft";
+            '& [data-part="information-highlight-icon"]': {
+                [x: string]: string;
+            };
+        };
+        high: {
+            borderInlineStart: string;
+            backgroundColor: "--cnvs-base-palette-sour-lemon-100";
+            '& [data-part="information-highlight-icon"]': {
+                [x: string]: "--cnvs-sys-color-icon-inverse" | "--cnvs-sys-color-fg-contrast-default";
+            };
+        };
+    };
+    critical: {
+        low: {
+            borderInlineStart: string;
+            backgroundColor: "--cnvs-sys-color-bg-alt-soft";
+            '& [data-part="information-highlight-icon"]': {
+                [x: string]: string;
+            };
+        };
+        high: {
+            borderInlineStart: string;
+            backgroundColor: "--cnvs-base-palette-peach-100";
+            '& [data-part="information-highlight-icon"]': {
+                [x: string]: "--cnvs-sys-color-icon-inverse" | "--cnvs-sys-color-bg-critical-default";
+            };
+        };
+    };
+}, {}, never, never>;
+export declare const InformationHighlight: import("@workday/canvas-kit-react/common").ElementComponentM<"section", InformationHighlightProps & Partial<{
+    variant: "informational" | "caution" | "critical";
+    emphasis: "high" | "low";
+}> & {} & {}, {
+    state: {
+        variant: "informational" | "caution" | "critical";
+        emphasis: "high" | "low";
+    };
+    events: {};
+}> & {
+    Icon: import("@workday/canvas-kit-react/common").ElementComponentM<"span", import("./parts/Icon").IconProps, {
+        state: {
+            variant: "informational" | "caution" | "critical";
+            emphasis: "high" | "low";
+        };
+        events: {};
+    }>;
+    Heading: import("@workday/canvas-kit-react/common").ElementComponent<"h3", import("./parts/Heading").InformationHighlightHeadingProps>;
+    Body: import("@workday/canvas-kit-react/common").ElementComponent<"p", import("@workday/canvas-kit-react/text").TextProps>;
+    Link: import("@workday/canvas-kit-react/common").ElementComponent<"a", import("@workday/canvas-kit-react/button").HyperlinkProps>;
+};
+export {};
+//# sourceMappingURL=InformationHighlight.d.ts.map

package/dist/commonjs/InformationHighlight/lib/InformationHighlight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InformationHighlight.d.ts","sourceRoot":"","sources":["../../../../InformationHighlight/lib/InformationHighlight.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAsC,OAAO,EAAC,MAAM,6BAA6B,CAAC;AAUzF,UAAU,yBAA0B,SAAQ,OAAO;CAAG;AAEtD,eAAO,MAAM,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBAmFtC,CAAC;AAEH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;CAkB/B,CAAC"}

package/dist/commonjs/InformationHighlight/lib/InformationHighlight.js

@@ -0,0 +1,65 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InformationHighlight = exports.informationHighlightStencil = void 0;
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
+const Heading_1 = require("./parts/Heading");
+const Body_1 = require("./parts/Body");
+const Icon_1 = require("./parts/Icon");
+const Link_1 = require("./parts/Link");
+const useInformationHighlightModel_1 = require("./hooks/useInformationHighlightModel");
+const icon_1 = require("@workday/canvas-kit-react/icon");
+exports.informationHighlightStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "jlfn1z", styles: "box-sizing:border-box;display:grid;grid-template-columns:min-content;column-gap:var(--cnvs-sys-space-x4);row-gap:var(--cnvs-sys-space-x2);padding:var(--cnvs-sys-space-x4);border-radius:var(--cnvs-sys-shape-x1);" },
+    modifiers: {
+        informational: {
+            low: { name: "jlfn20", styles: "border-inline-start:solid var(--cnvs-sys-space-x1) var(--cnvs-sys-color-bg-primary-default);background-color:var(--cnvs-sys-color-bg-alt-soft);& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-212f69:var(--cnvs-sys-color-bg-primary-default);--color-system-icon-212f69:var(--cnvs-sys-color-bg-primary-default);--backgroundColor-system-icon-212f69:none;}" },
+            high: { name: "jlfn21", styles: "border-inline-start:solid var(--cnvs-sys-space-x1) var(--cnvs-sys-color-bg-primary-default);background-color:var(--cnvs-base-palette-blueberry-100);& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-212f69:var(--cnvs-sys-color-icon-inverse);--color-system-icon-212f69:var(--cnvs-sys-color-bg-primary-default);--backgroundColor-system-icon-212f69:var(--cnvs-sys-color-bg-primary-default);}" }
+        },
+        caution: {
+            low: { name: "jlfn22", styles: "border-inline-start:solid var(--cnvs-sys-space-x1) var(--cnvs-sys-color-border-caution-default);background-color:var(--cnvs-sys-color-bg-alt-soft);& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-212f69:var(--cnvs-sys-color-fg-contrast-default);--color-system-icon-212f69:var(--cnvs-sys-color-fg-contrast-default);--backgroundColor-system-icon-212f69:none;}" },
+            high: { name: "jlfn23", styles: "border-inline-start:solid var(--cnvs-sys-space-x1) var(--cnvs-sys-color-border-caution-default);background-color:var(--cnvs-base-palette-sour-lemon-100);& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-212f69:var(--cnvs-sys-color-icon-inverse);--color-system-icon-212f69:var(--cnvs-sys-color-fg-contrast-default);--backgroundColor-system-icon-212f69:var(--cnvs-sys-color-fg-contrast-default);}" }
+        },
+        critical: {
+            low: { name: "jlfn24", styles: "border-inline-start:solid var(--cnvs-sys-space-x1) var(--cnvs-sys-color-border-critical-default);background-color:var(--cnvs-sys-color-bg-alt-soft);& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-212f69:var(--cnvs-sys-color-bg-critical-default);--color-system-icon-212f69:var(--cnvs-sys-color-bg-critical-default);--backgroundColor-system-icon-212f69:none;}" },
+            high: { name: "jlfn25", styles: "border-inline-start:solid var(--cnvs-sys-space-x1) var(--cnvs-sys-color-border-critical-default);background-color:var(--cnvs-base-palette-peach-100);& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-212f69:var(--cnvs-sys-color-icon-inverse);--color-system-icon-212f69:var(--cnvs-sys-color-bg-critical-default);--backgroundColor-system-icon-212f69:var(--cnvs-sys-color-bg-critical-default);}" }
+        }
+    }
+}, "information-highlight-261624");
+exports.InformationHighlight = (0, common_1.createContainer)('section')({
+    displayName: 'InformationHighlight',
+    modelHook: useInformationHighlightModel_1.useInformationHighlightModel,
+    subComponents: {
+        Icon: Icon_1.Icon,
+        Heading: Heading_1.InformationHighlightHeading,
+        Body: Body_1.Body,
+        Link: Link_1.Link,
+    },
+})(({ ...elemProps }, Element, model) => {
+    return (React.createElement(Element, { ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.informationHighlightStencil)({ [model.state.variant]: model.state.emphasis })) }));
+});

package/dist/commonjs/InformationHighlight/lib/hooks/useInformationHighlightModel.d.ts

@@ -0,0 +1,23 @@
+export declare const useInformationHighlightModel: (<TT_Special_Generic>(config?: (Partial<{
+    variant: "informational" | "caution" | "critical";
+    emphasis: "high" | "low";
+}> & {} & {}) | undefined) => {
+    state: {
+        variant: "informational" | "caution" | "critical";
+        emphasis: "high" | "low";
+    };
+    events: {};
+}) & import("@workday/canvas-kit-react/common").ModelExtras<{
+    variant: "informational" | "caution" | "critical";
+    emphasis: "high" | "low";
+}, {}, {
+    variant: "informational" | "caution" | "critical";
+    emphasis: "high" | "low";
+}, {}, {
+    state: {
+        variant: "informational" | "caution" | "critical";
+        emphasis: "high" | "low";
+    };
+    events: {};
+}>;
+//# sourceMappingURL=useInformationHighlightModel.d.ts.map

package/dist/commonjs/InformationHighlight/lib/hooks/useInformationHighlightModel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInformationHighlightModel.d.ts","sourceRoot":"","sources":["../../../../../InformationHighlight/lib/hooks/useInformationHighlightModel.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,4BAA4B;;;;;;;;;;;;;;;;;;;;;EAavC,CAAC"}

package/dist/commonjs/InformationHighlight/lib/hooks/useInformationHighlightModel.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useInformationHighlightModel = void 0;
+const common_1 = require("@workday/canvas-kit-react/common");
+exports.useInformationHighlightModel = (0, common_1.createModelHook)({
+    defaultConfig: {
+        variant: 'informational',
+        emphasis: 'low',
+    },
+})(config => {
+    return {
+        state: {
+            variant: config.variant,
+            emphasis: config.emphasis,
+        },
+        events: {},
+    };
+});

package/dist/commonjs/InformationHighlight/lib/parts/Body.d.ts

@@ -0,0 +1,2 @@
+export declare const Body: import("@workday/canvas-kit-react/common").ElementComponent<"p", import("@workday/canvas-kit-react/text").TextProps>;
+//# sourceMappingURL=Body.d.ts.map

package/dist/commonjs/InformationHighlight/lib/parts/Body.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Body.d.ts","sourceRoot":"","sources":["../../../../../InformationHighlight/lib/parts/Body.tsx"],"names":[],"mappings":"AAiBA,eAAO,MAAM,IAAI,sHAWf,CAAC"}

package/dist/commonjs/InformationHighlight/lib/parts/Body.js

@@ -0,0 +1,40 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Body = void 0;
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
+const text_1 = require("@workday/canvas-kit-react/text");
+const informationHighlightBodyStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "jlfn1x", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-normal);line-height:var(--cnvs-sys-line-height-subtext-large);font-size:var(--cnvs-sys-font-size-subtext-large);letter-spacing:var(--cnvs-base-letter-spacing-150);color:var(--cnvs-sys-color-text-strong);grid-column:2;margin:0 0 var(--cnvs-sys-space-x2) 0;" }
+}, "information-highlight-body-91094c");
+exports.Body = (0, common_1.createComponent)('p')({
+    displayName: 'Body',
+    Component: ({ ...elemProps }, ref, Element) => {
+        return (React.createElement(text_1.Text, { as: Element, ref: ref, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, informationHighlightBodyStencil()) }));
+    },
+});

package/dist/commonjs/InformationHighlight/lib/parts/Heading.d.ts

@@ -0,0 +1,6 @@
+import { ExtractProps } from '@workday/canvas-kit-react/common';
+import { Heading } from '@workday/canvas-kit-react/text';
+export interface InformationHighlightHeadingProps extends Partial<ExtractProps<typeof Heading, never>> {
+}
+export declare const InformationHighlightHeading: import("@workday/canvas-kit-react/common").ElementComponent<"h3", InformationHighlightHeadingProps>;
+//# sourceMappingURL=Heading.d.ts.map

package/dist/commonjs/InformationHighlight/lib/parts/Heading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../../../../InformationHighlight/lib/parts/Heading.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,YAAY,EAAC,MAAM,kCAAkC,CAAC;AAG/E,OAAO,EAAC,OAAO,EAAC,MAAM,gCAAgC,CAAC;AAevD,MAAM,WAAW,gCACf,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,OAAO,EAAE,KAAK,CAAC,CAAC;CAAG;AAEzD,eAAO,MAAM,2BAA2B,qGAYtC,CAAC"}

package/dist/commonjs/InformationHighlight/lib/parts/Heading.js

@@ -0,0 +1,40 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InformationHighlightHeading = void 0;
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
+const text_1 = require("@workday/canvas-kit-react/text");
+const informationHighlightHeadingStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "jlfn1w", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-body-small);font-size:var(--cnvs-sys-font-size-body-small);letter-spacing:var(--cnvs-base-letter-spacing-200);color:var(--cnvs-sys-color-text-strong);grid-column:2;margin-top:var(--cnvs-sys-space-zero);margin-bottom:var(--cnvs-sys-space-zero);" }
+}, "information-highlight-heading-52c651");
+exports.InformationHighlightHeading = (0, common_1.createComponent)('h3')({
+    displayName: 'Heading',
+    Component: ({ size = 'small', ...elemProps }, ref, Element) => {
+        return (React.createElement(text_1.Heading, { as: Element, ref: ref, size: size, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, informationHighlightHeadingStencil()) }));
+    },
+});

package/dist/commonjs/InformationHighlight/lib/parts/Icon.d.ts

@@ -0,0 +1,12 @@
+import { SystemIcon } from '@workday/canvas-kit-react/icon';
+import { ExtractProps } from '@workday/canvas-kit-react/common';
+export interface IconProps extends Partial<ExtractProps<typeof SystemIcon, never>> {
+}
+export declare const Icon: import("@workday/canvas-kit-react/common").ElementComponentM<"span", IconProps, {
+    state: {
+        variant: "informational" | "caution" | "critical";
+        emphasis: "high" | "low";
+    };
+    events: {};
+}>;
+//# sourceMappingURL=Icon.d.ts.map

package/dist/commonjs/InformationHighlight/lib/parts/Icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../../InformationHighlight/lib/parts/Icon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,UAAU,EAAC,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAqB,YAAY,EAAC,MAAM,kCAAkC,CAAC;AAQlF,MAAM,WAAW,SAAU,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,UAAU,EAAE,KAAK,CAAC,CAAC;CAAG;AAOrF,eAAO,MAAM,IAAI;;;;;;EAYf,CAAC"}