@x15ventures/x15-ui-library 3.15.0 → 3.16.0

package/dist/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.d.ts

@@ -1,23 +1,25 @@
-import { Message, Validate, ValidationRule } from 'react-hook-form';
-import { CustomContentProps, CustomFieldCssClassesProps, FieldProps, FormFieldProps, LabelProps } from '../../../formFieldWrapper/formFieldProps';
+import { ReactElement, ReactNode } from 'react';
+import { CustomContentProps, CustomFieldCssClassesProps, FieldProps, FormFieldProps, LabelProps, ValidationProps } from '../../../formFieldWrapper/formFieldProps';
 export interface InputCheckboxLabelProps extends Omit<LabelProps, 'hide' | 'position'> {
     position?: 'left' | 'right';
 }
+export interface InputCheckboxIconsProps {
+    checked: string | ReactNode | ReactElement;
+    unchecked: string | ReactNode | ReactElement;
+}
 export interface InputCheckboxFieldProps extends Omit<FieldProps, 'type' | 'placeholder' | 'value' | 'defaultValue' | 'referenceDate' | 'includeEmptyOption' | 'options'> {
     value: boolean | string;
     defaultChecked?: boolean;
     defaultValue?: boolean | string | number | readonly string[];
 }
-export interface InputCheckboxValidationProps<TFieldValue = unknown, TFormValues = unknown> {
-    required?: Message | ValidationRule<boolean>;
-    validate?: Validate<TFieldValue, TFormValues> | Record<string, Validate<TFieldValue, TFormValues>>;
-    [key: string]: Message | ValidationRule<RegExp> | ValidationRule<number | string | boolean> | Validate<TFieldValue, TFormValues> | Record<string, Validate<TFieldValue, TFormValues>> | undefined;
+export interface InputCheckboxValidationProps<TFieldValue = unknown, TFormValues = unknown> extends Omit<ValidationProps<TFieldValue, TFormValues>, 'validate'> {
 }
 export interface InputCheckboxProps extends Omit<FormFieldProps, 'label' | 'field' | 'layout' | 'validation'> {
     label: InputCheckboxLabelProps;
     field: InputCheckboxFieldProps;
     validation?: InputCheckboxValidationProps;
     showSpinner?: boolean;
+    icons?: InputCheckboxIconsProps;
     customCssClasses?: CustomFieldCssClassesProps;
     customContent?: CustomContentProps;
 }

package/dist/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inputCheckboxProps.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACpE,OAAO,EACL,kBAAkB,EAClB,0BAA0B,EAC1B,UAAU,EACV,cAAc,EACd,UAAU,EACX,MAAM,0CAA0C,CAAC;AAElD,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,UAAU,CAAC;IACpF,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAC7B;AAED,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,aAAa,GAAG,OAAO,GAAG,cAAc,GAAG,eAAe,GAAG,oBAAoB,GAAG,SAAS,CAAC;IACvK,KAAK,EAAE,OAAO,GAAG,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,YAAY,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,MAAM,EAAE,CAAC;CAC9D;AAED,MAAM,WAAW,4BAA4B,CAAC,WAAW,GAAG,OAAO,EAAE,WAAW,GAAG,OAAO;IACxF,QAAQ,CAAC,EAAE,OAAO,GAAG,cAAc,CAAC,OAAO,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC;IACnG,CAAC,GAAG,EAAE,MAAM,GACR,OAAO,GACP,cAAc,CAAC,MAAM,CAAC,GACtB,cAAc,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,GACzC,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAC,GAClC,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC,GAClD,SAAS,CAAC;CACf;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,YAAY,CAAC;IAC3G,KAAK,EAAE,uBAAuB,CAAC;IAC/B,KAAK,EAAE,uBAAuB,CAAC;IAC/B,UAAU,CAAC,EAAE,4BAA4B,CAAC;IAC1C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gBAAgB,CAAC,EAAE,0BAA0B,CAAC;IAC9C,aAAa,CAAC,EAAE,kBAAkB,CAAC;CACpC"}
+{"version":3,"file":"inputCheckboxProps.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EACL,kBAAkB,EAClB,0BAA0B,EAC1B,UAAU,EACV,cAAc,EACd,UAAU,EACV,eAAe,EAChB,MAAM,0CAA0C,CAAC;AAElD,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,UAAU,CAAC;IACpF,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAC7B;AAED,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,YAAY,CAAC;IAC3C,SAAS,EAAE,MAAM,GAAG,SAAS,GAAG,YAAY,CAAC;CAC9C;AAED,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,aAAa,GAAG,OAAO,GAAG,cAAc,GAAG,eAAe,GAAG,oBAAoB,GAAG,SAAS,CAAC;IACvK,KAAK,EAAE,OAAO,GAAG,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,YAAY,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,MAAM,EAAE,CAAC;CAC9D;AAED,MAAM,WAAW,4BAA4B,CAAC,WAAW,GAAG,OAAO,EAAE,WAAW,GAAG,OAAO,CACxF,SAAQ,IAAI,CAAC,eAAe,CAAC,WAAW,EAAE,WAAW,CAAC,EAAE,UAAU,CAAC;CACpE;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,YAAY,CAAC;IAC3G,KAAK,EAAE,uBAAuB,CAAC;IAC/B,KAAK,EAAE,uBAAuB,CAAC;IAC/B,UAAU,CAAC,EAAE,4BAA4B,CAAC;IAC1C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,uBAAuB,CAAC;IAChC,gBAAgB,CAAC,EAAE,0BAA0B,CAAC;IAC9C,aAAa,CAAC,EAAE,kBAAkB,CAAC;CACpC"}

package/dist/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DragAndDropFileUpload.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAuE,MAAM,OAAO,CAAC;AAY5F,OAAO,EAAE,0BAA0B,EAAE,MAAM,mBAAmB,CAAC;AAO/D,OAAO,8BAA8B,CAAC;AAEtC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAkOtE,CAAC;;;;AAEF,wBAAyC"}
+{"version":3,"file":"DragAndDropFileUpload.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuE,MAAM,OAAO,CAAC;AAW5F,OAAO,EAAE,0BAA0B,EAAE,MAAM,mBAAmB,CAAC;AAO/D,OAAO,8BAA8B,CAAC;AAEtC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAItE,CAAC;;;;AAoOF,wBAAyC"}

package/dist/components/form/formFields/subComponents/inputs/radio/styled/StyledRadioGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StyledRadioGroup.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/form/formFields/subComponents/inputs/radio/styled/StyledRadioGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAO5D,OAAO,yBAAyB,CAAC;AAEjC,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAkF5D,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"StyledRadioGroup.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/form/formFields/subComponents/inputs/radio/styled/StyledRadioGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAO5D,OAAO,yBAAyB,CAAC;AAEjC,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAuF5D,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/form/formFields/subComponents/inputs/text/InputText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputText.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/form/formFields/subComponents/inputs/text/InputText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAiB,MAAM,0CAA0C,CAAC;AAIzF,MAAM,WAAW,cAAe,SAAQ,cAAc,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;CAAI;AAEvG,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA8G9C,CAAC"}
+{"version":3,"file":"InputText.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/form/formFields/subComponents/inputs/text/InputText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAiB,MAAM,0CAA0C,CAAC;AAGzF,MAAM,WAAW,cAAe,SAAQ,cAAc,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;CAAI;AAEvG,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA+G9C,CAAC"}

