@pantheon-systems/pds-toolkit-react 1.0.0-dev.214 → 1.0.0-dev.216

package/_dist/components/FlowSteps/FlowSteps.d.ts

@@ -0,0 +1,33 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import './flow-steps.css';
+export type FlowStep = {
+    /**
+     * The header text of the step
+     */
+    header: string | ReactNode;
+    /**
+     * The content of the step
+     */
+    content?: string | ReactNode;
+};
+/**
+ * Prop types for FlowSteps
+ */
+export interface FlowStepsProps extends ComponentPropsWithoutRef<'ol'> {
+    /**
+     * Alignment of the step content.
+     */
+    contentAlignment?: 'indented' | 'left';
+    /**
+     * The list of steps to display.
+     */
+    steps: FlowStep[];
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * FlowSteps UI component
+ */
+export declare const FlowSteps: ({ contentAlignment, steps, className, ...props }: FlowStepsProps) => React.JSX.Element;

package/_dist/components/FlowSteps/example-steps.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+export declare const stepsWithoutExtraContent: {
+    header: string;
+}[];
+export declare const stepsWithCode: ({
+    header: string;
+    content: React.JSX.Element;
+} | {
+    header: React.JSX.Element;
+    content: React.JSX.Element;
+})[];
+export declare const stepsWithText: {
+    header: string;
+    content: string;
+}[];

package/_dist/components/Icon/Icon.d.ts

@@ -85,6 +85,10 @@ declare const svgData: {
         readonly path: "M22.2 32A16 16 0 0 0 6 47.8a26.35 26.35 0 0 0 .2 2.8l67.9 412.1a21.77 21.77 0 0 0 21.3 18.2h325.7a16 16 0 0 0 16-13.4L505 50.7a16 16 0 0 0-13.2-18.3 24.58 24.58 0 0 0-2.8-.2L22.2 32zm285.9 297.8h-104l-28.1-147h157.3l-25.2 147z";
         readonly width: "512";
     };
+    readonly bluesky: {
+        readonly path: "M111.8 62.2C170.2 105.9 233 194.7 256 242.4c23-47.6 85.8-136.4 144.2-180.2c42.1-31.6 110.3-56 110.3 21.8c0 15.5-8.9 130.5-14.1 149.2C478.2 298 412 314.6 353.1 304.5c102.9 17.5 129.1 75.5 72.5 133.5c-107.4 110.2-154.3-27.6-166.3-62.9l0 0c-1.7-4.9-2.6-7.8-3.3-7.8s-1.6 3-3.3 7.8l0 0c-12 35.3-59 173.1-166.3 62.9c-56.5-58-30.4-116 72.5-133.5C100 314.6 33.8 298 15.7 233.1C10.4 214.4 1.5 99.4 1.5 83.9c0-77.8 68.2-53.4 110.3-21.8z";
+        readonly width: "512";
+    };
     readonly bolt: {
         readonly path: "M349.4 44.6c5.9-13.7 1.5-29.7-10.6-38.5s-28.6-8-39.9 1.8l-256 224c-10 8.8-13.6 22.9-8.9 35.3S50.7 288 64 288H175.5L98.6 467.4c-5.9 13.7-1.5 29.7 10.6 38.5s28.6 8 39.9-1.8l256-224c10-8.8 13.6-22.9 8.9-35.3s-16.6-20.7-30-20.7H272.5L349.4 44.6z";
         readonly width: "448";
@@ -429,6 +433,14 @@ declare const svgData: {
         readonly path: "M38.8 5.1C28.4-3.1 13.3-1.2 5.1 9.2S-1.2 34.7 9.2 42.9l592 464c10.4 8.2 25.5 6.3 33.7-4.1s6.3-25.5-4.1-33.7L532.4 392c45.4-28.2 75.6-78.6 75.6-136c0-88.4-71.6-160-160-160H384c-17.7 0-32 14.3-32 32s14.3 32 32 32h64c53 0 96 43 96 96c0 43.3-28.6 79.8-67.9 91.8L399.7 288H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H318.1l-81.7-64H256c17.7 0 32-14.3 32-32s-14.3-32-32-32H192c-11.3 0-22.3 1.2-32.9 3.4L38.8 5.1zM121 191.4L70.7 151.7C46.6 179.7 32 216.1 32 256c0 88.4 71.6 160 160 160h64c17.7 0 32-14.3 32-32s-14.3-32-32-32H192c-53 0-96-43-96-96c0-24.9 9.5-47.6 25-64.6z";
         readonly width: "640";
     };
+    readonly lock: {
+        readonly path: "M144 144l0 48 160 0 0-48c0-44.2-35.8-80-80-80s-80 35.8-80 80zM80 192l0-48C80 64.5 144.5 0 224 0s144 64.5 144 144l0 48 16 0c35.3 0 64 28.7 64 64l0 192c0 35.3-28.7 64-64 64L64 512c-35.3 0-64-28.7-64-64L0 256c0-35.3 28.7-64 64-64l16 0z";
+        readonly width: "448";
+    };
+    readonly lockOpen: {
+        readonly path: "M352 144c0-44.2 35.8-80 80-80s80 35.8 80 80l0 48c0 17.7 14.3 32 32 32s32-14.3 32-32l0-48C576 64.5 511.5 0 432 0S288 64.5 288 144l0 48L64 192c-35.3 0-64 28.7-64 64L0 448c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-192c0-35.3-28.7-64-64-64l-32 0 0-48z";
+        readonly width: "576";
+    };
     readonly magnifyingGlass: {
         readonly path: "M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z";
         readonly width: "512";
@@ -670,5 +682,5 @@ declare const svgData: {
         readonly width: "576";
     };
 };
-export declare const iconList: ("angleDown" | "angleLeft" | "angleRight" | "angleUp" | "anglesLeft" | "anglesRight" | "arrowDownToLine" | "arrowLeft" | "arrowRight" | "asterisk" | "banBug" | "bars" | "barsFilter" | "billboard" | "bitbucket" | "bolt" | "book" | "books" | "bracketRight" | "broomWide" | "building" | "buildings" | "calendarDays" | "ccAmex" | "ccDiscover" | "ccGeneric" | "ccMC" | "ccVisa" | "chartSimple" | "cloud" | "cloudArrowUp" | "cloudPlus" | "code" | "codeBranch" | "codeMerge" | "caretDown" | "caretLeft" | "caretRight" | "caretUp" | "chartLine" | "chartNetwork" | "check" | "circle" | "circleExclamation" | "circleCheck" | "circleInfo" | "circleMinus" | "circleMinusOutline" | "circleNotch" | "circlePlus" | "circlePlusOutline" | "circleQuestion" | "circleXmark" | "command" | "comment" | "copy" | "diamondExclamation" | "diamonds4" | "discourse" | "download" | "drupal" | "ellipsis" | "ellipsisVertical" | "emptySet" | "envelope" | "exclamation" | "externalLink" | "eye" | "eyeSlash" | "facebook" | "file" | "fileCheck" | "fileContract" | "fileCSV" | "fileDiff" | "fileExport" | "fileImport" | "fileLines" | "filePDF" | "fileZip" | "folder" | "gear" | "github" | "gitlab" | "globe" | "globeLine" | "graduationCap" | "grid" | "gripDots" | "gripDotsVertical" | "heart" | "house" | "idCard" | "instagram" | "keySkeleton" | "laptopCode" | "leaf" | "lifeRing" | "linkedin" | "linkSimple" | "linkSimpleSlash" | "magnifyingGlass" | "memo" | "messages" | "minus" | "moon" | "paperclip" | "paperPlane" | "pen" | "phone" | "play" | "plus" | "quotesLeft" | "quotesRight" | "rectangleList" | "rocketLaunch" | "robot" | "rotate" | "rotateClock" | "rss" | "save" | "server" | "shield" | "shovel" | "siren" | "sitemap" | "slack" | "slashForward" | "slidersSimple" | "snowflake" | "sparkles" | "squareCheck" | "squareCode" | "squareMinus" | "squarePen" | "squareQuestion" | "squareTerminal" | "star" | "sun" | "table" | "terminal" | "threads" | "thumbsDown" | "thumbsUp" | "trash" | "triangleExclamation" | "twitter" | "upload" | "user" | "userGear" | "userPlus" | "users" | "video" | "wavePulse" | "windowRestore" | "wordpress" | "wrench" | "xmark" | "xmarkLarge" | "xTwitter" | "youtube")[];
+export declare const iconList: ("angleDown" | "angleLeft" | "angleRight" | "angleUp" | "anglesLeft" | "anglesRight" | "arrowDownToLine" | "arrowLeft" | "arrowRight" | "asterisk" | "banBug" | "bars" | "barsFilter" | "billboard" | "bitbucket" | "bluesky" | "bolt" | "book" | "books" | "bracketRight" | "broomWide" | "building" | "buildings" | "calendarDays" | "ccAmex" | "ccDiscover" | "ccGeneric" | "ccMC" | "ccVisa" | "chartSimple" | "cloud" | "cloudArrowUp" | "cloudPlus" | "code" | "codeBranch" | "codeMerge" | "caretDown" | "caretLeft" | "caretRight" | "caretUp" | "chartLine" | "chartNetwork" | "check" | "circle" | "circleExclamation" | "circleCheck" | "circleInfo" | "circleMinus" | "circleMinusOutline" | "circleNotch" | "circlePlus" | "circlePlusOutline" | "circleQuestion" | "circleXmark" | "command" | "comment" | "copy" | "diamondExclamation" | "diamonds4" | "discourse" | "download" | "drupal" | "ellipsis" | "ellipsisVertical" | "emptySet" | "envelope" | "exclamation" | "externalLink" | "eye" | "eyeSlash" | "facebook" | "file" | "fileCheck" | "fileContract" | "fileCSV" | "fileDiff" | "fileExport" | "fileImport" | "fileLines" | "filePDF" | "fileZip" | "folder" | "gear" | "github" | "gitlab" | "globe" | "globeLine" | "graduationCap" | "grid" | "gripDots" | "gripDotsVertical" | "heart" | "house" | "idCard" | "instagram" | "keySkeleton" | "laptopCode" | "leaf" | "lifeRing" | "linkedin" | "linkSimple" | "linkSimpleSlash" | "lock" | "lockOpen" | "magnifyingGlass" | "memo" | "messages" | "minus" | "moon" | "paperclip" | "paperPlane" | "pen" | "phone" | "play" | "plus" | "quotesLeft" | "quotesRight" | "rectangleList" | "rocketLaunch" | "robot" | "rotate" | "rotateClock" | "rss" | "save" | "server" | "shield" | "shovel" | "siren" | "sitemap" | "slack" | "slashForward" | "slidersSimple" | "snowflake" | "sparkles" | "squareCheck" | "squareCode" | "squareMinus" | "squarePen" | "squareQuestion" | "squareTerminal" | "star" | "sun" | "table" | "terminal" | "threads" | "thumbsDown" | "thumbsUp" | "trash" | "triangleExclamation" | "twitter" | "upload" | "user" | "userGear" | "userPlus" | "users" | "video" | "wavePulse" | "windowRestore" | "wordpress" | "wrench" | "xmark" | "xmarkLarge" | "xTwitter" | "youtube")[];
 export {};

package/_dist/components/Modal/Modal.d.ts

@@ -24,7 +24,7 @@ export interface ModalProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * The width of the modal.
      */
-    size?: 'sm' | 'md' | 'lg';
+    size?: 'sm' | 'md' | 'lg' | 'xl';
     /**
      * Text for modal title
      */

package/_dist/components/inputs/TextInput/TextInput.d.ts

@@ -87,6 +87,10 @@ export interface TextInputProps extends ComponentPropsWithoutRef<'div'> {
      * Is this field required?
      */
     required?: boolean;
+    /**
+     * Icon to use when type is search.
+     */
+    searchIcon?: 'search' | 'filter';
     /**
      * Should the label be visible? If false, it will render for screen readers only.
      */

package/_dist/components/inputs/input-utilities.d.ts

@@ -57,7 +57,7 @@ export declare const InputMessage: ({ id, message, hasValidationMessage, validat
     validationStatus?: string;
     className?: string;
 }) => React.JSX.Element;
-type DecoratorVariants = 'search' | 'error' | 'success';
+type DecoratorVariants = 'search' | 'error' | 'success' | 'filter';
 export declare const InputDecorator: ({ variant }: {
     variant: DecoratorVariants;
 }) => React.JSX.Element;

package/_dist/css/component-css/pds-code-block.css

@@ -1 +1 @@
-.pds-code-block{--code-block-padding:1.25rem;--code-block-background:var(--pds-color-code-block-dark-background);--code-block-foreground:var(--pds-color-code-block-dark-foreground);--code-block-line-prefix:var(--pds-color-code-block-dark-line-prefix);--code-block-focus-color:var(--pds-color-interactive-reverse-focus);background-color:var(--code-block-background);border-radius:.375rem;display:flex;font-family:var(--pds-typography-font-code);font-size:.9rem;font-weight:400;justify-content:space-between;line-height:165%}.pds-code-block__code{flex-grow:1;margin:0;overflow:auto;padding:1.25rem}.pds-code-block__code:focus-visible{border-radius:.375rem;outline:2px solid var(--code-block-focus-color)}.pds-code-block__code .token.plain{color:var(--code-block-foreground)}.pds-code-block__line{column-gap:.64rem;display:table-row}.pds-code-block__number,.pds-code-block__prompt{color:var(--code-block-line-prefix);display:table-cell;padding-inline-end:1rem;text-align:right}.pds-code-block__copy{padding:.8rem}.pds-code-block--dark{--code-block-background:var(--pds-color-code-block-dark-background);--code-block-foreground:var(--pds-color-code-block-dark-foreground);--code-block-line-prefix:var(--pds-color-code-block-dark-line-prefix);--code-block-focus-color:var(--pds-color-interactive-reverse-focus)}.pds-code-block--light{--code-block-background:var(--pds-color-code-block-light-background);--code-block-foreground:var(--pds-color-code-block-light-foreground);--code-block-line-prefix:var(--pds-color-code-block-light-line-prefix);--code-block-focus-color:var(--pds-color-interactive-focus)}.pds-code-block--light button.pds-clipboard-button{color:var(--pds-color-code-block-light-foreground)}.pds-code-block--light button.pds-clipboard-button:hover{background-color:var(--pds-color-code-block-light-highlight)}.pds-code-block--light button.pds-clipboard-button:active{background-color:#d0d2d5}
+.pds-code-block{--code-block-padding:1.25rem;--code-block-background:var(--pds-color-code-block-dark-background);--code-block-foreground:var(--pds-color-code-block-dark-foreground);--code-block-line-prefix:var(--pds-color-code-block-dark-line-prefix);--code-block-focus-color:var(--pds-color-interactive-reverse-focus);display:flex;font-family:var(--pds-typography-font-code);font-size:.9rem;font-weight:400;justify-content:space-between;line-height:165%}.pds-code-block,pre.pds-code-block__code{background-color:var(--code-block-background);border-radius:.375rem}pre.pds-code-block__code{flex-grow:1;margin:0;overflow:auto;padding:1.25rem}pre.pds-code-block__code:focus-visible{outline:2px solid var(--code-block-focus-color)}pre.pds-code-block__code .token.plain{color:var(--code-block-foreground)}.pds-code-block__line{column-gap:.64rem;display:table-row}.pds-code-block__number,.pds-code-block__prompt{color:var(--code-block-line-prefix);display:table-cell;padding-inline-end:1rem;text-align:right}.pds-code-block__copy{padding:.8rem}.pds-code-block--dark{--code-block-background:var(--pds-color-code-block-dark-background);--code-block-foreground:var(--pds-color-code-block-dark-foreground);--code-block-line-prefix:var(--pds-color-code-block-dark-line-prefix);--code-block-focus-color:var(--pds-color-interactive-reverse-focus)}.pds-code-block--light{--code-block-background:var(--pds-color-code-block-light-background);--code-block-foreground:var(--pds-color-code-block-light-foreground);--code-block-line-prefix:var(--pds-color-code-block-light-line-prefix);--code-block-focus-color:var(--pds-color-interactive-focus);font-weight:600}.pds-code-block--light button.pds-clipboard-button{color:var(--pds-color-code-block-light-foreground)}.pds-code-block--light button.pds-clipboard-button:hover{background-color:var(--pds-color-code-block-light-highlight)}.pds-code-block--light button.pds-clipboard-button:active{background-color:#d0d2d5}

package/_dist/css/component-css/pds-flow-steps.css

@@ -0,0 +1 @@
+ol.pds-flow-steps{display:flex;flex-direction:column;list-style:none;padding:0;row-gap:2.441rem}ol.pds-flow-steps--indented li{column-gap:.512rem;display:flex}.pds-flow-steps__header{font-size:1rem;font-weight:600;line-height:140%}.pds-flow-steps__number{align-items:center;background-color:var(--pds-color-background-reverse);border-radius:50%;color:var(--pds-color-foreground-reverse);display:flex;flex-shrink:0;font-family:Poppins,sans-serif;font-size:.833rem;font-weight:600;height:1.25rem;justify-content:center;line-height:90%;padding:1px;width:1.25rem}.pds-flow-steps__number span{padding-block-start:1px}.pds-flow-steps__content{padding-block-start:.8rem}.pds-flow-steps__header-group{column-gap:.512rem;display:flex}.pds-flow-steps__content-group{width:100%}