@westpac/ui 1.0.0-canary.8 → 1.0.0

package/dist/components/symbol/components/symbols/samsung-pay-button-symbol.d.ts

@@ -0,0 +1,2 @@
+import { type SymbolProps } from '../../symbol.types.js';
+export declare const SamsungPayButtonSymbol: ({ "aria-label": ariaLabel, copyrightYear, viewBoxWidth, viewBoxHeight, className, ...props }: SymbolProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/symbol/components/symbols/samsung-pay-button-symbol.js

@@ -0,0 +1,55 @@
+import { clsx } from 'clsx';
+import React from 'react';
+import { Symbol } from '../../symbol.component.js';
+export const SamsungPayButtonSymbol = ({ 'aria-label': ariaLabel = 'Samsung Pay', copyrightYear = '', viewBoxWidth = 268, viewBoxHeight = 63, className, ...props })=>React.createElement(Symbol, {
+        className: clsx('h-[63px] w-[268px]', className),
+        "aria-label": ariaLabel,
+        copyrightYear: copyrightYear,
+        viewBoxWidth: viewBoxWidth,
+        viewBoxHeight: viewBoxHeight,
+        ...props
+    }, React.createElement("g", {
+        clipPath: "url(#clip0_94_2479)"
+    }, React.createElement("path", {
+        d: "M257.57 0.23999H10.6302C4.89023 0.23999 0.240234 4.88999 0.240234 10.63V52.2C0.240234 57.94 4.89023 62.59 10.6302 62.59H257.57C263.31 62.59 267.96 57.94 267.96 52.2V10.63C267.96 4.88999 263.31 0.23999 257.57 0.23999Z",
+        className: "fill-black"
+    }), React.createElement("path", {
+        d: "M133.43 36.87H133.33L128.87 21.64H121.66V40.85H126.43L126.17 25.09H126.27L131.06 40.85H137.98V21.64H133.17L133.43 36.87Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M41.8002 21.64L38.2002 41.05H43.4502L46.1002 23.44H46.2102L48.8002 41.05H54.0102L50.4402 21.64H41.8002Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M71.1301 21.64L68.7301 36.48H68.6301L66.2301 21.64H58.3201L57.8901 41.05H62.7501L62.8701 23.6H62.9801L66.2201 41.05H71.1401L74.3901 23.6H74.4901L74.6201 41.05H79.4701L79.0401 21.64H71.1301Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M26.1803 26.64C26.0903 26.24 26.1103 25.84 26.1603 25.62C26.3003 25 26.7203 24.32 27.9303 24.32C29.0703 24.32 29.7303 25.02 29.7303 26.08V27.28H34.5703V25.91C34.5703 21.68 30.7703 21.02 28.0303 21.02C24.5803 21.02 21.7603 22.16 21.2403 25.33C21.1003 26.2 21.0803 26.97 21.2803 27.95C22.1203 31.92 29.0203 33.06 30.0203 35.58C30.2103 36.05 30.1503 36.65 30.0603 37.02C29.9003 37.67 29.4603 38.33 28.1703 38.33C26.9603 38.33 26.2203 37.63 26.2203 36.57V34.69H21.0103V36.19C21.0103 40.52 24.4203 41.83 28.0603 41.83C31.5703 41.83 34.4603 40.63 34.9203 37.39C35.1603 35.71 34.9803 34.62 34.9003 34.21C34.1003 30.12 26.7303 28.91 26.1803 26.64Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M89.3305 26.69C89.2405 26.3 89.2605 25.9 89.3105 25.68C89.4505 25.06 89.8705 24.39 91.0605 24.39C92.1905 24.39 92.8505 25.08 92.8505 26.13V27.32H97.6405V25.97C97.6405 21.78 93.8805 21.13 91.1605 21.13C87.7505 21.13 84.9505 22.26 84.4505 25.39C84.3105 26.25 84.2905 27.01 84.4905 27.98C85.3205 31.91 92.1505 33.04 93.1405 35.53C93.3305 36 93.2705 36.59 93.1805 36.95C93.0205 37.59 92.5905 38.24 91.3105 38.24C90.1105 38.24 89.3805 37.55 89.3805 36.5V34.64H84.2305V36.12C84.2305 40.41 87.6005 41.7 91.2205 41.7C94.7005 41.7 97.5605 40.52 98.0105 37.31C98.2405 35.65 98.0705 34.57 97.9905 34.16C97.1605 30.14 89.8705 28.94 89.3305 26.69Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M111.34 35.99C111.34 36.24 111.34 36.52 111.3 36.73C111.2 37.21 110.79 38.14 109.44 38.14C108.09 38.14 107.67 37.21 107.58 36.73C107.54 36.52 107.53 36.24 107.53 35.99V21.64H102.62V35.56C102.61 35.92 102.65 36.65 102.66 36.84C103 40.46 105.86 41.64 109.43 41.64C113 41.64 115.86 40.47 116.2 36.84C116.22 36.65 116.26 35.92 116.25 35.56V21.64H111.34V35.99Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M149.95 30.15V32.98H151.94V35.8C151.94 36.05 151.93 36.32 151.89 36.54C151.8 37.06 151.31 37.95 149.91 37.95C148.51 37.95 148.02 37.06 147.92 36.54C147.88 36.32 147.87 36.05 147.88 35.8V26.93C147.88 26.61 147.9 26.27 147.96 26.01C148.07 25.53 148.48 24.6 149.89 24.6C151.37 24.6 151.74 25.58 151.83 26.01C151.89 26.29 151.89 26.75 151.89 26.75V27.84H156.79V27.19C156.79 27.19 156.81 26.53 156.74 25.91C156.38 22.27 153.37 21.11 149.93 21.11C146.49 21.11 143.55 22.28 143.12 25.91C143.08 26.23 143.04 26.84 143.04 27.19V35.36C143.04 35.73 143.05 35.99 143.11 36.64C143.43 40.17 146.5 41.44 149.94 41.44C153.38 41.44 156.44 40.18 156.77 36.64C156.83 35.99 156.84 35.73 156.84 35.36V30.16H149.95V30.15Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M247.11 30.9C246.76 30.48 246.39 30.08 245.99 29.7C245.58 29.32 245.18 28.93 244.78 28.53C244.39 28.15 243.98 27.76 243.57 27.35C243.15 26.97 242.74 26.58 242.33 26.18C241.94 25.78 241.53 25.39 241.12 25.01C240.73 24.61 240.32 24.21 239.91 23.81C239.52 23.41 239.12 23.01 238.7 22.61L238.11 22.01C237.92 21.81 237.67 21.65 237.36 21.53H237.17C236.92 21.57 236.74 21.65 236.61 21.77C236.2 22.17 235.79 22.57 235.4 22.97L235.15 23.33C235.05 23.63 235.1 23.88 235.31 24.08C235.7 24.5 236.1 24.91 236.49 25.32C236.9 25.7 237.31 26.09 237.7 26.49C238.09 26.89 238.5 27.29 238.91 27.69C239.3 28.07 239.71 28.46 240.12 28.87C240.51 29.27 240.91 29.67 241.33 30.07C241.72 30.47 242.12 30.87 242.51 31.28L242.23 31.58C241.82 31.98 241.41 32.37 241.02 32.75C240.61 33.15 240.2 33.55 239.81 33.95C239.39 34.35 238.99 34.75 238.6 35.16C238.19 35.56 237.78 35.96 237.39 36.36C237 36.76 236.59 37.16 236.18 37.57L235.59 38.14L235.19 38.62L235.16 39.22L235.35 39.55L235.41 39.58C235.8 39.98 236.21 40.38 236.62 40.78C236.76 40.92 236.99 40.99 237.3 40.99L237.55 40.93C237.82 40.77 238.07 40.57 238.29 40.33C238.54 40.07 238.8 39.81 239.07 39.55L239.5 39.13C239.89 38.75 240.3 38.36 240.71 37.96C241.12 37.56 241.53 37.17 241.92 36.79C242.33 36.39 242.73 35.99 243.13 35.58C243.54 35.2 243.95 34.81 244.34 34.4C244.75 34 245.16 33.61 245.55 33.23C245.96 32.83 246.37 32.44 246.76 32.06L247.1 31.64L247.16 31.01L247.11 30.9Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M180.69 21.0601H173.58V41.8101H177.45V35.8701H180.66C184.98 35.8701 188.16 32.5701 188.16 28.4501C188.16 24.3501 184.98 21.0601 180.69 21.0601ZM180.4 32.2801H177.44V24.6301H180.4C182.7 24.6301 184.27 26.3401 184.27 28.4401C184.27 30.5801 182.7 32.2801 180.4 32.2801Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M202.49 27.1701C201.3 25.7501 199.33 24.8401 197.15 24.8401C192.94 24.8401 188.91 28.0001 188.91 33.5101C188.91 38.9401 193.09 42.1501 197.1 42.1501C199.29 42.1501 201.28 41.1801 202.5 39.6501V41.8101H206.34V25.1801H202.5V27.1701H202.49ZM197.72 38.6201C194.88 38.6201 192.69 36.3501 192.69 33.4501C192.69 30.5801 194.88 28.3301 197.72 28.3301C200.56 28.3301 202.69 30.6301 202.69 33.4501C202.69 36.3201 200.56 38.6201 197.72 38.6201Z",
+        className: "fill-white"
+    }), React.createElement("path", {
+        d: "M220.69 25.1801L216.31 36.3801L211.67 25.1801H207.58L214.4 40.9801L210.91 49.4801H214.8L224.72 25.1801H220.69Z",
+        className: "fill-white"
+    })), React.createElement("defs", null, React.createElement("clipPath", {
+        id: "clip0_94_2479"
+    }, React.createElement("rect", {
+        width: "268",
+        height: "63",
+        fill: "white"
+    }))));

package/dist/components/symbol/components/symbols/visa-blue-symbol.js

@@ -9,11 +9,17 @@ export const VisaBlueSymbol = ({ 'aria-label': ariaLabel = 'Visa', copyrightYear
         viewBoxHeight: viewBoxHeight,
         ...props
     }, React.createElement("g", {
-        fill: "none"
+        clipPath: "url(#clip0_118_1227)"
     }, React.createElement("path", {
-        fill: "#1A1F71",
-        d: "M0 37h80V0H0"
+        d: "M0 37H80V0H0",
+        className: "fill-[#1434CB]"
     }), React.createElement("path", {
-        d: "M38.527 7.93l-4.46 20.854H28.67L33.128 7.93h5.4zM61.22 21.392l2.838-7.827 1.64 7.827h-4.48zm6.024 7.392h4.982L67.87 7.93h-4.6c-1.037 0-1.913.602-2.3 1.53l-8.09 19.324h5.664l1.124-3.115h6.92l.656 3.114zm-14.084-6.81c.022-5.505-7.61-5.806-7.56-8.268.02-.744.736-1.544 2.287-1.747.774-.1 2.906-.177 5.323.933l.945-4.426c-1.3-.46-2.967-.92-5.047-.92-5.33 0-9.083 2.83-9.115 6.894-.03 3.002 2.68 4.68 4.722 5.674 2.102 1.03 2.81 1.678 2.8 2.593-.017 1.4-1.68 2.017-3.228 2.043-2.714.043-4.284-.735-5.542-1.32l-.973 4.572c1.26.583 3.585 1.087 5.994 1.113 5.667 0 9.373-2.802 9.394-7.14zM30.814 7.93L22.08 28.784h-5.703l-4.304-16.642c-.256-1.025-.485-1.4-1.28-1.833-1.298-.706-3.44-1.363-5.328-1.778l.132-.602h9.183c1.167 0 2.218.777 2.486 2.126l2.27 12.063 5.615-14.19h5.664z",
-        fill: "#FFF"
-    })));
+        d: "M38.5268 7.9299L34.0668 28.7839H28.6698L33.1278 7.9299H38.5278H38.5268ZM61.2198 21.3919L64.0578 13.5649L65.6978 21.3919H61.2178H61.2198ZM67.2438 28.7839H72.2258L67.8698 7.9299H63.2698C62.2328 7.9299 61.3568 8.5319 60.9698 9.4599L52.8798 28.7839H58.5438L59.6678 25.6689H66.5878L67.2438 28.7829V28.7839ZM53.1598 21.9739C53.1818 16.4689 45.5498 16.1679 45.5998 13.7059C45.6198 12.9619 46.3358 12.1619 47.8868 11.9589C48.6608 11.8589 50.7928 11.7819 53.2098 12.8919L54.1548 8.4659C52.8548 8.0059 51.1878 7.5459 49.1078 7.5459C43.7778 7.5459 40.0248 10.3759 39.9928 14.4399C39.9628 17.4419 42.6728 19.1199 44.7148 20.1139C46.8168 21.1439 47.5248 21.7919 47.5148 22.7069C47.4978 24.1069 45.8348 24.7239 44.2868 24.7499C41.5728 24.7929 40.0028 24.0149 38.7448 23.4299L37.7718 28.0019C39.0318 28.5849 41.3568 29.0889 43.7658 29.1149C49.4328 29.1149 53.1388 26.3129 53.1598 21.9749V21.9739ZM30.8138 7.9299L22.0798 28.7839H16.3768L12.0728 12.1419C11.8168 11.1169 11.5878 10.7419 10.7928 10.3089C9.49484 9.6029 7.35284 8.9459 5.46484 8.5309L5.59684 7.9289H14.7798C15.9468 7.9289 16.9978 8.7059 17.2658 10.0549L19.5358 22.1179L25.1508 7.9279H30.8148L30.8138 7.9299Z",
+        className: "fill-white"
+    })), React.createElement("defs", null, React.createElement("clipPath", {
+        id: "clip0_118_1227"
+    }, React.createElement("rect", {
+        width: "80",
+        height: "37",
+        fill: "white"
+    }))));

