@pantheon-systems/pds-toolkit-react 1.0.0-dev.195 → 1.0.0-dev.197

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@pantheon-systems/pds-toolkit-react",
 	"technology": "React",
-	"version": "1.0.0-dev.195",
+	"version": "1.0.0-dev.197",
 	"description": "PDS toolkit built using the React framework",
 	"repository": {
 		"type": "git",

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

@@ -1,35 +0,0 @@
-export function InputFormatted({ disabled, formatting, hasClearButton, id, initialValue, label, message, onChange, placeholder, required, showLabel, validationFunction, className, ...props }: {
-    [x: string]: any;
-    disabled?: boolean;
-    formatting: any;
-    hasClearButton?: boolean;
-    id: any;
-    initialValue?: string;
-    label: any;
-    message: any;
-    onChange: any;
-    placeholder: any;
-    required?: boolean;
-    showLabel?: boolean;
-    validationFunction: any;
-    className: any;
-}): React.JSX.Element;
-export namespace InputFormatted {
-    namespace propTypes {
-        let disabled: PropTypes.Requireable<boolean>;
-        let formatting: PropTypes.Validator<string>;
-        let id: PropTypes.Validator<string>;
-        let hasClearButton: PropTypes.Requireable<boolean>;
-        let initialValue: PropTypes.Requireable<string>;
-        let label: PropTypes.Validator<string>;
-        let message: PropTypes.Requireable<string>;
-        let onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        let placeholder: PropTypes.Requireable<string>;
-        let required: PropTypes.Requireable<boolean>;
-        let showLabel: PropTypes.Requireable<boolean>;
-        let validationFunction: PropTypes.Requireable<(...args: any[]) => any>;
-        let className: PropTypes.Requireable<string>;
-    }
-}
-import React from 'react';
-import PropTypes from 'prop-types';

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

@@ -1,33 +0,0 @@
-export function InputObscured({ counterFunction, disabled, hasClearButton, id, initialValue, label, message, onChange, required, showLabel, validationFunction, className, ...props }: {
-    [x: string]: any;
-    counterFunction?: () => void;
-    disabled?: boolean;
-    hasClearButton?: boolean;
-    id: any;
-    initialValue?: string;
-    label: any;
-    message: any;
-    onChange: any;
-    required?: boolean;
-    showLabel?: boolean;
-    validationFunction: any;
-    className: any;
-}): React.JSX.Element;
-export namespace InputObscured {
-    namespace propTypes {
-        let counterFunction: PropTypes.Requireable<(...args: any[]) => any>;
-        let disabled: PropTypes.Requireable<boolean>;
-        let hasClearButton: PropTypes.Requireable<boolean>;
-        let id: PropTypes.Validator<string>;
-        let initialValue: PropTypes.Requireable<string>;
-        let label: PropTypes.Validator<string>;
-        let message: PropTypes.Requireable<string>;
-        let onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        let required: PropTypes.Requireable<boolean>;
-        let showLabel: PropTypes.Requireable<boolean>;
-        let validationFunction: PropTypes.Requireable<(...args: any[]) => any>;
-        let className: PropTypes.Requireable<string>;
-    }
-}
-import React from 'react';
-import PropTypes from 'prop-types';

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

@@ -1,75 +0,0 @@
-export function InputText({ autoComplete, counterFunction, disabled, hasClearButton, hasSearchShortcut, id, initialValue, inputWidth, label, labelStrings, message, onChange, onFocus, placeholder, readonly, required, showLabel, specialFormatting, specialFormattingValidation, toggleVisibility, type, validationFunction, validationMessages, className, ...props }: {
-    [x: string]: any;
-    autoComplete?: string;
-    counterFunction?: () => void;
-    disabled?: boolean;
-    hasClearButton?: boolean;
-    hasSearchShortcut?: boolean;
-    id: any;
-    initialValue?: string;
-    inputWidth: any;
-    label: any;
-    labelStrings?: {
-        clearButton: string;
-        searchShortcut: string;
-        visibilityStatus: string;
-        visibilityToggleHide: string;
-        visibilityToggleShow: string;
-    };
-    message: any;
-    onChange: any;
-    onFocus: any;
-    placeholder: any;
-    readonly?: boolean;
-    required?: boolean;
-    showLabel?: boolean;
-    specialFormatting: any;
-    specialFormattingValidation?: boolean;
-    toggleVisibility?: boolean;
-    type?: string;
-    validationFunction: any;
-    validationMessages?: {
-        creditCardError: string;
-        phoneError: string;
-    };
-    className: any;
-}): React.JSX.Element;
-export namespace InputText {
-    namespace propTypes {
-        let autoComplete: PropTypes.Requireable<string>;
-        let counterFunction: PropTypes.Requireable<(...args: any[]) => any>;
-        let disabled: PropTypes.Requireable<boolean>;
-        let hasClearButton: PropTypes.Requireable<boolean>;
-        let hasSearchShortcut: PropTypes.Requireable<boolean>;
-        let id: PropTypes.Validator<string>;
-        let initialValue: PropTypes.Requireable<string>;
-        let inputWidth: PropTypes.Requireable<number>;
-        let label: PropTypes.Validator<string>;
-        let labelStrings: PropTypes.Requireable<PropTypes.InferProps<{
-            clearButton: PropTypes.Requireable<string>;
-            searchShortcut: PropTypes.Requireable<string>;
-            visibilityStatus: PropTypes.Requireable<string>;
-            visibilityToggleHide: PropTypes.Requireable<string>;
-            visibilityToggleShow: PropTypes.Requireable<string>;
-        }>>;
-        let message: PropTypes.Requireable<string>;
-        let onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        let onFocus: PropTypes.Requireable<(...args: any[]) => any>;
-        let placeholder: PropTypes.Requireable<string>;
-        let readonly: PropTypes.Requireable<boolean>;
-        let required: PropTypes.Requireable<boolean>;
-        let showLabel: PropTypes.Requireable<boolean>;
-        let specialFormatting: PropTypes.Requireable<string>;
-        let specialFormattingValidation: PropTypes.Requireable<boolean>;
-        let toggleVisibility: PropTypes.Requireable<boolean>;
-        let type: PropTypes.Requireable<string>;
-        let validationFunction: PropTypes.Requireable<(...args: any[]) => any>;
-        let validationMessages: PropTypes.Requireable<PropTypes.InferProps<{
-            creditCardError: PropTypes.Requireable<string>;
-            phoneError: PropTypes.Requireable<string>;
-        }>>;
-        let className: PropTypes.Requireable<string>;
-    }
-}
-import React from 'react';
-import PropTypes from 'prop-types';

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

@@ -1,5 +0,0 @@
-/**
- * InputWrapper UI component
- */
-export const InputWrapper: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';

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

@@ -1,33 +0,0 @@
-export function ToggleSwitch({ disabled, id, inputWidth, label, message, onChange, required, showLabel, showStatusLabel, statusOnLabel, statusOffLabel, className, ...props }: {
-    [x: string]: any;
-    disabled?: boolean;
-    id: any;
-    inputWidth: any;
-    label: any;
-    message: any;
-    onChange: any;
-    required?: boolean;
-    showLabel?: boolean;
-    showStatusLabel?: boolean;
-    statusOnLabel?: string;
-    statusOffLabel?: string;
-    className: any;
-}): React.JSX.Element;
-export namespace ToggleSwitch {
-    namespace propTypes {
-        let disabled: PropTypes.Requireable<boolean>;
-        let id: PropTypes.Validator<string>;
-        let inputWidth: PropTypes.Requireable<number>;
-        let label: PropTypes.Validator<string>;
-        let message: PropTypes.Requireable<string>;
-        let onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        let required: PropTypes.Requireable<boolean>;
-        let showLabel: PropTypes.Requireable<boolean>;
-        let showStatusLabel: PropTypes.Requireable<boolean>;
-        let statusOffLabel: PropTypes.Requireable<string>;
-        let statusOnLabel: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
-}
-import React from 'react';
-import PropTypes from 'prop-types';

package/_dist/components/inputs/inputs-common.d.ts

@@ -1,40 +0,0 @@
-export namespace cssClassesList {
-    let error: string;
-    let success: string;
-    let required: string;
-    let disabled: string;
-}
-export function ClearButton({ id, label, handleClearInput }: {
-    id: any;
-    label: any;
-    handleClearInput: any;
-}): React.JSX.Element;
-export namespace ClearButton {
-    namespace propTypes {
-        let id: PropTypes.Validator<string>;
-        let label: PropTypes.Validator<string>;
-        let handleClearInput: PropTypes.Requireable<(...args: any[]) => any>;
-    }
-}
-export function Decorator({ type }: {
-    type: any;
-}): React.JSX.Element;
-export namespace Decorator {
-    export namespace propTypes_1 {
-        let type: PropTypes.Validator<string>;
-    }
-    export { propTypes_1 as propTypes };
-}
-export function SearchShortcut({ label }: {
-    label: any;
-}): React.JSX.Element;
-export namespace SearchShortcut {
-    export namespace propTypes_2 {
-        let label_1: PropTypes.Validator<string>;
-        export { label_1 as label };
-    }
-    export { propTypes_2 as propTypes };
-}
-export const SelectOption: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
-import PropTypes from 'prop-types';

package/_dist/css/component-css/pds-input-text.css

@@ -1 +0,0 @@
-.pds-input-field--text{border:.0625rem solid var(--pds-color-input-border-default);border-radius:.1875rem;height:2.441rem;padding-inline:.64rem}.pds-input-field--text>input{background-color:transparent;border:none;caret-color:var(--pds-color-input-foreground-default);color:var(--pds-color-input-foreground-default);flex-grow:1;line-height:1;padding-inline:0}.pds-input-field--text>input:focus{outline:none}.pds-input-field--text>input::placeholder{color:var(--pds-color-input-placeholder-text)}.pds-input__clear,.pds-input__visibility-toggle{background-color:transparent;border:none;border-radius:.1875rem;display:flex;padding:.328rem}.pds-input__clear:hover,.pds-input__visibility-toggle:hover{background-color:var(--pds-color-icon-button-standard-background-hover)}.pds-input__clear:focus-visible,.pds-input__visibility-toggle:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus)}.pds-input__visibility-toggle{display:flex;justify-content:center;width:1.953rem}

