@westpac/ui 0.2.1 → 0.4.0

package/src/components/progress-rope/progress-rope.types.ts

@@ -0,0 +1,41 @@
+import { HTMLAttributes, MouseEventHandler, ReactNode } from 'react';
+import { type VariantProps } from 'tailwind-variants';
+
+import { styles } from './progress-rope.styles.js';
+
+export type ProgressRopeStepItem = {
+  onClick?: MouseEventHandler<Element>;
+  text: ReactNode;
+  type?: 'step';
+};
+
+export type ProgressRopeStepWithIndex =
+  | (ProgressRopeStepItem & { index: number })
+  | {
+      steps: (ProgressRopeStepItem & { index: number })[];
+      text: ReactNode;
+      type: 'group';
+    };
+
+export type ProgressRopeProps = {
+  /**
+   * Current active step (zero-indexed)
+   */
+  current?: number;
+  /**
+   * Data
+   */
+  data?: (
+    | ProgressRopeStepItem
+    | {
+        steps: ProgressRopeStepItem[];
+        text: ReactNode;
+        type: 'group';
+      }
+  )[];
+  /**
+   * Tag to render
+   */
+  tag?: keyof JSX.IntrinsicElements;
+} & VariantProps<typeof styles> &
+  HTMLAttributes<Element>;

package/src/components/radio-group/components/radio/radio.stories.tsx