package/dist/components/symbol/components/symbols/visa-white-symbol.js

@@ -9,11 +9,17 @@ export const VisaWhiteSymbol = ({ 'aria-label': ariaLabel = 'Visa', copyrightYea
         viewBoxHeight: viewBoxHeight,
         ...props
     }, React.createElement("g", {
-        fill: "none"
+        clipPath: "url(#clip0_118_1243)"
     }, React.createElement("path", {
-        fill: "#FFF",
-        d: "M0 37h80V0H0"
+        d: "M0 37H80V0H0",
+        className: "fill-white"
     }), React.createElement("path", {
-        d: "M38.527 7.93l-4.46 20.854H28.67L33.128 7.93h5.4zM61.22 21.392l2.838-7.827 1.64 7.827h-4.48zm6.024 7.392h4.982L67.87 7.93h-4.6c-1.037 0-1.913.602-2.3 1.53l-8.09 19.324h5.664l1.124-3.115h6.92l.656 3.114zm-14.084-6.81c.022-5.505-7.61-5.806-7.56-8.268.02-.744.736-1.544 2.287-1.747.774-.1 2.906-.177 5.323.933l.945-4.426c-1.3-.46-2.967-.92-5.047-.92-5.33 0-9.083 2.83-9.115 6.894-.03 3.002 2.68 4.68 4.722 5.674 2.102 1.03 2.81 1.678 2.8 2.593-.017 1.4-1.68 2.017-3.228 2.043-2.714.043-4.284-.735-5.542-1.32l-.973 4.572c1.26.583 3.585 1.087 5.994 1.113 5.667 0 9.373-2.802 9.394-7.14zM30.814 7.93L22.08 28.784h-5.703l-4.304-16.642c-.256-1.025-.485-1.4-1.28-1.833-1.298-.706-3.44-1.363-5.328-1.778l.132-.602h9.183c1.167 0 2.218.777 2.486 2.126l2.27 12.063 5.615-14.19h5.664z",
-        fill: "#1A1F71"
-    })));
+        d: "M38.5268 7.9299L34.0668 28.7839H28.6698L33.1278 7.9299H38.5278H38.5268ZM61.2198 21.3919L64.0578 13.5649L65.6978 21.3919H61.2178H61.2198ZM67.2438 28.7839H72.2258L67.8698 7.9299H63.2698C62.2328 7.9299 61.3568 8.5319 60.9698 9.4599L52.8798 28.7839H58.5438L59.6678 25.6689H66.5878L67.2438 28.7829V28.7839ZM53.1598 21.9739C53.1818 16.4689 45.5498 16.1679 45.5998 13.7059C45.6198 12.9619 46.3358 12.1619 47.8868 11.9589C48.6608 11.8589 50.7928 11.7819 53.2098 12.8919L54.1548 8.4659C52.8548 8.0059 51.1878 7.5459 49.1078 7.5459C43.7778 7.5459 40.0248 10.3759 39.9928 14.4399C39.9628 17.4419 42.6728 19.1199 44.7148 20.1139C46.8168 21.1439 47.5248 21.7919 47.5148 22.7069C47.4978 24.1069 45.8348 24.7239 44.2868 24.7499C41.5728 24.7929 40.0028 24.0149 38.7448 23.4299L37.7718 28.0019C39.0318 28.5849 41.3568 29.0889 43.7658 29.1149C49.4328 29.1149 53.1388 26.3129 53.1598 21.9749V21.9739ZM30.8138 7.9299L22.0798 28.7839H16.3768L12.0728 12.1419C11.8168 11.1169 11.5878 10.7419 10.7928 10.3089C9.49484 9.6029 7.35284 8.9459 5.46484 8.5309L5.59684 7.9289H14.7798C15.9468 7.9289 16.9978 8.7059 17.2658 10.0549L19.5358 22.1179L25.1508 7.9279H30.8148L30.8138 7.9299Z",
+        className: "fill-[#1434CB]"
+    })), React.createElement("defs", null, React.createElement("clipPath", {
+        id: "clip0_118_1243"
+    }, React.createElement("rect", {
+        width: "80",
+        height: "37",
+        fill: "white"
+    }))));