package/_dist/css/component-css/pds-input-wrapper.css

@@ -1 +0,0 @@
-.pds-input-wrapper{font-family:Poppins,sans-serif;font-size:1rem;position:relative}.pds-input-field__decorator{align-items:center;display:flex}.pds-input-field__decorator svg{pointer-events:none}.pds-input-label{color:var(--pds-color-text-default);display:flex;font-size:1rem;font-weight:600;margin-block-end:.512rem;padding-inline-end:3.052rem;position:relative}.pds-input-label.visually-hidden{margin:0;padding:0}.pds-input-field{align-items:center;box-sizing:border-box;display:flex;gap:.64rem;transition:background-color .2s ease-in-out 0s,border-color .2s ease-in-out 0s}.pds-input-field:focus-within{border-color:var(--pds-color-interactive-focus);outline:none;transition:outline .2s ease-in-out 0s}fieldset.pds-input-field{border:none;margin-block-end:.64rem;margin-inline:0;padding:0;padding-block-start:.328rem}.pds-input-field__message{color:var(--pds-color-text-default-secondary);font-size:.833rem;font-weight:400;line-height:140%;margin-block-start:.512rem}.pds-input-field__message--before{margin-block-end:.41rem}.pds-input-wrapper.pds-is-disabled .pds-input-field:not(fieldset),.pds-input-wrapper.pds-is-disabled .pds-input-label{opacity:50%}.pds-input-wrapper.pds-is-readonly .pds-input-field{background-color:var(--pds-color-background-default-secondary)}.pds-input-label__required{color:var(--pds-color-semantic-critical-foreground);height:.512rem;margin-inline-start:.25rem}.pds-input-wrapper.pds-has-error .pds-input-field{background-color:var(--pds-color-input-background-critical);border-color:var(--pds-color-input-foreground-critical)}.pds-input-wrapper.pds-has-error .pds-input-field__decorator,.pds-input-wrapper.pds-has-error .pds-input-field__message,.pds-input-wrapper.pds-has-error .pds-input-label,.pds-input-wrapper.pds-has-error .pds-input-text{color:var(--pds-color-input-foreground-critical)}.pds-input-wrapper.pds-has-success .pds-input-field{border-color:var(--pds-color-input-foreground-success)}.pds-input-wrapper.pds-has-success .pds-input-field__decorator,.pds-input-wrapper.pds-has-success .pds-input-field__message{color:var(--pds-color-input-foreground-success)}.pds-input__counter{color:var(--pds-color-text-default-secondary);font-size:.833rem;font-weight:400}.pds-input-field input::-webkit-search-cancel-button{display:none}.pds-input-field input:-internal-autofill-selected,.pds-input-field input:-webkit-autofill{box-shadow:inset 0 0 0 1px hsla(0,0%,100%,0),inset 0 0 0 100px var(--pds-color-background-default);-webkit-text-fill-color:var(--pds-color-foreground-default)}.pds-has-error .pds-input-field input:-internal-autofill-selected,.pds-has-error .pds-input-field input:-webkit-autofill{box-shadow:inset 0 0 0 1px hsla(0,0%,100%,0),inset 0 0 0 100px var(--pds-color-input-background-critical);-webkit-text-fill-color:var(--pds-color-input-foreground-critical)}