package/dist/components/form/formFields/subComponents/nestedFormContext.test.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @jest-environment jsdom
+ */
+import '@testing-library/jest-dom';
+//# sourceMappingURL=nestedFormContext.test.d.ts.map

package/dist/components/form/formFields/subComponents/nestedFormContext.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"nestedFormContext.test.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/formFields/subComponents/nestedFormContext.test.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,2BAA2B,CAAC"}

package/dist/components/form/formFields/subComponents/select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/formFields/subComponents/select/Select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EACL,UAAU,EACV,cAAc,EAGf,MAAM,uCAAuC,CAAC;AAG/C,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC;IAC/G,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;CACjC;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAgGxC,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/formFields/subComponents/select/Select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EACL,UAAU,EACV,cAAc,EAGf,MAAM,uCAAuC,CAAC;AAE/C,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC;IAC/G,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;CACjC;AAmGD,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAIxC,CAAC"}

package/dist/components/form/formFields/subComponents/textarea/Textarea.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
-import { FormFieldProps } from '../../formFieldWrapper/formFieldProps';
-interface TextareaProps extends FormFieldProps, React.TextareaHTMLAttributes<HTMLTextAreaElement> {
+import { FormFieldProps, TextareaFieldProps } from '../../formFieldWrapper/formFieldProps';
+import './textarea.scss';
+export interface TextareaProps extends Omit<FormFieldProps, 'field'> {
+    field: Omit<TextareaFieldProps, 'type'>;
 }
 export declare const Textarea: React.FC<TextareaProps>;
-export {};
 //# sourceMappingURL=Textarea.d.ts.map

package/dist/components/form/formFields/subComponents/textarea/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/formFields/subComponents/textarea/Textarea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAIvE,UAAU,aAAc,SAAQ,cAAc,EAAE,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC;CAAG;AAoCpG,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoO5C,CAAC"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/formFields/subComponents/textarea/Textarea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,EACL,cAAc,EACd,kBAAkB,EACnB,MAAM,uCAAuC,CAAC;AAI/C,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC;IAClE,KAAK,EAAE,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;CACzC;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAI5C,CAAC"}

package/dist/components/form/hookFormWrapper/HookFormWrapper.d.ts

@@ -1,8 +1,11 @@
 import React, { ReactNode, ReactElement, FormHTMLAttributes } from 'react';
+import { FieldValues, UseFormReturn } from 'react-hook-form';
 interface FormWrapperProps {
     formCssClass?: string;
     formProps?: FormHTMLAttributes<HTMLFormElement>;
     children: ReactNode | ReactElement;
+    formContext?: UseFormReturn<FieldValues, any, FieldValues>;
+    onSubmit?: (values: FieldValues) => void | Promise<void>;
 }
 export declare const HookFormWrapper: React.FC<FormWrapperProps>;
 export default HookFormWrapper;