@@ -14,7 +14,7 @@ const meta: Meta<typeof Radio> = {
     ),
   ],
   parameters: {
-    layout: 'center',
+    layout: 'fullscreen',
   },
   argTypes: {
     isDisabled: {

package/src/components/radio-group/components/radio/radio.styles.ts

@@ -13,7 +13,7 @@ export const styles = tv(
       isDisabled: {
         true: {
           labelText: 'text-muted',
-          selector: 'bg-border-20 border-border before:bg-border',
+          selector: 'border-border bg-border-20 before:bg-border',
         },
         false: {
           base: 'hover:cursor-pointer',

package/src/components/radio-group/radio-group.stories.tsx

@@ -14,7 +14,7 @@ const meta: Meta<typeof RadioGroup> = {
     ),
   ],
   parameters: {
-    layout: 'center',
+    layout: 'fullscreen',
   },
   args: {
     label: <h2>Test</h2>,

package/src/components/select/select.stories.tsx

@@ -14,7 +14,7 @@ const meta: Meta<typeof Select> = {
     ),
   ],
   parameters: {
-    layout: 'center',
+    layout: 'fullscreen',
   },
 };
 

package/src/components/select/select.styles.ts

@@ -2,7 +2,7 @@ import { tv } from 'tailwind-variants';
 
 export const styles = tv(
   {
-    base: 'form-control bg-no-repeat select-caret disabled:form-control-disabled focus:focus-outline',
+    base: 'form-control bg-no-repeat select-caret disabled:form-control-disabled focus:focus-outline group-[.add-on-after]:rounded-l-none group-[.add-on-before]:rounded-r-none',
     variants: {
       size: {
         small: 'form-control-small bg-[right_0.5625rem_center] pr-[calc(0.5rem+14px+0.5625rem)]',

package/src/components/skip-link/skip-link.stories.tsx

@@ -8,7 +8,7 @@ const meta: Meta<typeof SkipLink> = {
   tags: ['autodocs'],
   decorators: [(Story: StoryFn) => <Story />],
   parameters: {
-    layout: 'center',
+    layout: 'fullscreen',
   },
 };
 

package/src/components/switch/index.ts

@@ -0,0 +1,2 @@
+export { Switch } from './switch.component.js';
+export { type SwitchProps } from './switch.types.js';

package/src/components/switch/switch.component.tsx

@@ -0,0 +1,28 @@
+import React, { useId, useRef } from 'react';
+import { VisuallyHidden, useCheckbox, useFocusRing } from 'react-aria';
+import { useToggleState } from 'react-stately';
+
+import { styles as switchStyles } from './switch.styles.js';
+import { type SwitchProps } from './switch.types.js';
+
+export function Switch({ className, label, size = 'medium', block = false, isDisabled, ...props }: SwitchProps) {
+  const state = useToggleState(props);
+  const labelId = useId();
+  const ref = useRef(null);
+  const { inputProps } = useCheckbox({ isDisabled, 'aria-labelledby': labelId, ...props }, state, ref);
+  const { isSelected } = state;
+  const { isFocusVisible, focusProps } = useFocusRing();
+  const styles = switchStyles({ block, isFocusVisible, isSelected, isDisabled, size });
+
+  return (
+    <label className={styles.base({ className })}>
+      <span className={styles.label()} id={labelId}>
+        {label}
+      </span>
+      <VisuallyHidden>
+        <input {...inputProps} {...focusProps} ref={ref} />
+      </VisuallyHidden>
+      <div className={styles.switchDiv()} />
+    </label>
+  );
+}

package/src/components/switch/switch.stories.tsx

@@ -0,0 +1,99 @@
+import { type Meta, StoryFn, type StoryObj } from '@storybook/react';
+
+import { Switch } from './switch.component.js';
+
+const meta: Meta<typeof Switch> = {
+  title: 'Example/Switch',
+  component: Switch,
+  tags: ['autodocs'],
+  decorators: [
+    (Story: StoryFn) => (
+      <div className="flex p-3">
+        <Story />
+      </div>
+    ),
+  ],
+  parameters: {
+    layout: 'fullscreen',
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+const SIZES = ['small', 'medium', 'large', 'xlarge'];
+
+/**
+ * > Default usage example
+ */
+export const DefaultStory: Story = {
+  args: {
+    size: 'medium',
+    label: 'eStatements',
+  },
+};
+
+/**
+ * > Selected switch example
+ */
+export const SelectedSwitch: Story = {
+  args: {
+    label: 'eStatements',
+    isSelected: true,
+  },
+};
+
+/**
+ * > Switch size example
+ */
+export const SwitchSizes = () => (
+  <div>
+    {SIZES.map((size: any) => (
+      <div key={size}>
+        <h3 className="font-bold">{size}</h3>
+        <div className="mb-2">
+          <Switch size={size} label="eStatements" />
+        </div>
+      </div>
+    ))}
+  </div>
+);
+
+/**
+ * > Disabled switch example
+ */
+export const DisabledSwitch: Story = {
+  args: {
+    label: 'eStatements',
+    isDisabled: true,
+  },
+};
+
+/**
+ * > Block switch example
+ */
+export const BlockSwitch = () => (
+  <div>
+    <>
+      <div className="mb-2">
+        <Switch
+          block
+          label="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur corporis sint, facere sequi provident eius similique ab velit, beatae aut architecto porro quidem neque necessitatibus, quis nulla itaque labore harum, in nesciunt! Molestiae, voluptatum, voluptas. Quo pariatur, voluptate ducimus nemo?"
+        />
+      </div>
+      <div className="mb-2">
+        <Switch block label="eStatements" />
+      </div>
+    </>
+  </div>
+);
+
+/**
+ * > Responsive switch example
+ */
+export const ResponsiveSizeSwitch: Story = {
+  args: {
+    label: 'eStatements',
+    size: { initial: 'small', md: 'large', lg: 'xlarge' },
+  },
+};

package/src/components/switch/switch.styles.ts

@@ -0,0 +1,55 @@
+import { tv } from 'tailwind-variants';
+
+export const styles = tv(
+  {
+    slots: {
+      base: 'mb-1 inline-flex items-center hover:cursor-pointer',
+      switchDiv:
+        'relative box-content overflow-hidden border border-borderDark transition duration-[.3s] after:absolute after:left-0 after:top-0 after:block after:rounded-[50%] after:bg-white after:shadow-switch after:transition-all after:duration-[.3s]',
+      label: 'pr-1',
+    },
+    variants: {
+      size: {
+        small: {
+          switchDiv: 'h-[1.75rem] w-8 rounded-[1.75rem] after:h-[1.75rem] after:w-[1.75rem]',
+        },
+        medium: {
+          switchDiv: 'h-[2.125rem] w-10 rounded-[2.125rem] after:h-[2.125rem] after:w-[2.125rem]',
+        },
+        large: {
+          switchDiv: 'h-[2.5rem] w-12 rounded-[2.5rem] after:h-[2.5rem] after:w-[2.5rem]',
+        },
+        xlarge: {
+          switchDiv: 'h-[2.875rem] w-14 rounded-[2.875rem] after:h-[2.875rem] after:w-[2.875rem]',
+        },
+      },
+      isFocusVisible: {
+        true: {
+          switchDiv: 'focus-outline',
+        },
+      },
+      isSelected: {
+        true: {
+          switchDiv: 'border-hero bg-hero after:left-full after:-translate-x-full',
+        },
+      },
+      isDisabled: {
+        true: {
+          base: 'pointer-events-none',
+          switchDiv: 'opacity-50',
+          label: 'opacity-50',
+        },
+      },
+      block: {
+        true: {
+          base: 'w-full',
+          label: 'flex-1',
+        },
+        false: {
+          base: 'mr-3',
+        },
+      },
+    },
+  },
+  { responsiveVariants: ['xsl', 'sm', 'md', 'lg', 'xl'] },
+);

package/src/components/switch/switch.types.ts

@@ -0,0 +1,20 @@
+import { AriaCheckboxProps } from 'react-aria';
+import { type VariantProps } from 'tailwind-variants';
+
+import { styles } from './switch.styles.js';
+
+export type SwitchProps = {
+  /**
+   * Whether to display switch as block
+   */
+  block?: boolean;
+  /**
+   * Classname for overriding base style
+   */
+  className?: string;
+  /**
+   * Label for the switch
+   */
+  label: string;
+} & Omit<AriaCheckboxProps, 'children'> &
+  Pick<VariantProps<typeof styles>, 'size'>;

package/src/components/symbol/components/logos/bom-logo.tsx

@@ -0,0 +1,106 @@
+import { clsx } from 'clsx';
+import React from 'react';
+
+import { Symbol } from '../../symbol.component.js';
+import { type SymbolProps } from '../../symbol.types.js';
+
+export function BOMLogo({
+  'aria-label': ariaLabel = 'Bank of Melbourne',
+  copyrightYear = '2023',
+  viewBoxWidth = 150,
+  viewBoxHeight = 39,
+  className,
+  ...props
+}: SymbolProps) {
+  return (
+    <Symbol
+      className={clsx('h-[39px] w-[150px]', className)}
+      aria-label={ariaLabel}
+      copyrightYear={copyrightYear}
+      viewBoxWidth={viewBoxWidth}
+      viewBoxHeight={viewBoxHeight}
+      {...props}
+    >
+      <polygon points="0 0 0 13 6.5 6.5 " fill="#685AC0" />
+      <polygon points="13 0 0 0 6.5 6.5 " fill="#A094FC" />
+      <polygon points="13 13 13 0 6.5 6.5 " fill="#685AC0" />
+      <polygon points="0 13 13 13 6.5 6.5 " fill="#20024E" />
+      <polygon points="13 0 13 13 19.5 6.5 " fill="#C2BFEB" />
+      <polygon points="26 0 13 0 19.5 6.5 " fill="#685AC0" />
+      <polygon points="26 13 26 0 19.5 6.5 " fill="#20024E" />
+      <polygon points="13 13 26 13 19.5 6.5 " fill="#685AC0" />
+      <polygon points="13 13 13 26 19.5 19.5 " fill="#C2BFEB" />
+      <polygon points="26 13 13 13 19.5 19.5 " fill="#A094FC" />
+      <polygon points="26 26 26 13 19.5 19.5 " fill="#685AC0" />
+      <polygon points="13 26 26 26 19.5 19.5 " fill="#20024E" />
+      <polygon points="0 13 0 26 6.5 19.5 " fill="#685AC0" />
+      <polygon points="13 13 0 13 6.5 19.5 " fill="#C2BFEB" />
+      <polygon points="13 26 13 13 6.5 19.5 " fill="#20024E" />
+      <polygon points="0 26 13 26 6.5 19.5 " fill="#A094FC" />
+      <polygon points="13 26 13 39 19.5 32.5 " fill="#C2BFEB" />
+      <polygon points="26 26 13 26 19.5 32.5 " fill="#685AC0" />
+      <polygon points="13 26 0 26 6.5 32.5 " fill="#C2BFEB" />
+      <polygon points="13 39 13 26 6.5 32.5 " fill="#20024E" />
+      <path
+        d="M33 15.5h1c0.4 0 0.7-0.4 0.7-0.8V2.5c0-0.4-0.4-0.8-0.7-0.8h-1V0.2h6.7c3.8 0 6.1 1.2 6.1 4.3 0 2.2-1.3 3.2-3.4 3.7v0.1c2.5 0.3 4.1 1.6 4.1 4.1 0 3.3-2.6 4.8-6.5 4.8h-7V15.5zM39.6 7.4c2.2 0 3.4-0.8 3.4-2.8 0-2-1.1-2.7-3.3-2.7h-2.1v5.5H39.6zM39.9 15.4c2.6 0 3.7-1.1 3.7-3.2 0-2.1-1-3.1-3.8-3.1h-2.3v6.3H39.9z"
+        fill="#20024E"
+      />
+      <path
+        d="M47.6 13.5c0-2.6 2.1-3.8 5-3.8 1.1 0 2 0.1 2.9 0.3V8.3c0-1.6-0.9-2.2-2.6-2.2 -1.7 0-2.6 0.6-3.3 1.2h-1.2v-2c1.1-0.5 2.6-1 4.9-1 3 0 4.7 0.9 4.7 3.7v6.7c0 0.5 0.3 0.8 0.8 0.8h0.7v1.3c-0.3 0.2-0.9 0.4-1.7 0.4 -1.4 0-2.1-0.6-2.3-1.7 -0.9 1.2-2.2 1.7-3.9 1.7C49.3 17.2 47.6 16 47.6 13.5zM55.5 14.2v-2.7c-0.7-0.1-1.5-0.2-2.4-0.2 -1.8 0-2.9 0.7-2.9 2.2 0 1.5 0.9 2.2 2.3 2.2C53.9 15.5 54.7 15 55.5 14.2z"
+        fill="#20024E"
+      />
+      <path
+        d="M60.4 15.5h0.9c0.3 0 0.7-0.3 0.7-0.7V6.7c0-0.3-0.3-0.7-0.7-0.7h-1V4.4H64c0.4 0 0.6 0.3 0.6 1.5v0.3c1.3-1.2 3-2 5-2 1.8 0 3.3 0.7 3.3 3.1v7.4c0 0.3 0.3 0.7 0.6 0.7h0.8v1.5h-5.8v-1.5h1.7V8.3c0-1.6-0.7-2-2-2 -1.3 0-2.6 0.6-3.7 1.2v8h1.8v1.5h-6V15.5z"
+        fill="#20024E"
+      />
+      <path
+        d="M75.1 15.5h0.9c0.3 0 0.7-0.3 0.7-0.7V2.5c0-0.3-0.3-0.7-0.7-0.7h-1V0.2h3.8c0.3 0 0.5 0.2 0.5 0.7V11l4-4.1c0.4-0.4 0.2-0.9-0.2-0.9h-0.6V4.4h5.2v1.6h-0.6c-0.3 0-0.8 0.2-1.1 0.5l-3.1 3.1 3.5 5.1c0.3 0.5 0.7 0.7 1.1 0.7h0.4v1.5H85l-3.8-5.6 -1.8 1.8v2.3h1.6v1.5h-5.8V15.5z"
+        fill="#20024E"
+      />
+      <path
+        d="M93.2 10.8c0-4 2.8-6.5 6.4-6.5 3.6 0 6.4 2.5 6.4 6.5 0 4-2.8 6.4-6.4 6.4C96 17.2 93.2 14.8 93.2 10.8zM103.3 10.8c0-3.1-1.5-4.8-3.7-4.8 -2.2 0-3.7 1.6-3.7 4.8 0 3.1 1.5 4.7 3.7 4.7C101.8 15.5 103.3 13.9 103.3 10.8z"
+        fill="#20024E"
+      />
+      <path
+        d="M106.6 15.5h0.9c0.3 0 0.7-0.3 0.7-0.7V6.1h-1.7V4.4h1.7V3.4c0-2.4 1.4-3.4 3.7-3.4 1 0 1.6 0.1 2 0.3v1.5h-1.2c-1.1 0-1.9 0.2-1.9 1.6v1h2.7v1.6h-2.7v8.8c0 0.3 0.3 0.7 0.7 0.7h1.2v1.5h-6.1V15.5z"
+        fill="#20024E"
+      />
+      <path
+        d="M33 36.3h1c0.4 0 0.7-0.4 0.7-0.8V23.3c0-0.4-0.4-0.8-0.7-0.8h-1v-1.6h6.1l4 12.6h0.1l4-12.6h6.1v1.6h-1c-0.4 0-0.7 0.4-0.7 0.8v12.2c0 0.3 0.4 0.8 0.7 0.8h1v1.5h-6.4v-1.5h1.9V22.8h-0.2l-4.8 15h-2l-4.8-15h-0.1v13.5h1.9v1.5H33V36.3z"
+        fill="#20024E"
+      />
+      <path
+        d="M53.4 31.5c0-4 2.5-6.5 6.1-6.5 3.5 0 5.6 1.9 5.6 6.1 0 0.4 0 0.7 0 0.8h-9c0.1 2.9 1.4 4.4 3.9 4.4 1.8 0 2.6-0.6 3.3-1.4h1.5v1.8c-1 0.7-2.4 1.3-4.9 1.3C55.6 38 53.4 35.5 53.4 31.5zM62.6 30.3c-0.1-2.7-1.1-3.7-3-3.7 -1.9 0-3.1 1.2-3.4 3.7H62.6z"
+        fill="#20024E"
+      />
+      <path
+        d="M65.9 36.3h0.9c0.3 0 0.7-0.3 0.7-0.7V23.2c0-0.3-0.3-0.7-0.7-0.7h-1v-1.6h3.8c0.3 0 0.5 0.2 0.5 0.7v14c0 0.3 0.3 0.7 0.7 0.7h0.9v1.5h-5.8V36.3z"
+        fill="#20024E"
+      />
+      <path
+        d="M75.4 36.5c-0.2 0.8-0.7 1.3-1 1.3H73V23.2c0-0.3-0.3-0.7-0.7-0.7h-1v-1.6h3.8c0.3 0 0.5 0.2 0.5 0.7v5.5c1-1.1 2.3-2 4.4-2 2.4 0 4.8 1.5 4.8 6.3 0 4.9-2.8 6.6-5.5 6.6C77.3 38 76.2 37.4 75.4 36.5zM82.2 31.5c0-3.7-1.6-4.6-3.3-4.6 -1.2 0-2.4 0.7-3.2 1.4v6.9c0.7 0.7 1.6 1.2 3 1.2C80.3 36.4 82.2 35.5 82.2 31.5z"
+        fill="#20024E"
+      />
+      <path
+        d="M86 31.5c0-4 2.8-6.5 6.4-6.5 3.6 0 6.4 2.5 6.4 6.5 0 4-2.8 6.4-6.4 6.4C88.8 38 86 35.6 86 31.5zM96.2 31.6c0-3.1-1.5-4.8-3.7-4.8 -2.2 0-3.7 1.6-3.7 4.8 0 3.1 1.5 4.7 3.7 4.7C94.7 36.3 96.2 34.7 96.2 31.6z"
+        fill="#20024E"
+      />
+      <path
+        d="M100.8 34.9v-7.4c0-0.3-0.3-0.7-0.7-0.7h-0.9v-1.6h4.2V34c0 1.6 0.8 2 2 2 1.3 0 2.6-0.6 3.6-1.3v-8h-1.8v-1.6h4.4v10.4c0 0.3 0.3 0.7 0.7 0.7h1v1.5h-3.6c-0.3 0-0.6-0.3-0.6-1.5V36c-1.3 1.2-2.8 2-4.9 2C102.4 38 100.8 37.3 100.8 34.9z"
+        fill="#20024E"
+      />
+      <path
+        d="M114.1 36.3h0.9c0.3 0 0.7-0.3 0.7-0.7v-8.1c0-0.3-0.3-0.7-0.7-0.7h-1v-1.6h3.7c0.4 0 0.6 0.3 0.6 1.7v0.4c0.9-1.1 2-2.2 3.8-2.2 0.3 0 0.5 0 0.7 0.1v2.1h-0.5c-1.9 0-3 0.5-4 1.3v7.7h2v1.5h-6.2V36.3z"
+        fill="#20024E"
+      />
+      <path
+        d="M123.7 36.3h0.9c0.3 0 0.7-0.3 0.7-0.7v-8.1c0-0.3-0.3-0.7-0.7-0.7h-1v-1.6h3.7c0.4 0 0.6 0.3 0.6 1.5v0.3c1.3-1.2 3-2 5-2 1.8 0 3.3 0.7 3.3 3.1v7.4c0 0.3 0.3 0.7 0.6 0.7h0.8v1.5h-5.8v-1.5h1.7V29c0-1.6-0.7-2-2-2 -1.4 0-2.6 0.6-3.7 1.2v8h1.8v1.5h-6V36.3z"
+        fill="#20024E"
+      />
+      <path
+        d="M137.6 31.5c0-4 2.5-6.5 6.1-6.5 3.5 0 5.6 1.9 5.6 6.1 0 0.4 0 0.7 0 0.8h-9c0.1 2.9 1.4 4.4 3.9 4.4 1.8 0 2.6-0.6 3.3-1.4h1.5v1.8c-1 0.7-2.4 1.3-4.9 1.3C139.8 38 137.6 35.5 137.6 31.5zM146.8 30.3c-0.1-2.7-1.1-3.7-3-3.7 -1.9 0-3.1 1.2-3.4 3.7H146.8z"
+        fill="#20024E"
+      />
+    </Symbol>
+  );
+}

package/src/components/symbol/components/logos/bom-multibrand-large-logo.tsx

@@ -0,0 +1,54 @@
+import { clsx } from 'clsx';
+import React from 'react';
+
+import { Symbol } from '../../symbol.component.js';
+import { type SymbolProps } from '../../symbol.types.js';
+
+export function BOMMultibrandLargeLogo({
+  'aria-label': ariaLabel = 'Bank of Melbourne',
+  copyrightYear = '2023',
+  viewBoxWidth = 180,
+  viewBoxHeight = 65,
+  align = 'left',
+  offset = [null, 15.305, 30.61],
+  className,
+  ...props
+}: SymbolProps) {
+  return (
+    <Symbol
+      className={clsx('h-[65px] w-[180px]', className)}
+      aria-label={ariaLabel}
+      align={align}
+      offset={offset}
+      copyrightYear={copyrightYear}
+      viewBoxWidth={viewBoxWidth}
+      viewBoxHeight={viewBoxHeight}
+      {...props}
+    >
+      <path
+        fill="#20024E"
+        d="M39.9185 29.3706367C42.4985 29.3706367 43.5825 28.2856367 43.5825 26.1406367 43.5825 23.9946367 42.5455 23.0786367 39.8225 23.0786367L37.5565 23.0786367 37.5565 29.3706367 39.9185 29.3706367zM39.6285 21.4386367C41.8715 21.4386367 42.9805 20.6196367 42.9805 18.6426367 42.9805 16.5946367 41.8715 15.8946367 39.6535 15.8946367L37.5565 15.8946367 37.5565 21.4386367 39.6285 21.4386367zM33.0005 29.4666367L34.0125 29.4666367C34.3745 29.4666367 34.7595 29.0326367 34.7595 28.6946367L34.7595 16.5216367C34.7595 16.1596367 34.3745 15.7256367 34.0125 15.7256367L33.0005 15.7256367 33.0005 14.1826367 39.7255 14.1826367C43.4855 14.1826367 45.7755 15.4126367 45.7755 18.4496367 45.7755 20.6196367 44.4745 21.6806367 42.3765 22.1146367L42.3765 22.1866367C44.8845 22.5236367 46.4995 23.7776367 46.4995 26.2606367 46.4995 29.5396367 43.8965 31.0576367 39.9905 31.0576367L33.0005 31.0576367 33.0005 29.4666367zM55.4897 28.1411367L55.4897 25.3931367C54.7667 25.2481367 53.9707 25.1521367 53.1267 25.1521367 51.2957 25.1521367 50.1857 25.8021367 50.1857 27.3701367 50.1857 28.9121367 51.0537 29.5391367 52.5247 29.5391367 53.8497 29.5391367 54.7187 28.9601367 55.4897 28.1411367M47.6067 27.4421367C47.6067 24.8381367 49.6797 23.6091367 52.5967 23.6091367 53.7297 23.6091367 54.5977 23.7291367 55.4897 23.9471367L55.4897 22.2831367C55.4897 20.6671367 54.5497 20.0891367 52.9347 20.0891367 51.2707 20.0891367 50.3307 20.6671367 49.6557 21.2711367L48.4507 21.2711367 48.4507 19.2701367C49.5347 18.7401367 51.0777 18.2821367 53.3917 18.2821367 56.3577 18.2821367 58.0927 19.2211367 58.0927 22.0181367L58.0927 28.7441367C58.0927 29.2261367 58.4067 29.5151367 58.8647 29.5151367L59.5147 29.5151367 59.5147 30.8171367C59.1777 31.0341367 58.5747 31.2031367 57.8517 31.2031367 56.4777 31.2031367 55.7547 30.6481367 55.5617 29.4911367 54.6217 30.6481367 53.3917 31.2031367 51.7047 31.2031367 49.2947 31.2031367 47.6067 29.9491367 47.6067 27.4421367M60.3818 29.5151367L61.3218 29.5151367C61.6358 29.5151367 61.9728 29.1771367 61.9728 28.8641367L61.9728 20.7411367C61.9728 20.4511367 61.6358 20.0661367 61.3218 20.0661367L60.2858 20.0661367 60.2858 18.4261367 63.9738 18.4261367C64.3358 18.4261367 64.6008 18.7631367 64.5768 19.9691367L64.5768 20.3061367C65.8298 19.1491367 67.5898 18.2821367 69.5428 18.2821367 71.3498 18.2821367 72.8448 18.9321367 72.8448 21.4151367L72.8448 28.8641367C72.8448 29.2021367 73.1818 29.5151367 73.4718 29.5151367L74.2678 29.5151367 74.2678 31.0581367 68.5058 31.0581367 68.5058 29.5151367 70.2408 29.5151367 70.2408 22.2831367C70.2408 20.7161367 69.5428 20.3301367 68.2648 20.3301367 66.9148 20.3301367 65.6618 20.8851367 64.5768 21.5361367L64.5768 29.5151367 66.3368 29.5151367 66.3368 31.0581367 60.3818 31.0581367 60.3818 29.5151367zM75.1455 29.5151367L76.0855 29.5151367C76.3985 29.5151367 76.7365 29.1771367 76.7365 28.8641367L76.7365 16.4501367C76.7365 16.1601367 76.3985 15.7741367 76.0855 15.7741367L75.0735 15.7741367 75.0735 14.1831367 78.8575 14.1831367C79.1715 14.1831367 79.3405 14.4011367 79.3405 14.8341367L79.3405 25.0311367 83.3415 20.9571367C83.7035 20.5721367 83.5585 20.0661367 83.1005 20.0661367L82.5215 20.0661367 82.5215 18.4261367 87.7535 18.4261367 87.7535 20.0661367 87.1265 20.0661367C86.8125 20.0661367 86.3545 20.2831367 86.0655 20.5721367L82.9315 23.7051367 86.4515 28.7681367C86.7895 29.2491367 87.1745 29.5151367 87.5125 29.5151367L87.8735 29.5151367 87.8735 31.0581367 84.9805 31.0581367 81.1725 25.4411367 79.3405 27.2481367 79.3405 29.5151367 80.9315 29.5151367 80.9315 31.0581367 75.1455 31.0581367 75.1455 29.5151367zM103.3237 24.8140367C103.3237 21.6800367 101.7807 20.0420367 99.5877 20.0420367 97.3937 20.0420367 95.8507 21.6800367 95.8507 24.8140367 95.8507 27.9000367 97.3937 29.5150367 99.5877 29.5150367 101.7807 29.5150367 103.3237 27.9000367 103.3237 24.8140367M93.1507 24.7910367C93.1507 20.7410367 95.9717 18.2820367 99.5877 18.2820367 103.2267 18.2820367 106.0237 20.7410367 106.0237 24.7910367 106.0237 28.7920367 103.2267 31.2030367 99.5877 31.2030367 95.9717 31.2030367 93.1507 28.7920367 93.1507 24.7910367M106.6035 29.5151367L107.4955 29.5151367C107.8325 29.5151367 108.1705 29.1771367 108.1705 28.8641367L108.1705 20.0661367 106.5075 20.0661367 106.5075 18.4261367 108.1705 18.4261367 108.1705 17.3411367C108.1705 14.9791367 109.6165 13.9911367 111.8585 13.9911367 112.8225 13.9911367 113.4255 14.1351367 113.8345 14.2801367L113.8345 15.7741367 112.6295 15.7741367C111.5205 15.7741367 110.7735 16.0151367 110.7735 17.4131367L110.7735 18.4261367 113.4255 18.4261367 113.4255 20.0661367 110.7735 20.0661367 110.7735 28.8641367C110.7735 29.2021367 111.1115 29.5151367 111.4245 29.5151367L112.6535 29.5151367 112.6535 31.0581367 106.6035 31.0581367 106.6035 29.5151367zM33 50.2651367L33.988 50.2651367C34.374 50.2651367 34.736 49.8311367 34.736 49.4941367L34.736 37.3211367C34.736 36.9591367 34.374 36.5251367 33.988 36.5251367L33 36.5251367 33 34.9341367 39.123 34.9341367 43.101 47.5411367 43.172 47.5411367 47.198 34.9341367 53.249 34.9341367 53.249 36.5251367 52.236 36.5251367C51.851 36.5251367 51.489 36.9591367 51.489 37.3211367L51.489 49.4941367C51.489 49.8311367 51.851 50.2651367 52.236 50.2651367L53.249 50.2651367 53.249 51.8081367 46.813 51.8081367 46.813 50.2651367 48.693 50.2651367 48.693 36.7901367 48.524 36.7901367 43.727 51.8081367 41.774 51.8081367 37.001 36.7901367 36.857 36.7901367 36.857 50.2651367 38.761 50.2651367 38.761 51.8081367 33 51.8081367 33 50.2651367zM62.5522 44.3355367C62.4562 41.6595367 61.4192 40.6475367 59.5872 40.6475367 57.6832 40.6475367 56.4532 41.8535367 56.2132 44.3355367L62.5522 44.3355367zM53.4402 45.5405367C53.4402 41.5395367 55.9232 39.0315367 59.5872 39.0315367 63.1312 39.0315367 65.1802 40.8885367 65.1802 45.1065367 65.1802 45.4685367 65.1562 45.8065367 65.1562 45.9015367L56.1642 45.9015367C56.2602 48.8435367 57.5382 50.2895367 60.0452 50.2895367 61.8292 50.2895367 62.6492 49.6625367 63.3002 48.8665367L64.7942 48.8665367 64.7942 50.6505367C63.8052 51.3025367 62.3842 51.9525367 59.8522 51.9525367 55.6102 51.9525367 53.4402 49.4935367 53.4402 45.5405367L53.4402 45.5405367zM65.9097 50.2651367L66.8257 50.2651367C67.1627 50.2651367 67.5007 49.9281367 67.5007 49.6151367L67.5007 37.2001367C67.5007 36.9111367 67.1627 36.5251367 66.8257 36.5251367L65.8377 36.5251367 65.8377 34.9341367 69.6217 34.9341367C69.9587 34.9341367 70.1037 35.1511367 70.1037 35.5841367L70.1037 49.6151367C70.1037 49.9521367 70.4417 50.2651367 70.7547 50.2651367L71.6947 50.2651367 71.6947 51.8081367 65.9097 51.8081367 65.9097 50.2651367zM82.166 45.5405367C82.166 41.8285367 80.599 40.9365367 78.839 40.9365367 77.61 40.9365367 76.477 41.6105367 75.609 42.3115367L75.609 49.2045367C76.333 49.9285367 77.224 50.3865367 78.623 50.3865367 80.334 50.3865367 82.166 49.4455367 82.166 45.5405367M75.392 50.4825367C75.175 51.2775367 74.693 51.8085367 74.404 51.8085367L73.005 51.8085367 73.005 37.1995367C73.005 36.9105367 72.668 36.5245367 72.355 36.5245367L71.343 36.5245367 71.343 34.9345367 75.127 34.9345367C75.44 34.9345367 75.609 35.1505367 75.609 35.5845367L75.609 41.0815367C76.597 39.9965367 77.947 39.0315367 80.02 39.0315367 82.407 39.0315367 84.866 40.5265367 84.866 45.3235367 84.866 50.2655367 82.022 51.9525367 79.346 51.9525367 77.32 51.9525367 76.236 51.3505367 75.392 50.4825367M96.2017 45.5649367C96.2017 42.4309367 94.6597 40.7919367 92.4657 40.7919367 90.2717 40.7919367 88.7287 42.4309367 88.7287 45.5649367 88.7287 48.6499367 90.2717 50.2649367 92.4657 50.2649367 94.6597 50.2649367 96.2017 48.6499367 96.2017 45.5649367M86.0287 45.5409367C86.0287 41.4909367 88.8497 39.0319367 92.4657 39.0319367 96.1047 39.0319367 98.9017 41.4909367 98.9017 45.5409367 98.9017 49.5429367 96.1047 51.9529367 92.4657 51.9529367 88.8497 51.9529367 86.0287 49.5429367 86.0287 45.5409367M100.7568 48.8433367L100.7568 41.4663367C100.7568 41.1533367 100.4188 40.8163367 100.1058 40.8163367L99.1658 40.8163367 99.1658 39.1773367 103.3608 39.1773367 103.3608 48.0243367C103.3608 49.6623367 104.2038 50.0723367 105.3848 50.0723367 106.6868 50.0723367 107.9648 49.4933367 108.9768 48.8193367L108.9768 40.8163367 107.1688 40.8163367 107.1688 39.1773367 111.5808 39.1773367 111.5808 49.5903367C111.5808 49.9043367 111.9178 50.2653367 112.2548 50.2653367L113.2198 50.2653367 113.2198 51.8083367 109.5788 51.8083367C109.2418 51.8083367 109.0008 51.5193367 109.0008 50.3373367L109.0008 50.0253367C107.6988 51.1813367 106.1798 51.9773367 104.1318 51.9773367 102.3718 51.9773367 100.7568 51.2783367 100.7568 48.8433367M114.0981 50.2651367L115.0381 50.2651367C115.3511 50.2651367 115.6891 49.9281367 115.6891 49.6151367L115.6891 41.4911367C115.6891 41.2021367 115.3511 40.8161367 115.0381 40.8161367L114.0021 40.8161367 114.0021 39.1771367 117.6901 39.1771367C118.0511 39.1771367 118.2931 39.4911367 118.2931 40.8641367L118.2931 41.2741367C119.1841 40.1411367 120.2931 39.0791367 122.0531 39.0791367 122.3421 39.0791367 122.5831 39.1281367 122.7761 39.1771367L122.7761 41.3221367 122.2701 41.3221367C120.3421 41.3221367 119.2331 41.7801367 118.2931 42.6001367L118.2931 50.2651367 120.2931 50.2651367 120.2931 51.8081367 114.0981 51.8081367 114.0981 50.2651367zM123.7153 50.2651367L124.6553 50.2651367C124.9693 50.2651367 125.3073 49.9281367 125.3073 49.6151367L125.3073 41.4911367C125.3073 41.2021367 124.9693 40.8161367 124.6553 40.8161367L123.6193 40.8161367 123.6193 39.1771367 127.3073 39.1771367C127.6693 39.1771367 127.9343 39.5141367 127.9093 40.7191367L127.9093 41.0571367C129.1633 39.9001367 130.9233 39.0321367 132.8763 39.0321367 134.6833 39.0321367 136.1783 39.6831367 136.1783 42.1651367L136.1783 49.6151367C136.1783 49.9521367 136.5163 50.2651367 136.8053 50.2651367L137.6003 50.2651367 137.6003 51.8081367 131.8393 51.8081367 131.8393 50.2651367 133.5743 50.2651367 133.5743 43.0341367C133.5743 41.4661367 132.8763 41.0811367 131.5973 41.0811367 130.2483 41.0811367 128.9953 41.6351367 127.9093 42.2861367L127.9093 50.2651367 129.6693 50.2651367 129.6693 51.8081367 123.7153 51.8081367 123.7153 50.2651367zM146.7593 44.3355367C146.6623 41.6595367 145.6263 40.6475367 143.7943 40.6475367 141.8903 40.6475367 140.6613 41.8535367 140.4193 44.3355367L146.7593 44.3355367zM137.6473 45.5405367C137.6473 41.5395367 140.1303 39.0315367 143.7943 39.0315367 147.3383 39.0315367 149.3873 40.8885367 149.3873 45.1065367 149.3873 45.4685367 149.3633 45.8065367 149.3633 45.9015367L140.3713 45.9015367C140.4673 48.8435367 141.7453 50.2895367 144.2523 50.2895367 146.0353 50.2895367 146.8553 49.6625367 147.5073 48.8665367L149.0013 48.8665367 149.0013 50.6505367C148.0123 51.3025367 146.5913 51.9525367 144.0593 51.9525367 139.8173 51.9525367 137.6473 49.4935367 137.6473 45.5405367L137.6473 45.5405367z"
+      />
+      <polygon fill="#685AC0" points="0 27.001 6.5 20.501 0 14.001" />
+      <polygon fill="#A094FC" points=".001 14.001 6.501 20.501 13 14.001" />
+      <polygon fill="#685AC0" points="13 27.001 13 14.001 6.5 20.502" />
+      <polygon fill="#C2BFEB" points="13 14.001 13 27.001 19.5 20.501" />
+      <polygon fill="#685AC0" points="26 14.001 13 14.001 19.5 20.501" />
+      <polygon fill="#685AC0" points="13.001 27.001 26 27.001 19.5 20.501" />
+      <polygon fill="#C2BFEB" points="13 27.001 13 40.001 19.5 33.501" />
+      <polygon fill="#A094FC" points="26 27 13 27.001 19.5 33.501" />
+      <polygon fill="#685AC0" points="26 40 26 27 19.5 33.502" />
+      <polygon fill="#685AC0" points="0 40.001 6.5 33.5 0 27" />
+      <polygon fill="#C2BFEB" points=".001 27.001 6.501 33.501 13 27.001" />
+      <polygon fill="#A094FC" points=".001 40.001 13 40.001 6.5 33.5" />
+      <polygon fill="#C2BFEB" points="13 53 19.501 46.501 13 40.001" />
+      <polygon fill="#685AC0" points="26 40 13 40 19.5 46.501" />
+      <polygon fill="#C2BFEB" points="0 40 6.501 46.501 13 40" />
+      <polygon fill="#20024E" points=".001 27.001 13 27.001 6.5 20.501" />
+      <polygon fill="#20024E" points="26 27 26 14 19.5 20.502" />
+      <polygon fill="#20024E" points="13 40.001 13 27.001 6.5 33.502" />
+      <polygon fill="#20024E" points="13.001 40.001 26 40 19.5 33.501" />
+      <polygon fill="#20024E" points="6.5 46.502 13 53 13 40.001" />
+    </Symbol>
+  );
+}

package/src/components/symbol/components/logos/bom-multibrand-small-logo.tsx

@@ -0,0 +1,50 @@
+import { clsx } from 'clsx';
+import React from 'react';
+
+import { Symbol } from '../../symbol.component.js';
+import { type SymbolProps } from '../../symbol.types.js';
+
+export function BOMMultibrandSmallLogo({
+  'aria-label': ariaLabel = 'Bank of Melbourne',
+  copyrightYear = '2023',
+  viewBoxWidth = 122,
+  viewBoxHeight = 44,
+  align = 'left',
+  offset = [null, 48, 96],
+  className,
+  ...props
+}: SymbolProps) {
+  return (
+    <Symbol
+      className={clsx('h-[44px] w-[122px]', className)}
+      aria-label={ariaLabel}
+      align={align}
+      offset={offset}
+      copyrightYear={copyrightYear}
+      viewBoxWidth={viewBoxWidth}
+      viewBoxHeight={viewBoxHeight}
+      {...props}
+    >
+      <polygon fill="#685AC0" points="0 16.001 6.5 9.501 0 3.001" />
+      <polygon fill="#A094FC" points=".001 3.001 6.501 9.501 13 3.001" />
+      <polygon fill="#685AC0" points="13 16.001 13 3.001 6.5 9.502" />
+      <polygon fill="#20024E" points=".001 16.001 13 16.001 6.5 9.501" />
+      <polygon fill="#C2BFEB" points="13 3.001 13 16.001 19.5 9.501" />
+      <polygon fill="#685AC0" points="26 3.001 13 3.001 19.5 9.501" />
+      <polygon fill="#20024E" points="26 16 26 3 19.5 9.502" />
+      <polygon fill="#685AC0" points="13.001 16.001 26 16.001 19.5 9.501" />
+      <polygon fill="#C2BFEB" points="13 16.001 13 29.001 19.5 22.501" />
+      <polygon fill="#A094FC" points="26 16 13 16.001 19.5 22.501" />
+      <polygon fill="#685AC0" points="26 29 26 16 19.5 22.502" />
+      <polygon fill="#20024E" points="13.001 29.001 26 29 19.5 22.501" />
+      <polygon fill="#685AC0" points="0 29.001 6.5 22.5 0 16" />
+      <polygon fill="#C2BFEB" points=".001 16.001 6.501 22.501 13 16.001" />
+      <polygon fill="#20024E" points="13 29.001 13 16.001 6.5 22.502" />
+      <polygon fill="#A094FC" points=".001 29.001 13 29.001 6.5 22.5" />
+      <polygon fill="#C2BFEB" points="13 42 19.501 35.501 13 29.001" />
+      <polygon fill="#685AC0" points="26 29 13 29 19.5 35.501" />
+      <polygon fill="#C2BFEB" points="0 29 6.501 35.501 13 29" />
+      <polygon fill="#20024E" points="6.5 35.502 13 42 13 29.001" />
+    </Symbol>
+  );
+}

package/src/components/symbol/components/logos/bom-shield-logo.tsx

@@ -0,0 +1,47 @@
+import { clsx } from 'clsx';
+import React from 'react';
+
+import { Symbol } from '../../symbol.component.js';
+import { type SymbolProps } from '../../symbol.types.js';
+
+export function BOMShieldLogo({
+  'aria-label': ariaLabel = 'Bank of Melbourne',
+  copyrightYear = '2023',
+  viewBoxWidth = 26,
+  viewBoxHeight = 39,
+  className,
+  ...props
+}: SymbolProps) {
+  return (
+    <Symbol
+      className={clsx('h-[39px] w-[26px]', className)}
+      aria-label={ariaLabel}
+      copyrightYear={copyrightYear}
+      viewBoxWidth={viewBoxWidth}
+      viewBoxHeight={viewBoxHeight}
+      {...props}
+    >
+      {' '}
+      <polygon points="0 0 0 13 6.5 6.5 " fill="#685AC0" />
+      <polygon points="13 0 0 0 6.5 6.5 " fill="#A094FC" />
+      <polygon points="13 13 13 0 6.5 6.5 " fill="#685AC0" />
+      <polygon points="0 13 13 13 6.5 6.5 " fill="#20024E" />
+      <polygon points="13 0 13 13 19.5 6.5 " fill="#C2BFEB" />
+      <polygon points="26 0 13 0 19.5 6.5 " fill="#685AC0" />
+      <polygon points="26 13 26 0 19.5 6.5 " fill="#20024E" />
+      <polygon points="13 13 26 13 19.5 6.5 " fill="#685AC0" />
+      <polygon points="13 13 13 26 19.5 19.5 " fill="#C2BFEB" />
+      <polygon points="26 13 13 13 19.5 19.5 " fill="#A094FC" />
+      <polygon points="26 26 26 13 19.5 19.5 " fill="#685AC0" />
+      <polygon points="13 26 26 26 19.5 19.5 " fill="#20024E" />
+      <polygon points="0 13 0 26 6.5 19.5 " fill="#685AC0" />
+      <polygon points="13 13 0 13 6.5 19.5 " fill="#C2BFEB" />
+      <polygon points="13 26 13 13 6.5 19.5 " fill="#20024E" />
+      <polygon points="0 26 13 26 6.5 19.5 " fill="#A094FC" />
+      <polygon points="13 26 13 39 19.5 32.5 " fill="#C2BFEB" />
+      <polygon points="26 26 13 26 19.5 32.5 " fill="#685AC0" />
+      <polygon points="13 26 0 26 6.5 32.5 " fill="#C2BFEB" />
+      <polygon points="13 39 13 26 6.5 32.5 " fill="#20024E" />
+    </Symbol>
+  );
+}

package/src/components/symbol/components/logos/bsa-logo.tsx

@@ -0,0 +1,52 @@
+import { clsx } from 'clsx';
+import React from 'react';
+
+import { Symbol } from '../../symbol.component.js';
+import { type SymbolProps } from '../../symbol.types.js';
+
+export const BSALogo = ({
+  'aria-label': ariaLabel = 'Bank SA',
+  copyrightYear = '2023',
+  viewBoxWidth = 90,
+  viewBoxHeight = 41,
+  className,
+  ...props
+}: SymbolProps) => (
+  <Symbol
+    className={clsx('h-[41px] w-[90px]', className)}
+    aria-label={ariaLabel}
+    copyrightYear={copyrightYear}
+    viewBoxWidth={viewBoxWidth}
+    viewBoxHeight={viewBoxHeight}
+    {...props}
+  >
+    <path
+      d="M58 25.5c-0.9 0-2-0.5-2-1.5V2c0-1 1-2 2-2h30c1 0 2 1 2 2v38.2c0 0.5-0.4 0.8-0.9 0.8 -0.6 0-0.8-0.5-0.9-0.8C79.7 25.5 58.9 25.5 58 25.5z"
+      fill="#E91B2B"
+    />
+    <path
+      d="M80 7l-2.1 8.5c0 0 0 0.1 0.1 0.1l4.4 0c0 0 0.1 0 0.1-0.1L80.4 7C80.3 6.6 80.1 6.6 80 7zM82.3 2.8c0.4 0 0.7 0.2 0.7 0.5l4.7 18.3c0.1 0.2 0.1 0.4 0.1 0.5 0 0.3-0.3 0.6-0.7 0.6l-2.3 0c-0.4 0-0.6-0.3-0.7-0.6l-0.9-3.5c0 0 0 0-0.1 0l-5.9 0c0 0 0 0-0.1 0l-0.9 3.5c-0.1 0.3-0.3 0.6-0.7 0.6l-2.3 0c-0.4 0-0.7-0.3-0.7-0.6 0 0 0-0.3 0.1-0.5l4.7-18.3c0.1-0.3 0.3-0.5 0.7-0.5L82.3 2.8z"
+      fill="#fff"
+    />
+    <path
+      d="M62.3 7.5c0 1.4 0.7 1.9 2.3 2.8l3.5 2c2.4 1.4 3.3 2.9 3.3 5.5 0 3.5-2.7 5.3-6.5 5.3 -3.7 0-6.4-1.8-6.4-5.4l0-1.2c0-0.4 0.4-0.8 0.9-0.8l2 0c0.5 0 0.9 0.4 0.9 0.8l0 1.2c0 1.4 1.1 2.3 2.6 2.3 1.7 0 2.6-0.7 2.6-2.2h0c0-1.8-1.5-2.6-2.6-3.2L61 12.4c-1.8-1-2.5-3-2.5-4.6 0-3.5 2.6-5.6 6.5-5.6 3.7 0 6.4 1.9 6.4 5.5l0 0.6C71.4 8.7 71 9 70.5 9l-2 0c-0.5 0-0.9-0.4-0.9-0.8l0-0.6C67.6 6.2 66.7 5 65 5 63.3 5 62.3 5.9 62.3 7.5L62.3 7.5z"
+      fill="#fff"
+    />
+    <path
+      d="M21.5 15.7C21.5 15.6 21.5 15.6 21.5 15.7l-3.6 1.4c-1 0.4-1.2 1.1-1.2 1.7 0 1 0.3 1.9 2.3 1.9 1.4 0 2.4-1 2.4-2.2L21.5 15.7zM13 19.2c0-2.3 1.2-3.6 3.1-4.3l3.8-1.4c1.2-0.4 1.6-0.8 1.6-1.6 0-1-0.8-1.7-2.2-1.7 -1.3 0-2.2 0.7-2.2 1.8l0 0c0 0.4-0.4 0.8-0.9 0.8l-1.7 0c-0.5 0-0.9-0.4-0.9-0.8l0 0c0-2.6 2.3-4.6 5.7-4.6 3.7 0 5.5 2.2 5.5 4.9l0 9.8c0 0.4-0.4 0.8-0.9 0.8l-1.7 0c-0.5 0-0.9-0.4-0.9-0.8l0-0.1c0-0.3-0.1-0.3-0.3-0.1 -0.9 0.9-2.2 1.4-3.6 1.4C15.6 23.2 13 22.2 13 19.2"
+      fill="#002F6C"
+    />
+    <path
+      d="M41.1 3.8C41.1 3.4 41.5 3 42 3l1.7 0c0.5 0 0.9 0.4 0.9 0.8l0 9.6c0 0.3 0.1 0.3 0.3 0.1l3.9-4.6c0.3-0.4 0.5-0.6 1-0.6l2.1 0c0.5 0 0.8 0.2 0.8 0.5 0 0.1-0.1 0.4-0.2 0.5l-4.4 5.2c-0.1 0.1-0.1 0.2 0 0.2l5 7c0.1 0.2 0.1 0.3 0.1 0.4 0 0.4-0.4 0.7-0.9 0.7l-1.9 0c-0.5 0-0.8-0.4-1.1-0.8l-4.3-6.2c-0.2-0.3-0.3-0.2-0.3 0.1l0 6.1c0 0.4-0.4 0.8-0.9 0.8l-1.7 0c-0.5 0-0.9-0.4-0.9-0.8L41.1 3.8z"
+      fill="#002F6C"
+    />
+    <path
+      d="M38.8 11.6c0-2.2-1.7-4.2-4.1-4.2 -1.5 0-2.8 0.6-3.5 1.6 -0.2 0.3-0.3 0.2-0.3-0.1V8.7c0-0.4-0.4-0.8-0.9-0.8l-1.7 0c-0.5 0-0.9 0.4-0.9 0.8l0 5v7.9h0l0 0.6c0 0.4 0.4 0.8 0.9 0.8l1.7 0c0.5 0 0.9-0.4 0.9-0.8l0-0.7v-9.9c0.3-0.5 0.9-1.1 1.7-1.3 0.2 0 0.4-0.1 0.6-0.1 0.7 0 1.2 0.2 1.6 0.6 0 0 0 0 0 0 0 0 0 0 0.1 0.1 0.3 0.3 0.5 0.7 0.5 1.1 0 0.2 0 0.3 0 0.5l0 9.7c0 0.4 0.4 0.8 0.9 0.8l1.7 0c0.5 0 0.9-0.4 0.9-0.8L38.8 11.6z"
+      fill="#002F6C"
+    />
+    <path
+      d="M11.5 11.3c0-2.1-1.9-3.9-4.1-3.9C5.8 7.4 4.6 8 3.9 9 3.7 9.3 3.5 9.2 3.5 8.9l0-5.1C3.5 3.4 3.1 3 2.6 3L0.9 3C0.4 3 0 3.4 0 3.8l0 18.3c0 0.4 0.4 0.8 0.9 0.8l1.7 0c0.5 0 0.9-0.4 0.9-0.8v-0.2c0-0.3 0.1-0.4 0.3-0.1 0.7 1 2 1.4 3.5 1.4 2.3 0 4.1-1.6 4.1-4 0 0 0.1-1.5 0.1-3.9S11.5 11.3 11.5 11.3zM8 18.3c0 1.3-0.8 2.2-2.2 2.2 -0.9 0-1.9-0.6-2.2-1.4v-7.4c0.4-0.8 1.3-1.3 2.2-1.3 1.4 0 2.2 0.9 2.2 2.2 0 0 0 0.8 0 2.6C8 17.2 8 18.3 8 18.3z"
+      fill="#002F6C"
+    />
+  </Symbol>
+);