package/_dist/css/component-css/pds-inputs-common-deprecated.css

@@ -1 +0,0 @@
-.pds-input-field{font-family:Poppins,sans-serif;font-size:1rem}.pds-input-label,label{color:var(--pds-color-text-default);display:block;font-size:1rem;font-weight:600;margin-block-end:.512rem;position:relative}.pds-checkbox label,.pds-radio-group__option label{font-size:1rem}.pds-input-fieldset{border:none;margin-inline:0;padding:0;padding-block-start:.328rem}.pds-input-field__message{color:var(--pds-color-text-default-secondary);font-size:.833rem;font-weight:400;margin-block-start:.512rem}.pds-input-field__input-wrapper{align-items:center;border-color:var(--pds-color-input-border-default);border-radius:.1875rem;border-style:solid;border-width:.0625rem;box-sizing:border-box;display:flex;gap:.64rem;height:2.441rem;padding-inline:.64rem;transition:background-color .2s ease-in-out 0s,border-color .2s ease-in-out 0s}.pds-input-formatted--phone .pds-input-field__input-wrapper{max-width:16rem}.pds-input-formatted--credit-card .pds-input-field__input-wrapper{max-width:20rem}.pds-input-field__input{background-color:transparent;border:none;caret-color:var(--pds-color-input-foreground-default);color:var(--pds-color-input-foreground-default);flex-grow:1;line-height:1;padding-inline:0}.pds-input-field__input:focus{outline:none}.pds-input-field__input::placeholder{color:var(--pds-color-input-placeholder-text)}.pds-input-field__accessories,.pds-input-field__decorators{align-items:center;display:flex;gap:.512rem;height:2.441rem}.pds-input-field__accessory{background:transparent;border:0;display:flex;padding:0}.pds-input-field__search-shortcut{align-items:center;background:var(--pds-color-icon-button-standard-background-hover);border-radius:.1875rem;display:flex;height:.64rem;justify-content:center;margin-inline-end:-.25rem;padding:.512rem;width:.64rem}.pds-input-obscured__toggle,.pds-input__clear{border-radius:.1875rem;padding:.1875rem}.pds-input-obscured__toggle:hover,.pds-input__clear:hover{background-color:var(--pds-color-input-action-background-hover)}.pds-input-obscured__toggle:focus-visible,.pds-input__clear:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus)}.pds-input-obscured__toggle svg,.pds-input__clear svg{color:var(--pds-color-input-foreground-default)}.pds-input-field__counter{color:var(--pds-color-text-default-secondary)}.pds-input-field.pds-is-disabled .pds-input-field__input-wrapper,.pds-input-field.pds-is-disabled label,.pds-input-field.pds-is-disabled legend{border-color:var(--pds-color-input-border-default);opacity:50%;outline:none}.pds-input-field.pds-is-required .pds-input-label:after{color:var(--pds-color-input-foreground-critical);content:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="10" fill="none"><path fill="%23D61F1F" d="M4.547.875v3.281l1.855-1.113.547-.332.625 1.074-.527.313L5.133 5.25l1.914 1.152.527.332L6.95 7.81l-.547-.332-1.855-1.114v3.262h-1.25V6.363L1.422 7.477l-.527.332L.25 6.734l.527-.332L2.691 5.25.777 4.098.25 3.785l.645-1.074.527.332 1.875 1.113V.875z"/></svg>');margin-inline-start:.328rem;position:relative;top:-.328rem}.pds-input-field.pds-has-error .pds-input-field__decorator,.pds-input-field.pds-has-error .pds-input-field__input,.pds-input-field.pds-has-error .pds-input-field__message,.pds-input-field.pds-has-error .pds-input-label{color:var(--pds-color-input-foreground-critical)}.pds-input-field.pds-has-error .pds-input-field__input-wrapper{background-color:var(--pds-color-input-background-critical);border-color:var(--pds-color-input-foreground-critical)}.pds-input-field.pds-has-success .pds-input-field__decorator{color:var(--pds-color-input-foreground-success)}.pds-input-field.pds-has-success .pds-input-field__input-wrapper{border-color:var(--pds-color-input-border-success)}.pds-input-field input::-webkit-search-cancel-button{display:none}.pds-input-field input:-internal-autofill-selected,.pds-input-field input:-webkit-autofill{box-shadow:inset 0 0 0 1px hsla(0,0%,100%,0),inset 0 0 0 100px var(--pds-color-background-default);-webkit-text-fill-color:var(--pds-color-foreground-default)}.pds-input-field.pds-has-error input:-internal-autofill-selected,.pds-input-field.pds-has-error input:-webkit-autofill{box-shadow:inset 0 0 0 1px hsla(0,0%,100%,0),inset 0 0 0 100px var(--pds-color-input-background-critical);-webkit-text-fill-color:var(--pds-color-input-foreground-critical)}

package/_dist/css/component-css/pds-inputs-common.css

@@ -1 +0,0 @@
-.pds-input__option{align-items:center;background-color:var(--pds-color-menu-item-background-default);color:var(--pds-color-menu-item-foreground);cursor:pointer;display:flex;gap:1rem;justify-content:space-between;margin:0;padding-block:.64rem;padding-inline:.8rem}.pds-input__option--active,.pds-input__option:focus-visible,.pds-input__option:hover,.pds-input__option[aria-selected=true]{background-color:var(--pds-color-menu-item-background-hover);outline:none}.pds-input__clear{align-items:center;background-color:transparent;border:none;border-radius:.1875rem;color:var(--pds-color-text-default-secondary);display:flex;height:1.563rem}.pds-input__clear:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus)}.pds-input__search-shortcut{align-items:center;background:var(--pds-color-icon-button-standard-background-hover);border-radius:.1875rem;display:flex;height:.64rem;justify-content:center;margin-inline-end:-.25rem;padding:.512rem;width:.64rem}