package/dist/components/form/hookFormWrapper/HookFormWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HookFormWrapper.d.ts","sourceRoot":"","sources":["../../../../src/components/form/hookFormWrapper/HookFormWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,OAAO,CAAC;AAG3E,UAAU,gBAAgB;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC;IAChD,QAAQ,EAAE,SAAS,GAAG,YAAY,CAAC;CACpC;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA4BtD,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"HookFormWrapper.d.ts","sourceRoot":"","sources":["../../../../src/components/form/hookFormWrapper/HookFormWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,OAAO,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAyC,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEpG,UAAU,gBAAgB;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC;IAChD,QAAQ,EAAE,SAAS,GAAG,YAAY,CAAC;IACnC,WAAW,CAAC,EAAE,aAAa,CAAC,WAAW,EAAE,GAAG,EAAE,WAAW,CAAC,CAAA;IAE1D,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC1D;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAoDtD,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/form/hookFormWrapper/HookFormWrapper.test.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @jest-environment jsdom
+ */
+import '@testing-library/jest-dom';
+//# sourceMappingURL=HookFormWrapper.test.d.ts.map

package/dist/components/form/hookFormWrapper/HookFormWrapper.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HookFormWrapper.test.d.ts","sourceRoot":"","sources":["../../../../src/components/form/hookFormWrapper/HookFormWrapper.test.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,2BAA2B,CAAC"}

package/dist/components/form/validation/ValidationMessages.d.ts

@@ -2,7 +2,14 @@ import React from 'react';
 import { FieldError, FieldErrors, FieldErrorsImpl, Merge } from 'react-hook-form';
 import { ValidationProps } from '../formFields/formFieldWrapper/formFieldProps';
 import { InputCheckboxValidationProps } from '../formFields/subComponents/inputs/checkbox/inputCheckboxProps';
-export declare const GenericErrorMessages: Record<string, (value?: never) => string>;
+export declare const GenericErrorMessages: {
+    required: string;
+    minLength: string;
+    maxLength: string;
+    min: string;
+    max: string;
+    unknown: string;
+};
 export declare const extractError: (errors: FieldErrors, fieldName: string) => FieldError | Merge<FieldError, FieldErrorsImpl<never>> | undefined;
 interface ValidationMessagesProps {
     name: string;

package/dist/components/form/validation/ValidationMessages.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ValidationMessages.d.ts","sourceRoot":"","sources":["../../../../src/components/form/validation/ValidationMessages.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EACL,UAAU,EACV,WAAW,EACX,eAAe,EACf,KAAK,EACN,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,eAAe,EAChB,MAAM,+CAA+C,CAAC;AAEvD,OAAO,EAAE,4BAA4B,EAAE,MAAM,gEAAgE,CAAC;AAG9G,eAAO,MAAM,oBAAoB,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,MAAM,CAO1E,CAAC;AAGF,eAAO,MAAM,YAAY,WACf,WAAW,aACR,MAAM,KAChB,UAAU,GAAG,KAAK,CAAC,UAAU,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC,GAAG,SAiB3D,CAAC;AAEF,UAAU,uBAAuB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,eAAe,GAAG,4BAA4B,CAAA;CAC5D;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAmDhE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"ValidationMessages.d.ts","sourceRoot":"","sources":["../../../../src/components/form/validation/ValidationMessages.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,UAAU,EACV,WAAW,EACX,eAAe,EACf,KAAK,EAGN,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,eAAe,EAChB,MAAM,+CAA+C,CAAC;AACvD,OAAO,EAAE,4BAA4B,EAAE,MAAM,gEAAgE,CAAC;AAG9G,eAAO,MAAM,oBAAoB;;;;;;;CAOhC,CAAC;AAmCF,eAAO,MAAM,YAAY,WACf,WAAW,aACR,MAAM,KAChB,UAAU,GAAG,KAAK,CAAC,UAAU,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC,GAAG,SAiB3D,CAAC;AAEF,UAAU,uBAAuB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,eAAe,GAAG,4BAA4B,CAAA;CAC5D;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA8ChE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/form/validation/ValidationMessages.test.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @jest-environment jsdom
+ */
+import '@testing-library/jest-dom';
+//# sourceMappingURL=ValidationMessages.test.d.ts.map

package/dist/components/form/validation/ValidationMessages.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ValidationMessages.test.d.ts","sourceRoot":"","sources":["../../../../src/components/form/validation/ValidationMessages.test.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,2BAA2B,CAAC"}

package/dist/esm/autoGenerated/libraryThemes.js

@@ -11,8 +11,8 @@ export const libraryThemes = {
       "map": "index.min.css.map"
     },
     "versioned": {
-      "css": "index.min.3.15.0.css",
-      "map": "index.min.3.15.0.css.map"
+      "css": "index.min.3.16.0.css",
+      "map": "index.min.3.16.0.css.map"
     }
   },
   "cba": {
@@ -26,8 +26,8 @@ export const libraryThemes = {
       "map": "cba.min.css.map"
     },
     "versioned": {
-      "css": "cba.min.3.15.0.css",
-      "map": "cba.min.3.15.0.css.map"
+      "css": "cba.min.3.16.0.css",
+      "map": "cba.min.3.16.0.css.map"
     }
   },
   "creditSavvy": {
@@ -41,8 +41,8 @@ export const libraryThemes = {
       "map": "creditSavvy.min.css.map"
     },
     "versioned": {
-      "css": "creditSavvy.min.3.15.0.css",
-      "map": "creditSavvy.min.3.15.0.css.map"
+      "css": "creditSavvy.min.3.16.0.css",
+      "map": "creditSavvy.min.3.16.0.css.map"
     }
   },
   "doshii": {
@@ -56,8 +56,8 @@ export const libraryThemes = {
       "map": "doshii.min.css.map"
     },
     "versioned": {
-      "css": "doshii.min.3.15.0.css",
-      "map": "doshii.min.3.15.0.css.map"
+      "css": "doshii.min.3.16.0.css",
+      "map": "doshii.min.3.16.0.css.map"
     }
   },
   "homeIn": {
@@ -71,8 +71,8 @@ export const libraryThemes = {
       "map": "homeIn.min.css.map"
     },
     "versioned": {
-      "css": "homeIn.min.3.15.0.css",
-      "map": "homeIn.min.3.15.0.css.map"
+      "css": "homeIn.min.3.16.0.css",
+      "map": "homeIn.min.3.16.0.css.map"
     }
   },
   "x15Core": {
@@ -86,8 +86,8 @@ export const libraryThemes = {
       "map": "x15Core.min.css.map"
     },
     "versioned": {
-      "css": "x15Core.min.3.15.0.css",
-      "map": "x15Core.min.3.15.0.css.map"
+      "css": "x15Core.min.3.16.0.css",
+      "map": "x15Core.min.3.16.0.css.map"
     }
   }
 };

package/dist/esm/autoGenerated/libraryThemes.js.map

@@ -1 +1 @@
-{"version":3,"file":"libraryThemes.js","names":["libraryThemes"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n  \"base\": {\n    \"buildPath\": \"styles\",\n    \"dev\": {\n      \"css\": \"index.css\",\n      \"map\": \"index.css.map\"\n    },\n    \"min\": {\n      \"css\": \"index.min.css\",\n      \"map\": \"index.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"index.min.3.15.0.css\",\n      \"map\": \"index.min.3.15.0.css.map\"\n    }\n  },\n  \"cba\": {\n    \"buildPath\": \"styles/themes/cba\",\n    \"dev\": {\n      \"css\": \"cba.css\",\n      \"map\": \"cba.css.map\"\n    },\n    \"min\": {\n      \"css\": \"cba.min.css\",\n      \"map\": \"cba.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"cba.min.3.15.0.css\",\n      \"map\": \"cba.min.3.15.0.css.map\"\n    }\n  },\n  \"creditSavvy\": {\n    \"buildPath\": \"styles/themes/creditSavvy\",\n    \"dev\": {\n      \"css\": \"creditSavvy.css\",\n      \"map\": \"creditSavvy.css.map\"\n    },\n    \"min\": {\n      \"css\": \"creditSavvy.min.css\",\n      \"map\": \"creditSavvy.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"creditSavvy.min.3.15.0.css\",\n      \"map\": \"creditSavvy.min.3.15.0.css.map\"\n    }\n  },\n  \"doshii\": {\n    \"buildPath\": \"styles/themes/doshii\",\n    \"dev\": {\n      \"css\": \"doshii.css\",\n      \"map\": \"doshii.css.map\"\n    },\n    \"min\": {\n      \"css\": \"doshii.min.css\",\n      \"map\": \"doshii.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"doshii.min.3.15.0.css\",\n      \"map\": \"doshii.min.3.15.0.css.map\"\n    }\n  },\n  \"homeIn\": {\n    \"buildPath\": \"styles/themes/homeIn\",\n    \"dev\": {\n      \"css\": \"homeIn.css\",\n      \"map\": \"homeIn.css.map\"\n    },\n    \"min\": {\n      \"css\": \"homeIn.min.css\",\n      \"map\": \"homeIn.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"homeIn.min.3.15.0.css\",\n      \"map\": \"homeIn.min.3.15.0.css.map\"\n    }\n  },\n  \"x15Core\": {\n    \"buildPath\": \"styles/themes/x15Core\",\n    \"dev\": {\n      \"css\": \"x15Core.css\",\n      \"map\": \"x15Core.css.map\"\n    },\n    \"min\": {\n      \"css\": \"x15Core.min.css\",\n      \"map\": \"x15Core.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"x15Core.min.3.15.0.css\",\n      \"map\": \"x15Core.min.3.15.0.css.map\"\n    }\n  }\n}; export default libraryThemes;"],"mappings":"AAAA;AACA,OAAO,MAAMA,aAAa,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAE,eAAeA,aAAa","ignoreList":[]}
+{"version":3,"file":"libraryThemes.js","names":["libraryThemes"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n  \"base\": {\n    \"buildPath\": \"styles\",\n    \"dev\": {\n      \"css\": \"index.css\",\n      \"map\": \"index.css.map\"\n    },\n    \"min\": {\n      \"css\": \"index.min.css\",\n      \"map\": \"index.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"index.min.3.16.0.css\",\n      \"map\": \"index.min.3.16.0.css.map\"\n    }\n  },\n  \"cba\": {\n    \"buildPath\": \"styles/themes/cba\",\n    \"dev\": {\n      \"css\": \"cba.css\",\n      \"map\": \"cba.css.map\"\n    },\n    \"min\": {\n      \"css\": \"cba.min.css\",\n      \"map\": \"cba.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"cba.min.3.16.0.css\",\n      \"map\": \"cba.min.3.16.0.css.map\"\n    }\n  },\n  \"creditSavvy\": {\n    \"buildPath\": \"styles/themes/creditSavvy\",\n    \"dev\": {\n      \"css\": \"creditSavvy.css\",\n      \"map\": \"creditSavvy.css.map\"\n    },\n    \"min\": {\n      \"css\": \"creditSavvy.min.css\",\n      \"map\": \"creditSavvy.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"creditSavvy.min.3.16.0.css\",\n      \"map\": \"creditSavvy.min.3.16.0.css.map\"\n    }\n  },\n  \"doshii\": {\n    \"buildPath\": \"styles/themes/doshii\",\n    \"dev\": {\n      \"css\": \"doshii.css\",\n      \"map\": \"doshii.css.map\"\n    },\n    \"min\": {\n      \"css\": \"doshii.min.css\",\n      \"map\": \"doshii.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"doshii.min.3.16.0.css\",\n      \"map\": \"doshii.min.3.16.0.css.map\"\n    }\n  },\n  \"homeIn\": {\n    \"buildPath\": \"styles/themes/homeIn\",\n    \"dev\": {\n      \"css\": \"homeIn.css\",\n      \"map\": \"homeIn.css.map\"\n    },\n    \"min\": {\n      \"css\": \"homeIn.min.css\",\n      \"map\": \"homeIn.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"homeIn.min.3.16.0.css\",\n      \"map\": \"homeIn.min.3.16.0.css.map\"\n    }\n  },\n  \"x15Core\": {\n    \"buildPath\": \"styles/themes/x15Core\",\n    \"dev\": {\n      \"css\": \"x15Core.css\",\n      \"map\": \"x15Core.css.map\"\n    },\n    \"min\": {\n      \"css\": \"x15Core.min.css\",\n      \"map\": \"x15Core.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"x15Core.min.3.16.0.css\",\n      \"map\": \"x15Core.min.3.16.0.css.map\"\n    }\n  }\n}; export default libraryThemes;"],"mappings":"AAAA;AACA,OAAO,MAAMA,aAAa,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAE,eAAeA,aAAa","ignoreList":[]}

package/dist/esm/autoGenerated/libraryThemes.json

@@ -10,8 +10,8 @@
       "map": "index.min.css.map"
     },
     "versioned": {
-      "css": "base.min.3.15.0.css",
-      "map": "base.min.3.15.0.css.map"
+      "css": "base.min.3.16.0.css",
+      "map": "base.min.3.16.0.css.map"
     }
   },
   "cba": {
@@ -25,8 +25,8 @@
       "map": "cba.min.css.map"
     },
     "versioned": {
-      "css": "cba.min.3.15.0.css",
-      "map": "cba.min.3.15.0.css.map"
+      "css": "cba.min.3.16.0.css",
+      "map": "cba.min.3.16.0.css.map"
     }
   },
   "creditSavvy": {
@@ -40,8 +40,8 @@
       "map": "creditSavvy.min.css.map"
     },
     "versioned": {
-      "css": "creditSavvy.min.3.15.0.css",
-      "map": "creditSavvy.min.3.15.0.css.map"
+      "css": "creditSavvy.min.3.16.0.css",
+      "map": "creditSavvy.min.3.16.0.css.map"
     }
   },
   "doshii": {
@@ -55,8 +55,8 @@
       "map": "doshii.min.css.map"
     },
     "versioned": {
-      "css": "doshii.min.3.15.0.css",
-      "map": "doshii.min.3.15.0.css.map"
+      "css": "doshii.min.3.16.0.css",
+      "map": "doshii.min.3.16.0.css.map"
     }
   },
   "homeIn": {
@@ -70,8 +70,8 @@
       "map": "homeIn.min.css.map"
     },
     "versioned": {
-      "css": "homeIn.min.3.15.0.css",
-      "map": "homeIn.min.3.15.0.css.map"
+      "css": "homeIn.min.3.16.0.css",
+      "map": "homeIn.min.3.16.0.css.map"
     }
   },
   "x15Core": {
@@ -85,8 +85,8 @@
       "map": "x15Core.min.css.map"
     },
     "versioned": {
-      "css": "x15Core.min.3.15.0.css",
-      "map": "x15Core.min.3.15.0.css.map"
+      "css": "x15Core.min.3.16.0.css",
+      "map": "x15Core.min.3.16.0.css.map"
     }
   }
 }

