@indico-data/design-system 1.0.52 → 1.0.54

package/jest.config.js

@@ -4,12 +4,11 @@ module.exports = {
   testEnvironment: 'jest-environment-jsdom',
   testPathIgnorePatterns: ['/node_modules/', '/lib/', '__mocks__'],
   setupFilesAfterEnv: ["<rootDir>/src/setupTests.ts"],
-   moduleNameMapper: {
+  moduleNameMapper: {
     '^@/(.*)$': '<rootDir>/src/$1',
   },
   transform: {
     '^.+\\.(ts|tsx)?$': 'ts-jest',
     '^.+\\.(js|jsx)$': 'babel-jest',
   },
-
 };

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

@@ -7,6 +7,7 @@ type Props = PermafrostComponent & {
     size?: [string | number] | [string | number, string | number];
     style?: any;
     onClick?(): void;
+    ref?: React.Ref<SVGSVGElement>;
 };
 /**
  * Generic icon component, hidden from Assistive Technology by default.

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { StoryObj } from '@storybook/react';
 import { Icon } from './Icon';
 declare const meta: {
@@ -15,7 +16,7 @@ declare const meta: {
         name: {
             control: {
                 type: string;
-                options: ("checkbox" | "ellipsis" | "help" | "pointer" | "text" | "zoom-in" | "zoom-out" | "reset" | "menu" | "search" | "split" | "indico-o-white" | "account" | "address" | "api-doc" | "arrow-dots" | "arrow-down" | "arrow-up-circle" | "arrows-cursor" | "bookmark" | "bookmarks" | "bookmark-saved" | "branch" | "check-circle" | "circle-help" | "check" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "classification-document" | "classification-image" | "classification-page" | "classify-and-unbundle" | "clipboard" | "coffee-1" | "coffee-2" | "coffee-fail" | "coffeecup" | "coffeesteam" | "cog" | "collection" | "compare" | "company-name" | "confidence-bar-1" | "confidence-bar-2" | "confidence-bar-3" | "confidence-bar-4" | "confidence-bars" | "configure" | "choose-library" | "crowdlabel" | "currency" | "dashboard" | "data-and-access" | "database" | "document" | "date" | "draggable" | "droplet" | "edit" | "education" | "elmos-fire" | "email" | "enterprise" | "exclamation-circle-stroke" | "extraction" | "eye" | "file" | "fileHappy" | "filter" | "filter-outline" | "folder" | "form" | "gallery" | "find-documents" | "graphiql" | "grid-view" | "happy" | "help-solid" | "highlight" | "highlight-outline" | "indico-logo-white" | "indico-o" | "info" | "kabob" | "key" | "label" | "layout-complex" | "layout-simple" | "list-view" | "libraries" | "location" | "logout" | "lock" | "model-import" | "model-starter" | "moon" | "moonbow" | "no-collections" | "no-libraries" | "no_results" | "no-format" | "object-detection" | "organizations" | "output" | "page-thumbnail" | "pay-as-you-go" | "person" | "phone" | "pin" | "plus" | "popup" | "price" | "preview-view" | "radio-button" | "recruiter" | "regex" | "reject" | "repair" | "research" | "retrain" | "sad" | "search-thin" | "shrug" | "signature" | "sort-down" | "step-forward" | "sun" | "surround" | "surround-outline" | "thumbs-down" | "thumbs-up" | "time" | "trash" | "unlock" | "upload" | "url" | "user" | "wand" | "warning" | "warning-stroke" | "workflows" | "x-close" | "fa-dot-circle" | "fa-file" | "fa-file-alt" | "fa-file-pdf" | "fa-file-word" | "fa-check-square" | "fa-square" | "fa-angle-double-left" | "fa-arrow-circle-right" | "fa-arrow-down" | "fa-arrow-left" | "fa-arrow-right" | "fa-arrow-up" | "fa-ban" | "fa-caret-down" | "fa-caret-up" | "fa-chart-bar" | "fa-check" | "fa-check-circle" | "fa-circle-notch" | "fa-clipboard" | "fa-clock" | "fa-clone" | "fa-cloud" | "fa-cog" | "fa-cogs" | "fa-coins" | "fa-cube" | "fa-cut" | "fa-download" | "fa-exclamation-circle" | "fa-exclamation-triangle" | "fa-external-link-alt" | "fa-eye-dropper" | "fa-file-download" | "fa-file-export" | "fa-file-upload" | "fa-filter" | "fa-ghost" | "fa-hat-wizard" | "fa-info-circle" | "fa-key" | "fa-keyboard" | "fa-layer-group" | "fa-pencil-alt" | "fa-plus" | "fa-plus-square" | "fa-question-circle" | "fa-robot" | "fa-search" | "fa-sign-out-alt" | "fa-sliders-h" | "fa-sync-alt" | "fa-tag" | "fa-times" | "fa-times-circle" | "fa-tint" | "fa-toggle-off" | "fa-toggle-on" | "fa-trash" | "fa-trash-alt" | "fa-undo" | "fa-user" | "fa-users" | "fa-mouse-pointer" | "fa-step-forward" | "fa-search-minus" | "fa-search-plus" | "fa-table" | "fa-image" | "fa-link" | "fa-list")[];
+                options: ("checkbox" | "ellipsis" | "help" | "pointer" | "text" | "zoom-in" | "zoom-out" | "reset" | "menu" | "search" | "split" | "indico-o-white" | "account" | "address" | "api-doc" | "arrow-dots" | "arrow-down" | "arrow-up-circle" | "arrows-cursor" | "bookmark" | "bookmarks" | "bookmark-saved" | "branch" | "calendar" | "check-circle" | "circle-help" | "check" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "classification-document" | "classification-image" | "classification-page" | "classify-and-unbundle" | "clipboard" | "coffee-1" | "coffee-2" | "coffee-fail" | "coffeecup" | "coffeesteam" | "cog" | "collection" | "compare" | "company-name" | "confidence-bar-1" | "confidence-bar-2" | "confidence-bar-3" | "confidence-bar-4" | "confidence-bars" | "configure" | "choose-library" | "crowdlabel" | "currency" | "dashboard" | "data-and-access" | "database" | "document" | "date" | "draggable" | "droplet" | "edit" | "education" | "elmos-fire" | "email" | "enterprise" | "exclamation-circle-stroke" | "extraction" | "eye" | "file" | "fileHappy" | "filter" | "filter-outline" | "folder" | "form" | "gallery" | "find-documents" | "graphiql" | "grid-view" | "happy" | "help-solid" | "highlight" | "highlight-outline" | "indico-logo-white" | "indico-o" | "info" | "kabob" | "key" | "label" | "layout-complex" | "layout-simple" | "list-view" | "libraries" | "location" | "logout" | "lock" | "model-import" | "model-starter" | "moon" | "moonbow" | "no-collections" | "no-libraries" | "no_results" | "no-format" | "object-detection" | "organizations" | "output" | "page-thumbnail" | "pay-as-you-go" | "person" | "phone" | "pin" | "plus" | "popup" | "price" | "preview-view" | "radio-button" | "recruiter" | "regex" | "reject" | "repair" | "research" | "retrain" | "sad" | "search-thin" | "shrug" | "signature" | "sort-down" | "step-forward" | "sun" | "surround" | "surround-outline" | "thumbs-down" | "thumbs-up" | "time" | "trash" | "unlock" | "upload" | "url" | "user" | "wand" | "warning" | "warning-stroke" | "workflows" | "x-close" | "fa-dot-circle" | "fa-file" | "fa-file-alt" | "fa-file-pdf" | "fa-file-word" | "fa-check-square" | "fa-square" | "fa-angle-double-left" | "fa-arrow-circle-right" | "fa-arrow-down" | "fa-arrow-left" | "fa-arrow-right" | "fa-arrow-up" | "fa-ban" | "fa-caret-down" | "fa-caret-up" | "fa-chart-bar" | "fa-check" | "fa-check-circle" | "fa-circle-notch" | "fa-clipboard" | "fa-clock" | "fa-clone" | "fa-cloud" | "fa-cog" | "fa-cogs" | "fa-coins" | "fa-cube" | "fa-cut" | "fa-download" | "fa-exclamation-circle" | "fa-exclamation-triangle" | "fa-external-link-alt" | "fa-eye-dropper" | "fa-file-download" | "fa-file-export" | "fa-file-upload" | "fa-filter" | "fa-ghost" | "fa-hat-wizard" | "fa-info-circle" | "fa-key" | "fa-keyboard" | "fa-layer-group" | "fa-pencil-alt" | "fa-plus" | "fa-plus-square" | "fa-question-circle" | "fa-robot" | "fa-search" | "fa-sign-out-alt" | "fa-sliders-h" | "fa-sync-alt" | "fa-tag" | "fa-times" | "fa-times-circle" | "fa-tint" | "fa-toggle-off" | "fa-toggle-on" | "fa-trash" | "fa-trash-alt" | "fa-undo" | "fa-user" | "fa-users" | "fa-mouse-pointer" | "fa-step-forward" | "fa-search-minus" | "fa-search-plus" | "fa-table" | "fa-image" | "fa-link" | "fa-list")[];
             };
         };
     };
@@ -26,10 +27,11 @@ declare const meta: {
         'data-testid'?: string | undefined;
         ariaLabel?: string | undefined;
         fill?: string | undefined;
-        name: "checkbox" | "ellipsis" | "help" | "pointer" | "text" | "zoom-in" | "zoom-out" | "reset" | "menu" | "search" | "split" | "indico-o-white" | "account" | "address" | "api-doc" | "arrow-dots" | "arrow-down" | "arrow-up-circle" | "arrows-cursor" | "bookmark" | "bookmarks" | "bookmark-saved" | "branch" | "check-circle" | "circle-help" | "check" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "classification-document" | "classification-image" | "classification-page" | "classify-and-unbundle" | "clipboard" | "coffee-1" | "coffee-2" | "coffee-fail" | "coffeecup" | "coffeesteam" | "cog" | "collection" | "compare" | "company-name" | "confidence-bar-1" | "confidence-bar-2" | "confidence-bar-3" | "confidence-bar-4" | "confidence-bars" | "configure" | "choose-library" | "crowdlabel" | "currency" | "dashboard" | "data-and-access" | "database" | "document" | "date" | "draggable" | "droplet" | "edit" | "education" | "elmos-fire" | "email" | "enterprise" | "exclamation-circle-stroke" | "extraction" | "eye" | "file" | "fileHappy" | "filter" | "filter-outline" | "folder" | "form" | "gallery" | "find-documents" | "graphiql" | "grid-view" | "happy" | "help-solid" | "highlight" | "highlight-outline" | "indico-logo-white" | "indico-o" | "info" | "kabob" | "key" | "label" | "layout-complex" | "layout-simple" | "list-view" | "libraries" | "location" | "logout" | "lock" | "model-import" | "model-starter" | "moon" | "moonbow" | "no-collections" | "no-libraries" | "no_results" | "no-format" | "object-detection" | "organizations" | "output" | "page-thumbnail" | "pay-as-you-go" | "person" | "phone" | "pin" | "plus" | "popup" | "price" | "preview-view" | "radio-button" | "recruiter" | "regex" | "reject" | "repair" | "research" | "retrain" | "sad" | "search-thin" | "shrug" | "signature" | "sort-down" | "step-forward" | "sun" | "surround" | "surround-outline" | "thumbs-down" | "thumbs-up" | "time" | "trash" | "unlock" | "upload" | "url" | "user" | "wand" | "warning" | "warning-stroke" | "workflows" | "x-close" | "fa-dot-circle" | "fa-file" | "fa-file-alt" | "fa-file-pdf" | "fa-file-word" | "fa-check-square" | "fa-square" | "fa-angle-double-left" | "fa-arrow-circle-right" | "fa-arrow-down" | "fa-arrow-left" | "fa-arrow-right" | "fa-arrow-up" | "fa-ban" | "fa-caret-down" | "fa-caret-up" | "fa-chart-bar" | "fa-check" | "fa-check-circle" | "fa-circle-notch" | "fa-clipboard" | "fa-clock" | "fa-clone" | "fa-cloud" | "fa-cog" | "fa-cogs" | "fa-coins" | "fa-cube" | "fa-cut" | "fa-download" | "fa-exclamation-circle" | "fa-exclamation-triangle" | "fa-external-link-alt" | "fa-eye-dropper" | "fa-file-download" | "fa-file-export" | "fa-file-upload" | "fa-filter" | "fa-ghost" | "fa-hat-wizard" | "fa-info-circle" | "fa-key" | "fa-keyboard" | "fa-layer-group" | "fa-pencil-alt" | "fa-plus" | "fa-plus-square" | "fa-question-circle" | "fa-robot" | "fa-search" | "fa-sign-out-alt" | "fa-sliders-h" | "fa-sync-alt" | "fa-tag" | "fa-times" | "fa-times-circle" | "fa-tint" | "fa-toggle-off" | "fa-toggle-on" | "fa-trash" | "fa-trash-alt" | "fa-undo" | "fa-user" | "fa-users" | "fa-mouse-pointer" | "fa-step-forward" | "fa-search-minus" | "fa-search-plus" | "fa-table" | "fa-image" | "fa-link" | "fa-list";
+        name: "checkbox" | "ellipsis" | "help" | "pointer" | "text" | "zoom-in" | "zoom-out" | "reset" | "menu" | "search" | "split" | "indico-o-white" | "account" | "address" | "api-doc" | "arrow-dots" | "arrow-down" | "arrow-up-circle" | "arrows-cursor" | "bookmark" | "bookmarks" | "bookmark-saved" | "branch" | "calendar" | "check-circle" | "circle-help" | "check" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "classification-document" | "classification-image" | "classification-page" | "classify-and-unbundle" | "clipboard" | "coffee-1" | "coffee-2" | "coffee-fail" | "coffeecup" | "coffeesteam" | "cog" | "collection" | "compare" | "company-name" | "confidence-bar-1" | "confidence-bar-2" | "confidence-bar-3" | "confidence-bar-4" | "confidence-bars" | "configure" | "choose-library" | "crowdlabel" | "currency" | "dashboard" | "data-and-access" | "database" | "document" | "date" | "draggable" | "droplet" | "edit" | "education" | "elmos-fire" | "email" | "enterprise" | "exclamation-circle-stroke" | "extraction" | "eye" | "file" | "fileHappy" | "filter" | "filter-outline" | "folder" | "form" | "gallery" | "find-documents" | "graphiql" | "grid-view" | "happy" | "help-solid" | "highlight" | "highlight-outline" | "indico-logo-white" | "indico-o" | "info" | "kabob" | "key" | "label" | "layout-complex" | "layout-simple" | "list-view" | "libraries" | "location" | "logout" | "lock" | "model-import" | "model-starter" | "moon" | "moonbow" | "no-collections" | "no-libraries" | "no_results" | "no-format" | "object-detection" | "organizations" | "output" | "page-thumbnail" | "pay-as-you-go" | "person" | "phone" | "pin" | "plus" | "popup" | "price" | "preview-view" | "radio-button" | "recruiter" | "regex" | "reject" | "repair" | "research" | "retrain" | "sad" | "search-thin" | "shrug" | "signature" | "sort-down" | "step-forward" | "sun" | "surround" | "surround-outline" | "thumbs-down" | "thumbs-up" | "time" | "trash" | "unlock" | "upload" | "url" | "user" | "wand" | "warning" | "warning-stroke" | "workflows" | "x-close" | "fa-dot-circle" | "fa-file" | "fa-file-alt" | "fa-file-pdf" | "fa-file-word" | "fa-check-square" | "fa-square" | "fa-angle-double-left" | "fa-arrow-circle-right" | "fa-arrow-down" | "fa-arrow-left" | "fa-arrow-right" | "fa-arrow-up" | "fa-ban" | "fa-caret-down" | "fa-caret-up" | "fa-chart-bar" | "fa-check" | "fa-check-circle" | "fa-circle-notch" | "fa-clipboard" | "fa-clock" | "fa-clone" | "fa-cloud" | "fa-cog" | "fa-cogs" | "fa-coins" | "fa-cube" | "fa-cut" | "fa-download" | "fa-exclamation-circle" | "fa-exclamation-triangle" | "fa-external-link-alt" | "fa-eye-dropper" | "fa-file-download" | "fa-file-export" | "fa-file-upload" | "fa-filter" | "fa-ghost" | "fa-hat-wizard" | "fa-info-circle" | "fa-key" | "fa-keyboard" | "fa-layer-group" | "fa-pencil-alt" | "fa-plus" | "fa-plus-square" | "fa-question-circle" | "fa-robot" | "fa-search" | "fa-sign-out-alt" | "fa-sliders-h" | "fa-sync-alt" | "fa-tag" | "fa-times" | "fa-times-circle" | "fa-tint" | "fa-toggle-off" | "fa-toggle-on" | "fa-trash" | "fa-trash-alt" | "fa-undo" | "fa-user" | "fa-users" | "fa-mouse-pointer" | "fa-step-forward" | "fa-search-minus" | "fa-search-plus" | "fa-table" | "fa-image" | "fa-link" | "fa-list";
         size?: [string | number] | [string | number, string | number] | undefined;
         style?: any;
         onClick?: (() => void) | undefined;
+        ref?: React.Ref<SVGSVGElement> | undefined;
     }>) => import("react/jsx-runtime").JSX.Element)[];
 };
 export default meta;

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

@@ -11,6 +11,7 @@ declare const indicons: {
     bookmarks: import("react/jsx-runtime").JSX.Element;
     'bookmark-saved': import("react/jsx-runtime").JSX.Element;
     branch: import("react/jsx-runtime").JSX.Element;
+    calendar: import("react/jsx-runtime").JSX.Element;
     'check-circle': import("react/jsx-runtime").JSX.Element;
     'circle-help': import("react/jsx-runtime").JSX.Element;
     check: import("react/jsx-runtime").JSX.Element;

package/lib/components/Navigation/Drawer/constants.d.ts

@@ -0,0 +1,3 @@
+import { ListItem } from './types';
+export declare const navigationItems: ListItem[];
+export declare const footerItems: ListItem[];

package/lib/components/index.d.ts

@@ -3,7 +3,7 @@ export { Section, SectionBlock, SectionBody, SectionHeader, SectionTable } from
 export { Button, IconButton } from './buttons';
 export { BorderSelect, MultiCombobox, Select, SingleCombobox } from './dropdowns';
 export { Icon, faIcons, indicons } from './Icon';
-export { EditableInput, NumberInput, SearchInput, TextInput, Radio, RadioGroup, AbstractRadio, AbstractRadioGroup, } from './inputs';
+export { EditableInput, NumberInput, SearchInput, TextInput, Radio, RadioGroup, AbstractRadio, AbstractRadioGroup, DatePicker, NoInputDatePicker, } from './inputs';
 export { BarSpinner, CirclePulse, CircleSpinner, LoadingList, PercentageRing, RandomLoadingMessage, LoadingIndicator, } from './loading-indicators';
 export { ListTable } from './ListTable';
 export { Pagination } from './Pagination';

package/lib/components/inputs/DatePicker/DatePicker.d.ts

@@ -0,0 +1,15 @@
+import { PermafrostComponent } from '@/types';
+type Props = PermafrostComponent & {
+    ariaLabel?: string;
+    disableBeforeDate?: Date;
+    disableAfterDate?: Date;
+    disabled?: boolean;
+    id: string;
+    label?: string;
+    onChange: (value: Date | undefined) => void;
+    placeholder?: string;
+    selected?: Date | undefined;
+    value: Date | undefined;
+};
+export declare const DatePicker: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/inputs/DatePicker/DatePicker.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { DatePicker } from '@/components/inputs/DatePicker';
+declare const meta: Meta<typeof DatePicker>;
+export default meta;
+type Story = StoryObj<typeof DatePicker>;
+export declare const Normal: Story;

package/lib/components/inputs/DatePicker/DatePicker.styles.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const StyledDatePicker: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;

package/lib/components/inputs/DatePicker/index.d.ts

@@ -0,0 +1 @@
+export { DatePicker } from './DatePicker';

package/lib/components/inputs/NoInputDatePicker/NoInputDatePicker.d.ts

@@ -0,0 +1,21 @@
+import { DateRange } from 'react-day-picker';
+import { IconName, PermafrostComponent } from '@/types';
+type Props = PermafrostComponent & {
+    ariaLabel?: string;
+    disableBeforeDate?: Date;
+    disableAfterDate?: Date;
+    disabled?: boolean;
+    id: string;
+    label?: string;
+    onChange: (value: Date | DateRange | undefined) => void;
+    selected?: Date | undefined;
+    selectedRange?: DateRange | undefined;
+    value: Date | undefined;
+    triggerIcon: IconName;
+    triggerIconSize: [string | number];
+    isRangePicker?: boolean;
+    isOpen?: boolean;
+    clearOnClose?: boolean;
+};
+export declare const NoInputDatePicker: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/inputs/NoInputDatePicker/NoInputDatePicker.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { NoInputDatePicker } from '@/components/inputs/NoInputDatePicker';
+declare const meta: Meta<typeof NoInputDatePicker>;
+export default meta;
+type Story = StoryObj<typeof NoInputDatePicker>;
+export declare const Single: Story;
+export declare const Range: Story;

package/lib/components/inputs/NoInputDatePicker/NoInputDatePicker.styles.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const StyledNoInputDatePicker: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;

package/lib/components/inputs/NoInputDatePicker/__tests__/NoInputDatePicker.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/inputs/NoInputDatePicker/index.d.ts

@@ -0,0 +1 @@
+export { NoInputDatePicker } from './NoInputDatePicker';

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

@@ -4,3 +4,5 @@ export { SearchInput } from './SearchInput';
 export { TextInput } from './TextInput';
 export { Radio, RadioGroup } from './RadioButtons';
 export { AbstractRadio, AbstractRadioGroup } from './RadioGroup';
+export { DatePicker } from './DatePicker';
+export { NoInputDatePicker } from './NoInputDatePicker';

package/lib/components/text-truncate/TextTruncate.d.ts

@@ -1,7 +1,7 @@
 interface TextTruncateProps {
     string: string;
     maxChars: number;
-    children: any;
+    children?: any;
 }
 export declare function TextTruncate({ string, maxChars, children }: TextTruncateProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/index.d.ts

@@ -6,6 +6,7 @@ import * as styled_components from 'styled-components';
 import { PermafrostComponent, IconName } from '@/types';
 import { AriaButtonProps } from '@react-types/button';
 import { AriaRadioProps, RadioGroupProps as RadioGroupProps$1, AriaRadioGroupProps } from '@react-types/radio';
+import { DateRange } from 'react-day-picker';
 import * as styled_components_dist_types from 'styled-components/dist/types';
 
 declare const GlobalStyles: () => react_jsx_runtime.JSX.Element;
@@ -98,6 +99,7 @@ declare const indicons: {
     bookmarks: react_jsx_runtime.JSX.Element;
     'bookmark-saved': react_jsx_runtime.JSX.Element;
     branch: react_jsx_runtime.JSX.Element;
+    calendar: react_jsx_runtime.JSX.Element;
     'check-circle': react_jsx_runtime.JSX.Element;
     'circle-help': react_jsx_runtime.JSX.Element;
     check: react_jsx_runtime.JSX.Element;
@@ -442,25 +444,25 @@ declare const allColors: {
     readonly backgroundColor: "#182432";
 };
 
-type Props$o = PermafrostComponent & {
+type Props$q = PermafrostComponent & {
     content: React__default.ReactNode;
     header?: React__default.ReactNode | string;
     open?: boolean;
 };
-declare const Accordion: (props: Props$o) => react_jsx_runtime.JSX.Element;
+declare const Accordion: (props: Props$q) => react_jsx_runtime.JSX.Element;
 
-type Props$n = PermafrostComponent & {
+type Props$p = PermafrostComponent & {
     style?: object;
     children: React__default.ReactNode;
 };
-declare const Section: (props: Props$n) => react_jsx_runtime.JSX.Element;
+declare const Section: (props: Props$p) => react_jsx_runtime.JSX.Element;
 
-type Props$m = PermafrostComponent & {
+type Props$o = PermafrostComponent & {
     title?: string;
     style?: object;
     children: React__default.ReactNode;
 };
-declare const SectionBlock: (props: Props$m) => react_jsx_runtime.JSX.Element;
+declare const SectionBlock: (props: Props$o) => react_jsx_runtime.JSX.Element;
 
 type SectionBodyProps = PermafrostComponent & {
     style?: object;
@@ -468,12 +470,12 @@ type SectionBodyProps = PermafrostComponent & {
 };
 declare const SectionBody: (props: SectionBodyProps) => react_jsx_runtime.JSX.Element;
 
-type Props$l = PermafrostComponent & {
+type Props$n = PermafrostComponent & {
     style?: object;
     children?: React__default.ReactNode;
 };
 declare const SectionHeader: {
-    (props: Props$l): react_jsx_runtime.JSX.Element;
+    (props: Props$n): react_jsx_runtime.JSX.Element;
     defaultProps: {
         className: string;
         style: {};
@@ -505,7 +507,7 @@ declare function Button(props: ButtonProps): React__default.ReactElement;
 type IconButtonVariant = 'default' | 'primary' | 'destructive' | 'outline';
 type ButtonSize = 'normal' | 'large';
 
-type Props$k = PermafrostComponent & {
+type Props$m = PermafrostComponent & {
     /**
      * Adjusts vertical alignment of the text label, in relation to the icon
      */
@@ -531,9 +533,9 @@ type Props$k = PermafrostComponent & {
  *
  * @see {@link https://react-spectrum.adobe.com/blog/building-a-button-part-1.html}
  */
-declare function IconButton(props: Props$k): react_jsx_runtime.JSX.Element;
+declare function IconButton(props: Props$m): react_jsx_runtime.JSX.Element;
 
-type Props$j = PermafrostComponent & {
+type Props$l = PermafrostComponent & {
     defaultValue?: string;
     disabled?: boolean;
     horizontal?: boolean;
@@ -548,7 +550,7 @@ type Props$j = PermafrostComponent & {
     value?: string | number;
     validationErrors?: string[];
 };
-declare const BorderSelect: (props: Props$j) => react_jsx_runtime.JSX.Element;
+declare const BorderSelect: (props: Props$l) => react_jsx_runtime.JSX.Element;
 
 type ComboboxProps = {
     'aria-label'?: string;
@@ -596,7 +598,7 @@ type ComboboxOption = {
 type ComboboxSize = 'small' | 'medium';
 type ComboboxVariant = 'default' | 'light';
 
-type Props$i = PermafrostComponent & {
+type Props$k = PermafrostComponent & {
     disabled?: boolean;
     initialText?: string;
     options: {
@@ -610,7 +612,7 @@ type Props$i = PermafrostComponent & {
     onChange(e: React__default.ChangeEvent<HTMLSelectElement>): void;
     onClick?(e: React__default.MouseEvent<HTMLDivElement, MouseEvent>): void;
 };
-declare const Select: (props: Props$i) => react_jsx_runtime.JSX.Element;
+declare const Select: (props: Props$k) => react_jsx_runtime.JSX.Element;
 
 /**
  * Multiselect combobox component. If selections are not bound to outside state
@@ -651,21 +653,22 @@ declare const SingleCombobox: React__default.ForwardRefExoticComponent<Permafros
     onChange: (selectedOption: ComboboxOption) => void;
 } & React__default.RefAttributes<unknown>>;
 
-type Props$h = PermafrostComponent & {
+type Props$j = PermafrostComponent & {
     ariaLabel?: string;
     fill?: string;
     name: IconName;
     size?: [string | number] | [string | number, string | number];
     style?: any;
     onClick?(): void;
+    ref?: React__default.Ref<SVGSVGElement>;
 };
 /**
  * Generic icon component, hidden from Assistive Technology by default.
  * If icon should be available to AT, pass the desired name into the `ariaLabel` prop.
  */
-declare function Icon({ style, ...props }: Props$h): React__default.ReactElement | null;
+declare function Icon({ style, ...props }: Props$j): React__default.ReactElement | null;
 
-type Props$g = PermafrostComponent & {
+type Props$i = PermafrostComponent & {
     children: React__default.ReactNode | string;
     minLength?: number;
     onUpdate?(newValue: string): void;
@@ -674,9 +677,9 @@ type Props$g = PermafrostComponent & {
  * Wrapper component which enables text editing in place directly on a child component,
  * element, or plain text.
  */
-declare function EditableInput(props: Props$g): react_jsx_runtime.JSX.Element;
+declare function EditableInput(props: Props$i): react_jsx_runtime.JSX.Element;
 
-type Props$f = PermafrostComponent & {
+type Props$h = PermafrostComponent & {
     autoFocus?: boolean;
     decrement?(): void;
     disabled?: boolean;
@@ -696,9 +699,9 @@ type Props$f = PermafrostComponent & {
  * Basic numeric input field. A label is required, but may be visually hidden
  * using the `hiddenLabel` property.
  */
-declare function NumberInput(props: Props$f): React__default.ReactElement;
+declare function NumberInput(props: Props$h): React__default.ReactElement;
 
-type Props$e = PermafrostComponent & {
+type Props$g = PermafrostComponent & {
     border?: boolean;
     showClearInputIcon?: boolean;
     showSearchIcon?: boolean;
@@ -712,13 +715,13 @@ type Props$e = PermafrostComponent & {
     value?: string;
 };
 declare const SearchInput: {
-    (props: Props$e): react_jsx_runtime.JSX.Element;
+    (props: Props$g): react_jsx_runtime.JSX.Element;
     defaultProps: {
         className: string;
     };
 };
 
-type Props$d = PermafrostComponent & {
+type Props$f = PermafrostComponent & {
     autoComplete?: 'email' | 'current-password' | 'new-password' | string;
     autoFocus?: boolean;
     defaultValue?: string;
@@ -739,9 +742,9 @@ type Props$d = PermafrostComponent & {
     value?: string;
     readOnly?: boolean;
 };
-declare function TextInput(props: Props$d): React__default.ReactElement;
+declare function TextInput(props: Props$f): React__default.ReactElement;
 
-type Props$c = {
+type Props$e = {
     ['aria-label']: string;
     children?: React__default.ReactNode;
     hideFocusRing: boolean;
@@ -757,7 +760,7 @@ type Props$c = {
  * A group label must be included: either pass a string or markup into the
  * `label` prop, or include an `aria-label` or `aria-labelledby` attribute.
  */
-declare function RadioGroup$1({ children, ...props }: Props$c): react_jsx_runtime.JSX.Element;
+declare function RadioGroup$1({ children, ...props }: Props$e): react_jsx_runtime.JSX.Element;
 /**
  * A single radio button and its label.
  */
@@ -786,6 +789,39 @@ declare function Radio(props: AriaRadioProps & {
     isVisuallySelected?: (selectedValue: string) => void;
 }): react_jsx_runtime.JSX.Element;
 
+type Props$d = PermafrostComponent & {
+    ariaLabel?: string;
+    disableBeforeDate?: Date;
+    disableAfterDate?: Date;
+    disabled?: boolean;
+    id: string;
+    label?: string;
+    onChange: (value: Date | undefined) => void;
+    placeholder?: string;
+    selected?: Date | undefined;
+    value: Date | undefined;
+};
+declare const DatePicker: (props: Props$d) => react_jsx_runtime.JSX.Element;
+
+type Props$c = PermafrostComponent & {
+    ariaLabel?: string;
+    disableBeforeDate?: Date;
+    disableAfterDate?: Date;
+    disabled?: boolean;
+    id: string;
+    label?: string;
+    onChange: (value: Date | DateRange | undefined) => void;
+    selected?: Date | undefined;
+    selectedRange?: DateRange | undefined;
+    value: Date | undefined;
+    triggerIcon: IconName;
+    triggerIconSize: [string | number];
+    isRangePicker?: boolean;
+    isOpen?: boolean;
+    clearOnClose?: boolean;
+};
+declare const NoInputDatePicker: (props: Props$c) => react_jsx_runtime.JSX.Element;
+
 type Props$b = PermafrostComponent & {
     ariaLabel?: string;
     size?: string;
@@ -1074,8 +1110,8 @@ declare const Drawer: (props: Props) => react_jsx_runtime.JSX.Element;
 interface TextTruncateProps {
     string: string;
     maxChars: number;
-    children: any;
+    children?: any;
 }
 declare function TextTruncate({ string, maxChars, children }: TextTruncateProps): react_jsx_runtime.JSX.Element;
 
-export { animation as ANIMATION, Radio as AbstractRadio, RadioGroup as AbstractRadioGroup, Accordion, breakpoints as BREAKPOINT, BarSpinner, BorderSelect, Button, allColors as COLORS, CirclePulse, CircleSpinner, ConfirmModal, Drawer, EditableInput, GlobalStyles, Icon, IconButton, ListTable, LoadingAwareContainer, LoadingList, margin as MARGINS, MATH, mediaQueries as MEDIA_QUERIES, ModalBase, MultiCombobox, NumberInput, padding as PADDINGS, Pagination, PercentageRing, Radio$1 as Radio, RadioGroup$1 as RadioGroup, RandomLoadingMessage, spacings as SPACING, SearchInput, Section, SectionBlock, SectionBody, SectionHeader, SectionTable, Select, Shrug, SingleCombobox, StyledWizard, typography as TYPOGRAPHY, TextInput, TextTruncate, Wizard, WizardCard, WizardSection, WizardWithSidebar, faIcons, indicons };
+export { animation as ANIMATION, Radio as AbstractRadio, RadioGroup as AbstractRadioGroup, Accordion, breakpoints as BREAKPOINT, BarSpinner, BorderSelect, Button, allColors as COLORS, CirclePulse, CircleSpinner, ConfirmModal, DatePicker, Drawer, EditableInput, GlobalStyles, Icon, IconButton, ListTable, LoadingAwareContainer, LoadingList, margin as MARGINS, MATH, mediaQueries as MEDIA_QUERIES, ModalBase, MultiCombobox, NoInputDatePicker, NumberInput, padding as PADDINGS, Pagination, PercentageRing, Radio$1 as Radio, RadioGroup$1 as RadioGroup, RandomLoadingMessage, spacings as SPACING, SearchInput, Section, SectionBlock, SectionBody, SectionHeader, SectionTable, Select, Shrug, SingleCombobox, StyledWizard, typography as TYPOGRAPHY, TextInput, TextTruncate, Wizard, WizardCard, WizardSection, WizardWithSidebar, faIcons, indicons };