@indico-data/design-system 1.0.29 → 1.0.31

package/lib/components/Icon/index.d.ts

@@ -1 +1,3 @@
 export { Icon } from './Icon';
+export { faIcons } from './faIcons';
+export { indicons } from './indicons';

package/lib/components/buttons/IconButton/IconButton.styles.d.ts

@@ -298,7 +298,6 @@ export declare const StyledIconButtonLink: import("styled-components").IStyledCo
     translate?: "yes" | "no" | undefined;
     slot?: string | undefined;
     title?: string | undefined;
-    children?: import("react").ReactNode;
     draggable?: (boolean | "false" | "true") | undefined;
     id?: string | undefined;
     className?: string | undefined;
@@ -395,6 +394,7 @@ export declare const StyledIconButtonLink: import("styled-components").IStyledCo
     "aria-valuemin"?: number | undefined;
     "aria-valuenow"?: number | undefined;
     "aria-valuetext"?: string | undefined;
+    children?: import("react").ReactNode;
     dangerouslySetInnerHTML?: {
         __html: string | TrustedHTML;
     } | undefined;

package/lib/components/index.d.ts

@@ -2,7 +2,7 @@ export { Accordion } from './Accordion';
 export { Section, SectionBlock, SectionBody, SectionHeader, SectionTable } from './basic-section';
 export { Button, IconButton } from './buttons';
 export { BorderSelect, MultiCombobox, Select, SingleCombobox } from './dropdowns';
-export { Icon } from './Icon';
+export { Icon, faIcons, indicons } from './Icon';
 export { EditableInput, NumberInput, SearchInput, TextInput } from './inputs';
 export { BarSpinner, CirclePulse, CircleSpinner, LoadingList, PercentageRing, RandomLoadingMessage, } from './loading-indicators';
 export { ListTable } from './ListTable';

package/lib/index.d.ts

@@ -1,10 +1,402 @@
 /// <reference types="react" />
 import React, { ChangeEvent } from 'react';
+import * as styled_components from 'styled-components';
 import { PermafrostComponent, IconName } from '@/types';
 import { AriaButtonProps } from '@react-types/button';
 
 declare const GlobalStyles: () => React.JSX.Element;
 
