@codecademy/gamut 72.2.2-beta.pr3339.28121408874.0 → 72.2.2

package/dist/Card/styles.d.ts

@@ -9,14 +9,14 @@ export declare const patternFadeInOut: {
         opacity: number;
         transition: {
             duration: number;
-            ease: "easeOut";
+            ease: string;
         };
     };
     animate: {
         opacity: number;
         transition: {
             duration: number;
-            ease: "easeIn";
+            ease: string;
         };
     };
 };
@@ -26,7 +26,7 @@ export declare const hoverShadowLeft: (borderRadius?: string) => {
         borderRadius: string | undefined;
         transition: {
             duration: number;
-            ease: "easeOut";
+            ease: string;
         };
     };
     initialOutline: {
@@ -34,7 +34,7 @@ export declare const hoverShadowLeft: (borderRadius?: string) => {
         borderRadius: string | undefined;
         transition: {
             duration: number;
-            ease: "easeOut";
+            ease: string;
         };
     };
     animate: {
@@ -43,7 +43,7 @@ export declare const hoverShadowLeft: (borderRadius?: string) => {
         borderRadius: string | undefined;
         transition: {
             duration: number;
-            ease: "easeIn";
+            ease: string;
         };
     };
     animateOutline: {
@@ -52,7 +52,7 @@ export declare const hoverShadowLeft: (borderRadius?: string) => {
         borderRadius: string | undefined;
         transition: {
             duration: number;
-            ease: "easeIn";
+            ease: string;
         };
     };
 };
@@ -62,7 +62,7 @@ export declare const hoverShadowRight: (borderRadius?: string) => {
         borderRadius: string | undefined;
         transition: {
             duration: number;
-            ease: "easeOut";
+            ease: string;
         };
     };
     animate: {
@@ -71,7 +71,7 @@ export declare const hoverShadowRight: (borderRadius?: string) => {
         borderRadius: string | undefined;
         transition: {
             duration: number;
-            ease: "easeIn";
+            ease: string;
         };
     };
 };

package/dist/Coachmark/index.d.ts

@@ -21,7 +21,7 @@ export type CoachmarkProps = PopoverFocusProps & {
     /**
      * Function that returns the contents of the coachmark.
      */
-    renderPopover: (onDismiss?: () => void) => React.JSX.Element;
+    renderPopover: (onDismiss?: () => void) => JSX.Element;
     /**
      * Props to be passed into the popover component.
      */

package/dist/ConnectedForm/ConnectedForm.d.ts

@@ -62,4 +62,4 @@ export interface ConnectedFormProps<Values extends {}> extends Omit<FormContextP
 }
 export type FormProviderCustomProps = FormProviderProps & FormContextProps;
 export declare const FormPropsContext: React.Context<Partial<FormContextProps>>;
-export declare const ConnectedForm: <Values extends FormValues<Values>>(props: React.PropsWithoutRef<ConnectedFormProps<Values>> & React.RefAttributes<HTMLFormElement>) => React.ReactElement;
+export declare const ConnectedForm: <Values extends FormValues<Values>>(props: ConnectedFormProps<Values>, ref: React.ForwardedRef<HTMLFormElement>) => React.ReactElement;

package/dist/ConnectedForm/ConnectedFormGroup.js

@@ -1,6 +1,6 @@
 import _styled from "@emotion/styled/base";
 import { css } from '@codecademy/gamut-styles';
-import { useEffect } from 'react';
+import { useEffect, useId } from 'react';
 import * as React from 'react';
 import { FormError, FormGroup, FormGroupLabel } from '..';
 import { Anchor } from '../Anchor';
@@ -13,7 +13,7 @@ const ErrorAnchor = /*#__PURE__*/_styled(Anchor, {
   label: "ErrorAnchor"
 })(css({
   color: 'feedback-error'
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9Db25uZWN0ZWRGb3JtL0Nvbm5lY3RlZEZvcm1Hcm91cC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY29CIiwiZmlsZSI6Ii4uLy4uL3NyYy9Db25uZWN0ZWRGb3JtL0Nvbm5lY3RlZEZvcm1Hcm91cC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgdXNlRWZmZWN0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgUmVnaXN0ZXJPcHRpb25zIH0gZnJvbSAncmVhY3QtaG9vay1mb3JtJztcblxuaW1wb3J0IHsgRm9ybUVycm9yLCBGb3JtR3JvdXAsIEZvcm1Hcm91cExhYmVsLCBGb3JtR3JvdXBQcm9wcyB9IGZyb20gJy4uJztcbmltcG9ydCB7IEFuY2hvciB9IGZyb20gJy4uL0FuY2hvcic7XG5pbXBvcnQgeyBNYXJrZG93biB9IGZyb20gJy4uL01hcmtkb3duJztcbmltcG9ydCB7IEluZm9UaXBTdWJDb21wb25lbnRQcm9wcyB9IGZyb20gJy4uL1RpcC9JbmZvVGlwL3R5cGUtdXRpbHMnO1xuaW1wb3J0IHsgVGV4dCB9IGZyb20gJy4uL1R5cG9ncmFwaHknO1xuaW1wb3J0IHsgQ29ubmVjdGVkRmllbGQsIEZpZWxkUHJvcHMsIFN1Ym1pdENvbnRleHRQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuaW1wb3J0IHsgZ2V0RXJyb3JNZXNzYWdlLCB1c2VGaWVsZCB9IGZyb20gJy4vdXRpbHMnO1xuXG5jb25zdCBFcnJvckFuY2hvciA9IHN0eWxlZChBbmNob3IpKFxuICBjc3Moe1xuICAgIGNvbG9yOiAnZmVlZGJhY2stZXJyb3InLFxuICB9KVxuKTtcblxuZXhwb3J0IGludGVyZmFjZSBDb25uZWN0ZWRGb3JtR3JvdXBCYXNlUHJvcHNcbiAgZXh0ZW5kcyBPbWl0PFxuICAgIEZvcm1Hcm91cFByb3BzLFxuICAgICdsYWJlbCcgfCAnZGlzYWJsZWQnIHwgJ2Rlc2NyaXB0aW9uJyB8ICdodG1sRm9yJ1xuICA+IHtcbiAgY3VzdG9tRXJyb3I/OiBzdHJpbmc7XG4gIGVycm9yVHlwZT86ICdpbml0aWFsJyB8ICdhYnNvbHV0ZSc7XG4gIGhpZGVMYWJlbD86IGJvb2xlYW47XG4gIG5hbWU6IHN0cmluZztcbiAgbGFiZWw6IFJlYWN0LlJlYWN0Tm9kZTtcbiAgcmVxdWlyZWQ/OiBib29sZWFuO1xuICAvKipcbiAgICogSW5mb1RpcCB0byBkaXNwbGF5IG5leHQgdG8gdGhlIGZpZWxkIGxhYmVsLiBUaGUgSW5mb1RpcCBidXR0b24gaXNcbiAgICogYXV0b21hdGljYWxseSBsYWJlbGxlZCBieSB0aGUgZmllbGQgbGFiZWwuIFRvIG92ZXJyaWRlIHRoaXMgYmVoYXZpb3IsXG4gICAqIHByb3ZpZGUgYGFyaWFMYWJlbGAgb3IgYGFyaWFMYWJlbGxlZGJ5YC5cbiAgICovXG4gIGluZm90aXA/OiBJbmZvVGlwU3ViQ29tcG9uZW50UHJvcHM7XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgQ29ubmVjdGVkRm9ybUdyb3VwUHJvcHM8VCBleHRlbmRzIENvbm5lY3RlZEZpZWxkPlxuICBleHRlbmRzIFN1Ym1pdENvbnRleHRQcm9wcyxcbiAgICBDb25uZWN0ZWRGb3JtR3JvdXBCYXNlUHJvcHMge1xuICAvKipcbiAgICogQW4gb2JqZWN0IGNvbnNpc3Rpbmcgb2YgYSBgY29tcG9uZW50YCBrZXkgdG8gc3BlY2lmeSB3aGF0IENvbm5lY3RlZEZvcm1JbnB1dCB0byByZW5kZXIgLSB0aGUgcmVtYWluaW5nIGtleS92YWx1ZSBwYWlycyBhcmUgdGhhdCBjb21wb25lbnRzIGRlc2lyZWQgcHJvcHMuXG4gICAqL1xuICBmaWVsZDogT21pdDxSZWFjdC5Db21wb25lbnRQcm9wczxUPiwgJ25hbWUnIHwgJ2Rpc2FibGVkJz4gJlxuICAgIEZpZWxkUHJvcHM8VD4gJiB7XG4gICAgICBjdXN0b21WYWxpZGF0aW9ucz86IFJlZ2lzdGVyT3B0aW9ucztcbiAgICB9O1xufVxuXG5leHBvcnQgZnVuY3Rpb24gQ29ubmVjdGVkRm9ybUdyb3VwPFQgZXh0ZW5kcyBDb25uZWN0ZWRGaWVsZD4oe1xuICBjdXN0b21FcnJvcixcbiAgY2hpbGRyZW4sXG4gIGRpc2FibGVkID0gZmFsc2UsXG4gIGVycm9yVHlwZSA9ICdhYnNvbHV0ZScsXG4gIGZpZWxkLFxuICBoaWRlTGFiZWwsXG4gIGlkLFxuICBsYWJlbCxcbiAgbmFtZSxcbiAgbGFiZWxTaXplLFxuICBzcGFjaW5nID0gJ2ZpdCcsXG4gIGlzU29sb0ZpZWxkLFxuICBpbmZvdGlwLFxufTogQ29ubmVjdGVkRm9ybUdyb3VwUHJvcHM8VD4pIHtcbiAgY29uc3QgeyBjb21wb25lbnQ6IENvbXBvbmVudCwgY3VzdG9tVmFsaWRhdGlvbnMsIC4uLnJlc3QgfSA9IGZpZWxkO1xuICBjb25zdCB7IGVycm9yLCBpc0ZpcnN0RXJyb3IsIGlzRGlzYWJsZWQsIHNldEVycm9yLCB2YWxpZGF0aW9uIH0gPSB1c2VGaWVsZCh7XG4gICAgbmFtZSxcbiAgICBkaXNhYmxlZCxcbiAgICBjdXN0b21WYWxpZGF0aW9ucyxcbiAgfSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBpZiAoY3VzdG9tRXJyb3IpIHtcbiAgICAgIHNldEVycm9yKG5hbWUsIHtcbiAgICAgICAgdHlwZTogJ21hbnVhbCcsXG4gICAgICAgIG1lc3NhZ2U6IGN1c3RvbUVycm9yLFxuICAgICAgfSk7XG4gICAgfVxuICB9LCBbY3VzdG9tRXJyb3IsIG5hbWUsIHNldEVycm9yXSk7XG5cbiAgY29uc3QgZmllbGRJZCA9IHR5cGVvZiBpZCA9PT0gJ3N0cmluZycgPyBpZCA6IG5hbWU7XG5cbiAgY29uc3QgcmVuZGVyZWRMYWJlbCA9IChcbiAgICA8Rm9ybUdyb3VwTGFiZWxcbiAgICAgIGRpc2FibGVkPXtpc0Rpc2FibGVkfVxuICAgICAgaHRtbEZvcj17ZmllbGRJZH1cbiAgICAgIGluZm90aXA9e2luZm90aXB9XG4gICAgICBpc1NvbG9GaWVsZD17aXNTb2xvRmllbGR9XG4gICAgICByZXF1aXJlZD17Qm9vbGVhbih2YWxpZGF0aW9uPy5yZXF1aXJlZCl9XG4gICAgICBzaXplPXtsYWJlbFNpemV9XG4gICAgPlxuICAgICAge2xhYmVsfVxuICAgIDwvRm9ybUdyb3VwTGFiZWw+XG4gICk7XG5cbiAgY29uc3QgdGV4dEVycm9yID0gY3VzdG9tRXJyb3IgfHwgZ2V0RXJyb3JNZXNzYWdlKGVycm9yKTtcbiAgY29uc3Qgc2hvd0Vycm9yID0gISEodGV4dEVycm9yICYmICFoaWRlTGFiZWwpO1xuICBjb25zdCBlcnJvcklkID0gc2hvd0Vycm9yID8gYCR7ZmllbGRJZH1fZXJyb3JgIDogdW5kZWZpbmVkO1xuXG4gIHJldHVybiAoXG4gICAgPEZvcm1Hcm91cCBzcGFjaW5nPXtoaWRlTGFiZWwgPyAndGlnaHQnIDogc3BhY2luZ30+XG4gICAgICB7aGlkZUxhYmVsID8gPFRleHQgc2NyZWVucmVhZGVyPntyZW5kZXJlZExhYmVsfTwvVGV4dD4gOiByZW5kZXJlZExhYmVsfVxuICAgICAgPENvbXBvbmVudFxuICAgICAgICB7Li4uKHJlc3QgYXMgYW55KX1cbiAgICAgICAgYXJpYS1kZXNjcmliZWRieT17ZXJyb3JJZH1cbiAgICAgICAgYXJpYS1pbnZhbGlkPXtzaG93RXJyb3J9XG4gICAgICAgIGN1c3RvbVZhbGlkYXRpb25zPXtjdXN0b21WYWxpZGF0aW9uc31cbiAgICAgICAgZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgICBuYW1lPXtuYW1lfVxuICAgICAgLz5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICAgIHtzaG93RXJyb3IgJiYgKFxuICAgICAgICA8Rm9ybUVycm9yXG4gICAgICAgICAgYXJpYS1saXZlPXtpc0ZpcnN0RXJyb3IgPyAnYXNzZXJ0aXZlJyA6ICdvZmYnfVxuICAgICAgICAgIGlkPXtlcnJvcklkfVxuICAgICAgICAgIHJvbGU9e2lzRmlyc3RFcnJvciA/ICdhbGVydCcgOiAnc3RhdHVzJ31cbiAgICAgICAgICB2YXJpYW50PXtlcnJvclR5cGV9XG4gICAgICAgID5cbiAgICAgICAgICA8TWFya2Rvd25cbiAgICAgICAgICAgIGlubGluZVxuICAgICAgICAgICAgb3ZlcnJpZGVzPXt7XG4gICAgICAgICAgICAgIGE6IHtcbiAgICAgICAgICAgICAgICBhbGxvd2VkQXR0cmlidXRlczogWydocmVmJywgJ3RhcmdldCddLFxuICAgICAgICAgICAgICAgIGNvbXBvbmVudDogRXJyb3JBbmNob3IsXG4gICAgICAgICAgICAgICAgcHJvY2Vzc05vZGU6IChcbiAgICAgICAgICAgICAgICAgIG5vZGU6IHVua25vd24sXG4gICAgICAgICAgICAgICAgICBwcm9wczogeyBvbkNsaWNrPzogKCkgPT4gdm9pZCB9XG4gICAgICAgICAgICAgICAgKSA9PiB7XG4gICAgICAgICAgICAgICAgICBjb25zdCB7IGtleTogZWxlbWVudEtleSwgLi4ucmVzdCB9ID1cbiAgICAgICAgICAgICAgICAgICAgcHJvcHMgYXMgUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEVycm9yQW5jaG9yPiAmIHtcbiAgICAgICAgICAgICAgICAgICAgICBrZXk/OiBSZWFjdC5LZXk7XG4gICAgICAgICAgICAgICAgICAgIH07XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPEVycm9yQW5jaG9yIGtleT17ZWxlbWVudEtleX0gey4uLnJlc3R9IC8+O1xuICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICB9fVxuICAgICAgICAgICAgc2tpcERlZmF1bHRPdmVycmlkZXM9e3sgYTogdHJ1ZSB9fVxuICAgICAgICAgICAgc3BhY2luZz1cIm5vbmVcIlxuICAgICAgICAgICAgdGV4dD17dGV4dEVycm9yfVxuICAgICAgICAgIC8+XG4gICAgICAgIDwvRm9ybUVycm9yPlxuICAgICAgKX1cbiAgICA8L0Zvcm1Hcm91cD5cbiAgKTtcbn1cbiJdfQ== */");
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9Db25uZWN0ZWRGb3JtL0Nvbm5lY3RlZEZvcm1Hcm91cC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY29CIiwiZmlsZSI6Ii4uLy4uL3NyYy9Db25uZWN0ZWRGb3JtL0Nvbm5lY3RlZEZvcm1Hcm91cC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgdXNlRWZmZWN0LCB1c2VJZCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IFJlZ2lzdGVyT3B0aW9ucyB9IGZyb20gJ3JlYWN0LWhvb2stZm9ybSc7XG5cbmltcG9ydCB7IEZvcm1FcnJvciwgRm9ybUdyb3VwLCBGb3JtR3JvdXBMYWJlbCwgRm9ybUdyb3VwUHJvcHMgfSBmcm9tICcuLic7XG5pbXBvcnQgeyBBbmNob3IgfSBmcm9tICcuLi9BbmNob3InO1xuaW1wb3J0IHsgTWFya2Rvd24gfSBmcm9tICcuLi9NYXJrZG93bic7XG5pbXBvcnQgeyBJbmZvVGlwU3ViQ29tcG9uZW50UHJvcHMgfSBmcm9tICcuLi9UaXAvSW5mb1RpcC90eXBlLXV0aWxzJztcbmltcG9ydCB7IFRleHQgfSBmcm9tICcuLi9UeXBvZ3JhcGh5JztcbmltcG9ydCB7IENvbm5lY3RlZEZpZWxkLCBGaWVsZFByb3BzLCBTdWJtaXRDb250ZXh0UHJvcHMgfSBmcm9tICcuL3R5cGVzJztcbmltcG9ydCB7IGdldEVycm9yTWVzc2FnZSwgdXNlRmllbGQgfSBmcm9tICcuL3V0aWxzJztcblxuY29uc3QgRXJyb3JBbmNob3IgPSBzdHlsZWQoQW5jaG9yKShcbiAgY3NzKHtcbiAgICBjb2xvcjogJ2ZlZWRiYWNrLWVycm9yJyxcbiAgfSlcbik7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQ29ubmVjdGVkRm9ybUdyb3VwQmFzZVByb3BzXG4gIGV4dGVuZHMgT21pdDxcbiAgICBGb3JtR3JvdXBQcm9wcyxcbiAgICAnbGFiZWwnIHwgJ2Rpc2FibGVkJyB8ICdkZXNjcmlwdGlvbicgfCAnaHRtbEZvcidcbiAgPiB7XG4gIGN1c3RvbUVycm9yPzogc3RyaW5nO1xuICBlcnJvclR5cGU/OiAnaW5pdGlhbCcgfCAnYWJzb2x1dGUnO1xuICBoaWRlTGFiZWw/OiBib29sZWFuO1xuICBuYW1lOiBzdHJpbmc7XG4gIGxhYmVsOiBSZWFjdC5SZWFjdE5vZGU7XG4gIHJlcXVpcmVkPzogYm9vbGVhbjtcbiAgLyoqXG4gICAqIEluZm9UaXAgdG8gZGlzcGxheSBuZXh0IHRvIHRoZSBmaWVsZCBsYWJlbC4gVGhlIEluZm9UaXAgYnV0dG9uIGlzXG4gICAqIGF1dG9tYXRpY2FsbHkgbGFiZWxsZWQgYnkgdGhlIGZpZWxkIGxhYmVsLiBUbyBvdmVycmlkZSB0aGlzIGJlaGF2aW9yLFxuICAgKiBwcm92aWRlIGBhcmlhTGFiZWxgIG9yIGBhcmlhTGFiZWxsZWRieWAuXG4gICAqL1xuICBpbmZvdGlwPzogSW5mb1RpcFN1YkNvbXBvbmVudFByb3BzO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIENvbm5lY3RlZEZvcm1Hcm91cFByb3BzPFQgZXh0ZW5kcyBDb25uZWN0ZWRGaWVsZD5cbiAgZXh0ZW5kcyBTdWJtaXRDb250ZXh0UHJvcHMsXG4gICAgQ29ubmVjdGVkRm9ybUdyb3VwQmFzZVByb3BzIHtcbiAgLyoqXG4gICAqIEFuIG9iamVjdCBjb25zaXN0aW5nIG9mIGEgYGNvbXBvbmVudGAga2V5IHRvIHNwZWNpZnkgd2hhdCBDb25uZWN0ZWRGb3JtSW5wdXQgdG8gcmVuZGVyIC0gdGhlIHJlbWFpbmluZyBrZXkvdmFsdWUgcGFpcnMgYXJlIHRoYXQgY29tcG9uZW50cyBkZXNpcmVkIHByb3BzLlxuICAgKi9cbiAgZmllbGQ6IE9taXQ8UmVhY3QuQ29tcG9uZW50UHJvcHM8VD4sICduYW1lJyB8ICdkaXNhYmxlZCc+ICZcbiAgICBGaWVsZFByb3BzPFQ+ICYge1xuICAgICAgY3VzdG9tVmFsaWRhdGlvbnM/OiBSZWdpc3Rlck9wdGlvbnM7XG4gICAgfTtcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIENvbm5lY3RlZEZvcm1Hcm91cDxUIGV4dGVuZHMgQ29ubmVjdGVkRmllbGQ+KHtcbiAgY3VzdG9tRXJyb3IsXG4gIGNoaWxkcmVuLFxuICBkaXNhYmxlZCA9IGZhbHNlLFxuICBlcnJvclR5cGUgPSAnYWJzb2x1dGUnLFxuICBmaWVsZCxcbiAgaGlkZUxhYmVsLFxuICBpZCxcbiAgbGFiZWwsXG4gIG5hbWUsXG4gIGxhYmVsU2l6ZSxcbiAgc3BhY2luZyA9ICdmaXQnLFxuICBpc1NvbG9GaWVsZCxcbiAgaW5mb3RpcCxcbn06IENvbm5lY3RlZEZvcm1Hcm91cFByb3BzPFQ+KSB7XG4gIGNvbnN0IHsgY29tcG9uZW50OiBDb21wb25lbnQsIGN1c3RvbVZhbGlkYXRpb25zLCAuLi5yZXN0IH0gPSBmaWVsZDtcbiAgY29uc3QgeyBlcnJvciwgaXNGaXJzdEVycm9yLCBpc0Rpc2FibGVkLCBzZXRFcnJvciwgdmFsaWRhdGlvbiB9ID0gdXNlRmllbGQoe1xuICAgIG5hbWUsXG4gICAgZGlzYWJsZWQsXG4gICAgY3VzdG9tVmFsaWRhdGlvbnMsXG4gIH0pO1xuICBjb25zdCB1bmlxdWVJZFN1ZmZpeCA9IHVzZUlkKCk7XG4gIGNvbnN0IGh0bWxGb3JJZCA9IGAke25hbWV9LSR7dW5pcXVlSWRTdWZmaXh9YDtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChjdXN0b21FcnJvcikge1xuICAgICAgc2V0RXJyb3IobmFtZSwge1xuICAgICAgICB0eXBlOiAnbWFudWFsJyxcbiAgICAgICAgbWVzc2FnZTogY3VzdG9tRXJyb3IsXG4gICAgICB9KTtcbiAgICB9XG4gIH0sIFtjdXN0b21FcnJvciwgbmFtZSwgc2V0RXJyb3JdKTtcblxuICBjb25zdCByZW5kZXJlZExhYmVsID0gKFxuICAgIDxGb3JtR3JvdXBMYWJlbFxuICAgICAgZGlzYWJsZWQ9e2lzRGlzYWJsZWR9XG4gICAgICBodG1sRm9yPXtpZCB8fCBodG1sRm9ySWR9XG4gICAgICBpbmZvdGlwPXtpbmZvdGlwfVxuICAgICAgaXNTb2xvRmllbGQ9e2lzU29sb0ZpZWxkfVxuICAgICAgcmVxdWlyZWQ9e0Jvb2xlYW4odmFsaWRhdGlvbj8ucmVxdWlyZWQpfVxuICAgICAgc2l6ZT17bGFiZWxTaXplfVxuICAgID5cbiAgICAgIHtsYWJlbH1cbiAgICA8L0Zvcm1Hcm91cExhYmVsPlxuICApO1xuXG4gIGNvbnN0IHRleHRFcnJvciA9IGN1c3RvbUVycm9yIHx8IGdldEVycm9yTWVzc2FnZShlcnJvcik7XG4gIGNvbnN0IHNob3dFcnJvciA9ICEhKHRleHRFcnJvciAmJiAhaGlkZUxhYmVsKTtcbiAgY29uc3QgZXJyb3JJZCA9IHNob3dFcnJvciA/IGAke2lkIHx8IG5hbWV9X2Vycm9yYCA6IHVuZGVmaW5lZDtcblxuICByZXR1cm4gKFxuICAgIDxGb3JtR3JvdXAgc3BhY2luZz17aGlkZUxhYmVsID8gJ3RpZ2h0JyA6IHNwYWNpbmd9PlxuICAgICAge2hpZGVMYWJlbCA/IDxUZXh0IHNjcmVlbnJlYWRlcj57cmVuZGVyZWRMYWJlbH08L1RleHQ+IDogcmVuZGVyZWRMYWJlbH1cbiAgICAgIDxDb21wb25lbnRcbiAgICAgICAgey4uLihyZXN0IGFzIGFueSl9XG4gICAgICAgIGFyaWEtZGVzY3JpYmVkYnk9e2Vycm9ySWR9XG4gICAgICAgIGFyaWEtaW52YWxpZD17c2hvd0Vycm9yfVxuICAgICAgICBjdXN0b21WYWxpZGF0aW9ucz17Y3VzdG9tVmFsaWRhdGlvbnN9XG4gICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgaHRtbEZvcj17aHRtbEZvcklkfVxuICAgICAgICBuYW1lPXtuYW1lfVxuICAgICAgLz5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICAgIHtzaG93RXJyb3IgJiYgKFxuICAgICAgICA8Rm9ybUVycm9yXG4gICAgICAgICAgYXJpYS1saXZlPXtpc0ZpcnN0RXJyb3IgPyAnYXNzZXJ0aXZlJyA6ICdvZmYnfVxuICAgICAgICAgIGlkPXtlcnJvcklkfVxuICAgICAgICAgIHJvbGU9e2lzRmlyc3RFcnJvciA/ICdhbGVydCcgOiAnc3RhdHVzJ31cbiAgICAgICAgICB2YXJpYW50PXtlcnJvclR5cGV9XG4gICAgICAgID5cbiAgICAgICAgICA8TWFya2Rvd25cbiAgICAgICAgICAgIGlubGluZVxuICAgICAgICAgICAgb3ZlcnJpZGVzPXt7XG4gICAgICAgICAgICAgIGE6IHtcbiAgICAgICAgICAgICAgICBhbGxvd2VkQXR0cmlidXRlczogWydocmVmJywgJ3RhcmdldCddLFxuICAgICAgICAgICAgICAgIGNvbXBvbmVudDogRXJyb3JBbmNob3IsXG4gICAgICAgICAgICAgICAgcHJvY2Vzc05vZGU6IChcbiAgICAgICAgICAgICAgICAgIG5vZGU6IHVua25vd24sXG4gICAgICAgICAgICAgICAgICBwcm9wczogeyBvbkNsaWNrPzogKCkgPT4gdm9pZCB9XG4gICAgICAgICAgICAgICAgKSA9PiB7XG4gICAgICAgICAgICAgICAgICBjb25zdCB7IGtleTogZWxlbWVudEtleSwgLi4ucmVzdCB9ID1cbiAgICAgICAgICAgICAgICAgICAgcHJvcHMgYXMgUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEVycm9yQW5jaG9yPiAmIHtcbiAgICAgICAgICAgICAgICAgICAgICBrZXk/OiBSZWFjdC5LZXk7XG4gICAgICAgICAgICAgICAgICAgIH07XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPEVycm9yQW5jaG9yIGtleT17ZWxlbWVudEtleX0gey4uLnJlc3R9IC8+O1xuICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICB9fVxuICAgICAgICAgICAgc2tpcERlZmF1bHRPdmVycmlkZXM9e3sgYTogdHJ1ZSB9fVxuICAgICAgICAgICAgc3BhY2luZz1cIm5vbmVcIlxuICAgICAgICAgICAgdGV4dD17dGV4dEVycm9yfVxuICAgICAgICAgIC8+XG4gICAgICAgIDwvRm9ybUVycm9yPlxuICAgICAgKX1cbiAgICA8L0Zvcm1Hcm91cD5cbiAgKTtcbn1cbiJdfQ== */");
 export function ConnectedFormGroup({
   customError,
   children,
@@ -45,6 +45,8 @@ export function ConnectedFormGroup({
     disabled,
     customValidations
   });
+  const uniqueIdSuffix = useId();
+  const htmlForId = `${name}-${uniqueIdSuffix}`;
   useEffect(() => {
     if (customError) {
       setError(name, {
@@ -53,10 +55,9 @@ export function ConnectedFormGroup({
       });
     }
   }, [customError, name, setError]);
-  const fieldId = typeof id === 'string' ? id : name;
   const renderedLabel = /*#__PURE__*/_jsx(FormGroupLabel, {
     disabled: isDisabled,
-    htmlFor: fieldId,
+    htmlFor: id || htmlForId,
     infotip: infotip,
     isSoloField: isSoloField,
     required: Boolean(validation?.required),
@@ -65,7 +66,7 @@ export function ConnectedFormGroup({
   });
   const textError = customError || getErrorMessage(error);
   const showError = !!(textError && !hideLabel);
-  const errorId = showError ? `${fieldId}_error` : undefined;
+  const errorId = showError ? `${id || name}_error` : undefined;
   return /*#__PURE__*/_jsxs(FormGroup, {
     spacing: hideLabel ? 'tight' : spacing,
     children: [hideLabel ? /*#__PURE__*/_jsx(Text, {
@@ -77,6 +78,7 @@ export function ConnectedFormGroup({
       "aria-invalid": showError,
       customValidations: customValidations,
       disabled: disabled,
+      htmlFor: htmlForId,
       name: name
     }), children, showError && /*#__PURE__*/_jsx(FormError, {
       "aria-live": isFirstError ? 'assertive' : 'off',

package/dist/ConnectedForm/ConnectedInputs/ConnectedCheckbox.js

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { useId } from 'react';
 import { Controller } from 'react-hook-form';
 import { Checkbox } from '../..';
 import { useField } from '..';
@@ -26,6 +27,7 @@ export const ConnectedCheckbox = ({
     disabled,
     customValidations
   });
+  const uniqueIdSuffix = useId();
   return /*#__PURE__*/_jsx(Controller, {
     control: control,
     defaultValue: false,
@@ -43,7 +45,7 @@ export const ConnectedCheckbox = ({
       checked: value,
       className: className,
       disabled: isDisabled,
-      htmlFor: name,
+      htmlFor: `${name}-${uniqueIdSuffix}`,
       id: id,
       infotip: infotip,
       label: label,

package/dist/ConnectedForm/utils.d.ts

@@ -112,7 +112,7 @@ export declare const USE_DEBOUNCED_FIELD_DIRTY_KEY = "";
  * for something that I think could be modified to make this better
  * but I couldn't get it to work
  */
-type InputTypes = Extract<HTMLInputTypeAttribute, 'number' | 'color' | 'date' | 'datetime-local' | 'time' | 'image' | 'checkbox' | 'text' | 'hidden' | 'password' | 'radio' | 'range' | 'email' | 'search' | 'month' | 'tel' | 'url' | 'week'> | 'textarea' | 'select';
+type InputTypes = Extract<HTMLInputTypeAttribute, 'number' | 'color' | 'date' | 'datetime-local' | 'time' | 'image' | 'checkbox' | 'text' | 'hidden' | 'password' | 'radio' | 'range' | 'email' | 'search' | 'month' | 'tel' | 'time' | 'url' | 'week'> | 'textarea' | 'select';
 type DebouncedFieldProps<T extends InputTypes> = Omit<GetInitialFormValueProps, 'setLocalValue' | 'defaultValue'> & Pick<useFieldProps, 'loading' | 'disabled' | 'name' | 'customValidations'> & {
     type: T;
     shouldDirtyOnChange?: boolean;

package/dist/ConnectedForm/utils.js

@@ -102,7 +102,7 @@ export const useField = ({
     disabled: disabled || formStateDisabled,
     loading
   });
-  const formValidation = validationRules?.[name];
+  const formValidation = (validationRules && validationRules[name]) ?? undefined;
   const validation = useMemo(() => formValidation || customValidations ? {
     ...formValidation,
     ...customValidations

package/dist/DataList/Tables/Rows/TableRow.js

@@ -125,7 +125,11 @@ export const TableRow = ({
         return /*#__PURE__*/_createElement(ListCol, {
           ...colProps,
           key: newKey
-        }, /*#__PURE__*/_jsx(Shimmer, {
+        }, type === 'header' && /*#__PURE__*/_jsx(Text, {
+          as: "span",
+          screenreader: true,
+          children: "Loading data"
+        }), /*#__PURE__*/_jsx(Shimmer, {
           height: "calc(100% - 1rem)",
           minHeight: 24,
           width: "calc(100% - 0.5rem)"

package/dist/DatePicker/DatePickerInput/index.d.ts

@@ -3,7 +3,7 @@ export type DatePickerInputProps = Omit<InputWrapperProps, 'className' | 'type'
     /** In range mode: which part of the range this input edits. Omit for single-date or combined display. */
     rangePart?: 'start' | 'end';
 };
-export declare const DatePickerInput: import("react").ForwardRefExoticComponent<Omit<InputWrapperProps, "color" | "className" | "onChange" | "type" | "value" | "icon"> & {
+export declare const DatePickerInput: import("react").ForwardRefExoticComponent<Omit<InputWrapperProps, "color" | "className" | "onChange" | "type" | "icon" | "value"> & {
     /** In range mode: which part of the range this input edits. Omit for single-date or combined display. */
     rangePart?: "start" | "end";
 } & import("react").RefAttributes<HTMLDivElement>>;