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

package/_dist/components/BranchDiff/BranchDiff.d.ts

@@ -0,0 +1,35 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import './branch-diff.css';
+/**
+ * Prop types for BranchDiff
+ */
+export interface BranchDiffProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * The number of commits the current branch is ahead of its upstream branch.
+     */
+    numberAhead: number;
+    /**
+     * A description for the `numberAhead` value.
+     */
+    numberAheadDescription?: string;
+    /**
+     * The number of commits the current branch is behind its upstream branch.
+     */
+    numberBehind: number;
+    /**
+     * A description for the `numberBehind` value.
+     */
+    numberBehindDescription?: string;
+    /**
+     * Custom width in rems for the component. This will override the default.
+     */
+    componentWidth?: number;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * BranchDiff UI component
+ */
+export declare const BranchDiff: ({ numberAhead, numberAheadDescription, numberBehind, numberBehindDescription, componentWidth, className, ...props }: BranchDiffProps) => React.JSX.Element;

package/_dist/components/FileDiff/FileDiff.d.ts

@@ -0,0 +1,35 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import './file-diff.css';
+/**
+ * Prop types for FileDiff
+ */
+export interface FileDiffProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     *  Number of added lines (green bar).
+     */
+    additions: number;
+    /**
+     * Number of removed lines (red bar).
+     */
+    deletions: number;
+    /**
+     * Object with strings for tooltips and screen reader labels.
+     */
+    labelStrings?: {
+        linesChanged?: string;
+        additions?: string;
+        deletions?: string;
+    };
+    /**
+     * Custom width in rems for the component. This will override the default.
+     */
+    componentWidth?: number;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * FileDiff UI component
+ */
+export declare const FileDiff: ({ additions, deletions, labelStrings, className, componentWidth, ...props }: FileDiffProps) => React.JSX.Element;

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

@@ -151,6 +151,10 @@ declare const svgData: {
         readonly path: "M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128H144zm79-217c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l39-39V392c0 13.3 10.7 24 24 24s24-10.7 24-24V257.9l39 39c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-80-80c-9.4-9.4-24.6-9.4-33.9 0l-80 80z";
         readonly width: "640";
     };