+declare const faIcons: {
+    'fa-dot-circle': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-file': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-file-alt': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-file-pdf': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-file-word': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-check-square': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-square': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-angle-double-left': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-arrow-circle-right': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-arrow-down': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-arrow-left': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-arrow-right': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-arrow-up': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-ban': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-caret-down': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-caret-up': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-chart-bar': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-check': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-check-circle': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-circle-notch': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-clipboard': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-clock': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-clone': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-cloud': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-cog': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-cogs': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-coins': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-cube': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-cut': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-download': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-exclamation-circle': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-exclamation-triangle': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-external-link-alt': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-eye-dropper': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-file-download': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-file-export': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-file-upload': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-filter': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-ghost': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-hat-wizard': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-info-circle': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-key': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-keyboard': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-layer-group': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-pencil-alt': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-plus': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-plus-square': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-question-circle': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-robot': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-search': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-sign-out-alt': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-sliders-h': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-sync-alt': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-tag': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-times': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-times-circle': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-tint': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-toggle-off': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-toggle-on': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-trash': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-trash-alt': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-undo': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-user': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-users': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-mouse-pointer': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-step-forward': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-search-minus': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-search-plus': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-table': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-image': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-link': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    'fa-list': React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+};
+
+declare const indicons: {
+    'indico-o-white': React.JSX.Element;
+    account: React.JSX.Element;
+    address: React.JSX.Element;
+    'api-doc': React.JSX.Element;
+    'arrow-dots': React.JSX.Element;
+    'arrow-down': React.JSX.Element;
+    'arrow-up-circle': React.JSX.Element;
+    'arrows-cursor': React.JSX.Element;
+    branch: React.JSX.Element;
+    'check-circle': React.JSX.Element;
+    check: React.JSX.Element;
+    checkbox: React.JSX.Element;
+    'chevron-down': React.JSX.Element;
+    'chevron-left': React.JSX.Element;
+    'chevron-right': React.JSX.Element;
+    'chevron-up': React.JSX.Element;
+    'classification-document': React.JSX.Element;
+    'classification-image': React.JSX.Element;
+    'classification-page': React.JSX.Element;
+    'classify-and-unbundle': React.JSX.Element;
+    clipboard: React.JSX.Element;
+    'coffee-1': React.JSX.Element;
+    'coffee-2': React.JSX.Element;
+    'coffee-fail': React.JSX.Element;
+    coffeecup: React.JSX.Element;
+    coffeesteam: React.JSX.Element;
+    'company-name': React.JSX.Element;
+    'confidence-bar-1': React.JSX.Element;
+    'confidence-bar-2': React.JSX.Element;
+    'confidence-bar-3': React.JSX.Element;
+    'confidence-bar-4': React.JSX.Element;
+    'confidence-bars': React.JSX.Element;
+    configure: React.JSX.Element;
+    crowdlabel: React.JSX.Element;
+    currency: React.JSX.Element;
+    dashboard: React.JSX.Element;
+    'data-and-access': React.JSX.Element;
+    database: React.JSX.Element;
+    date: React.JSX.Element;
+    draggable: React.JSX.Element;
+    droplet: React.JSX.Element;
+    edit: React.JSX.Element;
+    education: React.JSX.Element;
+    ellipsis: React.JSX.Element;
+    'elmos-fire': React.JSX.Element;
+    email: React.JSX.Element;
+    enterprise: React.JSX.Element;
+    extraction: React.JSX.Element;
+    eye: React.JSX.Element;
+    file: React.JSX.Element;
+    fileHappy: React.JSX.Element;
+    filter: React.JSX.Element;
+    'filter-outline': React.JSX.Element;
+    folder: React.JSX.Element;
+    form: React.JSX.Element;
+    gallery: React.JSX.Element;
+    graphiql: React.JSX.Element;
+    happy: React.JSX.Element;
+    'help-solid': React.JSX.Element;
+    help: React.JSX.Element;
+    highlight: React.JSX.Element;
+    'highlight-outline': React.JSX.Element;
+    'indico-logo-white': React.JSX.Element;
+    'indico-o': React.JSX.Element;
+    info: React.JSX.Element;
+    kabob: React.JSX.Element;
+    key: React.JSX.Element;
+    label: React.JSX.Element;
+    'layout-complex': React.JSX.Element;
+    'layout-simple': React.JSX.Element;
+    location: React.JSX.Element;
+    lock: React.JSX.Element;
+    menu: React.JSX.Element;
+    'model-import': React.JSX.Element;
+    'model-starter': React.JSX.Element;
+    moon: React.JSX.Element;
+    moonbow: React.JSX.Element;
+    'no-format': React.JSX.Element;
+    'object-detection': React.JSX.Element;
+    organizations: React.JSX.Element;
+    output: React.JSX.Element;
+    'page-thumbnail': React.JSX.Element;
+    'pay-as-you-go': React.JSX.Element;
+    person: React.JSX.Element;
+    phone: React.JSX.Element;
+    pin: React.JSX.Element;
+    plus: React.JSX.Element;
+    pointer: React.JSX.Element;
+    popup: React.JSX.Element;
+    price: React.JSX.Element;
+    'radio-button': React.JSX.Element;
+    recruiter: React.JSX.Element;
+    regex: React.JSX.Element;
+    reject: React.JSX.Element;
+    repair: React.JSX.Element;
+    research: React.JSX.Element;
+    retrain: React.JSX.Element;
+    sad: React.JSX.Element;
+    search: React.JSX.Element;
+    shrug: React.JSX.Element;
+    signature: React.JSX.Element;
+    'sort-down': React.JSX.Element;
+    split: React.JSX.Element;
+    'step-forward': React.JSX.Element;
+    sun: React.JSX.Element;
+    surround: React.JSX.Element;
+    'surround-outline': React.JSX.Element;
+    swagger: React.JSX.Element;
+    text: React.JSX.Element;
+    'thumbs-down': React.JSX.Element;
+    'thumbs-up': React.JSX.Element;
+    time: React.JSX.Element;
+    trash: React.JSX.Element;
+    unlock: React.JSX.Element;
+    upload: React.JSX.Element;
+    url: React.JSX.Element;
+    user: React.JSX.Element;
+    wand: React.JSX.Element;
+    warning: React.JSX.Element;
+    workflows: React.JSX.Element;
+    'x-close': React.JSX.Element;
+    'zoom-in': React.JSX.Element;
+    'zoom-out': React.JSX.Element;
+};
+
+declare const animation: {
+    readonly duration: "200ms";
+    readonly timing: "ease";
+};
+
+declare const breakpoints: {
+    readonly mediumScreen: "600px";
+    readonly largeScreen: "900px";
+    readonly maxScreen: "1300px";
+};
+declare const mediaQueries: {
+    mediumScreen: string;
+    largeScreen: string;
+    maxScreen: string;
+};
+
+declare const typography: {
+    fontFamily: {
+        base: string;
+        heading: string;
+    };
+    fontSize: {
+        readonly caption: "12px";
+        readonly base: "14px";
+        readonly subheadSmall: "16px";
+        readonly subheadLarge: "18px";
+        readonly subheadXl: "22px";
+        readonly display: "30px";
+    };
+    lineHeight: {
+        readonly base: 1.25;
+        readonly heading: 1.2;
+    };
+    spacing: {
+        base: string;
+        half: string;
+        quarter: string;
+        third: string;
+    };
+    ellipsis: styled_components.RuleSet<object>;
+};
+
+declare const padding: {
+    readonly sm: "15px";
+    readonly md: "20px";
+};
+
+declare const spacings: {
+    readonly xs: "8px";
+    readonly sm: "12px";
+    readonly md: "24px";
+};
+
+declare const margin: {
+    readonly sm: "15px";
+    readonly md: "20px";
+};
+
+declare function decimalAdjust(type: any, value: any, exp: any): any;
+declare function round10(value: any, exp: any): any;
+declare function clamp(value: any, min: any, max: any): any;
+declare function numberWithCommas(x: any): any;
+declare namespace MATH {
+    export { decimalAdjust };
+    export { round10 };
+    export { clamp };
+    export { numberWithCommas };
+}
+
+declare const allColors: {
+    readonly akaroa: "#cbc98f";
+    readonly amber: "#f4c401";
+    readonly amethyst: "#8e57b3";
+    readonly aqua: "#10e4fe";
+    readonly astralBlue: "#2f7ca2";
+    readonly ateneoBlue: "#0d466a";
+    readonly avocado: "#81b12f";
+    readonly azure: "#108cf7";
+    readonly baliHai: "#8498b6";
+    readonly black: "#000";
+    readonly blueBayoux: "#4f5e74";
+    readonly blueMagenta: "#542f9d";
+    readonly blueRibbon: "#0b35ff";
+    readonly blueYonder: "#586fd2";
+    readonly bouqet: "#a35c9a";
+    readonly brick: "#c62828";
+    readonly brown: "#785349";
+    readonly candyCorn: "#fcef4d";
+    readonly carnation: "#ff8adf";
+    readonly carrot: "#f29a2d";
+    readonly cerise: "#d52a96";
+    readonly cerulean: "#008b9e";
+    readonly chantilly: "#f7b0eb";
+    readonly charcoal: "#474b4b";
+    readonly chartreuse: "#34ff01";
+    readonly clay: "#283243";
+    readonly cocoaBean: "#5c1200";
+    readonly comet: "#5a6982";
+    readonly cornflower: "#2060ff";
+    readonly crimson: "#e53126";
+    readonly curiousBlue: "#178ee0";
+    readonly cyan: "#0cf";
+    readonly darkFontColor: "#0d151d";
+    readonly darkGray: "#333";
+    readonly darkPurple: "#6f3eae";
+    readonly darkRed: "#b30000";
+    readonly defaultFontColor: "#bbbfc5";
+    readonly dodgerBlue: "#1774ff";
+    readonly eagleGreen: "#005557";
+    readonly ebony: "#101a26";
+    readonly eggplant: "#7a0074";
+    readonly electricGreen: "#00ff0a";
+    readonly emerald: "#09c199";
+    readonly espresso: "#5a3627";
+    readonly fieldPromptError: "#fd9693";
+    readonly fieldPromptInfo: "#00bfff";
+    readonly flamingo: "#f861b6";
+    readonly flirt: "#910870";
+    readonly forestGreen: "#1f7f1f";
+    readonly geraldine: "#fe9486";
+    readonly grannysmith: "#92e959";
+    readonly green: "#4caf50";
+    readonly harlequin: "#20cb00";
+    readonly harvestGold: "#e6c079";
+    readonly hemlock: "#626740";
+    readonly imperial: "#4b0134";
+    readonly iron: "#d9dee0";
+    readonly japaneseIndigo: "#264359";
+    readonly juniper: "#6d9292";
+    readonly khaki: "#bba44b";
+    readonly koamaru: "#2f346a";
+    readonly korma: "#90370e";
+    readonly lavender: "#B086E3";
+    readonly lavenderRose: "#fb9fda";
+    readonly lightGray: "#eee";
+    readonly lightPurple: "#b43be4";
+    readonly lilac: "#a195d4";
+    readonly lincolnGreen: "#254600";
+    readonly magenta: "#ff15e0";
+    readonly malibu: "#68C2FB";
+    readonly mantis: "#4fa83d";
+    readonly maroon: "#ad3349";
+    readonly mauve: "#e06cfb";
+    readonly mediumGray: "#999";
+    readonly midFontColor: "#8593b3";
+    readonly mint: "#3ac999";
+    readonly mirage: "#182432";
+    readonly mulberry: "#5c0536";
+    readonly olive: "#807300";
+    readonly orange: "#ff7200";
+    readonly orchid: "#ab00ff";
+    readonly oxfordBlue: "#384558";
+    readonly pacific: "#00b5b6";
+    readonly palm: "#1aa511";
+    readonly persian: "#1717cf";
+    readonly persianLight: "#0327ce";
+    readonly pine: "#017074";
+    readonly pink: "#f74f8a";
+    readonly pistachio: "#aac609";
+    readonly raspberry: "#990030";
+    readonly red: "#f95359";
+    readonly robinsEggBlue: "#00bcd4";
+    readonly romanSilver: "#7d888d";
+    readonly salem: "#03832e";
+    readonly sapGreen: "#5f7e20";
+    readonly seaGreen: "#0b8a51";
+    readonly seance: "#7f1f82";
+    readonly shiraz: "#c61021";
+    readonly sinopia: "#D14200";
+    readonly tangerine: "#ff9900";
+    readonly teal: "#008285";
+    readonly toast: "#997862";
+    readonly trueBlue: "#066CC6";
+    readonly turquoise: "#00b5b6";
+    readonly vermilion: "#b95555";
+    readonly viking: "#59cfe0";
+    readonly violet: "#3e4eb8";
+    readonly violetBlue: "#8060d2";
+    readonly walnut: "#783f00";
+    readonly white: "#fff";
+    readonly windsorTan: "#b35c00";
+    readonly yellow: "#ffca28";
+    readonly zucchini: "#016422";
+    readonly hiliteFontColor: "#fff";
+    readonly lightFontColor: "#eee";
+    readonly borderColor: "#eee";
+    readonly actionColor: "#8593b3";
+    readonly backgroundColor: "#182432";
+};
+
 type Props$i = PermafrostComponent & {
     content: React.ReactNode;
     header?: React.ReactNode | string;
@@ -406,4 +798,4 @@ type Props = PermafrostComponent & {
 };
 declare function Shrug(props: Props): React.ReactElement;
 
-export { Accordion, BarSpinner, BorderSelect, Button, CirclePulse, CircleSpinner, EditableInput, GlobalStyles, Icon, IconButton, ListTable, LoadingList, MultiCombobox, NumberInput, Pagination, PercentageRing, RandomLoadingMessage, SearchInput, Section, SectionBlock, SectionBody, SectionHeader, SectionTable, Select, Shrug, SingleCombobox, TextInput };
+export { animation as ANIMATION, Accordion, breakpoints as BREAKPOINT, BarSpinner, BorderSelect, Button, allColors as COLORS, CirclePulse, CircleSpinner, EditableInput, GlobalStyles, Icon, IconButton, ListTable, LoadingList, margin as MARGINS, MATH, mediaQueries as MEDIA_QUERIES, MultiCombobox, NumberInput, padding as PADDINGS, Pagination, PercentageRing, RandomLoadingMessage, spacings as SPACING, SearchInput, Section, SectionBlock, SectionBody, SectionHeader, SectionTable, Select, Shrug, SingleCombobox, typography as TYPOGRAPHY, TextInput, faIcons, indicons };

package/lib/index.esm.js

@@ -58,12 +58,60 @@ const padding = {
     md: '20px',
 };
 
+const spacings = {
+    xs: '8px',
+    sm: '12px',
+    md: '24px',
+};
+
 const margin = {
     // todo -- get with mike L for other padding values as they become needed. Ideally we should create a formula.
     sm: '15px',
     md: '20px',
 };
 
+// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/floor
+
+const decimalAdjust = (type, value, exp) => {
+  // If the exp is undefined or zero...
+  if (typeof exp === 'undefined' || +exp === 0) {
+    return Math[type](value);
+  }
+  value = +value;
+  exp = +exp;
+  // If the value is not a number or the exp is not an integer...
+  if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0)) {
+    return NaN;
+  }
+  // Shift
+  value = value.toString().split('e');
+  value = Math[type](+(value[0] + 'e' + (value[1] ? +value[1] - exp : -exp)));
+  // Shift back
+  value = value.toString().split('e');
+  return +(value[0] + 'e' + (value[1] ? +value[1] + exp : exp));
+};
+
+const round10 = (value, exp) => {
+  return decimalAdjust('round', value, exp);
+};
+
+const clamp = (value, min, max) => {
+  value = value < min ? min : value;
+  value = value > max ? max : value;
+  return value;
+};
+
+const numberWithCommas$1 = (x) => {
+  return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+};
+
+const MATH = {
+  decimalAdjust,
+  round10,
+  clamp,
+  numberWithCommas: numberWithCommas$1,
+};
+
 const allColors = {
     akaroa: '#cbc98f',
     amber: '#f4c401',
@@ -7327,7 +7375,6 @@ const Layout = createGlobalStyle `
 
   body {
     margin: 0;
-    background-color: var(${allColors.backgroundColor});
   }
 `;
 
@@ -7528,40 +7575,6 @@ const GlobalStyles = () => (React.createElement(React.Fragment, null,
     React.createElement(Typography, null),
     React.createElement(MarginPadding, null)));
 
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol */
-
-
-function __rest(s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-}
-
-typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-    var e = new Error(message);
-    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-};
-
 var faFileLines = {
   prefix: 'far',
   iconName: 'file-lines',
@@ -8297,6 +8310,40 @@ const indicons = {
         React.createElement("path", { d: "M60.9,38.3V43c0,1.3-1.1,2.3-2.3,2.3H22.7c-1.3,0-2.3-1.1-2.3-2.3v-4.7\n\tc0-1.3,1.1-2.3,2.3-2.3h35.9C59.9,35.9,60.9,37,60.9,38.3z M99.3,94.9l-4.4,4.4c-0.9,0.9-2.4,0.9-3.3,0L67.9,75.6\n\tc-0.4-0.4-0.7-1-0.7-1.7v-2.6c-7.1,6.2-16.4,9.9-26.6,9.9C18.2,81.2,0,63.1,0,40.6S18.2,0,40.6,0s40.6,18.2,40.6,40.6\n\tc0,10.2-3.7,19.4-9.9,26.6h2.6c0.6,0,1.2,0.3,1.7,0.7l23.7,23.7C100.2,92.5,100.2,94,99.3,94.9L99.3,94.9z M71.9,40.6\n\tc0-17.3-14-31.2-31.2-31.2S9.4,23.4,9.4,40.6s14,31.2,31.2,31.2S71.9,57.9,71.9,40.6z" }))),
 };
 
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol */
+
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
 // TODO: This component's migration was fast-tracked for Insights. Assess for potential refactor and documentation.
 const allIcons = Object.assign(Object.assign({}, faIcons), indicons);
 /**
@@ -9432,7 +9479,71 @@ function BarSpinner(props) {
         React.createElement("span", null)));
 }
 
-var MESSAGES = ['Charging the flux capacitor', 'Spinning up the hamster wheel', 'Flushing the pipes', 'Counting all the beans', 'Take a deep breath and enjoy this beautiful moment', 'Counting digits in pi (almost done)', 'Folding time and space', 'Oiling the gears', 'Peeling the data fruits', 'Activating the oscillation overthruster', 'Gleaming the cube', 'Reticulating splines', 'Playing a quick game of squash', 'Making the sausage', 'Building the matrix', 'Drawing fractals', 'Testing memory (what did you have for breakfast?)', 'Priming data pumps', 'Whacking datamoles', 'Finding Nemo', 'Running spin cycle', 'Chasing down a dream', 'Twiddling the knobs', 'Assembling lines', 'Making the donuts', 'Gathering magic', 'Rolling stones', 'Busting all the moves', 'Augmenting reality', 'Leveling up', 'Obviating frequencies', 'Declaring variables', 'Boosting thrusters', 'Blazing the saddles', 'Flipping some bits', 'Unclogging the internet', 'Turning it off and back on again', 'Entering the ThunderDome', 'Rolling logs', 'Dangling particles', 'Catching moonbeams', 'Digging for treasure', 'Reconbulating the conbulator', 'Machine learning', 'Magicing', 'Tuning the forks', 'Fiddling widgets', 'Feeding the data monkeys', 'Regularizing expressions', 'Ramping up the synergy', 'Inflating point flotations', 'Entering orbit around alpha centuri', 'Squeezing data tubes', 'Making a list and checking it twice', 'Unkinking the data tubes', 'Turning on the data hose', 'Preparing for liftoff', 'Replacing the hamsters', 'Changing the batteries', 'Waking up our engineers', 'Contemplating the meaning of life', 'Downloading fresh dog memes', 'Springing the chickens'];
+const MESSAGES = [
+  'Charging the flux capacitor',
+  'Spinning up the hamster wheel',
+  'Flushing the pipes',
+  'Counting all the beans',
+  'Take a deep breath and enjoy this beautiful moment',
+  'Counting digits in pi (almost done)',
+  'Folding time and space',
+  'Oiling the gears',
+  'Peeling the data fruits',
+  'Activating the oscillation overthruster',
+  'Gleaming the cube',
+  'Reticulating splines',
+  'Playing a quick game of squash',
+  'Making the sausage',
+  'Building the matrix',
+  'Drawing fractals',
+  'Testing memory (what did you have for breakfast?)',
+  'Priming data pumps',
+  'Whacking datamoles',
+  'Finding Nemo',
+  'Running spin cycle',
+  'Chasing down a dream',
+  'Twiddling the knobs',
+  'Assembling lines',
+  'Making the donuts',
+  'Gathering magic',
+  'Rolling stones',
+  'Busting all the moves',
+  'Augmenting reality',
+  'Leveling up',
+  'Obviating frequencies',
+  'Declaring variables',
+  'Boosting thrusters',
+  'Blazing the saddles',
+  'Flipping some bits',
+  'Unclogging the internet',
+  'Turning it off and back on again',
+  'Entering the ThunderDome',
+  'Rolling logs',
+  'Dangling particles',
+  'Catching moonbeams',
+  'Digging for treasure',
+  'Reconbulating the conbulator',
+  'Machine learning',
+  'Magicing',
+  'Tuning the forks',
+  'Fiddling widgets',
+  'Feeding the data monkeys',
+  'Regularizing expressions',
+  'Ramping up the synergy',
+  'Inflating point flotations',
+  'Entering orbit around alpha centuri',
+  'Squeezing data tubes',
+  'Making a list and checking it twice',
+  'Unkinking the data tubes',
+  'Turning on the data hose',
+  'Preparing for liftoff',
+  'Replacing the hamsters',
+  'Changing the batteries',
+  'Waking up our engineers',
+  'Contemplating the meaning of life',
+  'Downloading fresh dog memes',
+  'Springing the chickens',
+];
 
 const RandomLoadingMessage = () => {
     const [randomMessage, changeRandomMessage] = useState(MESSAGES[Math.floor(Math.random() * MESSAGES.length)]);
@@ -12594,5 +12705,5 @@ const ListTable = (props) => {
         list))));
 };
 
-export { Accordion, BarSpinner, BorderSelect, Button, CirclePulse, CircleSpinner, EditableInput, GlobalStyles, Icon, IconButton, ListTable, LoadingList, MultiCombobox, NumberInput, Pagination, PercentageRing, RandomLoadingMessage, SearchInput, Section, SectionBlock, SectionBody, SectionHeader, SectionTable, Select, Shrug, SingleCombobox, TextInput };
+export { animation as ANIMATION, Accordion, breakpoints as BREAKPOINT, BarSpinner, BorderSelect, Button, allColors as COLORS, CirclePulse, CircleSpinner, EditableInput, GlobalStyles, Icon, IconButton, ListTable, LoadingList, margin as MARGINS, MATH, mediaQueries as MEDIA_QUERIES, MultiCombobox, NumberInput, padding as PADDINGS, Pagination, PercentageRing, RandomLoadingMessage, spacings as SPACING, SearchInput, Section, SectionBlock, SectionBody, SectionHeader, SectionTable, Select, Shrug, SingleCombobox, typography as TYPOGRAPHY, TextInput, faIcons, indicons };
 //# sourceMappingURL=index.esm.js.map