package/dist/esm/components/design/dialog/Dialog.js

@@ -108,7 +108,7 @@ export const Dialog = ({
   }, /*#__PURE__*/React.createElement("section", {
     className: `dialogContent ${customCssClasses?.content || ''}`,
     tabIndex: 0
-  }, children), /*#__PURE__*/React.createElement("div", {
+  }, children), footer && /*#__PURE__*/React.createElement("div", {
     className: `dialogFooter ${customCssClasses?.footer || ''}`,
     tabIndex: 0
   }, typeof footer === 'string' ? /*#__PURE__*/React.createElement("span", {

package/dist/esm/components/design/dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","names":["React","useCallback","useEffect","useRef","useState","useMemo","xmarkLarge","SvgIcon","EllipsisTooltip","useDialogOverlay","useFocusTrap","Dialog","id","size","position","animation","scrollBehaviour","onClose","open","overlay","header","footer","children","screenReaderInstruction","customCssClasses","showFocusOutline","isOpen","setIsOpen","dialogElement","dialogHeaderElement","TOGGLE_TEXT","dialogCloseButton","createOverlay","removeOverlay","HandleClose","dialogCssClass","dialog","HandleOpen","dialogOverlay","showOverlay","current","focus","DialogCloseButton","createElement","ref","className","title","type","onClick","svgDefinition","role","tabIndex","lineClamp","tooltipProps","customCssClass","content"],"sources":["../../../../../src/components/design/dialog/Dialog.tsx"],"sourcesContent":["/* eslint-disable jsxA11y/no-noninteractive-tabindex */\n'use client';\n\nimport React, { ReactNode, useCallback, useEffect, useRef, useState, useMemo } from 'react';\nimport { xmarkLarge } from '@x15ventures/x15-ui-library-icons/iconDefinitions/index';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { EllipsisTooltip } from '../tooltip';\nimport { GenericFunction } from '../../../interfaces';\nimport { useDialogOverlay } from '../../../hooks/DialogOverlay';\nimport { useFocusTrap } from '../../../hooks/FocusTrap';\n\nimport './dialog.scss';\n\nexport interface DialogInterface {\n  id: string;\n  size?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'dynamic';\n  position?: 'left' | 'right' | 'top' | 'bottom' | 'center' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';\n  animation?: 'none' | 'grow' | 'reveal';\n  scrollBehaviour?: 'contentOnly' | 'contentAndFooter' | 'all';\n  onClose: GenericFunction;\n  open?: boolean;\n  overlay?: {\n    parentNode?: HTMLElement;\n    customCssClass?: string;\n  };\n  header: string | ReactNode;\n  footer?: string | ReactNode;\n  children: ReactNode;\n  screenReaderInstruction?: string;\n  showFocusOutline?: boolean;\n  customCssClasses?: {\n    dialog?: string;\n    content?: string;\n    header?: string;\n    footer?: string;\n  };\n}\n\nexport const Dialog: React.FC<DialogInterface> = ({\n  id,\n  size = 'm',\n  position = 'center',\n  animation = 'none',\n  scrollBehaviour = 'contentOnly',\n  onClose = () => {},\n  open = false,\n  overlay,\n  header,\n  footer,\n  children,\n  screenReaderInstruction = `The following content is in a dialog. \n      You can press the Tab key to navigate through the elements, and press Escape to close the dialog.`,\n  customCssClasses,\n  showFocusOutline = false,\n}) => {\n  const [isOpen, setIsOpen] = useState<boolean>(open);\n  const dialogElement = useRef<HTMLDivElement>(null);\n  const dialogHeaderElement = useRef<HTMLDivElement>(null);\n\n  const TOGGLE_TEXT = 'Open and close dialog';\n  const dialogCloseButton = useRef(null);\n\n  const { createOverlay, removeOverlay } = useDialogOverlay(overlay || {});\n  useFocusTrap(dialogElement, () => HandleClose());\n\n  const dialogCssClass = useMemo(() => {\n    return `dialog \n    ${ isOpen || open ? 'isOpen' : '' }\n    dialogSize_${ size }\n    dialogPosition_${ position }\n    dialogAnimation_${ animation }\n    dialogScrollBehaviour_${ scrollBehaviour }\n    ${ size === 'dynamic' ? 'dialogSize_dynamic' : '' }\n    ${ customCssClasses?.dialog || '' }\n    ${ showFocusOutline ? 'showFocusOutline' : '' }`;\n  }, [open, isOpen, size, position, animation, scrollBehaviour, customCssClasses, showFocusOutline]);\n\n  const HandleClose = useCallback(() => {\n    setIsOpen(false);\n    removeOverlay();\n    onClose();\n  }, [onClose, removeOverlay]);\n\n  const HandleOpen = useCallback(() => {\n    const dialogOverlay = createOverlay();\n    dialogOverlay.showOverlay();\n  }, [createOverlay]);\n\n  useEffect(() => {\n    if (open || isOpen) {\n      if (dialogHeaderElement.current) {\n        dialogHeaderElement.current.focus();\n      }\n      HandleOpen();\n    } else {\n      HandleClose();\n    }\n  }, [customCssClasses, createOverlay, open, isOpen, HandleOpen, HandleClose, dialogHeaderElement]);\n\n  const DialogCloseButton: React.FC = () => (\n    <button\n      ref={ dialogCloseButton }\n      className=\"dialogClose\"\n      title={ TOGGLE_TEXT }\n      type=\"button\"\n      onClick={ () => HandleClose() }\n    >\n      <SvgIcon svgDefinition={ xmarkLarge } />\n      <span className=\"sr-only\">Close dialog</span>\n    </button>\n  );\n\n  return (\n    <div\n      className={ dialogCssClass }\n      role=\"dialog\"\n      aria-labelledby={ `dialogHeader_${ id }` }\n      tabIndex={ 0 }\n      aria-describedby={ `dialogSRInstruction_${ id }` }\n      aria-modal=\"true\"\n      ref={ dialogElement }\n    >\n      <div className=\"dialogFullScroller\">\n        <div\n          ref={ dialogHeaderElement }\n          id={ `dialogHeader_${ id }` }\n          className={ `dialogHeader ${ customCssClasses?.header || '' }` }\n          tabIndex={ 0 }\n        >\n          <span id={ `dialogSRInstruction_${ id }` } className=\"sr-only\">\n            { screenReaderInstruction }\n          </span>\n          <div className=\"dialogHeaderTextWrapper\">\n            <EllipsisTooltip \n              lineClamp={ 2 } \n              tooltipProps={ { \n                customCssClass: 'shiftDown large dialogEllipsisTooltip'\n              } }\n            >\n              { typeof header === 'string' ? <span className=\"dialogHeaderText\">{ header }</span> : header }\n            </EllipsisTooltip>\n          </div>\n          <DialogCloseButton />\n        </div>\n\n        <div className=\"dialogContentAndFooterScroller\">\n          <section className={ `dialogContent ${ customCssClasses?.content || '' }` } tabIndex={ 0 }>\n            { children }\n          </section>\n\n          <div className={ `dialogFooter ${ customCssClasses?.footer || '' }` } tabIndex={ 0 }>\n            { typeof footer === 'string' ? <span className=\"dialogFooterText\">{ footer }</span> : footer }\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Dialog.js","names":["React","useCallback","useEffect","useRef","useState","useMemo","xmarkLarge","SvgIcon","EllipsisTooltip","useDialogOverlay","useFocusTrap","Dialog","id","size","position","animation","scrollBehaviour","onClose","open","overlay","header","footer","children","screenReaderInstruction","customCssClasses","showFocusOutline","isOpen","setIsOpen","dialogElement","dialogHeaderElement","TOGGLE_TEXT","dialogCloseButton","createOverlay","removeOverlay","HandleClose","dialogCssClass","dialog","HandleOpen","dialogOverlay","showOverlay","current","focus","DialogCloseButton","createElement","ref","className","title","type","onClick","svgDefinition","role","tabIndex","lineClamp","tooltipProps","customCssClass","content"],"sources":["../../../../../src/components/design/dialog/Dialog.tsx"],"sourcesContent":["/* eslint-disable jsxA11y/no-noninteractive-tabindex */\n'use client';\n\nimport React, { ReactNode, useCallback, useEffect, useRef, useState, useMemo } from 'react';\nimport { xmarkLarge } from '@x15ventures/x15-ui-library-icons/iconDefinitions/index';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { EllipsisTooltip } from '../tooltip';\nimport { GenericFunction } from '../../../interfaces';\nimport { useDialogOverlay } from '../../../hooks/DialogOverlay';\nimport { useFocusTrap } from '../../../hooks/FocusTrap';\n\nimport './dialog.scss';\n\nexport interface DialogInterface {\n  id: string;\n  size?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'dynamic';\n  position?: 'left' | 'right' | 'top' | 'bottom' | 'center' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';\n  animation?: 'none' | 'grow' | 'reveal';\n  scrollBehaviour?: 'contentOnly' | 'contentAndFooter' | 'all';\n  onClose: GenericFunction;\n  open?: boolean;\n  overlay?: {\n    parentNode?: HTMLElement;\n    customCssClass?: string;\n  };\n  header: string | ReactNode;\n  footer?: string | ReactNode;\n  children: ReactNode;\n  screenReaderInstruction?: string;\n  showFocusOutline?: boolean;\n  customCssClasses?: {\n    dialog?: string;\n    content?: string;\n    header?: string;\n    footer?: string;\n  };\n}\n\nexport const Dialog: React.FC<DialogInterface> = ({\n  id,\n  size = 'm',\n  position = 'center',\n  animation = 'none',\n  scrollBehaviour = 'contentOnly',\n  onClose = () => {},\n  open = false,\n  overlay,\n  header,\n  footer,\n  children,\n  screenReaderInstruction = `The following content is in a dialog. \n      You can press the Tab key to navigate through the elements, and press Escape to close the dialog.`,\n  customCssClasses,\n  showFocusOutline = false,\n}) => {\n  const [isOpen, setIsOpen] = useState<boolean>(open);\n  const dialogElement = useRef<HTMLDivElement>(null);\n  const dialogHeaderElement = useRef<HTMLDivElement>(null);\n\n  const TOGGLE_TEXT = 'Open and close dialog';\n  const dialogCloseButton = useRef(null);\n\n  const { createOverlay, removeOverlay } = useDialogOverlay(overlay || {});\n  useFocusTrap(dialogElement, () => HandleClose());\n\n  const dialogCssClass = useMemo(() => {\n    return `dialog \n    ${ isOpen || open ? 'isOpen' : '' }\n    dialogSize_${ size }\n    dialogPosition_${ position }\n    dialogAnimation_${ animation }\n    dialogScrollBehaviour_${ scrollBehaviour }\n    ${ size === 'dynamic' ? 'dialogSize_dynamic' : '' }\n    ${ customCssClasses?.dialog || '' }\n    ${ showFocusOutline ? 'showFocusOutline' : '' }`;\n  }, [open, isOpen, size, position, animation, scrollBehaviour, customCssClasses, showFocusOutline]);\n\n  const HandleClose = useCallback(() => {\n    setIsOpen(false);\n    removeOverlay();\n    onClose();\n  }, [onClose, removeOverlay]);\n\n  const HandleOpen = useCallback(() => {\n    const dialogOverlay = createOverlay();\n    dialogOverlay.showOverlay();\n  }, [createOverlay]);\n\n  useEffect(() => {\n    if (open || isOpen) {\n      if (dialogHeaderElement.current) {\n        dialogHeaderElement.current.focus();\n      }\n      HandleOpen();\n    } else {\n      HandleClose();\n    }\n  }, [customCssClasses, createOverlay, open, isOpen, HandleOpen, HandleClose, dialogHeaderElement]);\n\n  const DialogCloseButton: React.FC = () => (\n    <button\n      ref={ dialogCloseButton }\n      className=\"dialogClose\"\n      title={ TOGGLE_TEXT }\n      type=\"button\"\n      onClick={ () => HandleClose() }\n    >\n      <SvgIcon svgDefinition={ xmarkLarge } />\n      <span className=\"sr-only\">Close dialog</span>\n    </button>\n  );\n\n  return (\n    <div\n      className={ dialogCssClass }\n      role=\"dialog\"\n      aria-labelledby={ `dialogHeader_${ id }` }\n      tabIndex={ 0 }\n      aria-describedby={ `dialogSRInstruction_${ id }` }\n      aria-modal=\"true\"\n      ref={ dialogElement }\n    >\n      <div className=\"dialogFullScroller\">\n        <div\n          ref={ dialogHeaderElement }\n          id={ `dialogHeader_${ id }` }\n          className={ `dialogHeader ${ customCssClasses?.header || '' }` }\n          tabIndex={ 0 }\n        >\n          <span id={ `dialogSRInstruction_${ id }` } className=\"sr-only\">\n            { screenReaderInstruction }\n          </span>\n          <div className=\"dialogHeaderTextWrapper\">\n            <EllipsisTooltip \n              lineClamp={ 2 } \n              tooltipProps={ { \n                customCssClass: 'shiftDown large dialogEllipsisTooltip'\n              } }\n            >\n              { typeof header === 'string' ? <span className=\"dialogHeaderText\">{ header }</span> : header }\n            </EllipsisTooltip>\n          </div>\n          <DialogCloseButton />\n        </div>\n\n        <div className=\"dialogContentAndFooterScroller\">\n          <section className={ `dialogContent ${ customCssClasses?.content || '' }` } tabIndex={ 0 }>\n            { children }\n          </section>\n\n          {\n            footer && (\n              <div className={ `dialogFooter ${ customCssClasses?.footer || '' }` } tabIndex={ 0 }>\n                { typeof footer === 'string' ? <span className=\"dialogFooterText\">{ footer }</span> : footer }\n              </div>\n            )\n          }\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/design/headerBar/HeaderBar.js

@@ -13,6 +13,7 @@ export const HeaderBar = ({
   rightIcon,
   buttons,
   notificationIcon,
+  headingLevel = 2,
   children
 }) => {
   const headerCssClass = `headerBar 
@@ -20,9 +21,10 @@ export const HeaderBar = ({
     ${rightIcon ? 'withRightIcon' : ''}
     ${notificationIcon ? 'withNotification' : ''}
     `;
+  const Heading = `h${headingLevel}`;
   return /*#__PURE__*/React.createElement("header", {
     className: headerCssClass
-  }, leftIcon && /*#__PURE__*/React.createElement(Icon, leftIcon), text && /*#__PURE__*/React.createElement("h2", null, text), children, buttons && /*#__PURE__*/React.createElement("div", {
+  }, leftIcon && /*#__PURE__*/React.createElement(Icon, leftIcon), text && /*#__PURE__*/React.createElement(Heading, null, text), children, buttons && /*#__PURE__*/React.createElement("div", {
     className: "headerButtons"
   }, buttons.map(button => {
     if (button.kind === 'notifications') {

package/dist/esm/components/design/headerBar/HeaderBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderBar.js","names":["_extends","React","Icon","NotificationIcon","SimpleButton","NotificationsButton","HeaderBar","text","leftIcon","rightIcon","buttons","notificationIcon","children","headerCssClass","createElement","className","map","button","kind","key","id"],"sources":["../../../../../src/components/design/headerBar/HeaderBar.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { HeaderTextInterface } from '../../../interfaces/headerText.interface';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { NotificationIcon } from '../icons/notificationIcon/NotificationIcon';\nimport { SimpleButton } from '../../form/buttons/SimpleButton';\nimport { NotificationsButton } from '../../form/buttons/notificationsButton/NotificationsButton';\nimport { ButtonProps } from '../../form/buttons/button.interface';\n\nimport './headerBar.scss';\n\nexport const HeaderBar: React.FC<HeaderTextInterface> = (\n  {\n    text,\n    leftIcon,\n    rightIcon,\n    buttons,\n    notificationIcon,\n    children\n  }\n) => {\n  const headerCssClass = `headerBar \n    ${ leftIcon ? 'withLeftIcon' : '' }\n    ${ rightIcon ? 'withRightIcon' : '' }\n    ${ notificationIcon ? 'withNotification' : '' }\n    `;\n\n  return (\n    <header className={ headerCssClass }>\n      {\n        leftIcon && <Icon { ...leftIcon } />\n      }\n\n      {\n        text && <h2>{ text }</h2>\n      }\n\n      { children }\n\n      {\n        buttons\n        && (\n          <div className=\"headerButtons\">\n            {\n              buttons.map((button) => {\n                if (button.kind === 'notifications') {\n                  return <NotificationsButton key={ button.id } { ...button } />;\n                }\n                return <SimpleButton key={ button.id } { ...(button as ButtonProps) } />;\n              })\n            }\n          </div>\n        )\n      }\n\n      {\n        rightIcon && <Icon { ...rightIcon } />\n      }\n\n      {\n        notificationIcon && <NotificationIcon { ...notificationIcon } />\n      }\n    </header>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,MAAM,OAAO;AAEzB,SAASC,IAAI,QAAQ,yBAAyB;AAC9C,SAASC,gBAAgB,QAAQ,4CAA4C;AAC7E,SAASC,YAAY,QAAQ,iCAAiC;AAC9D,SAASC,mBAAmB,QAAQ,4DAA4D;AAGhG,OAAO,kBAAkB;AAEzB,OAAO,MAAMC,SAAwC,GAAGA,CACtD;EACEC,IAAI;EACJC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,gBAAgB;EAChBC;AACF,CAAC,KACE;EACH,MAAMC,cAAc,GAAG;AACzB,MAAOL,QAAQ,GAAG,cAAc,GAAG,EAAE;AACrC,MAAOC,SAAS,GAAG,eAAe,GAAG,EAAE;AACvC,MAAOE,gBAAgB,GAAG,kBAAkB,GAAG,EAAE;AACjD,KAAK;EAEH,oBACEV,KAAA,CAAAa,aAAA;IAAQC,SAAS,EAAGF;EAAgB,GAEhCL,QAAQ,iBAAIP,KAAA,CAAAa,aAAA,CAACZ,IAAI,EAAMM,QAAY,CAAC,EAIpCD,IAAI,iBAAIN,KAAA,CAAAa,aAAA,aAAMP,IAAU,CAAC,EAGzBK,QAAQ,EAGRF,OAAO,iBAELT,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAC;EAAe,GAE1BL,OAAO,CAACM,GAAG,CAAEC,MAAM,IAAK;IACtB,IAAIA,MAAM,CAACC,IAAI,KAAK,eAAe,EAAE;MACnC,oBAAOjB,KAAA,CAAAa,aAAA,CAACT,mBAAmB,EAAAL,QAAA;QAACmB,GAAG,EAAGF,MAAM,CAACG;MAAI,GAAMH,MAAM,CAAI,CAAC;IAChE;IACA,oBAAOhB,KAAA,CAAAa,aAAA,CAACV,YAAY,EAAAJ,QAAA;MAACmB,GAAG,EAAGF,MAAM,CAACG;IAAI,GAAOH,MAAM,CAAoB,CAAC;EAC1E,CAAC,CAEA,CACN,EAIDR,SAAS,iBAAIR,KAAA,CAAAa,aAAA,CAACZ,IAAI,EAAMO,SAAa,CAAC,EAItCE,gBAAgB,iBAAIV,KAAA,CAAAa,aAAA,CAACX,gBAAgB,EAAMQ,gBAAoB,CAE3D,CAAC;AAEb,CAAC","ignoreList":[]}
+{"version":3,"file":"HeaderBar.js","names":["_extends","React","Icon","NotificationIcon","SimpleButton","NotificationsButton","HeaderBar","text","leftIcon","rightIcon","buttons","notificationIcon","headingLevel","children","headerCssClass","Heading","createElement","className","map","button","kind","key","id"],"sources":["../../../../../src/components/design/headerBar/HeaderBar.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { HeaderTextInterface } from '../../../interfaces/headerText.interface';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { NotificationIcon } from '../icons/notificationIcon/NotificationIcon';\nimport { SimpleButton } from '../../form/buttons/SimpleButton';\nimport { NotificationsButton } from '../../form/buttons/notificationsButton/NotificationsButton';\nimport { ButtonProps } from '../../form/buttons/button.interface';\n\nimport './headerBar.scss';\n\ntype HeadingLevel = NonNullable<HeaderTextInterface['headingLevel']>;\ntype HeadingTag = `h${ HeadingLevel }`;\n\nexport const HeaderBar: React.FC<HeaderTextInterface> = (\n  {\n    text,\n    leftIcon,\n    rightIcon,\n    buttons,\n    notificationIcon,\n    headingLevel = 2,\n    children\n  }\n) => {\n  const headerCssClass = `headerBar \n    ${ leftIcon ? 'withLeftIcon' : '' }\n    ${ rightIcon ? 'withRightIcon' : '' }\n    ${ notificationIcon ? 'withNotification' : '' }\n    `;\n  const Heading: HeadingTag = `h${ headingLevel }`;\n\n  return (\n    <header className={ headerCssClass }>\n      {\n        leftIcon && <Icon { ...leftIcon } />\n      }\n\n      {\n        text && <Heading>{ text }</Heading>\n      }\n\n      { children }\n\n      {\n        buttons\n        && (\n          <div className=\"headerButtons\">\n            {\n              buttons.map((button) => {\n                if (button.kind === 'notifications') {\n                  return <NotificationsButton key={ button.id } { ...button } />;\n                }\n                return <SimpleButton key={ button.id } { ...(button as ButtonProps) } />;\n              })\n            }\n          </div>\n        )\n      }\n\n      {\n        rightIcon && <Icon { ...rightIcon } />\n      }\n\n      {\n        notificationIcon && <NotificationIcon { ...notificationIcon } />\n      }\n    </header>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,MAAM,OAAO;AAEzB,SAASC,IAAI,QAAQ,yBAAyB;AAC9C,SAASC,gBAAgB,QAAQ,4CAA4C;AAC7E,SAASC,YAAY,QAAQ,iCAAiC;AAC9D,SAASC,mBAAmB,QAAQ,4DAA4D;AAGhG,OAAO,kBAAkB;AAKzB,OAAO,MAAMC,SAAwC,GAAGA,CACtD;EACEC,IAAI;EACJC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,gBAAgB;EAChBC,YAAY,GAAG,CAAC;EAChBC;AACF,CAAC,KACE;EACH,MAAMC,cAAc,GAAG;AACzB,MAAON,QAAQ,GAAG,cAAc,GAAG,EAAE;AACrC,MAAOC,SAAS,GAAG,eAAe,GAAG,EAAE;AACvC,MAAOE,gBAAgB,GAAG,kBAAkB,GAAG,EAAE;AACjD,KAAK;EACH,MAAMI,OAAmB,GAAG,IAAKH,YAAY,EAAG;EAEhD,oBACEX,KAAA,CAAAe,aAAA;IAAQC,SAAS,EAAGH;EAAgB,GAEhCN,QAAQ,iBAAIP,KAAA,CAAAe,aAAA,CAACd,IAAI,EAAMM,QAAY,CAAC,EAIpCD,IAAI,iBAAIN,KAAA,CAAAe,aAAA,CAACD,OAAO,QAAGR,IAAe,CAAC,EAGnCM,QAAQ,EAGRH,OAAO,iBAELT,KAAA,CAAAe,aAAA;IAAKC,SAAS,EAAC;EAAe,GAE1BP,OAAO,CAACQ,GAAG,CAAEC,MAAM,IAAK;IACtB,IAAIA,MAAM,CAACC,IAAI,KAAK,eAAe,EAAE;MACnC,oBAAOnB,KAAA,CAAAe,aAAA,CAACX,mBAAmB,EAAAL,QAAA;QAACqB,GAAG,EAAGF,MAAM,CAACG;MAAI,GAAMH,MAAM,CAAI,CAAC;IAChE;IACA,oBAAOlB,KAAA,CAAAe,aAAA,CAACZ,YAAY,EAAAJ,QAAA;MAACqB,GAAG,EAAGF,MAAM,CAACG;IAAI,GAAOH,MAAM,CAAoB,CAAC;EAC1E,CAAC,CAEA,CACN,EAIDV,SAAS,iBAAIR,KAAA,CAAAe,aAAA,CAACd,IAAI,EAAMO,SAAa,CAAC,EAItCE,gBAAgB,iBAAIV,KAAA,CAAAe,aAAA,CAACb,gBAAgB,EAAMQ,gBAAoB,CAE3D,CAAC;AAEb,CAAC","ignoreList":[]}

package/dist/esm/components/design/headerBar/headerBar.css

@@ -26,7 +26,12 @@
   right: 0;
   left: auto;
 }
-.headerBar h2 {
+.headerBar h1,
+.headerBar h2,
+.headerBar h3,
+.headerBar h4,
+.headerBar h5,
+.headerBar h6 {
   text-overflow: ellipsis;
   white-space: nowrap;
   overflow: hidden;

package/dist/esm/components/design/tooltip/Tooltip.js

@@ -18,7 +18,8 @@ export const Tooltip = props => {
     containsBlockElements = false,
     children,
     label = 'Toggle tooltip open state',
-    showPointer = true
+    showPointer = true,
+    hoverDelay
     // visualIndicators will be handled below
   } = props;
 
@@ -28,38 +29,89 @@ export const Tooltip = props => {
     colouredText: true
   } : undefined;
   const [isOpen, setIsOpen] = useState(false);
+  const [isHovered, setIsHovered] = useState(false);
   const tooltipElement = useRef(null);
   const triggerElement = useRef(null);
   const contentElement = useRef(null);
+  const hoverTimer = useRef(null);
   const iconIsElement = /*#__PURE__*/React.isValidElement(icon);
-  useOnClickOutside(tooltipElement, () => setIsOpen(false));
+
+  // Hover is handled in css by default. It is only taken over by js when a delay is requested.
+  const hasHoverDelay = typeof hoverDelay === 'number' && hoverDelay > 0;
+  const isVisible = isOpen || isHovered;
+  const clearHoverTimer = useCallback(() => {
+    if (hoverTimer.current) {
+      clearTimeout(hoverTimer.current);
+      hoverTimer.current = null;
+    }
+  }, []);
+  const handleMouseEnter = useCallback(() => {
+    clearHoverTimer();
+    hoverTimer.current = setTimeout(() => setIsHovered(true), hoverDelay);
+  }, [clearHoverTimer, hoverDelay]);
+  const handleMouseLeave = useCallback(() => {
+    clearHoverTimer();
+    setIsHovered(false);
+  }, [clearHoverTimer]);
+
+  // Single dismissal path, so every close route clears both the click and hover state
+  const dismiss = useCallback(() => {
+    clearHoverTimer();
+    setIsHovered(false);
+    setIsOpen(false);
+  }, [clearHoverTimer]);
+  const handleTriggerClick = useCallback(() => {
+    if (isVisible) {
+      dismiss();
+      return;
+    }
+    clearHoverTimer();
+    setIsOpen(true);
+  }, [isVisible, dismiss, clearHoverTimer]);
+
+  // Releasing the delay detaches the mouse handlers, so reset any hover state they left behind
+  useEffect(() => {
+    if (!hasHoverDelay) {
+      clearHoverTimer();
+      setIsHovered(false);
+    }
+  }, [hasHoverDelay, clearHoverTimer]);
+  useEffect(() => clearHoverTimer, [clearHoverTimer]);
+  const hoverHandlers = hasHoverDelay ? {
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  } : {};
+  useOnClickOutside(tooltipElement, dismiss);
   useOnEdgeProximityDetect({
     triggerRef: triggerElement,
     wrapperRef: tooltipElement,
     contentRef: contentElement,
-    requiresRecalc: isOpen
+    requiresRecalc: isVisible
   });
 
   // Handle special key presses
   const handleSpecialKeyPresses = useCallback(event => {
     if (event.key === 'Escape' || event.keyCode === 27) {
-      setIsOpen(false);
+      dismiss();
     }
-  }, [setIsOpen]);
+  }, [dismiss]);
   useEffect(() => {
-    if (tooltipElement.current) {
-      tooltipElement.current.addEventListener('keydown', handleSpecialKeyPresses);
+    const wrapper = tooltipElement.current;
+    if (!wrapper) {
+      return undefined;
     }
+    wrapper.addEventListener('keydown', handleSpecialKeyPresses);
+    return () => wrapper.removeEventListener('keydown', handleSpecialKeyPresses);
   }, [handleSpecialKeyPresses]);
   if (containsBlockElements) {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement("div", _extends({
       role: "tooltip",
       ref: tooltipElement,
-      className: `tooltip tooltip_block ${isOpen ? 'isOpen' : ''} ${triggerStyle === 'text' && 'textDisplay'} ${customCssClass || ''}`
-    }, /*#__PURE__*/React.createElement("button", _extends({
+      className: `tooltip tooltip_block ${isVisible ? 'isOpen' : ''} ${hasHoverDelay ? 'hoverDelayed' : ''} ${triggerStyle === 'text' ? 'textDisplay' : ''} ${customCssClass || ''}`
+    }, hoverHandlers), /*#__PURE__*/React.createElement("button", _extends({
       ref: triggerElement,
       type: "button",
-      onClick: () => setIsOpen(!isOpen),
+      onClick: handleTriggerClick,
       className: `button ${triggerStyle === 'text' ? 'text_only' : 'icon_only'} ${triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : ''} ${triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : ''}`
     }, triggerId ? {
       'id': triggerId,
@@ -77,13 +129,13 @@ export const Tooltip = props => {
       id: `${triggerId}_content`
     } : {}), children));
   }
-  return /*#__PURE__*/React.createElement("span", {
+  return /*#__PURE__*/React.createElement("span", _extends({
     ref: tooltipElement,
-    className: `tooltip ${isOpen ? 'isOpen' : ''} ${triggerStyle === 'text' && 'textDisplay'} ${customCssClass || ''}`
-  }, /*#__PURE__*/React.createElement("button", _extends({
+    className: `tooltip ${isVisible ? 'isOpen' : ''} ${hasHoverDelay ? 'hoverDelayed' : ''} ${triggerStyle === 'text' ? 'textDisplay' : ''} ${customCssClass || ''}`
+  }, hoverHandlers), /*#__PURE__*/React.createElement("button", _extends({
     ref: triggerElement,
     type: "button",
-    onClick: () => setIsOpen(!isOpen),
+    onClick: handleTriggerClick,
     className: `button ${triggerStyle === 'text' ? 'text_only' : 'icon_only'} ${triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : ''} ${triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : ''}`
   }, triggerId ? {
     id: triggerId