package/dist/components/symbol/components/symbols/x-symbol.js

@@ -9,15 +9,15 @@ export const XSymbol = ({ 'aria-label': ariaLabel = 'X', copyrightYear = '', vie
         viewBoxHeight: viewBoxHeight,
         ...props
     }, React.createElement("g", {
-        "clip-path": "url(#clip0_1842_16)"
+        clipPath: "url(#clip0_94_846)"
     }, React.createElement("path", {
         d: "M30 0H2C0.89543 0 0 0.89543 0 2V30C0 31.1046 0.89543 32 2 32H30C31.1046 32 32 31.1046 32 30V2C32 0.89543 31.1046 0 30 0Z",
-        fill: "black"
+        className: "fill-black"
     }), React.createElement("path", {
         d: "M18.093 14.1624L26.283 4H24.3422L17.2308 12.8238L11.551 4H5L13.589 17.3432L5 28H6.94088L14.4507 18.6817L20.449 28H27L18.0925 14.1624H18.093ZM15.4347 17.4608L14.5644 16.1321L7.6402 5.55962H10.6213L16.2092 14.0919L17.0795 15.4206L24.3431 26.5113H21.3621L15.4347 17.4613V17.4608Z",
-        fill: "white"
+        className: "fill-white"
     })), React.createElement("defs", null, React.createElement("clipPath", {
-        id: "clip0_1842_16"
+        id: "clip0_94_846"
     }, React.createElement("rect", {
         width: "32",
         height: "32",

package/dist/components/symbol/components/symbols/youtube-symbol.js

@@ -8,31 +8,13 @@ export const YouTubeSymbol = ({ 'aria-label': ariaLabel = 'YouTube', copyrightYe
         viewBoxWidth: viewBoxWidth,
         viewBoxHeight: viewBoxHeight,
         ...props
-    }, React.createElement("defs", null, React.createElement("linearGradient", {
-        x1: "50%",
-        y1: "0%",
-        x2: "50%",
-        y2: "100%",
-        id: "YouTubeSymbol"
-    }, React.createElement("stop", {
-        stopColor: "#E52D27",
-        offset: "0%"
-    }), React.createElement("stop", {
-        stopColor: "#B31217",
-        offset: "100%"
-    }))), React.createElement("g", {
-        fill: "none",
-        fillRule: "evenodd"
-    }, React.createElement("rect", {
-        fill: "url(#YouTubeSymbol)",
-        width: "32",
-        height: "32",
-        rx: "2"
+    }, React.createElement("path", {
+        d: "M30 0H2C0.89543 0 0 0.89543 0 2V30C0 31.1046 0.89543 32 2 32H30C31.1046 32 32 31.1046 32 30V2C32 0.89543 31.1046 0 30 0Z",
+        className: "fill-[#FF0033]"
     }), React.createElement("path", {
-        fillOpacity: ".25",
-        fill: "#000",
-        d: "M13.5 12.5l6 4.5.5-1"
+        d: "M6.62981 23.8463C5.59544 23.5739 4.78925 22.7727 4.49086 21.7845C4 19.9615 4 16.1614 4 16.1614C4 16.1614 4 12.3619 4.49086 10.5559C4.78864 9.55063 5.59544 8.76708 6.62981 8.49413C8.48793 8 15.9912 8 15.9912 8C15.9912 8 23.5121 8 25.3702 8.49413C26.4221 8.76649 27.2108 9.55063 27.4916 10.5559C28 12.3619 28 16.1614 28 16.1614C28 16.1614 28 19.9609 27.4916 21.7845C27.2108 22.7727 26.4221 23.5733 25.3702 23.8463C23.5121 24.3404 15.9912 24.3404 15.9912 24.3404C15.9912 24.3404 8.48793 24.3404 6.62981 23.8463ZM13.6071 19.6721L19.8309 16.162L13.6071 12.6689V19.6721Z",
+        className: "fill-white"
     }), React.createElement("path", {
-        d: "M15.995 7.5h.01s5.038 0 8.397.244c.47.057 1.492.062 2.404 1.024.72.733.954 2.398.954 2.398s.24 1.956.24 3.91v1.835c0 1.956-.24 3.91-.24 3.91s-.234 1.667-.954 2.4c-.912.962-1.935.967-2.404 1.023-3.36.245-8.402.253-8.402.253s-6.24-.058-8.16-.243c-.534-.1-1.733-.07-2.646-1.033-.72-.733-.954-2.4-.954-2.4S4 18.867 4 16.91v-1.833c0-1.955.24-3.91.24-3.91s.234-1.666.954-2.4c.913-.96 1.935-.966 2.404-1.023 3.36-.244 8.397-.244 8.397-.244zm-2.495 5v7L20 16l-6.5-3.5z",
-        fill: "#FFF"
-    })));
+        d: "M13.6074 19.6721L19.8306 16.162L13.6074 12.6689V19.6721Z",
+        className: "fill-[#FF0033]"
+    }));

package/dist/components/symbol/index.d.ts

@@ -1,4 +1,5 @@
 export { AmericanExpressSymbol } from './components/symbols/american-express-symbol.js';
+export { ApplePaySymbol } from './components/symbols/apple-pay-symbol.js';
 export { AppleStoreInverseSymbol } from './components/symbols/apple-store-inverse-symbol.js';
 export { AppleStoreSymbol } from './components/symbols/apple-store-symbol.js';
 export { BOMLogo } from './components/logos/bom-logo.js';
@@ -10,8 +11,6 @@ export { BTLogo } from './components/logos/bt-logo.js';
 export { BTPanoramaLogo } from './components/logos/bt-panorama-logo.js';
 export { BTMultibrandSmallLogo } from './components/logos/bt-multibrand-small-logo.js';
 export { BTMultibrandLargeLogo } from './components/logos/bt-multibrand-large-logo.js';
-export { BTPanoramaMultibrandSmallLogo } from './components/logos/bt-panorama-multibrand-small-logo.js';
-export { BTPanoramaMultibrandLargeLogo } from './components/logos/bt-panorama-multibrand-large-logo.js';
 export { BOMShieldLogo } from './components/logos/bom-shield-logo.js';
 export { BPayLandSymbol } from './components/symbols/bpay-land-symbol.js';
 export { BPayPortSymbol } from './components/symbols/bpay-port-symbol.js';
@@ -19,42 +18,37 @@ export { BSALogo } from './components/logos/bsa-logo.js';
 export { BSAMultibrandLargeLogo } from './components/logos/bsa-multibrand-large-logo.js';
 export { BSAMultibrandSmallLogo } from './components/logos/bsa-multibrand-small-logo.js';
 export { BSAStackedLogo } from './components/logos/bsa-stacked-logo.js';
+export { EftposHorizontalInverseSymbol } from './components/symbols/eftpos-horizontal-inverse-symbol.js';
+export { EftposHorizontalSymbol } from './components/symbols/eftpos-horizontal-symbol.js';
+export { EftposVerticalInverseSymbol } from './components/symbols/eftpos-vertical-inverse-symbol.js';
+export { EftposVerticalSymbol } from './components/symbols/eftpos-vertical-symbol.js';
+export { FacebookCircularSymbol } from './components/symbols/facebook-circular-symbol.js';
 export { FacebookSymbol } from './components/symbols/facebook-symbol.js';
-export { GooglePlusSymbol } from './components/symbols/google-plus-symbol.js';
+export { GooglePayInverseSymbol } from './components/symbols/google-pay-inverse-symbol.js';
+export { GooglePaySymbol } from './components/symbols/google-pay-symbol.js';
 export { GoogleStoreSymbol } from './components/symbols/google-store-symbol.js';
 export { InstagramSymbol } from './components/symbols/instagram-symbol.js';
 export { LinkedInSymbol } from './components/symbols/linked-in-symbol.js';
-export { MastercardAcceptedSymbol } from './components/symbols/mastercard-accepted-symbol.js';
-export { MastercardHorizontalSymbol } from './components/symbols/mastercard-horizontal-symbol.js';
 export { MastercardSymbol } from './components/symbols/mastercard-symbol.js';
-export { MicrosoftStoreSymbol } from './components/symbols/microsoft-store-symbol.js';
+export { PayIDInverseSymbol } from './components/symbols/pay-id-inverse-symbol.js';
 export { PayIDSymbol } from './components/symbols/pay-id-symbol.js';
-export { RedAvatarCircleLogo } from './components/logos/red-avatar-circle-logo.js';
-export { RedAvatarCircleReversedLogo } from './components/logos/red-avatar-circle-reversed-logo.js';
-export { RedAvatarLogo } from './components/logos/red-avatar-logo.js';
-export { PayToBlackSymbol } from './components/symbols/pay-to-black-symbol.js';
-export { PayToDarkGreySymbol } from './components/symbols/pay-to-dark-grey-symbol.js';
-export { PayToLightGreySymbol } from './components/symbols/pay-to-light-grey-symbol.js';
-export { PayToWhiteSymbol } from './components/symbols/pay-to-white-symbol.js';
-export { PayToWordmarkBlackSymbol } from './components/symbols/pay-to-wordmark-black-symbol.js';
-export { PayToWordmarkLightGreySymbol } from './components/symbols/pay-to-wordmark-light-grey-symbol.js';
-export { PayToWordmarkDarkGreySymbol } from './components/symbols/pay-to-wordmark-dark-grey-symbol.js';
-export { PayToWordmarkWhiteSymbol } from './components/symbols/pay-to-wordmark-white-symbol.js';
-export { SlackSymbol } from './components/symbols/slack-symbol.js';
+export { PayToInverseSymbol } from './components/symbols/pay-to-inverse-symbol.js';
+export { PayToSymbol } from './components/symbols/pay-to-symbol.js';
+export { SamsungPayButtonInverseSymbol } from './components/symbols/samsung-pay-button-inverse-symbol.js';
+export { SamsungPayButtonSymbol } from './components/symbols/samsung-pay-button-symbol.js';
 export { STGDragonLogo } from './components/logos/stg-dragon-logo.js';
 export { STGLogo } from './components/logos/stg-logo.js';
 export { STGMultibrandLargeLogo } from './components/logos/stg-multibrand-large-logo.js';
 export { STGMultibrandSmallLogo } from './components/logos/stg-multibrand-small-logo.js';
-export { TwitterSymbol } from './components/symbols/twitter-symbol.js';
 export { VisaBlueSymbol } from './components/symbols/visa-blue-symbol.js';
-export { VisaSymbol } from './components/symbols/visa-symbol.js';
 export { VisaWhiteSymbol } from './components/symbols/visa-white-symbol.js';
 export { WBCLogo } from './components/logos/wbc-logo.js';
 export { WBCMultibrandLargeLogo } from './components/logos/wbc-multibrand-large-logo.js';
 export { WBCMultibrandSmallLogo } from './components/logos/wbc-multibrand-small-logo.js';
+export { WBGInternalLogo } from './components/logos/wbg-internal-logo.js';
+export { WBGLogo } from './components/logos/wbg-logo.js';
+export { WBGMultibrandLargeLogo } from './components/logos/wbg-multibrand-large-logo.js';
+export { WBGMultibrandSmallLogo } from './components/logos/wbg-multibrand-small-logo.js';
 export { XSymbol } from './components/symbols/x-symbol.js';
-export { XMarkSymbol } from './components/symbols/x-mark-symbol.js';
-export { XMarkInverseSymbol } from './components/symbols/x-mark-inverse-symbol.js';
-export { YammerSymbol } from './components/symbols/yammer-symbol.js';
 export { YouTubeSymbol } from './components/symbols/youtube-symbol.js';
 export { type SymbolProps } from './symbol.types.js';

package/dist/components/symbol/index.js

@@ -1,4 +1,5 @@
 export { AmericanExpressSymbol } from './components/symbols/american-express-symbol.js';
+export { ApplePaySymbol } from './components/symbols/apple-pay-symbol.js';
 export { AppleStoreInverseSymbol } from './components/symbols/apple-store-inverse-symbol.js';
 export { AppleStoreSymbol } from './components/symbols/apple-store-symbol.js';
 export { BOMLogo } from './components/logos/bom-logo.js';
@@ -10,8 +11,6 @@ export { BTLogo } from './components/logos/bt-logo.js';
 export { BTPanoramaLogo } from './components/logos/bt-panorama-logo.js';
 export { BTMultibrandSmallLogo } from './components/logos/bt-multibrand-small-logo.js';
 export { BTMultibrandLargeLogo } from './components/logos/bt-multibrand-large-logo.js';
-export { BTPanoramaMultibrandSmallLogo } from './components/logos/bt-panorama-multibrand-small-logo.js';
-export { BTPanoramaMultibrandLargeLogo } from './components/logos/bt-panorama-multibrand-large-logo.js';
 export { BOMShieldLogo } from './components/logos/bom-shield-logo.js';
 export { BPayLandSymbol } from './components/symbols/bpay-land-symbol.js';
 export { BPayPortSymbol } from './components/symbols/bpay-port-symbol.js';
@@ -19,41 +18,36 @@ export { BSALogo } from './components/logos/bsa-logo.js';
 export { BSAMultibrandLargeLogo } from './components/logos/bsa-multibrand-large-logo.js';
 export { BSAMultibrandSmallLogo } from './components/logos/bsa-multibrand-small-logo.js';
 export { BSAStackedLogo } from './components/logos/bsa-stacked-logo.js';
+export { EftposHorizontalInverseSymbol } from './components/symbols/eftpos-horizontal-inverse-symbol.js';
+export { EftposHorizontalSymbol } from './components/symbols/eftpos-horizontal-symbol.js';
+export { EftposVerticalInverseSymbol } from './components/symbols/eftpos-vertical-inverse-symbol.js';
+export { EftposVerticalSymbol } from './components/symbols/eftpos-vertical-symbol.js';
+export { FacebookCircularSymbol } from './components/symbols/facebook-circular-symbol.js';
 export { FacebookSymbol } from './components/symbols/facebook-symbol.js';
-export { GooglePlusSymbol } from './components/symbols/google-plus-symbol.js';
+export { GooglePayInverseSymbol } from './components/symbols/google-pay-inverse-symbol.js';
+export { GooglePaySymbol } from './components/symbols/google-pay-symbol.js';
 export { GoogleStoreSymbol } from './components/symbols/google-store-symbol.js';
 export { InstagramSymbol } from './components/symbols/instagram-symbol.js';
 export { LinkedInSymbol } from './components/symbols/linked-in-symbol.js';
-export { MastercardAcceptedSymbol } from './components/symbols/mastercard-accepted-symbol.js';
-export { MastercardHorizontalSymbol } from './components/symbols/mastercard-horizontal-symbol.js';
 export { MastercardSymbol } from './components/symbols/mastercard-symbol.js';
-export { MicrosoftStoreSymbol } from './components/symbols/microsoft-store-symbol.js';
+export { PayIDInverseSymbol } from './components/symbols/pay-id-inverse-symbol.js';
 export { PayIDSymbol } from './components/symbols/pay-id-symbol.js';
-export { RedAvatarCircleLogo } from './components/logos/red-avatar-circle-logo.js';
-export { RedAvatarCircleReversedLogo } from './components/logos/red-avatar-circle-reversed-logo.js';
-export { RedAvatarLogo } from './components/logos/red-avatar-logo.js';
-export { PayToBlackSymbol } from './components/symbols/pay-to-black-symbol.js';
-export { PayToDarkGreySymbol } from './components/symbols/pay-to-dark-grey-symbol.js';
-export { PayToLightGreySymbol } from './components/symbols/pay-to-light-grey-symbol.js';
-export { PayToWhiteSymbol } from './components/symbols/pay-to-white-symbol.js';
-export { PayToWordmarkBlackSymbol } from './components/symbols/pay-to-wordmark-black-symbol.js';
-export { PayToWordmarkLightGreySymbol } from './components/symbols/pay-to-wordmark-light-grey-symbol.js';
-export { PayToWordmarkDarkGreySymbol } from './components/symbols/pay-to-wordmark-dark-grey-symbol.js';
-export { PayToWordmarkWhiteSymbol } from './components/symbols/pay-to-wordmark-white-symbol.js';
-export { SlackSymbol } from './components/symbols/slack-symbol.js';
+export { PayToInverseSymbol } from './components/symbols/pay-to-inverse-symbol.js';
+export { PayToSymbol } from './components/symbols/pay-to-symbol.js';
+export { SamsungPayButtonInverseSymbol } from './components/symbols/samsung-pay-button-inverse-symbol.js';
+export { SamsungPayButtonSymbol } from './components/symbols/samsung-pay-button-symbol.js';
 export { STGDragonLogo } from './components/logos/stg-dragon-logo.js';
 export { STGLogo } from './components/logos/stg-logo.js';
 export { STGMultibrandLargeLogo } from './components/logos/stg-multibrand-large-logo.js';
 export { STGMultibrandSmallLogo } from './components/logos/stg-multibrand-small-logo.js';
-export { TwitterSymbol } from './components/symbols/twitter-symbol.js';
 export { VisaBlueSymbol } from './components/symbols/visa-blue-symbol.js';
-export { VisaSymbol } from './components/symbols/visa-symbol.js';
 export { VisaWhiteSymbol } from './components/symbols/visa-white-symbol.js';
 export { WBCLogo } from './components/logos/wbc-logo.js';
 export { WBCMultibrandLargeLogo } from './components/logos/wbc-multibrand-large-logo.js';
 export { WBCMultibrandSmallLogo } from './components/logos/wbc-multibrand-small-logo.js';
+export { WBGInternalLogo } from './components/logos/wbg-internal-logo.js';
+export { WBGLogo } from './components/logos/wbg-logo.js';
+export { WBGMultibrandLargeLogo } from './components/logos/wbg-multibrand-large-logo.js';
+export { WBGMultibrandSmallLogo } from './components/logos/wbg-multibrand-small-logo.js';
 export { XSymbol } from './components/symbols/x-symbol.js';
-export { XMarkSymbol } from './components/symbols/x-mark-symbol.js';
-export { XMarkInverseSymbol } from './components/symbols/x-mark-inverse-symbol.js';
-export { YammerSymbol } from './components/symbols/yammer-symbol.js';
 export { YouTubeSymbol } from './components/symbols/youtube-symbol.js';

package/dist/components/symbol/symbol.types.d.ts

@@ -1,10 +1,6 @@
 import { type SVGAttributes } from 'react';
 export type Align = 'left' | 'center' | 'right';
 export type SymbolProps = Omit<SVGAttributes<SVGElement>, 'offset' | 'mode'> & {
-    /**
-     * mode
-     */
-    mode?: 'light' | 'dark' | 'auto';
     /**
      * SVG alignment
      */

package/dist/components/tooltip/components/tooltip-content/tooltip-content.component.d.ts

@@ -1,2 +1,2 @@
 import { TooltipContentProps } from './tooltip-content.types.js';
-export declare function TooltipContent({ children, id }: TooltipContentProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function TooltipContent({ children, id, position }: TooltipContentProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/tooltip/components/tooltip-content/tooltip-content.component.js

@@ -1,8 +1,10 @@
 import React from 'react';
 import { styles } from './tooltip-content.styles.js';
-export function TooltipContent({ children, id }) {
+export function TooltipContent({ children, id, position }) {
     return children ? React.createElement("span", {
-        className: styles(),
+        className: styles({
+            position
+        }),
         role: "tooltip",
         id: id
     }, children) : null;

package/dist/components/tooltip/components/tooltip-content/tooltip-content.styles.d.ts

@@ -1 +1,16 @@
-export declare const styles: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "absolute top-full left-1 z-10 mt-2 rounded-sm border border-border-muted-soft bg-surface-muted-faint p-0.5 whitespace-nowrap text-text-body", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "absolute top-full left-1 z-10 mt-2 rounded-sm border border-border-muted-soft bg-surface-muted-faint p-0.5 whitespace-nowrap text-text-body", unknown, unknown, undefined>>;
+export declare const styles: import("tailwind-variants").TVReturnType<{
+    position: {
+        top: string;
+        bottom: string;
+    };
+}, undefined, "absolute left-1 z-10 rounded-sm border border-border-muted-soft bg-surface-muted-faint p-0.5 whitespace-nowrap text-text-body", {
+    position: {
+        top: string;
+        bottom: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    position: {
+        top: string;
+        bottom: string;
+    };
+}, undefined, "absolute left-1 z-10 rounded-sm border border-border-muted-soft bg-surface-muted-faint p-0.5 whitespace-nowrap text-text-body", unknown, unknown, undefined>>;

package/dist/components/tooltip/components/tooltip-content/tooltip-content.styles.js

@@ -1,4 +1,10 @@
 import { tv } from 'tailwind-variants';
 export const styles = tv({
-    base: 'absolute top-full left-1 z-10 mt-2 rounded-sm border border-border-muted-soft bg-surface-muted-faint p-0.5 whitespace-nowrap text-text-body'
+    base: 'absolute left-1 z-10 rounded-sm border border-border-muted-soft bg-surface-muted-faint p-0.5 whitespace-nowrap text-text-body',
+    variants: {
+        position: {
+            top: 'top-auto bottom-full',
+            bottom: 'top-full mt-2 mb-0'
+        }
+    }
 });

package/dist/components/tooltip/components/tooltip-content/tooltip-content.types.d.ts

@@ -2,4 +2,5 @@ import { ReactNode } from 'react';
 export type TooltipContentProps = {
     children?: ReactNode;
     id: string;
+    position?: 'top' | 'bottom';
 };

package/dist/components/tooltip/tooltip.component.d.ts

@@ -1,2 +1,2 @@
 import { TooltipProps } from './tooltip.types.js';
-export declare function Tooltip({ children, tooltip, id, className }: TooltipProps): import("react/jsx-runtime").JSX.Element;
+export declare function Tooltip({ children, disabled, tooltip, id, className, position }: TooltipProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/tooltip/tooltip.component.js

@@ -3,7 +3,7 @@ import React, { useCallback, useEffect, useId, useRef, useState } from 'react';
 import { mergeProps, useHover, useFocusRing } from 'react-aria';
 import { TooltipContent } from './components/tooltip-content/tooltip-content.component.js';
 import { styles } from './tooltip.styles.js';
-export function Tooltip({ children, tooltip, id, className }) {
+export function Tooltip({ children, disabled, tooltip, id, className, position = 'bottom' }) {
     const localId = useId();
     const [isOpen, setIsOpen] = useState(false);
     const tooltipWaitTime = useRef(null);
@@ -27,12 +27,12 @@ export function Tooltip({ children, tooltip, id, className }) {
         }
     }, []);
     useEffect(()=>{
-        setIsOpen(isFocusVisible);
+        setIsOpen(isFocusVisible && !disabled);
     }, [
         isFocusVisible
     ]);
     useEffect(()=>{
-        if (isHovered && !isOpen) startTimer();
+        if (isHovered && !isOpen && !disabled) startTimer();
         if (!isHovered) setIsOpen(false);
         return ()=>stopTimer();
     }, [
@@ -50,6 +50,7 @@ export function Tooltip({ children, tooltip, id, className }) {
             className
         })
     }, children, isOpen && React.createElement(TooltipContent, {
-        id: id !== null && id !== void 0 ? id : localId
+        id: id !== null && id !== void 0 ? id : localId,
+        position: position
     }, tooltip));
 }

package/dist/components/tooltip/tooltip.types.d.ts

@@ -1,7 +1,10 @@
 import { ReactNode } from 'react';
+import { TooltipContentProps } from './components/tooltip-content/tooltip-content.types.js';
 export type TooltipProps = {
     children: ReactNode;
+    disabled?: boolean;
     tooltip: string;
     id?: string;
     className?: string;
+    position?: TooltipContentProps['position'];
 };