+    readonly cloudPlus: {
+        readonly path: "M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128l-368 0zM296 376c0 13.3 10.7 24 24 24s24-10.7 24-24l0-64 64 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-64 0 0-64c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 64-64 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l64 0 0 64z";
+        readonly width: "640";
+    };
     readonly code: {
         readonly path: "M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z";
         readonly width: "640";
@@ -636,5 +640,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" | "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" | "fileContract" | "fileCSV" | "fileExport" | "fileImport" | "filePDF" | "folder" | "gear" | "github" | "gitlab" | "globe" | "globeLine" | "graduationCap" | "grid" | "gripDots" | "gripDotsVertical" | "heart" | "house" | "idCard" | "instagram" | "keySkeleton" | "laptopCode" | "leaf" | "lifeRing" | "linkedin" | "linkSimple" | "linkSimpleSlash" | "magnifyingGlass" | "messages" | "minus" | "moon" | "paperclip" | "paperPlane" | "pen" | "phone" | "play" | "plus" | "quotesLeft" | "quotesRight" | "rectangleList" | "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" | "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" | "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" | "fileContract" | "fileCSV" | "fileExport" | "fileImport" | "filePDF" | "folder" | "gear" | "github" | "gitlab" | "globe" | "globeLine" | "graduationCap" | "grid" | "gripDots" | "gripDotsVertical" | "heart" | "house" | "idCard" | "instagram" | "keySkeleton" | "laptopCode" | "leaf" | "lifeRing" | "linkedin" | "linkSimple" | "linkSimpleSlash" | "magnifyingGlass" | "messages" | "minus" | "moon" | "paperclip" | "paperPlane" | "pen" | "phone" | "play" | "plus" | "quotesLeft" | "quotesRight" | "rectangleList" | "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" | "trash" | "triangleExclamation" | "twitter" | "upload" | "user" | "userGear" | "userPlus" | "users" | "video" | "wavePulse" | "windowRestore" | "wordpress" | "wrench" | "xmark" | "xmarkLarge" | "xTwitter" | "youtube")[];
 export {};

package/_dist/components/RefreshChecker/RefreshChecker.d.ts

@@ -0,0 +1,46 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import './refresh-checker.css';
+/**
+ * Enum for RefreshChecker states
+ */
+export declare enum RefreshCheckerState {
+    DEFAULT = "default",
+    WORKING = "working",
+    CHECKED = "checked"
+}
+/**
+ * Prop types for RefreshChecker
+ */
+interface RefreshCheckerProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Custom width in rems for the component. This will override the default.
+     */
+    componentWidth?: number;
+    /**
+     * Internationalization props for labels
+     */
+    labelStrings?: {
+        checkForUpdates?: string;
+        checking?: string;
+        checked?: string;
+        tooltipContent?: string;
+        ariaLabel?: string;
+    };
+    /**
+     * Last checked timestamp
+     */
+    lastChecked?: Date;
+    /**
+     * Callback function when check is triggered
+     */
+    onCheck?: () => Promise<void>;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * RefreshChecker UI component
+ */
+export declare const RefreshChecker: ({ componentWidth, labelStrings, lastChecked, onCheck, className, ...props }: RefreshCheckerProps) => React.JSX.Element;
+export {};

package/_dist/components/badges/IndicatorBadge/IndicatorBadge.d.ts

@@ -15,7 +15,7 @@ export interface IndicatorBadgeProps extends ComponentPropsWithoutRef<'span'> {
     /**
      * Badge size
      */
-    size: 'sm' | 'md';
+    size?: 'sm' | 'md';
     /**
      * Additional class names
      */

package/_dist/components/buttons/IconButton/IconButton.d.ts

@@ -37,7 +37,7 @@ interface IconButtonProps extends ComponentPropsWithoutRef<'button'> {
     /**
      * Which variant of button to render.
      */
-    variant?: 'standard' | 'critical';
+    variant?: 'standard' | 'critical' | 'critical-hover';
     /**
      * Additional class names.
      */

package/_dist/components/buttons/MenuButton/MenuButton.d.ts

@@ -1,6 +1,5 @@
-export function MenuButton({ avatarImageSrc, disabled, displayType, iconName, id, isSplitButton, label, menuItems, menuPosition, size, testId, undefinedLabel, variant, withinNavbar, className, ...props }: {
+export function MenuButton({ disabled, displayType, iconName, id, isSplitButton, label, menuItems, menuPosition, size, testId, undefinedLabel, variant, withinNavbar, className, ...props }: {
     [x: string]: any;
-    avatarImageSrc: any;
     disabled: any;
     displayType?: string;
     iconName?: string;
@@ -18,7 +17,6 @@ export function MenuButton({ avatarImageSrc, disabled, displayType, iconName, id
 }): React.JSX.Element;
 export namespace MenuButton {
     namespace propTypes {
-        export let avatarImageSrc: PropTypes.Requireable<string>;
         export let disabled: PropTypes.Requireable<boolean>;
         export let displayType: PropTypes.Requireable<string>;
         export { PDSIcon as iconName };

package/_dist/components/navigation/NavMenu/NavMenu.d.ts

@@ -1,19 +1,43 @@
-export function NavMenu({ ariaLabel, colorType, menuItems, mobileMenuMaxWidth, className, ...props }: {
-    [x: string]: any;
-    ariaLabel?: string;
-    colorType?: string;
-    menuItems: any;
+import React, { ComponentPropsWithoutRef } from 'react';
+import './nav-menu.css';
+/**
+ * Prop types for MenuItem
+ */
+export interface MenuItem {
+    id?: string;
+    label: string;
+    links?: MenuItem[];
+    linkContent?: React.ReactNode;
+    isActive?: boolean;
+    isSeparator?: boolean;
+}
+/**
+ * Prop types for NavMenu
+ */
+interface NavMenuProps extends ComponentPropsWithoutRef<'nav'> {
+    /**
+     * Aria label for `nav` element.
+     */
+    ariaLabel: string;
+    /**
+     * Color scheme.
+     */
+    colorType?: 'default' | 'reverse';
+    /**
+     * Menu Items.
+     */
+    menuItems?: MenuItem[];
+    /**
+     *  Mobile menu will be enabled when viewport is at or below this number in pixels.
+     */
     mobileMenuMaxWidth?: number;
-    className: any;
-}): React.JSX.Element;
-export namespace NavMenu {
-    namespace propTypes {
-        let ariaLabel: PropTypes.Validator<string>;
-        let colorType: PropTypes.Requireable<string>;
-        let menuItems: PropTypes.Requireable<any[]>;
-        let mobileMenuMaxWidth: PropTypes.Requireable<number>;
-        let className: PropTypes.Requireable<string>;
-    }
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * NavMenu UI component
+ */
+export declare const NavMenu: ({ ariaLabel, colorType, menuItems, mobileMenuMaxWidth, className, ...props }: NavMenuProps) => React.JSX.Element;
+export {};

package/_dist/components/navigation/NavMenu/NavMenuDropdown.d.ts

@@ -1,14 +1,24 @@
-export function NavMenuDropdown({ items, label, mobileMenuMaxWidth }: {
-    items: any;
-    label: any;
+import React, { ComponentPropsWithoutRef } from 'react';
+import { MenuItem } from './NavMenu';
+/**
+ * Prop types for NavMenuDropdown
+ */
+interface NavMenuDropdownProps extends ComponentPropsWithoutRef<'button'> {
+    /**
+     * Dropdown items.
+     */
+    items?: MenuItem[];
+    /**
+     * Dropdown label.
+     */
+    label?: string;
+    /**
+     * Mobile menu will be enabled when viewport is at or below this number in pixels.
+     */
     mobileMenuMaxWidth?: number;
-}): React.JSX.Element;
-export namespace NavMenuDropdown {
-    namespace propTypes {
-        let items: PropTypes.Requireable<any[]>;
-        let label: PropTypes.Requireable<string>;
-        let mobileMenuMaxWidth: PropTypes.Requireable<number>;
-    }
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * NavMenuDropdown UI component
+ */
+export declare const NavMenuDropdown: ({ items, label, mobileMenuMaxWidth, }: NavMenuDropdownProps) => React.JSX.Element;
+export {};

package/_dist/css/component-css/pds-branch-diff.css

@@ -0,0 +1 @@
+.pds-branch-diff{display:flex;height:2rem;max-width:100%;width:100%}.pds-branch-diff .pds-branch-diff__behind{padding-bottom:4px;position:relative;text-align:right;width:50%}.pds-branch-diff .pds-branch-diff__behind .pds-branch-diff__behind-number{display:block;font-size:.833rem;font-weight:400;line-height:120%;padding-inline:.25rem;position:relative;top:-1px}.pds-branch-diff .pds-branch-diff__behind .pds-branch-diff__behind-line{background-color:var(--pds-color-neutral-300);border-bottom-left-radius:6.25rem;border-top-left-radius:6.25rem;height:8px;min-width:1px;position:absolute;right:0;transition:width .3s ease;width:41.95%}.pds-branch-diff .pds-branch-diff__ahead{border-color:var(--pds-color-neutral-400);border-left-style:solid;border-left-width:1px;padding-bottom:4px;position:relative;text-align:left;width:50%}.pds-branch-diff .pds-branch-diff__ahead .pds-branch-diff__ahead-number{display:block;font-size:.833rem;font-weight:400;line-height:120%;padding-inline:.25rem;position:relative;top:-1px}.pds-branch-diff .pds-branch-diff__ahead .pds-branch-diff__ahead-line{background-color:var(--pds-color-neutral-400);border-bottom-right-radius:6.25rem;border-top-right-radius:6.25rem;height:8px;left:0;min-width:1px;position:absolute;transition:width .3s ease;width:41.95%}.pds-branch-diff .pds-branch-diff__tooltip{padding-inline:0}

package/_dist/css/component-css/pds-button.css

@@ -78,4 +78,4 @@ a.pds-button,button.pds-button{--pds-button-color-background:var(
 		--pds-color-button-navbar-foreground-hover
 	)}a.pds-button.pds-button--navbar:active,button.pds-button.pds-button--navbar:active:enabled{--pds-button-color-background:transparent;--pds-button-color-border:transparent;--pds-button-color-foreground:var(
 		--pds-color-button-navbar-foreground-active
-	)}button.pds-button.pds-button--inline{background-color:transparent;border:none;border-radius:0;color:var(--pds-color-interactive-link-default);font-size:inherit;font-weight:400;height:unset;justify-content:unset;max-height:unset;padding:0;text-decoration:underline;transition:all .2s ease-in-out 0s}button.pds-button.pds-button--inline .pds-button__loading-indicator{--pds-spinner-color-1:#23232d;--pds-spinner-color-2:#6d6d78;--pds-spinner-color-3:#cfcfd3}button.pds-button.pds-button--inline:hover:enabled{color:var(--pds-color-interactive-link-hover);text-decoration:none}button.pds-button.pds-button--inline:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:.125rem;text-decoration:none}.pds-button-group,.pds-button-group--lg{display:flex;flex-direction:column;row-gap:1rem;width:100%}.pds-button-group a.pds-button.pds-button--subtle,.pds-button-group button.pds-button.pds-button--subtle,.pds-button-group--lg a.pds-button.pds-button--subtle,.pds-button-group--lg button.pds-button.pds-button--subtle{margin-block:-.512rem}@media (min-width:641px){.pds-button-group a.pds-button.pds-button--subtle,.pds-button-group button.pds-button.pds-button--subtle,.pds-button-group--lg a.pds-button.pds-button--subtle,.pds-button-group--lg button.pds-button.pds-button--subtle{margin-block:unset;margin-inline:-.25rem}.pds-button-group{column-gap:1.25rem;flex-direction:row;width:unset}.pds-button-group--lg{column-gap:1.563rem}}
+	)}button.pds-button.pds-button--inline{background-color:transparent;border:none;border-radius:0;color:var(--pds-color-interactive-link-default);font-size:inherit;font-weight:400;height:unset;justify-content:unset;letter-spacing:0;max-height:unset;padding:0;transition:all .2s ease-in-out 0s}button.pds-button.pds-button--inline .pds-button__loading-indicator{--pds-spinner-color-1:#23232d;--pds-spinner-color-2:#6d6d78;--pds-spinner-color-3:#cfcfd3}button.pds-button.pds-button--inline:hover:enabled{color:var(--pds-color-interactive-link-hover);text-decoration:underline}button.pds-button.pds-button--inline:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:.125rem;text-decoration:none}.pds-button-group,.pds-button-group--lg{display:flex;flex-direction:column;row-gap:1rem;width:100%}.pds-button-group a.pds-button.pds-button--subtle,.pds-button-group button.pds-button.pds-button--subtle,.pds-button-group--lg a.pds-button.pds-button--subtle,.pds-button-group--lg button.pds-button.pds-button--subtle{margin-block:-.512rem}@media (min-width:641px){.pds-button-group a.pds-button.pds-button--subtle,.pds-button-group button.pds-button.pds-button--subtle,.pds-button-group--lg a.pds-button.pds-button--subtle,.pds-button-group--lg button.pds-button.pds-button--subtle{margin-block:unset;margin-inline:-.25rem}.pds-button-group{column-gap:1.25rem;flex-direction:row;width:unset}.pds-button-group--lg{column-gap:1.563rem}}

package/_dist/css/component-css/pds-file-diff.css

@@ -0,0 +1 @@
+.pds-file-diff{align-items:center;display:flex;gap:.25rem;height:1.0625rem;max-width:100%;width:100%}.pds-file-diff .pds-file-diff__total-changes{color:var(--pds-color-text-default-secondary);font-size:.694rem}.pds-file-diff .pds-file-diff__bars{align-items:center;display:flex;gap:.125rem;width:100%}.pds-file-diff .pds-file-diff__behind{position:relative}.pds-file-diff .pds-file-diff__behind .pds-file-diff__behind-bar{background-color:var(--pds-color-semantic-critical-foreground);border-bottom-left-radius:6.25rem;border-top-left-radius:6.25rem;height:8px;min-width:1px;right:0;transition:width .3s ease;width:100%}.pds-file-diff .pds-file-diff__ahead{position:relative}.pds-file-diff .pds-file-diff__ahead .pds-file-diff__ahead-bar{background-color:var(--pds-color-semantic-success-utility);border-bottom-right-radius:6.25rem;border-top-right-radius:6.25rem;height:8px;left:0;min-width:1px;transition:width .3s ease;width:100%}.pds-file-diff .pds-file-diff__tooltip{display:block;padding-inline:0}

package/_dist/css/component-css/pds-icon-button.css

@@ -14,4 +14,12 @@ button.pds-icon-button{--pds-button-size:2.25rem;--pds-button-color-foreground:v
 		--pds-color-icon-button-critical-background-active
 	);--pds-button-color-foreground:var(
 		--pds-color-icon-button-critical-foreground-default
+	)}button.pds-icon-button--critical-hover{--pds-button-color-background:var(
+		--pds-color-icon-button-standard-background-default
+	);--pds-button-color-background-hover:var(
+		--pds-color-icon-button-critical-background-hover
+	);--pds-button-color-background-active:var(
+		--pds-color-icon-button-critical-background-active
+	)}button.pds-icon-button--critical-hover:hover{--pds-button-color-foreground:var(
+		--pds-color-icon-button-critical-foreground-default
 	)}button.pds-icon-button--sm{--pds-button-size:2rem}button.pds-icon-button--lg{--pds-button-size:3rem}.pds-icon-button__tooltip .pds-tooltip__container{padding:.328rem .512rem}.pds-icon-button__icon-wrapper{align-items:center;display:flex;justify-content:center;position:absolute}.pds-icon-button--fadeOut{-webkit-animation:scale-down-center .4s cubic-bezier(.25,.46,.45,.94) both;animation:scale-down-center .4s cubic-bezier(.25,.46,.45,.94) both;opacity:0;transition:.2s ease-in}.pds-icon-button--hide{display:none}.pds-icon-button--scaleIn{-webkit-animation:scale-in-center .2s cubic-bezier(.175,.885,.32,1.275) both;animation:scale-in-center .2s cubic-bezier(.175,.885,.32,1.275) both}@keyframes scale-in-center{0%{opacity:1;-webkit-transform:scale(0);transform:scale(0)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}