@transferwise/components 0.0.0-experimental-1ea2b9d → 0.0.0-experimental-d4643d9

package/src/common/hooks/useHasIntersected/{useHasIntersected.ts → useHasIntersected.js}

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
 
-const ObserverParams: IntersectionObserverInit = {
+const ObserverParams = {
   threshold: 0.1,
 };
 
@@ -9,19 +9,13 @@ const ObserverParams: IntersectionObserverInit = {
  * Use this custom hook to detect when an element has became visible inside the viewport. This hook checks only if the intersection happend.
  * Once the intersection has happened the hook will not return false even if the element gets out of the viewport.
  *
- * @param {object} params
- * @param {object} [params.elRef] - node object that contains a react reference to the element that needs to be observed.
- * @param {string} [params.loading = 'eager'] - string that contains the type of loading.
+ * @param elRef.elRef
+ * @param {object} [elRef] - node object that contains a react reference to the element that needs to be observed.
+ * @param {strimng} [loading = 'eager'] - string that contains the type of loading.
  * @param elRef.loading
  * @usage `const [hasIntersected] = useHasIntersected({imageRef,loading});`
  */
-export const useHasIntersected = ({
-  elRef,
-  loading = 'eager',
-}: {
-  elRef: React.RefObject<HTMLElement>;
-  loading?: 'eager' | 'lazy';
-}) => {
+export const useHasIntersected = ({ elRef, loading }) => {
   const [hasIntersected, setHasIntersected] = useState(false);
 
   const { current } = elRef || {};
@@ -30,29 +24,29 @@ export const useHasIntersected = ({
     return elRef && current;
   };
 
-  const handleOnIntersect: IntersectionObserverCallback = (entries, observer) => {
+  const handleOnIntersect = (entries, observer) => {
     entries.forEach((entry) => {
       if (entry.isIntersecting) {
         setHasIntersected(true);
-        observer.unobserve(current!);
+        observer.unobserve(current);
       }
     });
   };
 
   useEffect(() => {
-    let observer: IntersectionObserver | undefined;
+    let observer;
     let didCancel = false;
 
-    // Check if window is defined for SSR and Old browsers fallback
+    // Check if window is define for SSR and Old browsers fallback
     if (typeof window === 'undefined' || !window.IntersectionObserver || !isValidReference()) {
       setHasIntersected(true);
-    } else if (current && !didCancel) {
+    } else if (!didCancel) {
       observer = new IntersectionObserver(handleOnIntersect, ObserverParams);
       observer.observe(current);
     }
     return () => {
       didCancel = true;
-      if (observer && current) {
+      if (observer) {
         observer.unobserve(current);
       }
     };

package/src/common/{requirements.ts → requirements.js}

@@ -1,67 +1,7 @@
 /* eslint-disable no-unused-vars */
 /* eslint-disable no-param-reassign */
 
-import { PrimitiveType } from 'react-intl';
-
-type ValidationMessages = Record<string, string>;
-
-type Value = {
-  label?: string;
-  title?: string;
-  name?: string;
-  value?: PrimitiveType;
-  code?: string | number;
-  key?: PrimitiveType;
-};
-
-type Field = {
-  name?: string;
-  title?: string;
-  type?: string;
-  control?: string;
-  format?: string;
-  pattern?: string;
-  minimum?: number;
-  maximum?: number;
-  max?: number;
-  min?: number;
-  width?: string;
-  example?: string;
-  placeholder?: string;
-  info?: string;
-  tooltip?: string;
-  help?: { message: string };
-  valuesAllowed?: Value[];
-  values?: Value[];
-  default?: Value;
-  value?: Value;
-  validationMessages?: ValidationMessages;
-  validationRegexp?: string;
-  properties: Record<string, Field>;
-  hidden?: boolean;
-  key?: string;
-  fields?: Field[];
-  groups?: Field[];
-  [otherKey: string]: any; // For additional fields
-};
-
-type FieldMapType = Record<string, Field>;
-
-type Alternative = {
-  title?: string;
-  label?: string;
-  type?: string;
-  types: string[];
-  name?: string;
-  description?: string;
-  tooltip?: string;
-  fields?: Field[];
-  fieldGroups?: Field[];
-  properties?: Record<string, any>;
-  prepared?: boolean;
-};
-
-const prepRequirements = (alternatives: Alternative[]) => {
+const prepRequirements = (alternatives) => {
   if (!alternatives || alternatives.length === 0) {
     return [];
   }
@@ -75,8 +15,7 @@ const prepRequirements = (alternatives: Alternative[]) => {
 
     prepLegacyAlternatives(alternative);
 
-    const fieldsToPrep = Array.isArray(alternative.fields) ? alternative.fields : [];
-    alternative.properties = prepFields(fieldsToPrep) || alternative.properties;
+    alternative.properties = prepFields(alternative.properties || alternative.fields);
 
     // If we're still treating type as a special case, move it to a hidden value
     if (alternative.type && alternative.type !== 'object' && !alternative.types) {
@@ -96,14 +35,16 @@ const prepRequirements = (alternatives: Alternative[]) => {
   return preppedAlternatives;
 };
 
-const prepFields = (fields: Field[], model?: any, validationMessages?: any): FieldMapType => {
+const prepFields = (fields, model, validationMessages) => {
   if (!fields) {
     return {};
   }
 
-  const preparedFields = transformNestedKeysToNestedSpecs(
-    transformFieldArrayToMap(flattenFieldsWithGroups(copyOf(fields))),
-  );
+  let preparedFields = copyOf(fields);
+
+  preparedFields = flattenFieldsWithGroups(preparedFields);
+  preparedFields = transformFieldArrayToMap(preparedFields);
+  preparedFields = transformNestedKeysToNestedSpecs(preparedFields);
 
   Object.keys(preparedFields).forEach((key) => {
     preparedFields[key] = prepField(preparedFields[key], model, validationMessages);
@@ -112,7 +53,7 @@ const prepFields = (fields: Field[], model?: any, validationMessages?: any): Fie
   return preparedFields;
 };
 
-const prepField = (field: Field, model: unknown, validationMessages: ValidationMessages) => {
+const prepField = (field, model, validationMessages) => {
   const preparedField = copyOf(field);
 
   prepLegacyProps(preparedField);
@@ -130,10 +71,9 @@ const prepField = (field: Field, model: unknown, validationMessages: ValidationM
  *
  * @param fields
  */
-const flattenFieldsWithGroups = (fields?: Field[]): Field[] => {
+const flattenFieldsWithGroups = (fields) => {
   if (Array.isArray(fields)) {
-    let flattenedFields: Field[] = [];
-
+    let flattenedFields = [];
     fields.forEach((field) => {
       // If we've been given a group with nested fields, break them out.
       if (field.fields) {
@@ -147,11 +87,10 @@ const flattenFieldsWithGroups = (fields?: Field[]): Field[] => {
     });
     return flattenedFields;
   }
-
-  return fields || [];
+  return fields;
 };
 
-const flattenFieldWithGroup = (field: Field, subFields: Field[]): Field[] => {
+const flattenFieldWithGroup = (field, subFields) => {
   // If first field doesn't have a label, use the one from the group
   if (field.name && subFields.length > 0 && !subFields[0].name) {
     subFields[0].name = field.name;
@@ -190,26 +129,18 @@ const flattenFieldWithGroup = (field: Field, subFields: Field[]): Field[] => {
  * Some older requirements return an array of fields, where it should be a map
  * from the property name to the spec.  This converts arrays to maps.
  */
-const transformFieldArrayToMap = (fields?: Field[]): FieldMapType => {
+const transformFieldArrayToMap = (fields) => {
   if (Array.isArray(fields)) {
-    const fieldMap: FieldMapType = {};
-
-    fields.forEach((field: Field) => {
-      const newKey = field.key || field.name;
-
-      if ('key' in field) {
-        delete field.key;
-      }
+    const fieldMap = {};
+    fields.forEach((field) => {
+      const key = field.key || field.name;
+      delete field.key;
 
-      if (newKey) {
-        fieldMap[newKey] = copyOf(field);
-      }
+      fieldMap[key] = copyOf(field);
     });
-
     return fieldMap;
   }
-
-  return fields ?? {};
+  return fields;
 };
 
 /*
@@ -218,13 +149,12 @@ const transformFieldArrayToMap = (fields?: Field[]): FieldMapType => {
  * type 'object', and nests such fields inside of it.  When we render we pass
  * this object spec to a nested fieldset.
  */
-const transformNestedKeysToNestedSpecs = (fieldMap: FieldMapType): Record<string, Field> => {
+const transformNestedKeysToNestedSpecs = (fieldMap) => {
   if (Array.isArray(fieldMap)) {
     throw new TypeError('Expecting a map of fields, not an array');
   }
 
-  const nestedFields: FieldMapType = {};
-
+  const nestedFields = {};
   Object.keys(fieldMap).forEach((key) => {
     if (key.indexOf('.') > 0) {
       // If the key contains a period we need to nest the fields in another object
@@ -246,8 +176,8 @@ const transformNestedKeysToNestedSpecs = (fieldMap: FieldMapType): Record<string
   return nestedFields;
 };
 
-const prepType = (field: Field) => {
-  const type = field.type?.toLowerCase?.();
+const prepType = (field) => {
+  const type = field.type && field.type.toLowerCase && field.type.toLowerCase();
 
   switch (type) {
     case 'text':
@@ -294,7 +224,7 @@ const prepType = (field: Field) => {
   }
 };
 
-const prepLegacyAlternatives = (alternative: Alternative) => {
+const prepLegacyAlternatives = (alternative) => {
   if (!alternative.title && alternative.label) {
     alternative.title = alternative.label;
   }
@@ -313,7 +243,7 @@ const prepLegacyAlternatives = (alternative: Alternative) => {
   }
 };
 
-const prepLegacyProps = (field: Field) => {
+const prepLegacyProps = (field) => {
   if (field.name && !field.title) {
     field.title = field.name;
     delete field.name;
@@ -349,7 +279,7 @@ const prepLegacyProps = (field: Field) => {
     delete field.valuesAllowed;
   }
 
-  if (field.values && Array.isArray(field.values)) {
+  if (field.values && field.values.map) {
     field.values = prepLegacyValues(field.values);
   }
 
@@ -374,9 +304,9 @@ const prepLegacyProps = (field: Field) => {
   }
 };
 
-const prepLegacyValues = (values: Value[]) => values.map(prepLegacyValue);
+const prepLegacyValues = (values) => values.map(prepLegacyValue);
 
-const prepLegacyValue = (value: Value) => {
+const prepLegacyValue = (value) => {
   if (!value.label && value.title) {
     value.label = value.title;
     delete value.title;
@@ -398,7 +328,7 @@ const prepLegacyValue = (value: Value) => {
   return value;
 };
 
-const prepPattern = (field: Field) => {
+const prepPattern = (field) => {
   if (field.pattern) {
     try {
       new RegExp(field.pattern);
@@ -412,7 +342,7 @@ const prepPattern = (field: Field) => {
   }
 };
 
-const prepValidationMessages = (field: Field, validationMessages?: ValidationMessages) => {
+const prepValidationMessages = (field, validationMessages) => {
   field.validationMessages = field.validationMessages
     ? field.validationMessages
     : validationMessages;
@@ -432,7 +362,7 @@ const prepValidationMessages = (field: Field, validationMessages?: ValidationMes
   }
 };
 
-const getControlType = (field: Field) => {
+const getControlType = (field) => {
   if (field.control) {
     return field.control.toLowerCase();
   }
@@ -456,7 +386,7 @@ const getControlType = (field: Field) => {
   }
 };
 
-const getControlForStringFormat = (format?: string) => {
+const getControlForStringFormat = (format) => {
   switch (format) {
     case 'date':
       return 'date';
@@ -475,7 +405,7 @@ const getControlForStringFormat = (format?: string) => {
   }
 };
 
-const getSelectionType = (field: Field) => {
+const getSelectionType = (field) => {
   if (field.control) {
     return field.control;
   }
@@ -492,14 +422,14 @@ const getSelectionType = (field: Field) => {
   return 'select';
 };
 
-const copyOf = <T>(object: T): T => JSON.parse(JSON.stringify(object)) as T;
+const copyOf = (object) => JSON.parse(JSON.stringify(object));
 
 /**
  * Some older requirments formats do not include a label for alternatives
  *
  * @param tabType
  */
-const getNameFromType = (tabType?: string): string => {
+const getNameFromType = (tabType) => {
   if (tabType && tabType.length > 0) {
     const tabNameWithSpaces = tabType.toLowerCase().split('_').join(' '); // String.replace method only replaces first instance
     return tabNameWithSpaces.charAt(0).toUpperCase() + tabNameWithSpaces.slice(1);

package/src/inputWithDisplayFormat/InputWithDisplayFormat.story.js

@@ -0,0 +1,85 @@
+import { text } from '@storybook/addon-knobs';
+import { userEvent, within } from '@storybook/test';
+
+import InputWithDisplayFormat from '.';
+import { Field } from '../field/Field';
+
+export default {
+  component: InputWithDisplayFormat,
+  title: 'Forms/InputWithDisplayFormat',
+};
+
+export const Basic = () => {
+  const placeholder = text('Placeholder', '**-**-**');
+  const displayPattern = text('DisplayPattern', '**-**-**');
+
+  return (
+    <Field label="Display pattern is controlled via knobs" id="Basic">
+      <InputWithDisplayFormat
+        id="Basic"
+        placeholder={placeholder}
+        displayPattern={displayPattern}
+        className="form-control"
+        onChange={(v) => console.log(v)}
+        onBlur={(v) => console.log(v)}
+        onFocus={(v) => console.log(v)}
+      />
+    </Field>
+  );
+};
+
+const Template = (args) => {
+  const placeholder = args.pattern;
+  const displayPattern = args.pattern;
+  const label = args.label;
+  const id = label.replaceAll(' ', '-').toLowerCase();
+
+  return (
+    <Field label={label} id={id}>
+      <InputWithDisplayFormat
+        id={id}
+        placeholder={placeholder}
+        displayPattern={displayPattern}
+        className="form-control"
+        onChange={(v) => console.log(v)}
+        onBlur={(v) => console.log(v)}
+        onFocus={(v) => console.log(v)}
+      />
+    </Field>
+  );
+};
+
+export const CardNumber = Template.bind({});
+CardNumber.args = {
+  label: 'Card Number',
+  pattern: '**** **** **** **** ***',
+};
+
+export const CVC = Template.bind({});
+CVC.args = {
+  label: 'CVC',
+  pattern: '***',
+};
+
+export const ExpiryDate = Template.bind({});
+ExpiryDate.args = {
+  label: 'Expiry Date',
+  pattern: '** / **',
+};
+
+export const SecurityPin = Template.bind({});
+SecurityPin.args = {
+  label: 'Security Pin',
+  pattern: '*-*-*-*-*-*',
+};
+
+export const SecurityPinPlay = Template.bind({});
+SecurityPinPlay.args = {
+  label: 'Security Pin',
+  pattern: '*-*-*-*-*-*',
+};
+
+SecurityPinPlay.play = async ({ canvasElement }) => {
+  const canvas = within(canvasElement);
+  await userEvent.type(canvas.getByPlaceholderText('*-*-*-*-*-*'), '123456');
+};

package/src/main.css

@@ -5449,6 +5449,12 @@ html:not([dir="rtl"]) .np-navigation-option {
 .tw-droppable-sm {
   min-height: 245px;
 }
+.tw-droppable-lg .btn:focus-visible,
+.tw-droppable-md .btn:focus-visible,
+.tw-droppable-sm .btn:focus-visible {
+  outline: var(--ring-outline-color) solid var(--ring-outline-width);
+  outline-offset: var(--ring-outline-offset);
+}
 .upload-error-message {
   margin-top: 24px;
   margin-top: var(--padding-medium);

package/src/upload/Upload.css

@@ -13,6 +13,12 @@
 .tw-droppable-sm {
   min-height: 245px;
 }
+.tw-droppable-lg .btn:focus-visible,
+.tw-droppable-md .btn:focus-visible,
+.tw-droppable-sm .btn:focus-visible {
+  outline: var(--ring-outline-color) solid var(--ring-outline-width);
+  outline-offset: var(--ring-outline-offset);
+}
 .upload-error-message {
   margin-top: 24px;
   margin-top: var(--padding-medium);

package/src/upload/Upload.less

@@ -1,3 +1,5 @@
+@import (reference) "../../node_modules/@transferwise/neptune-css/src/less/ring.less";
+
 // This css is a quick workaround on the height of the upload container collapsing if UploadImageStep is
 // not rendered.
 .tw-droppable-lg {
@@ -20,6 +22,12 @@
   min-height: 245px;
 }
 
+.tw-droppable-lg, .tw-droppable-md, .tw-droppable-sm {
+  .btn:focus-visible {
+    .ring();
+  }
+}
+
 .upload-error-message {
   margin-top: var(--padding-medium);
   border-top: 1px solid var(--color-border-neutral);

package/src/upload/steps/uploadImageStep/uploadImageStep.tsx

@@ -68,6 +68,7 @@ export default class UploadImageStep extends PureComponent<UploadImageStepProps>
             className={`btn btn-primary btn-md ${usDisabled ? 'disabled' : ''}`}
             role="button"
             aria-disabled={usDisabled}
+            tabIndex={0}
           >
             {usButtonText ? (
               <span>{usButtonText}</span>

package/src/utilities/deprecatedProperty/{deprecatedProperty.ts → deprecatedProperty.js}

@@ -1,22 +1,6 @@
 import { logActionRequired } from '../logActionRequired';
 
-type DeprecatedMessageType = {
-  component: string;
-  propName: string;
-  message: string;
-  expiryDate?: Date;
-};
-
-type ValidatorType = (props: Record<string, any>, propName: string, ...rest: any[]) => Error | null;
-
-type DeprecatedOptionsType = {
-  component: string;
-  message?: string;
-  newProp?: string | null;
-  expiryDate?: Date;
-};
-
-const deprecatedMessage = ({ component, propName, message, expiryDate }: DeprecatedMessageType) => {
+const deprecatedMessage = ({ component, propName, message, expiryDate }) => {
   const messages = [`${component} has deprecated the use of ${propName}.`];
 
   if (message) {
@@ -37,11 +21,8 @@ const deprecatedMessage = ({ component, propName, message, expiryDate }: Depreca
 };
 
 const deprecated =
-  (
-    validator: ValidatorType,
-    { component, message = '', newProp: newProperty = null, expiryDate }: DeprecatedOptionsType,
-  ) =>
-  (props: Record<string, any>, propertyName: string, ...rest: any[]) => {
+  (validator, { component, message = '', newProp: newProperty = null, expiryDate = null }) =>
+  (props, propertyName, ...rest) => {
     const newPropertyMessage = newProperty ? `Please use ${newProperty} instead.` : message;
 
     if (props[propertyName] != null && typeof props[propertyName] !== 'undefined') {
@@ -54,8 +35,6 @@ const deprecated =
         }),
       );
     }
-
-    // Fix: include `componentName` when calling the validator
     return validator(props, propertyName, ...rest);
   };
 

package/src/utilities/{logActionRequired.ts → logActionRequired.js}

@@ -1,11 +1,11 @@
-export function logActionRequired(message: string) {
+export function logActionRequired(message) {
   if (typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production') {
     // eslint-disable-next-line no-console
     console.warn(message);
   }
 }
 
-export function logActionRequiredIf(message: string, conditional: boolean) {
+export function logActionRequiredIf(message, conditional) {
   if (conditional) {
     logActionRequired(message);
   }

package/build/types/common/fakeEvents.d.ts

@@ -1,23 +0,0 @@
-export declare const fakeEvent: () => {
-    nativeEvent: {
-        stopImmediatePropagation(): void;
-    };
-    stopPropagation(): void;
-    preventDefault(): void;
-};
-export declare const fakeKeyDownEventForKey: (key: string) => {
-    key: string;
-    nativeEvent: {
-        stopImmediatePropagation(): void;
-    };
-    stopPropagation(): void;
-    preventDefault(): void;
-};
-export declare const fakeKeyDownEvent: (eventAttribute?: {}) => {
-    nativeEvent: {
-        stopImmediatePropagation(): void;
-    };
-    stopPropagation(): void;
-    preventDefault(): void;
-};
-//# sourceMappingURL=fakeEvents.d.ts.map

package/build/types/common/fakeEvents.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"fakeEvents.d.ts","sourceRoot":"","sources":["../../../src/common/fakeEvents.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS;;;;;;CAIpB,CAAC;AAEH,eAAO,MAAM,sBAAsB,QAAS,MAAM;;;;;;;CAGhD,CAAC;AAEH,eAAO,MAAM,gBAAgB;;;;;;CAG3B,CAAC"}

package/build/types/common/requirements.d.ts

@@ -1,47 +0,0 @@
-import { PrimitiveType } from 'react-intl';
-type ValidationMessages = Record<string, string>;
-type Value = {
-    label?: string;
-    title?: string;
-    name?: string;
-    value?: PrimitiveType;
-    code?: string | number;
-    key?: PrimitiveType;
-};
-type Field = {
-    name?: string;
-    title?: string;
-    type?: string;
-    control?: string;
-    format?: string;
-    pattern?: string;
-    minimum?: number;
-    maximum?: number;
-    max?: number;
-    min?: number;
-    width?: string;
-    example?: string;
-    placeholder?: string;
-    info?: string;
-    tooltip?: string;
-    help?: {
-        message: string;
-    };
-    valuesAllowed?: Value[];
-    values?: Value[];
-    default?: Value;
-    value?: Value;
-    validationMessages?: ValidationMessages;
-    validationRegexp?: string;
-    properties: Record<string, Field>;
-    hidden?: boolean;
-    key?: string;
-    fields?: Field[];
-    groups?: Field[];
-    [otherKey: string]: any;
-};
-type FieldMapType = Record<string, Field>;
-declare const prepFields: (fields: Field[], model?: any, validationMessages?: any) => FieldMapType;
-declare const getControlType: (field: Field) => string;
-export { prepFields, getControlType };
-//# sourceMappingURL=requirements.d.ts.map

package/build/types/common/requirements.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"requirements.d.ts","sourceRoot":"","sources":["../../../src/common/requirements.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,KAAK,kBAAkB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAEjD,KAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB,CAAC;AAEF,KAAK,KAAK,GAAG;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAC3B,aAAa,CAAC,EAAE,KAAK,EAAE,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;IACjB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAClC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;IACjB,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;IACjB,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC;CACzB,CAAC;AAEF,KAAK,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;AAmD1C,QAAA,MAAM,UAAU,WAAY,KAAK,EAAE,UAAU,GAAG,uBAAuB,GAAG,KAAG,YAc5E,CAAC;AAkUF,QAAA,MAAM,cAAc,UAAW,KAAK,WAsBnC,CAAC;AAqDF,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAC"}