package/_dist/css/component-css/pds-toggle-switch.css

@@ -1,3 +0,0 @@
-.pds-toggle-switch{--pds-toggle-switch-width:2.625rem;--pds-toggle-switch-height:1.375rem;--pds-toggle-switch-border-width:0.125rem;--pds-toggle-switch-animation:var(
-			--pds-animation-transition-default-duration
-		) var(--pds-animation-transition-default-timing-function) var(--pds-animation-transition-default-delay);margin-block-start:.64rem}.pds-input-wrapper--toggle-switch .pds-input-label+.pds-input-field__message--before{margin-block-start:-.25rem}.pds-toggle-switch__toggle{align-items:center;background:none;border:none;color:var(--pds-color-foreground-default);display:flex;line-height:1;padding:0;position:relative}.pds-toggle__label{font-size:1rem;left:calc(var(--pds-toggle-switch-width) + .512rem);position:absolute;transition:var(--pds-toggle-switch-animation)}.pds-toggle-switch__toggle[aria-checked=false] .pds-toggle__label--off{opacity:1}.pds-toggle-switch__toggle[aria-checked=false] .pds-toggle__label--on{opacity:0}.pds-toggle-switch__toggle[aria-checked=true] .pds-toggle__label--on{opacity:1}.pds-toggle-switch__toggle[aria-checked=true] .pds-toggle__label--off{opacity:0}.pds-toggle-switch__toggle:before{border-radius:6.25rem;content:"";height:var(--pds-toggle-switch-height);margin-inline-end:.512rem;width:var(--pds-toggle-switch-width)}.pds-toggle-switch__toggle[aria-checked=false]:before{background-color:var(--pds-color-input-toggle-switch-off)}.pds-toggle-switch__toggle[aria-checked=true]:before{background-color:var(--pds-color-input-toggle-switch-on)}.pds-toggle-switch__toggle:after{background-color:var(--pds-color-background-default);border-radius:100%;border-style:solid;border-width:var(--pds-toggle-switch-border-width);content:"";height:calc(var(--pds-toggle-switch-height) - var(--pds-toggle-switch-border-width)*2);position:absolute;width:calc(var(--pds-toggle-switch-height) - var(--pds-toggle-switch-border-width)*2);z-index:1}.pds-toggle-switch__toggle[aria-checked=false]:after,.pds-toggle-switch__toggle[aria-checked=true]:after{transition:var(--pds-toggle-switch-animation)}.pds-toggle-switch__toggle[aria-checked=false]:after{border-color:var(--pds-color-input-toggle-switch-off);left:0}.pds-toggle-switch__toggle[aria-checked=true]:after{border-color:var(--pds-color-input-toggle-switch-on);left:calc(var(--pds-toggle-switch-height) - var(--pds-toggle-switch-border-width))}.pds-toggle-switch__off-icon,.pds-toggle-switch__on-icon{color:var(--pds-color-input-toggle-switch-icon);position:absolute;transition:var(--pds-toggle-switch-animation)}.pds-toggle-switch__off-icon{right:calc(var(--pds-toggle-switch-border-width) + .8625rem)}.pds-toggle-switch__on-icon{left:calc(var(--pds-toggle-switch-border-width) + .328rem)}.pds-toggle-switch__toggle[aria-checked=false] .pds-toggle-switch__off-icon{opacity:1;transition:var(--pds-toggle-switch-animation);z-index:2}.pds-toggle-switch__toggle[aria-checked=false] .pds-toggle-switch__on-icon{opacity:0}.pds-toggle-switch__toggle[aria-checked=true] .pds-toggle-switch__on-icon{opacity:1;transition:var(--pds-toggle-switch-animation);z-index:2}.pds-toggle-switch__toggle[aria-checked=true] .pds-toggle-switch__off-icon{opacity:0}.pds-toggle-switch__toggle:focus{outline:none}.pds-toggle-switch__toggle:focus-visible:before{outline:.0625rem solid var(--pds-color-input-toggle-background-on);outline-offset:.0625rem}.pds-toggle-switch.pds-is-disabled .pds-toggle-switch__toggle{cursor:not-allowed;opacity:50%}