@uh-design-system/component-library 0.7.0 → 0.7.1

package/dist/cjs/ds-icon-visibility-off.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconVisibilityOff = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconVisibilityOff = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '69d22ac5e957df140a8a618cdfa4a215fa2c2d97', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '9b5ad174ce54755e9964d4163a881eb7eba3ccd9', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '0c26a0c798437fb75d802573bc75f7704680294e', d: "m634-432-77-76q21-44-12.5-69t-62.5-6l-70-71q15-8 33-12t35-4q71 0 120.5 49.5T650-500q0 16-4 36t-12 32Zm148 150-55-56q44-35 76.5-77t52.5-85q-52-110-150.5-175T490-740q-42 0-82 7t-59 16l-66-66q35-16 92.5-28T485-823q147 0 272 85t186 238q-25 66-67.5 121.5T782-282Zm25 227L653-207q-35 14-80 22t-93 8q-151 0-276.5-85.5T17-500q18-51 55-103t86-100L35-824l50-52 769 769-47 52ZM216-646q-36 29-66 68.5T104-500q52 111 153 175.5T488-260q27 0 55.5-3t44.5-11l-64-64q-8 4-20.5 6t-23.5 2q-70 0-120-49t-50-121q0-11 1.5-23t4.5-21L216-646Zm323 128Zm-137 69Z" }))));
+        return (index.h(index.Host, { key: 'c89c77ed1e23a8a68fb8a8aea3aaa31d502e440b', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '95dd9d6a67f86589a742433730e2364e36460493', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '0ec60cadb12d27061e0c678e263654528909a513', d: "m634-432-77-76q21-44-12.5-69t-62.5-6l-70-71q15-8 33-12t35-4q71 0 120.5 49.5T650-500q0 16-4 36t-12 32Zm148 150-55-56q44-35 76.5-77t52.5-85q-52-110-150.5-175T490-740q-42 0-82 7t-59 16l-66-66q35-16 92.5-28T485-823q147 0 272 85t186 238q-25 66-67.5 121.5T782-282Zm25 227L653-207q-35 14-80 22t-93 8q-151 0-276.5-85.5T17-500q18-51 55-103t86-100L35-824l50-52 769 769-47 52ZM216-646q-36 29-66 68.5T104-500q52 111 153 175.5T488-260q27 0 55.5-3t44.5-11l-64-64q-8 4-20.5 6t-23.5 2q-70 0-120-49t-50-121q0-11 1.5-23t4.5-21L216-646Zm323 128Zm-137 69Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-visibility.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconVisibility = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconVisibility = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '811b25ae604fa8eabae4647d14bc0c0d8a46ca08', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '89e2fbc8e889adbd4573b6a164a5658fb0943f95', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'cea04593ea89dcebae34bcc74c45c731937e4a4b', d: "M480.12-330q70.88 0 120.38-49.62t49.5-120.5q0-70.88-49.62-120.38T479.88-670Q409-670 359.5-620.38T310-499.88q0 70.88 49.62 120.38t120.5 49.5Zm-.12-74q-40 0-68-28t-28-68q0-40 28-68t68-28q40 0 68 28t28 68q0 40-28 68t-68 28Zm0 227q-154 0-278-90T17-500q61-143 185-233t278-90q154 0 278 90t185 233q-61 143-185 233t-278 90Zm0-323Zm-.08 240q120.45 0 221.27-65.5Q802-391 855-500q-53-109-153.73-174.5Q600.53-740 480.08-740t-221.27 65.5Q158-609 104-500q54 109 154.73 174.5Q359.47-260 479.92-260Z" }))));
+        return (index.h(index.Host, { key: '3ed0754310e9acbffc0921370db5d18722c5ed91', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'cec3dfcb3adec2dbf95f882070286b67caa5586d', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'f03ffc04739b483c779420b425e4a3ecba60a893', d: "M480.12-330q70.88 0 120.38-49.62t49.5-120.5q0-70.88-49.62-120.38T479.88-670Q409-670 359.5-620.38T310-499.88q0 70.88 49.62 120.38t120.5 49.5Zm-.12-74q-40 0-68-28t-28-68q0-40 28-68t68-28q40 0 68 28t28 68q0 40-28 68t-68 28Zm0 227q-154 0-278-90T17-500q61-143 185-233t278-90q154 0 278 90t185 233q-61 143-185 233t-278 90Zm0-323Zm-.08 240q120.45 0 221.27-65.5Q802-391 855-500q-53-109-153.73-174.5Q600.53-740 480.08-740t-221.27 65.5Q158-609 104-500q54 109 154.73 174.5Q359.47-260 479.92-260Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-vpn-lock.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconVpnLock = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconVpnLock = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '19f8b5d11cd4f5cb2265ea63d4cffc8c18b86992', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '8ebcabad5ce1ebe91d24db0167b98dfc45aa2701', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'a0ddc437d35355062f03128257ed908a23c67334', d: "M480.67-55Q390.8-55 312.9-87.5t-135.4-90Q120-235 87.5-312.65T55-479.53Q55-570 87.5-647.5t89.5-135Q234-840 310.3-873q76.31-33 162.7-33 44.65 0 90.32 8Q609-890 632-880v191H435v123.2H312v83.8h293v170h38l80 58q43-49 66-107.1 23-58.09 23-116.78 0-13.12-.5-35.12t-2.5-34h93q2 9 3 28.69t1 37.31q0 89.39-32.5 167.7-32.5 78.3-90 135.8-57.5 57.5-134.78 90T480.67-55ZM435-144v-90l-77.94-77.69v-38.85L156-551q-4 24-5.5 37.17Q149-500.67 149-485q0 130.55 80.86 227.27Q310.73-161 435-144Zm246-452v-219h46v-40q0-37.95 25.7-65.47Q778.4-948 815.5-948q37.51 0 63.51 27.53Q905-892.95 905-855v40h47v219H681Zm97-219h76v-47q0-17.3-10.28-30.15Q833.45-905 815.5-905q-17.53 0-27.51 12.85Q778-879.3 778-862v47Z" }))));
+        return (index.h(index.Host, { key: '2a1759f242ca6af76bb158f9173593c275fd2fff', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '74dee4493202cde2ea0cef0dc84a5f452b631c1c', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'eea77cdb8afd2ee208b958d31ccbb57bb7090f26', d: "M480.67-55Q390.8-55 312.9-87.5t-135.4-90Q120-235 87.5-312.65T55-479.53Q55-570 87.5-647.5t89.5-135Q234-840 310.3-873q76.31-33 162.7-33 44.65 0 90.32 8Q609-890 632-880v191H435v123.2H312v83.8h293v170h38l80 58q43-49 66-107.1 23-58.09 23-116.78 0-13.12-.5-35.12t-2.5-34h93q2 9 3 28.69t1 37.31q0 89.39-32.5 167.7-32.5 78.3-90 135.8-57.5 57.5-134.78 90T480.67-55ZM435-144v-90l-77.94-77.69v-38.85L156-551q-4 24-5.5 37.17Q149-500.67 149-485q0 130.55 80.86 227.27Q310.73-161 435-144Zm246-452v-219h46v-40q0-37.95 25.7-65.47Q778.4-948 815.5-948q37.51 0 63.51 27.53Q905-892.95 905-855v40h47v219H681Zm97-219h76v-47q0-17.3-10.28-30.15Q833.45-905 815.5-905q-17.53 0-27.51 12.85Q778-879.3 778-862v47Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-warning-fill.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconWarningFill = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconWarningFill = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '85a9522d5dce4a203273255d9dd684e1361f749f', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'ee3e392768df5ba1b2e69715466de51fdd8ecc00', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '5877796ab5bec22cb642e54d51730c92d5dab568', d: "m18-107 462-799 462 799H18Zm466.18-132q13.4 0 23.61-10.39Q518-259.78 518-273.18q0-13.4-10.39-23.11-10.39-9.71-23.79-9.71-13.4 0-23.61 9.89Q450-286.22 450-272.82q0 13.4 10.39 23.61Q470.78-239 484.18-239ZM454-348h60v-216h-60v216Z" }))));
+        return (index.h(index.Host, { key: '0b55a576cac6e77a55072c1a4a89365d5d5406cb', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '218965a9a48f8e7823acca495ffc22a6a475f952', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'af4e95359a9568a914850417d5c1ee25dc686962', d: "m18-107 462-799 462 799H18Zm466.18-132q13.4 0 23.61-10.39Q518-259.78 518-273.18q0-13.4-10.39-23.11-10.39-9.71-23.79-9.71-13.4 0-23.61 9.89Q450-286.22 450-272.82q0 13.4 10.39 23.61Q470.78-239 484.18-239ZM454-348h60v-216h-60v216Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-warning.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconWarning = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconWarning = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '6b4414a572025e48920fd89322d9009af98836f9', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '8ab74750905416d016fc749a8766c5896d297eb7', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'd29d727adbd20be2cfd325d226ecfd915296b9f9', d: "m18-107 462-799 462 799H18Zm145-84h634L480-739 163-191Zm321.18-48q13.4 0 23.61-10.39Q518-259.78 518-273.18q0-13.4-10.39-23.11-10.39-9.71-23.79-9.71-13.4 0-23.61 9.89Q450-286.22 450-272.82q0 13.4 10.39 23.61Q470.78-239 484.18-239ZM454-348h60v-216h-60v216Zm26-117Z" }))));
+        return (index.h(index.Host, { key: '4b41adb90ae559188a33fde374f1186228ac9396', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '1cec524b96a67a6147fc6855376718669acd29a0', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '56de9e0a0c36b143e0120d5d543adb3828e4642a', d: "m18-107 462-799 462 799H18Zm145-84h634L480-739 163-191Zm321.18-48q13.4 0 23.61-10.39Q518-259.78 518-273.18q0-13.4-10.39-23.11-10.39-9.71-23.79-9.71-13.4 0-23.61 9.89Q450-286.22 450-272.82q0 13.4 10.39 23.61Q470.78-239 484.18-239ZM454-348h60v-216h-60v216Zm26-117Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-widget-small-fill.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconWidgetSmallFill = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconWidgetSmallFill = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '49e9d4cce15ae2e5bd0a0a9022d611024e0a7536', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'f2d8d34213ae309b34706ea64e73848d0abff100', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '8b4be8cd43b14496daf1fcaae2b7df6337c3af37', d: "M55-55v-240h240v240H55Zm304 0v-240h242v240H359Zm306 0v-240h241v240H665ZM55-359v-242h240v242H55Zm304 0v-242h242v242H359Zm306 0v-242h241v242H665ZM55-665v-241h240v241H55Zm304 0v-241h242v241H359Zm306 0v-241h241v241H665Z" }))));
+        return (index.h(index.Host, { key: 'ecbacd9ddcd692c01bad981a9208ecbc4667374c', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '7e8f0e776876f85e69d29f1c08b9ac376d5cc536', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '4c8909282cdb6851af6353d6dd9a13a2964e77d0', d: "M55-55v-240h240v240H55Zm304 0v-240h242v240H359Zm306 0v-240h241v240H665ZM55-359v-242h240v242H55Zm304 0v-242h242v242H359Zm306 0v-242h241v242H665ZM55-665v-241h240v241H55Zm304 0v-241h242v241H359Zm306 0v-241h241v241H665Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-widget-small.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconWidgetSmall = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconWidgetSmall = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '03421ae4fbf716259baf1abe11c4800a0037672f', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '2093e42b1e7a1e67644debd53361e0ddc496a099', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '2e0b073278a370da5da2b62a4194480ef60a356f', d: "M55-55v-240h240v240H55Zm304 0v-240h242v240H359Zm306 0v-240h241v240H665ZM55-359v-242h240v242H55Zm304 0v-242h242v242H359Zm306 0v-242h241v242H665ZM55-665v-241h240v241H55Zm304 0v-241h242v241H359Zm306 0v-241h241v241H665ZM213-212Zm229 0h76-76Zm306 0ZM213-443v-74 74Zm267-37Zm268 37v-74 74ZM442-748h76-76Zm306 0ZM137-138h76v-74h-76v74Zm305 0h76v-74h-76v74Zm306 0h75v-74h-75v74ZM137-443h76v-74h-76v74Zm305 0h76v-74h-76v74Zm306 0h75v-74h-75v74ZM442-748h76v-74h-76v74Zm306 0h75v-74h-75v74Z" }))));
+        return (index.h(index.Host, { key: '4788d30cbe57530fedad096ce42f1a137fb18a8a', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '33bab707a54f1a493eee463481035bac23573fd9', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'ba2577641cde1d437cfa317eef71631d3f980ace', d: "M55-55v-240h240v240H55Zm304 0v-240h242v240H359Zm306 0v-240h241v240H665ZM55-359v-242h240v242H55Zm304 0v-242h242v242H359Zm306 0v-242h241v242H665ZM55-665v-241h240v241H55Zm304 0v-241h242v241H359Zm306 0v-241h241v241H665ZM213-212Zm229 0h76-76Zm306 0ZM213-443v-74 74Zm267-37Zm268 37v-74 74ZM442-748h76-76Zm306 0ZM137-138h76v-74h-76v74Zm305 0h76v-74h-76v74Zm306 0h75v-74h-75v74ZM137-443h76v-74h-76v74Zm305 0h76v-74h-76v74Zm306 0h75v-74h-75v74ZM442-748h76v-74h-76v74Zm306 0h75v-74h-75v74Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-x.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconX = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconX = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '90412b9519c9a7d50e2ac3da386ece6cb6e24285', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '305b50b12cdcedf82468eee1581a4b7ab9dfd998', viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '7312e43910f0b13cac910ba986c174f326932140', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M3.00003 3.00002C3.00001 4.00002 3.00002 4.00002 3.00002 5.00002L3.00002 21C4.5 21 4.00002 21 5.00002 21L21 21C21 20 21 20 21 19L21 3.00003C20 2.99999 20 3.00002 19 3.00002H3.00003ZM16.9092 7.00001H15.2128L12.4175 10.1954L10.0005 7.00001H6.50002L10.6826 12.4692L6.71848 17H8.41591L11.4754 13.5041L14.1492 17H17.5631L13.2031 11.2359L16.9092 7.00001Z" }), index.h("path", { key: '08adc9b188f46212035f624129f74694e8e52658', d: "M14.6175 15.9846H15.5575L9.48976 7.96207H8.48104L14.6175 15.9846Z" }))));
+        return (index.h(index.Host, { key: '05ac4306b2cd9150c341d529c52a23569629ea2d', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '14b111b337532a7688372511c4a95c347c441fb4', viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'b31a0ea754bef3f77b5241c5fa2ddf83d09c6342', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M3.00003 3.00002C3.00001 4.00002 3.00002 4.00002 3.00002 5.00002L3.00002 21C4.5 21 4.00002 21 5.00002 21L21 21C21 20 21 20 21 19L21 3.00003C20 2.99999 20 3.00002 19 3.00002H3.00003ZM16.9092 7.00001H15.2128L12.4175 10.1954L10.0005 7.00001H6.50002L10.6826 12.4692L6.71848 17H8.41591L11.4754 13.5041L14.1492 17H17.5631L13.2031 11.2359L16.9092 7.00001Z" }), index.h("path", { key: 'f6124bee3093f09f1a01f61a87f6d91be1b92cd3', d: "M14.6175 15.9846H15.5575L9.48976 7.96207H8.48104L14.6175 15.9846Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-youtube.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconYoutube = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconYoutube = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: 'd231d2442381380f72273086340838e65474fea1', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'e3064d66a424822cd025827cb289a10cc950e495', viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '2e883c3f7b6845451c4657e33ef5d3aea850ea15', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M21 3.00002C21 8.3569 21 15.643 21 21.0001C15 20.9806 8.99999 21 3 21V3.00019C8.35684 2.99992 15.6429 3.00002 21 3.00002ZM12.4663 7.00165L11.7079 7.0004C10.7113 7.00644 7.45039 7.04509 6.52908 7.29244C5.92669 7.4538 5.45224 7.92917 5.29122 8.5328C5.06455 9.38044 5.01349 10.9415 5.00199 11.6018V12.2175C5.01349 12.8778 5.06455 14.4389 5.29122 15.2865C5.45224 15.8901 5.92669 16.3457 6.52908 16.5071C7.36319 16.731 10.115 16.7839 11.368 16.7964H12.6307C13.8837 16.7839 16.6355 16.731 17.4696 16.5071C18.072 16.3457 18.5464 15.8901 18.7074 15.2865C18.8713 14.6738 18.9434 13.6884 18.9751 12.9398L18.9995 11.817C18.9958 11.3789 18.9649 9.49561 18.7074 8.5328C18.5464 7.92917 18.072 7.45378 17.4696 7.29244C16.5968 7.05811 13.6241 7.01109 12.4663 7.00165ZM10.5992 9.79955L14.0995 11.8998L10.5992 14V9.79955Z" }))));
+        return (index.h(index.Host, { key: 'f586cb781f9592fae6ee9a0b0dc8815491c96fe4', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'bad3da434182100bad1f1ef3b5cf0ec6fad30c6c', viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '7282291d76c53091aa2c4672f7e27d3ec0703cbb', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M21 3.00002C21 8.3569 21 15.643 21 21.0001C15 20.9806 8.99999 21 3 21V3.00019C8.35684 2.99992 15.6429 3.00002 21 3.00002ZM12.4663 7.00165L11.7079 7.0004C10.7113 7.00644 7.45039 7.04509 6.52908 7.29244C5.92669 7.4538 5.45224 7.92917 5.29122 8.5328C5.06455 9.38044 5.01349 10.9415 5.00199 11.6018V12.2175C5.01349 12.8778 5.06455 14.4389 5.29122 15.2865C5.45224 15.8901 5.92669 16.3457 6.52908 16.5071C7.36319 16.731 10.115 16.7839 11.368 16.7964H12.6307C13.8837 16.7839 16.6355 16.731 17.4696 16.5071C18.072 16.3457 18.5464 15.8901 18.7074 15.2865C18.8713 14.6738 18.9434 13.6884 18.9751 12.9398L18.9995 11.817C18.9958 11.3789 18.9649 9.49561 18.7074 8.5328C18.5464 7.92917 18.072 7.45378 17.4696 7.29244C16.5968 7.05811 13.6241 7.01109 12.4663 7.00165ZM10.5992 9.79955L14.0995 11.8998L10.5992 14V9.79955Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-zoom-in-map.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconZoomInMap = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconZoomInMap = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: 'e3b7390b22bd91f0376c830f134338f160d5c50f', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'f9d81cf36c181444edc38f2e8a45e0fbc948e70e', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'fee3fe754fe0b9c9791a325731158342b816a86b', d: "m147-79-68-68 130-130H95v-94h276v276h-94v-114L147-79Zm666 0L684-209v114h-95v-276h277v94H751l130 130-68 68ZM95-589v-95h114L79-813l68-68 130 130v-115h94v277H95Zm494 0v-277h95v115l130-131 68 68-131 130h115v95H589Z" }))));
+        return (index.h(index.Host, { key: 'f1ce9da50093991871642f55ac6f7e66819ed4c3', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'b4ae7398805f4388967f1874f3bc844123bd215f', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '69082359c2a2114153d9bcaecdb12eef2461066a', d: "m147-79-68-68 130-130H95v-94h276v276h-94v-114L147-79Zm666 0L684-209v114h-95v-276h277v94H751l130 130-68 68ZM95-589v-95h114L79-813l68-68 130 130v-115h94v277H95Zm494 0v-277h95v115l130-131 68 68-131 130h115v95H589Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-zoom-in.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconZoomIn = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconZoomIn = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: '53772f09a5cbb55f2d3e8c64bf0467fb7037c69a', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'db042315a9473dace26f5df1f2e0740ae463191a', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '339a47264bf4dff2fdae0f75bcdafaf8b10f014e', d: "M795-93 526-361q-29 22.92-68.46 35.96Q418.08-312 372-312q-115.16 0-195.08-80Q97-472 97-585t80-193q80-80 193.5-80t193 80Q643-698 643-584.85q0 44.85-12.5 83.35Q618-463 593-429l270 268-68 68ZM371.35-406q74.9 0 126.28-52.25Q549-510.5 549-585t-51.52-126.75Q445.96-764 371.35-764q-75.43 0-127.89 52.25Q191-659.5 191-585t52.31 126.75Q295.62-406 371.35-406Zm-31.85-73v-77H263v-60h77v-77h60v77h77v60.5h-77v76.5h-60.5Z" }))));
+        return (index.h(index.Host, { key: 'e7d0687249d8e5e885fa8ac58501d7d18f33ee14', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'b6f6daea8b552829000550afc6ea7d66bbc39c04', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'f3a0a8f6d16adf423e5015d179db00f6a684f49e', d: "M795-93 526-361q-29 22.92-68.46 35.96Q418.08-312 372-312q-115.16 0-195.08-80Q97-472 97-585t80-193q80-80 193.5-80t193 80Q643-698 643-584.85q0 44.85-12.5 83.35Q618-463 593-429l270 268-68 68ZM371.35-406q74.9 0 126.28-52.25Q549-510.5 549-585t-51.52-126.75Q445.96-764 371.35-764q-75.43 0-127.89 52.25Q191-659.5 191-585t52.31 126.75Q295.62-406 371.35-406Zm-31.85-73v-77H263v-60h77v-77h60v77h77v60.5h-77v76.5h-60.5Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-zoom-out-map.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconZoomOutMap = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconZoomOutMap = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: 'cf8ede0ca718e682dd3986d201bf8af540edd239', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: '5cd42b62e03711a5c49ac620dbf17e592473679c', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '67955a14d6895efb6e0c603cc7274305b37606b8', d: "M95-95v-276h94v115l131-131 67 67-131 131h115v94H95Zm494 0v-94h115L574-319l67-67 130 130v-115h95v276H589ZM319-574 189-704v115H95v-277h276v95H256l130 130-67 67Zm322 0-67-67 130-130H589v-95h277v277h-95v-115L641-574Z" }))));
+        return (index.h(index.Host, { key: 'c1241b76db7afa679983a444bb832aa8f932ed01', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'ec002690fe752685dc44e2693a501aa2384a5c75', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: 'd99accf19538f71536a2af9114c87e8551ed0256', d: "M95-95v-276h94v115l131-131 67 67-131 131h115v94H95Zm494 0v-94h115L574-319l67-67 130 130v-115h95v276H589ZM319-574 189-704v115H95v-277h276v95H256l130 130-67 67Zm322 0-67-67 130-130H589v-95h277v277h-95v-115L641-574Z" }))));
     }
 };
 

package/dist/cjs/ds-icon-zoom-out.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 
 const DsIconZoomOut = class {
     constructor(hostRef) {
@@ -11,7 +11,7 @@ const DsIconZoomOut = class {
     dsRole = 'img';
     dsColour;
     render() {
-        return (index.h(index.Host, { key: 'b495b99d274fdf4773dfdb91a71a9fd37b0b90c0', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'b31415d191c47bbf61c9f587d5981ed9e7ecb61c', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '0be7e9be180e6e45fa7e87d217b15e0df2853697', d: "M795-93 526-361q-29 22.92-68.46 35.96Q418.08-312 372-312q-115.16 0-195.08-80Q97-472 97-585t80-193q80-80 193.5-80t193 80Q643-698 643-584.85q0 44.85-12.5 83.35Q618-463 593-429l270 268-68 68ZM371.35-406q74.9 0 126.28-52.25Q549-510.5 549-585t-51.52-126.75Q445.96-764 371.35-764q-75.43 0-127.89 52.25Q191-659.5 191-585t52.31 126.75Q295.62-406 371.35-406ZM269-556v-60h201v60H269Z" }))));
+        return (index.h(index.Host, { key: 'fd491a71429b5f0b066644fe15af1cc04d34db35', style: { display: 'flex' }, title: this.dsTitle }, index.h("svg", { key: 'bd9b6fa2ffdd44b9f6379db612c129e856a9f2e8', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", width: this.dsSize, height: this.dsSize, fill: this.dsColour, role: this.dsRole, "aria-label": this.dsTitle }, index.h("path", { key: '8baa46aa0f4623e64281e045410066f42eb2cab9', d: "M795-93 526-361q-29 22.92-68.46 35.96Q418.08-312 372-312q-115.16 0-195.08-80Q97-472 97-585t80-193q80-80 193.5-80t193 80Q643-698 643-584.85q0 44.85-12.5 83.35Q618-463 593-429l270 268-68 68ZM371.35-406q74.9 0 126.28-52.25Q549-510.5 549-585t-51.52-126.75Q445.96-764 371.35-764q-75.43 0-127.89 52.25Q191-659.5 191-585t52.31 126.75Q295.62-406 371.35-406ZM269-556v-60h201v60H269Z" }))));
     }
 };
 

package/dist/cjs/ds-icon.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
-var utils = require('./utils-BjZTECpy.js');
+var index = require('./index-DgPeuNJP.js');
+var utils = require('./utils-CQYRBA7R.js');
 
 const dsIconCss = ":host{display:flex}.ds-icon--container{display:flex}";
 
@@ -15,13 +15,15 @@ const DsIcon = class {
     dsTitle = 'Icon';
     dsRole = 'img';
     dsHidden = true;
+    get el() { return index.getElement(this); }
     getIconColour() {
         const colour = this.dsColour ? `var(--${this.dsColour})` : 'currentColor';
         return colour;
     }
     render() {
-        const IconTag = `ds-icon-${this.dsName.replace(/_/g, "-")}`;
-        return (index.h(index.Fragment, { key: '79230bd44116c5e9d3eddabfb66942e2d99d4bfd' }, index.h("span", { key: 'cee6cb1583830be8e4eb13f28c8c3f5b005808d3', class: "ds-icon--container", "aria-hidden": this.dsHidden ? 'true' : 'false' }, index.h(IconTag, { key: '298771a22e370f58f0b61ba26f19d78449d15ce4', dsSize: utils.remToPx(this.dsSize), dsColour: this.getIconColour(), dsRole: this.dsRole, dsTitle: this.dsTitle }))));
+        const iconComponentName = `ds-icon-${this.dsName.replace(/_/g, "-")}`;
+        const IconTag = utils.transformTagName(iconComponentName, 'ds-icon', this.el);
+        return (index.h(index.Fragment, { key: '7eaf2c94d82646aced5d1809adf1dc3878f462ab' }, index.h("span", { key: '534afbeb6d1aefaac7dd700a5925deef5f800dcb', class: "ds-icon--container", "aria-hidden": this.dsHidden ? 'true' : 'false' }, index.h(IconTag, { key: '528a25680f0198ba67054c23adab754aeff179f1', dsSize: utils.remToPx(this.dsSize), dsColour: this.getIconColour(), dsRole: this.dsRole, dsTitle: this.dsTitle }))));
     }
 };
 DsIcon.style = dsIconCss;

package/dist/cjs/ds-input-validity.cjs.entry.js

@@ -1,9 +1,10 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 var index$1 = require('./index-Bp6Dd2i1.js');
+var utils = require('./utils-CQYRBA7R.js');
 
-const dsInputValidityCss = ":root,:host{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.ds-input-validity{display:flex;align-items:center;margin-top:var(--ds-spacing-2xSmall);gap:var(--ds-spacing-2xSmall)}.ds-input-validity--error{color:var(--ds-palette-red-70)}.ds-input-validity--success{color:var(--ds-palette-green-70)}.ds-input-validity ds-icon{display:block;height:1.5rem}.ds-input-validity small{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}";
+const dsInputValidityCss = ":root,:host{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.ds-input-validity{display:flex;align-items:center;margin-top:var(--ds-spacing-2xSmall);gap:var(--ds-spacing-2xSmall)}.ds-input-validity--error{color:var(--ds-palette-red-70)}.ds-input-validity--success{color:var(--ds-palette-green-70)}.ds-input-validity__icon{display:block;height:1.5rem}.ds-input-validity small{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}";
 
 const DsInputValidity = class {
     constructor(hostRef) {
@@ -26,9 +27,11 @@ const DsInputValidity = class {
             'ds-input-validity--success': this.dsType === 'success',
         });
         const icon = this.dsType === 'success' ? 'check_circle_fill' : 'warning_fill';
-        return (index.h("div", { key: 'c56f67e7067eeb576b2c0ddc5a63f656a5670658', role: this.dsValidityRole, "aria-live": this.dsAriaLive, "aria-atomic": this.dsAriaAtomic }, this.dsText && (index.h("div", { key: 'e180b75368843c56dd85e4243bb7e74e79af0d26', class: classes }, index.h("ds-icon", { key: '66ca3abcccda0e7c3e6a11daa0c3110f97a9c1d9', dsName: icon }), index.h("small", { key: 'df1304b07c01b8399734769869521f281bdc475f', id: this.identifier }, this.dsText)))));
+        const DsIcon = utils.transformTagName('ds-icon', 'ds-input-validity', this.el);
+        return (index.h("div", { key: 'd39ec88fafa158e6ae3e0fde34ab9012454507a8', role: this.dsValidityRole, "aria-live": this.dsAriaLive, "aria-atomic": this.dsAriaAtomic }, this.dsText && (index.h("div", { key: '8c3863ba4dde84c806fd994af040cc91265f9679', class: classes }, index.h(DsIcon, { key: '221dd7009c9a3fc02fbf29d85abe4640ff26d3ce', class: "ds-input-validity__icon", dsName: icon }), index.h("small", { key: '7709de0ba98a75ab413a24309ca20d224f34ea25', id: this.identifier }, this.dsText)))));
     }
 };
+utils.declareComponentDependencies([index.h("ds-icon", null)]);
 DsInputValidity.style = dsInputValidityCss;
 
 exports.ds_input_validity = DsInputValidity;

package/dist/cjs/ds-link-with-arrow.cjs.entry.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 var index$1 = require('./index-Bp6Dd2i1.js');
 var attributes = require('./attributes-BMbXzbwU.js');
-var linkUtils = require('./linkUtils-Ce4ioJ7A.js');
-var utils = require('./utils-BjZTECpy.js');
-require('./index-CNUFAH0H.js');
+var linkUtils = require('./linkUtils-d3jBbGmk.js');
+var utils = require('./utils-CQYRBA7R.js');
+require('./index-DwxkNCwi.js');
 
-const dsLinkWithArrowCss = ":root,:host{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:host{display:inline-block}.ds-link-with-arrow{display:inline-flex;align-items:center;color:var(--ds-palette-mainBlue-70);letter-spacing:var(--ds-letterSpacing-wide);font-weight:var(--ds-fontWeight-semibold);font-size:var(--ds-fontSize-16);text-decoration-line:none}.ds-link-with-arrow:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-palette-white);outline:var(--ds-borderWidth-thin) solid var(--ds-palette-black-95);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}@media (min-width: 30rem){.ds-link-with-arrow{font-size:var(--ds-fontSize-18)}}.ds-link-with-arrow__icon{display:inline-flex;width:2rem;height:2rem;line-height:0;align-items:center;justify-content:center;color:var(--ds-palette-white);background-color:var(--ds-palette-mainBlue-70)}@media (min-width: 30rem){.ds-link-with-arrow__icon{width:2.5rem;height:2.5rem}}.ds-link-with-arrow__icon--start{margin-right:var(--ds-spacing-xSmall)}.ds-link-with-arrow__icon--end{margin-left:var(--ds-spacing-xSmall)}:hover slot>.ds-link-with-arrow__icon{outline:10px solid;background-color:var(--ds-palette-mainBlue-80)}:active slot>.ds-link-with-arrow__icon{background-color:var(--ds-palette-mainBlue-90)}.ds-link-with-arrow:hover,.ds-link-with-arrow:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:auto;text-decoration-thickness:7%;text-underline-offset:12%;text-underline-position:from-font}.ds-link-with-arrow:hover{color:var(--ds-palette-mainBlue-80)}.ds-link-with-arrow:active,.ds-link-with-arrow:focus-visible{color:var(--ds-palette-mainBlue-90)}";
+const dsLinkWithArrowCss = ":root,:host{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:host{display:inline-block}.ds-link-with-arrow{display:inline-flex;align-items:center;color:var(--ds-palette-mainBlue-70);letter-spacing:var(--ds-letterSpacing-wide);font-weight:var(--ds-fontWeight-semibold);font-size:var(--ds-fontSize-16);text-decoration-line:none}.ds-link-with-arrow:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-palette-white);outline:var(--ds-borderWidth-thin) solid var(--ds-palette-black-95);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}@media (min-width: 30rem){.ds-link-with-arrow{font-size:var(--ds-fontSize-18)}}.ds-link-with-arrow__icon{display:inline-flex;width:2rem;height:2rem;line-height:0;align-items:center;justify-content:center;color:var(--ds-palette-white);background-color:var(--ds-palette-mainBlue-70)}@media (min-width: 30rem){.ds-link-with-arrow__icon{width:2.5rem;height:2.5rem}}.ds-link-with-arrow__icon--start{margin-right:var(--ds-spacing-xSmall)}.ds-link-with-arrow__icon--end{margin-left:var(--ds-spacing-xSmall)}:hover slot>.ds-link-with-arrow__icon{background-color:var(--ds-palette-mainBlue-80)}:active slot>.ds-link-with-arrow__icon{background-color:var(--ds-palette-mainBlue-90)}.ds-link-with-arrow:hover,.ds-link-with-arrow:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:auto;text-decoration-thickness:7%;text-underline-offset:12%;text-underline-position:from-font}.ds-link-with-arrow:hover{color:var(--ds-palette-mainBlue-80)}.ds-link-with-arrow:active,.ds-link-with-arrow:focus-visible{color:var(--ds-palette-mainBlue-90)}";
 
 const visuallyHiddenAssistiveTextIdGenerator = utils.idGenerator('visually-hidden-assistive-text');
 const DsLinkWithArrow = class {
@@ -58,9 +58,12 @@ const DsLinkWithArrow = class {
             'ds-link-with-arrow__icon--start': this.dsIconPosition === 'start',
             'ds-link-with-arrow__icon--end': this.dsIconPosition === 'end',
         });
-        return (index.h(this.dsTag, { key: 'f33caca2eda5c54cc3d5b30f15e091f65006f2c2', class: classes, "aria-label": this.dsAriaLabel, ...this.inheritedAttributes, ...this.linkAttributes }, index.h("slot", { key: '2b4f7a313148bb5217d8907a5e3fad01a1ceff1d', name: "prefix" }, this.dsIconPosition === 'start' && index.h("ds-icon", { key: '7b826f07ce18fe842bca8a5006e474be98a0838b', dsName: this.icon, class: iconClasses, dsSize: this.iconSize })), this.dsText, index.h("slot", { key: '1184a385c1f75a49e4820eac3d21910ba0b54b3f', name: "suffix" }, this.dsIconPosition === 'end' && index.h("ds-icon", { key: '16607d6ff25bce5fb3fae5c6aca9fd808cb2710f', dsName: this.icon, class: iconClasses, dsSize: this.iconSize })), linkUtils.opensInNewTab(this.dsTarget) && index.h("ds-visually-hidden", { key: 'e68cfe34cd5e6c78c9e4bdaa4cc0f4deac88a048', id: this.visuallyHiddenAssistiveTextId, "ds-tag": "span" }, linkUtils.visuallyHiddenAssistiveText())));
+        const DsIcon = utils.transformTagName('ds-icon', 'ds-link-with-arrow', this.el);
+        const DsVisuallyHidden = utils.transformTagName('ds-visually-hidden', 'ds-link-with-arrow', this.el);
+        return (index.h(this.dsTag, { key: '0ac18a498b618b19d34678322ffd06a54e8c625a', class: classes, "aria-label": this.dsAriaLabel, ...this.inheritedAttributes, ...this.linkAttributes }, index.h("slot", { key: '1fff2cf38044e37faa80a943bb2f42ca713652bf', name: "prefix" }, this.dsIconPosition === 'start' && index.h(DsIcon, { key: 'b8e3df94d512a117bee451c89e78f6345baa54fd', dsName: this.icon, class: iconClasses, dsSize: this.iconSize })), this.dsText, index.h("slot", { key: '416046d940aa1e926deffae714554584b3271f91', name: "suffix" }, this.dsIconPosition === 'end' && index.h(DsIcon, { key: '3fd4abdcdedd11a9da56d11f203aa6d146323b45', dsName: this.icon, class: iconClasses, dsSize: this.iconSize })), linkUtils.opensInNewTab(this.dsTarget) && index.h(DsVisuallyHidden, { key: 'de624fe88d1760f941e3db7d0bdc7f7fac15397c', id: this.visuallyHiddenAssistiveTextId, "ds-tag": "span" }, linkUtils.visuallyHiddenAssistiveText())));
     }
 };
+utils.declareComponentDependencies([index.h("ds-icon", null), index.h("ds-visually-hidden", null)]);
 DsLinkWithArrow.style = dsLinkWithArrowCss;
 
 exports.ds_link_with_arrow = DsLinkWithArrow;

package/dist/cjs/ds-link.cjs.entry.js

@@ -1,11 +1,11 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
+var index = require('./index-DgPeuNJP.js');
 var index$1 = require('./index-Bp6Dd2i1.js');
 var attributes = require('./attributes-BMbXzbwU.js');
-var linkUtils = require('./linkUtils-Ce4ioJ7A.js');
-var utils = require('./utils-BjZTECpy.js');
-require('./index-CNUFAH0H.js');
+var linkUtils = require('./linkUtils-d3jBbGmk.js');
+var utils = require('./utils-CQYRBA7R.js');
+require('./index-DwxkNCwi.js');
 
 const dsLinkCss = ":root,:host{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:host{display:inline-block}.ds-link{box-sizing:border-box;display:inline-flex;align-items:center;color:var(--ds-palette-mainBlue-70);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:auto;text-decoration-thickness:7%;text-underline-offset:12%;text-underline-position:from-font}.ds-link:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-palette-white);outline:var(--ds-borderWidth-thin) solid var(--ds-palette-black-95);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-link--semibold{font-weight:var(--ds-fontWeight-semibold)}.ds-link--bold{font-weight:var(--ds-fontWeight-bold)}.ds-link--2xLarge{font-size:var(--ds-fontSize-22)}.ds-link--xLarge{font-size:var(--ds-fontSize-20)}.ds-link--large{font-size:var(--ds-fontSize-18)}.ds-link--medium{font-size:var(--ds-fontSize-16)}.ds-link--small{font-size:var(--ds-fontSize-14)}.ds-link--xSmall{font-size:var(--ds-fontSize-12)}.ds-link__icon{height:1em;width:1em}.ds-link__icon--start-inline{margin-right:var(--ds-spacing-3xSmall)}.ds-link__icon--start-standalone{margin-right:var(--ds-spacing-2xSmall)}.ds-link__icon--end-inline{margin-left:var(--ds-spacing-3xSmall)}.ds-link__icon--end-standalone{margin-left:var(--ds-spacing-2xSmall)}.ds-link:hover,.ds-link:active{text-decoration-thickness:13%;text-underline-offset:12%}.ds-link:hover{color:var(--ds-palette-mainBlue-80)}.ds-link:active{color:var(--ds-palette-mainBlue-90)}.ds-link:visited{color:#551a8b}.ds-link--standalone{color:var(--ds-palette-mainBlue-70);text-decoration-line:none}.ds-link--standalone:hover,.ds-link--standalone:active{text-decoration-line:underline}.ds-link--standalone:hover{color:var(--ds-palette-mainBlue-80)}.ds-link--standalone:active{color:var(--ds-palette-mainBlue-90)}.ds-link--standalone:focus-visible{color:var(--ds-palette-mainBlue-70)}.ds-link--standalone:visited{color:var(--ds-palette-mainBlue-70)}.ds-link--colour-white{color:var(--ds-palette-white)}.ds-link--colour-white:hover,.ds-link--colour-white:active,.ds-link--colour-white:visited,.ds-link--colour-white:focus-visible{color:var(--ds-palette-white)}.ds-link--colour-black{color:var(--ds-palette-black-95)}.ds-link--colour-black:hover,.ds-link--colour-black:active,.ds-link--colour-black:visited,.ds-link--colour-black:focus-visible{color:var(--ds-palette-black-95)}";
 
@@ -71,9 +71,12 @@ const DsLink = class {
             [`ds-link__icon--end-${this.dsVariant}`]: this.dsIconPosition === 'end',
         });
         const iconSize = linkIconSizeMap[this.dsSize] ?? '1rem';
-        return (index.h(this.dsTag, { key: 'c752b279607128f89e3972785faec2528a721421', part: "ds-link", class: classes, "aria-label": this.dsAriaLabel, ...this.inheritedAttributes, ...this.linkAttributes }, index.h("slot", { key: '3a46af0939d725ca47dc903ec218776c53242e23', name: "prefix" }, this.dsIcon && this.dsIconPosition === 'start' && (index.h("ds-icon", { key: '93461318d5c5ea371c2b2221b1574791edb7d307', dsName: this.dsIcon, class: iconClasses, dsSize: iconSize, dsTitle: this.dsIconTitle, dsHidden: this.dsIconHidden }))), this.dsText, index.h("slot", { key: 'a6a2a6c33680a5bdf15ab2cdcd45512298d8fae7', name: "suffix" }, this.dsIcon && this.dsIconPosition === 'end' && (index.h("ds-icon", { key: '62beb495660c54c22640517ee5eef23109e11cb4', dsName: this.dsIcon, class: iconClasses, dsSize: iconSize, dsTitle: this.dsIconTitle, dsHidden: this.dsIconHidden }))), linkUtils.opensInNewTab(this.dsTarget) && index.h("ds-visually-hidden", { key: '6177cbc4a13aee2b63b69d12e46e402dad1f87a8', id: this.visuallyHiddenAssistiveTextId, "ds-tag": "span" }, linkUtils.visuallyHiddenAssistiveText())));
+        const DsIcon = utils.transformTagName('ds-icon', 'ds-link', this.el);
+        const DsVisuallyHidden = utils.transformTagName('ds-visually-hidden', 'ds-link', this.el);
+        return (index.h(this.dsTag, { key: '95d9b62ac717adebe61d0a4e6aa88401ffba0159', part: "link", class: classes, "aria-label": this.dsAriaLabel, ...this.inheritedAttributes, ...this.linkAttributes }, index.h("slot", { key: '3838c29e4d3c98b818e3985948fccef66ae7e26d', name: "prefix" }, this.dsIcon && this.dsIconPosition === 'start' && (index.h(DsIcon, { key: '2498a2e9d053d7e83cbf01f1190301b427b1f9ae', dsName: this.dsIcon, class: iconClasses, dsSize: iconSize, dsTitle: this.dsIconTitle, dsHidden: this.dsIconHidden }))), this.dsText, index.h("slot", { key: '96a550a8433c3a60cc82be30f1b8289f80d8c1e2', name: "suffix" }, this.dsIcon && this.dsIconPosition === 'end' && (index.h(DsIcon, { key: 'f117bc9bd27dd90e4a2100d86a88a3ba0fa2dcc7', dsName: this.dsIcon, class: iconClasses, dsSize: iconSize, dsTitle: this.dsIconTitle, dsHidden: this.dsIconHidden }))), linkUtils.opensInNewTab(this.dsTarget) && index.h(DsVisuallyHidden, { key: '2029deefab55e6205d254a7d5be3841cc7870ebe', id: this.visuallyHiddenAssistiveTextId, "ds-tag": "span" }, linkUtils.visuallyHiddenAssistiveText())));
     }
 };
+utils.declareComponentDependencies([index.h("ds-icon", null), index.h("ds-visually-hidden", null)]);
 DsLink.style = dsLinkCss;
 
 exports.ds_link = DsLink;

package/dist/cjs/ds-option_4.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-Cz4FoSKZ.js');
-var utils = require('./utils-BjZTECpy.js');
+var index = require('./index-DgPeuNJP.js');
+var utils = require('./utils-CQYRBA7R.js');
 var index$1 = require('./index-Bp6Dd2i1.js');
 
 const dsOptionCss = ".sc-ds-option:root,.sc-ds-option-h{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.option.sc-ds-option{display:flex;align-items:center;justify-content:space-between;min-height:2.5rem;padding:0.625rem var(--ds-spacing-small);position:relative;cursor:pointer;background-color:var(--ds-palette-white);color:var(--ds-palette-black-95)}.option.sc-ds-option:hover{background-color:var(--ds-palette-black-10)}.option.sc-ds-option:active{background-color:var(--ds-palette-black-20)}.option.active.sc-ds-option{box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-palette-white);outline:var(--ds-borderWidth-thin) solid var(--ds-palette-black-95);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.option.selected.sc-ds-option{background-color:var(--ds-palette-mainBlue-70);color:var(--ds-palette-white)}.option.selected.sc-ds-option .check-icon.sc-ds-option{visibility:visible;color:var(--ds-palette-white)}.option.selected.sc-ds-option:hover{background-color:var(--ds-palette-mainBlue-80)}.option.selected.sc-ds-option:active{background-color:var(--ds-palette-mainBlue-90)}.option.sc-ds-option .option-label.sc-ds-option{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;grid-column:1;grid-row:1}.option.sc-ds-option .check-icon.sc-ds-option{grid-column:2;grid-row:1/span 2;align-self:center;justify-self:end;margin-left:auto;visibility:hidden}.option.sc-ds-option .option-description.sc-ds-option{color:var(--ds-palette-black-70);font-size:var(--ds-fontSize-14);margin-top:var(--ds-spacing-3xSmall);line-height:1.3;grid-column:1;grid-row:2}.option.sc-ds-option .option-description.sc-ds-option:not(:empty){display:block}.option.selected.sc-ds-option .option-description.sc-ds-option{color:var(--ds-palette-white)}.option.sc-ds-option .option-check.sc-ds-option{margin-left:var(--ds-spacing-small);flex-shrink:0;display:flex;align-items:center;height:100%}";
@@ -31,17 +31,19 @@ const DsOption = class {
         this.internalTabIndex = this.dsActive && !this.dsDisabled ? 0 : -1;
     }
     render() {
-        return (index.h("div", { key: '1299b9ceff5e1c29230a7693acf22a7f1c0b0dac', ref: el => this.optionRef = el, class: {
+        const DsIcon = utils.transformTagName('ds-icon', 'ds-option', this.el);
+        return (index.h("div", { key: 'b051e2ccd61a02f1c33e5c74f7f66dec856e1d04', ref: el => this.optionRef = el, class: {
                 option: true,
                 active: this.dsActive,
                 selected: this.dsSelected,
                 disabled: this.dsDisabled,
-            }, role: "option", "aria-selected": String(this.dsSelected), "aria-disabled": String(this.dsDisabled), tabIndex: this.internalTabIndex }, index.h("span", { key: 'a02d4b4551d4c248a3eeebe8f365d889358ac2ac', class: "option-label" }, index.h("slot", { key: '9b55b8fb9d075a87bc3868d15133d2841de0c12b' }), this.dsDescription && index.h("span", { key: '9f1123d8a1d60ba2237ed1cd2a8bfd8bee1bcf2b', class: "option-description" }, this.dsDescription)), this.dsSelected && (index.h("ds-icon", { key: 'd1a0545f6599e154caf8df710aa5750539f8dfee', dsName: "check", class: "option-check", "aria-hidden": "true" }))));
+            }, role: "option", "aria-selected": String(this.dsSelected), "aria-disabled": String(this.dsDisabled), tabIndex: this.internalTabIndex }, index.h("span", { key: '8114317ed212116893f288753be27bc57487218c', class: "option-label" }, index.h("slot", { key: 'edc1ae43b1d32fd4d145e6f5c5bb296202e4f6bf' }), this.dsDescription && index.h("span", { key: '7a250b046d95c7bd74d742029100d7aed9a0b032', class: "option-description" }, this.dsDescription)), this.dsSelected && (index.h(DsIcon, { key: '23432b9e3f29189c6030003e61c02be9469a8a2e', dsName: "check", class: "option-check", "aria-hidden": "true" }))));
     }
     static get watchers() { return {
         "dsActive": ["dsActiveObserver"]
     }; }
 };
+utils.declareComponentDependencies([index.h("ds-icon", null)]);
 DsOption.style = dsOptionCss;
 
 const dsOptionGroupCss = ".group.sc-ds-option-group ul.sc-ds-option-group{padding:0}.group-label.sc-ds-option-group{position:sticky;display:block;top:0;background-color:var(--ds-palette-black-03);z-index:1;padding:var(--ds-spacing-2xSmall);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-semibold)}.group-label.shadow.sc-ds-option-group{box-shadow:0 -2px 7px var(--ds-overlay-black-50)}";
@@ -59,7 +61,7 @@ const DsOptionGroup = class {
         this.groupId = `ds-option-group-label-${this.dsLabel.replace(/\s+/g, '-').toLowerCase()}`;
     }
     render() {
-        return (index.h("div", { key: '2471766ca7de5398081839e044d55fdddb578c3a', class: "group", role: "group", "aria-labelledby": this.groupId }, index.h("div", { key: 'ae62a44855bc54f481ce12ec69f076798bf99699', class: "group-label", id: this.groupId }, this.dsLabel), index.h("slot", { key: '365deafb4b1add8c532eb261e3d73b8246f8bcab' })));
+        return (index.h("div", { key: 'c764a70cf7cd2881404ea90b114957227259d37c', class: "group", role: "group", "aria-labelledby": this.groupId }, index.h("div", { key: '6a38a5db89ff8462704c740a7921e40312a9f466', class: "group-label", id: this.groupId }, this.dsLabel), index.h("slot", { key: 'b6bac535b5c569175f9fb84550d823829208142b' })));
     }
     static get watchers() { return {
         "dsLabel": ["dsLabelObserver"]
@@ -119,14 +121,17 @@ const DsOptions = class {
             }
         });
     };
+    get DsOptionTag() {
+        return utils.transformTagName('ds-option', 'ds-options', this.el);
+    }
     focusActiveOption() {
-        const optionEls = Array.from(this.el.querySelectorAll('ds-option'));
+        const optionEls = Array.from(this.el.querySelectorAll(this.DsOptionTag));
         if (optionEls[this.dsActiveIndex]) {
             optionEls[this.dsActiveIndex].focus();
         }
     }
     handleKeyDown = (e) => {
-        const optionEls = Array.from(this.el.querySelectorAll('ds-option'));
+        const optionEls = Array.from(this.el.querySelectorAll(this.DsOptionTag));
         if (!optionEls.length)
             return;
         let nextIndex = this.dsActiveIndex;
@@ -177,12 +182,15 @@ const DsOptions = class {
     dsOptionsErrorTitle = "We couldn’t load the options";
     dsOptionsErrorText = "Try again or if the problem persists contact support.";
     render() {
-        return (index.h("div", { key: '7f582725e7e7e4119ba636b2b327b5e530e706cd', class: "options-list", role: "listbox", tabindex: 0, "aria-labelledby": this.dsLabelId, onKeyDown: this.handleKeyDown, ref: el => this.optionsListRef = el, onScroll: this.handleScroll, onFocus: this.updateScrimClasses }, index.h("slot", { key: '652b05b45610f838be7ced7f4c5b275d7c18d6d4', name: "groups" }), index.h("div", { key: 'd299689df895de9f7ccc2c716ce99a7fe3d634bd', class: "options-list-inner", ref: el => (this.optionsListInnerRef = el), onScroll: this.handleScroll }, index.h("div", { key: '124ca6b19c1a4bce6fc1f317d2bdb26c97f60529', class: "top-scrim", "aria-hidden": "true" }), this.dsOptionsError ? (index.h("div", { class: "options-error" }, index.h("ds-icon", { dsName: "warning", dsSize: '2rem', class: "options-error-icon" }), index.h("div", { class: "options-error--error-message" }, index.h("div", { class: "options-error--error-title" }, this.dsOptionsErrorTitle), index.h("div", { class: "options-error--error-text" }, this.dsOptionsErrorText)))) : this.dsLoading ? (index.h("div", { class: "options-loading" }, index.h("ds-spinner", { dsSize: "large" }), index.h("div", { class: "options-loading--loading-text" }, this.dsLoadingText))) : (index.h("slot", null)), index.h("div", { key: 'c50bb98b3eea026bac446c847b8d0a47136a3156', class: "bottom-scrim", "aria-hidden": "true" }))));
+        const DsIcon = utils.transformTagName('ds-icon', 'ds-options', this.el);
+        const DsSpinner = utils.transformTagName('ds-spinner', 'ds-options', this.el);
+        return (index.h("div", { key: '656aaa2ab4989958bf7d33914df5f082c91f7477', class: "options-list", role: "listbox", tabindex: 0, "aria-labelledby": this.dsLabelId, onKeyDown: this.handleKeyDown, ref: el => this.optionsListRef = el, onScroll: this.handleScroll, onFocus: this.updateScrimClasses }, index.h("slot", { key: '9aaef6b026ca0b5d8c7264ee69457df801fbdc19', name: "groups" }), index.h("div", { key: '399b0989af2d6cd0eadc10e18b10e2dac2e0f976', class: "options-list-inner", ref: el => (this.optionsListInnerRef = el), onScroll: this.handleScroll }, index.h("div", { key: '5eabc020be41e0fb2afcdb5c4e2cb3519212ac00', class: "top-scrim", "aria-hidden": "true" }), this.dsOptionsError ? (index.h("div", { class: "options-error" }, index.h(DsIcon, { dsName: "warning", dsSize: '2rem', class: "options-error-icon" }), index.h("div", { class: "options-error--error-message" }, index.h("div", { class: "options-error--error-title" }, this.dsOptionsErrorTitle), index.h("div", { class: "options-error--error-text" }, this.dsOptionsErrorText)))) : this.dsLoading ? (index.h("div", { class: "options-loading" }, index.h(DsSpinner, { dsSize: "large" }), index.h("div", { class: "options-loading--loading-text" }, this.dsLoadingText))) : (index.h("slot", null)), index.h("div", { key: 'a3180baebc60c132bd328e10fa77a554642a9d22', class: "bottom-scrim", "aria-hidden": "true" }))));
     }
     static get watchers() { return {
         "dsActiveIndex": ["onActiveIndexChange"]
     }; }
 };
+utils.declareComponentDependencies([index.h("ds-icon", null), index.h("ds-spinner", null)]);
 DsOptions.style = dsOptionsCss;
 
 const dsSelectCss = ".sc-ds-select:root,.sc-ds-select-h{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.sc-ds-select-h{display:inline-block;width:100%}@media (min-width: 30rem){.sc-ds-select-h{width:20rem}}.sc-ds-select-h>div.sc-ds-select{display:flex;flex-direction:column;position:relative}.native-select-wrapper.sc-ds-select,.custom-select.sc-ds-select{position:relative;display:flex;align-items:center;border:var(--ds-borderWidth-thin) solid var(--ds-palette-black-50);background-color:var(--ds-palette-white);color:var(--ds-palette-black-70);cursor:pointer;box-sizing:border-box;height:2.75rem;width:100%}.disabled.native-select-wrapper.sc-ds-select,.disabled.custom-select.sc-ds-select{background-color:var(--ds-overlay-black-10);border-color:var(--ds-overlay-black-15);color:var(--ds-palette-black-40);cursor:not-allowed}.disabled.native-select-wrapper.sc-ds-select .dropdown-icon.sc-ds-select,.disabled.custom-select.sc-ds-select .dropdown-icon.sc-ds-select{color:var(--ds-palette-black-40);border-left-color:var(--ds-overlay-black-15);cursor:not-allowed}.invalid.native-select-wrapper.sc-ds-select,.invalid.custom-select.sc-ds-select{background-color:var(--ds-palette-red-05);border-color:var(--ds-palette-red-50)}.invalid.native-select-wrapper.sc-ds-select:not(.open):not(.disabled):active,.invalid.custom-select.sc-ds-select:not(.open):not(.disabled):active{background-color:var(--ds-palette-red-20);border-color:var(--ds-palette-red-50)}.native-select-wrapper.sc-ds-select:not(.open):not(.invalid):not(.disabled):hover,.custom-select.sc-ds-select:not(.open):not(.invalid):not(.disabled):hover{background-color:var(--ds-palette-black-10)}.custom-select.sc-ds-select .selected-option.sc-ds-select{display:flex;align-items:center;gap:var(--ds-spacing-2xSmall)}.custom-select.sc-ds-select .placeholder-icon.sc-ds-select{font-size:var(--ds-fontSize-16)}.custom-select--open.sc-ds-select+.options-container.sc-ds-select{display:block;box-shadow:0rem var(--ds-spacing-4xSmall) var(--ds-spacing-3xSmall) calc(-1 * var(--ds-spacing-4xSmall)) var(--ds-overlay-black-15), 0rem var(--ds-spacing-3xSmall) calc(var(--ds-spacing-xSmall) / 2) calc(-0.5 * var(--ds-spacing-4xSmall)) var(--ds-overlay-black-15)}.custom-select--open.sc-ds-select .options-list.sc-ds-select{display:block}.custom-select.sc-ds-select:not(.custom-select--open):not(.custom-select--invalid):not(.custom-select--disabled):hover{background-color:var(--ds-palette-black-10)}.custom-select.sc-ds-select:active:not(.custom-select--open):not(.custom-select--invalid):not(.custom-select--disabled){background-color:var(--ds-palette-black-20)}.custom-select--open.sc-ds-select,.custom-select.sc-ds-select:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-palette-white);outline:var(--ds-borderWidth-thin) solid var(--ds-palette-black-95);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.custom-select--open.sc-ds-select:not(.custom-select--open--invalid,.custom-select.sc-ds-select:focus-visible--invalid),.custom-select.sc-ds-select:focus-visible:not(.custom-select--open--invalid,.custom-select.sc-ds-select:focus-visible--invalid){border-color:var(--ds-palette-mainBlue-70)}.custom-select--disabled.sc-ds-select{background-color:var(--ds-overlay-black-10);border-color:var(--ds-overlay-black-15);color:var(--ds-palette-black-40);cursor:not-allowed}.custom-select--disabled.sc-ds-select .dropdown-icon.sc-ds-select{color:var(--ds-palette-black-40);border-left-color:var(--ds-overlay-black-15);cursor:not-allowed}.custom-select--invalid.sc-ds-select{background-color:var(--ds-palette-red-05);border-color:var(--ds-palette-red-50)}.custom-select--invalid.sc-ds-select:not(.custom-select--invalid--open):not(.custom-select--invalid--disabled):active{background-color:var(--ds-palette-red-20);border-color:var(--ds-palette-red-50)}.selected-option.sc-ds-select{flex:1;font-size:var(--ds-fontSize-16);color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:var(--ds-spacing-xSmall);padding-right:var(--ds-spacing-xSmall)}.custom-select--has-icon.sc-ds-select .selected-option.sc-ds-select{padding-left:var(--ds-spacing-2xSmall);padding-right:var(--ds-spacing-2xSmall)}.dropdown-icon.sc-ds-select{align-items:center;align-self:stretch;border-left:var(--ds-borderWidth-hairline) solid var(--ds-overlay-black-15);color:var(--ds-palette-black-70);z-index:2;pointer-events:none;padding:0 var(--ds-spacing-2xSmall)}.clear-button.sc-ds-select,.dropdown-icon.sc-ds-select{cursor:pointer}.select-title.sc-ds-select{display:inline-block;font-weight:var(--ds-fontWeight-semibold);margin-bottom:var(--ds-spacing-2xSmall);color:var(--ds-palette-black-95)}.selected-text.sc-ds-select{flex:1;padding:0 var(--ds-spacing-xSmall);font-size:var(--ds-fontSize-16);color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.options-container.sc-ds-select{display:none;position:absolute;top:100%;left:0;right:0;z-index:10;border:var(--ds-borderWidth-hairline) solid var(--ds-palette-black-20);background-color:var(--ds-palette-white)}.native-select.sc-ds-select{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1;appearance:none;-webkit-appearance:none;-moz-appearance:none;border:none;outline:none;padding:0 var(--ds-spacing-2xSmall);font-size:var(--ds-fontSize-16);font-family:inherit;background-color:transparent;color:inherit;flex:1}.native-select.sc-ds-select::placeholder{color:var(--ds-palette-black-70)}.native-select.sc-ds-select:disabled{background-color:var(--ds-overlay-black-10);color:var(--ds-palette-black-40);cursor:not-allowed}.native-select-wrapper.sc-ds-select:hover{background-color:var(--ds-palette-black-10)}.native-select-wrapper.sc-ds-select:focus-within{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-palette-white);outline:var(--ds-borderWidth-thin) solid var(--ds-palette-black-95);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.native-select-wrapper--disabled.sc-ds-select{background-color:var(--ds-overlay-black-10);border-color:var(--ds-overlay-black-15);color:var(--ds-palette-black-40);cursor:not-allowed}.native-select-wrapper--invalid.sc-ds-select{background-color:var(--ds-palette-red-05);border-color:var(--ds-palette-red-50)}";
@@ -220,6 +228,15 @@ const DsSelect = class {
     disconnectedCallback() {
         this.el.removeEventListener('focusout', this.handleFocusOut);
     }
+    get DsIconTag() {
+        return utils.transformTagName('ds-icon', 'ds-select', this.el);
+    }
+    get DsInputValidityTag() {
+        return utils.transformTagName('ds-input-validity', 'ds-select', this.el);
+    }
+    get DsOptionTag() {
+        return utils.transformTagName('ds-option', 'ds-select', this.el);
+    }
     customSelectRef;
     nativeSelectRef;
     handleFocusOut = (e) => {
@@ -286,7 +303,7 @@ const DsSelect = class {
                 }
                 this.activeIndex = focusIndex;
                 this.scrollToActiveOption();
-                const optionEls = this.el.querySelectorAll('ds-option');
+                const optionEls = this.el.querySelectorAll(this.DsOptionTag);
                 const active = optionEls[this.activeIndex];
                 active?.focus();
             }, 0);
@@ -382,7 +399,7 @@ const DsSelect = class {
         }
     }
     getAllOptions() {
-        return Array.from(this.el.querySelectorAll('ds-option'));
+        return Array.from(this.el.querySelectorAll(this.DsOptionTag));
     }
     handleStateChange() {
         this.updateOptionStates();
@@ -426,7 +443,7 @@ const DsSelect = class {
                 this.dsValue = target.value;
                 this.selectedOption = target.selectedOptions[0]?.textContent || '';
                 this.dsChange.emit(target.value);
-            } }, index.h("option", { value: "", disabled: true, selected: !this.selectedOption }, this.dsPlaceholder || 'Select an option'), index.h("slot", { name: "native" })), index.h("ds-icon", { class: "dropdown-icon", dsName: "keyboard_arrow_down" })), !!this.dsErrorText && (index.h("ds-input-validity", { id: this.inputValidityId, dsText: this.dsErrorText, dsType: "error" }))));
+            } }, index.h("option", { value: "", disabled: true, selected: !this.selectedOption }, this.dsPlaceholder || 'Select an option'), index.h("slot", { name: "native" })), index.h(this.DsIconTag, { class: "dropdown-icon", dsName: "keyboard_arrow_down" })), !!this.dsErrorText && (index.h(this.DsInputValidityTag, { id: this.inputValidityId, dsText: this.dsErrorText, dsType: "error" }))));
     }
     renderCustomSelect() {
         const noneSelected = !this.selectedOption;
@@ -435,6 +452,8 @@ const DsSelect = class {
         const ariaDescribedBy = this.dsErrorText ? this.inputValidityId : undefined;
         const optionsContainerId = `ds-select-options-${selectId}`;
         const baseClass = 'custom-select';
+        const DsButton = utils.transformTagName('ds-button', 'ds-select', this.el);
+        const DsOptions = utils.transformTagName('ds-options', 'ds-select', this.el);
         return (index.h("div", null, this.dsTitle && (index.h("div", { class: "select-title-wrapper" }, index.h("label", { id: labelId, class: "select-title", htmlFor: selectId, onClick: () => {
                 const customSelect = this.customSelectRef;
                 customSelect?.focus();
@@ -453,7 +472,7 @@ const DsSelect = class {
                 if (!this.dsDisabled) {
                     this.handleKeyDown(event);
                 }
-            } }, index.h("div", { class: "selected-option" }, this.dsIcon && (index.h("ds-icon", { class: "placeholder-icon", dsName: this.dsIcon })), this.selectedOption || this.dsPlaceholder || 'Select an option'), this.dsClearable && this.selectedOption && !this.dsDisabled && (index.h("ds-button", { class: "clear-button", dsVariant: "supplementary", dsIcon: "cancel_fill", dsColour: "black", onClick: (event) => {
+            } }, index.h("div", { class: "selected-option" }, this.dsIcon && (index.h(this.DsIconTag, { class: "placeholder-icon", dsName: this.dsIcon })), this.selectedOption || this.dsPlaceholder || 'Select an option'), this.dsClearable && this.selectedOption && !this.dsDisabled && (index.h(DsButton, { class: "clear-button", dsVariant: "supplementary", dsIcon: "cancel_fill", dsColour: "black", onClick: (event) => {
                 event.stopPropagation();
                 this.handleClearSelection();
             }, onKeyDown: (event) => {
@@ -462,15 +481,15 @@ const DsSelect = class {
                     event.stopPropagation();
                     this.handleClearSelection();
                 }
-            }, "aria-label": "Clear selection" })), index.h("ds-icon", { class: "dropdown-icon", dsName: this.isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down' })), index.h("div", { id: optionsContainerId, class: "options-container", onClick: (e) => {
-                const option = e.target.closest('ds-option');
+            }, "aria-label": "Clear selection" })), index.h(this.DsIconTag, { class: "dropdown-icon", dsName: this.isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down' })), index.h("div", { id: optionsContainerId, class: "options-container", onClick: (e) => {
+                const option = e.target.closest(this.DsOptionTag);
                 if (option && !option.dsDisabled) {
                     this.selectOption(option);
                 }
-            } }, index.h("ds-options", { dsActiveIndex: this.activeIndex, onDsOptionsActiveIndexChange: e => this.activeIndex = e.detail, onDsOptionsEsc: () => { this.isOpen = false; }, dsLabelId: labelId, dsLoading: this.dsLoading, dsLoadingText: this.dsLoadingText, dsOptionsError: this.dsOptionsError, dsOptionsErrorTitle: this.dsOptionsErrorTitle, dsOptionsErrorText: this.dsOptionsErrorText }, index.h("slot", null)))), !!this.dsErrorText && (index.h("ds-input-validity", { id: this.inputValidityId, dsText: this.dsErrorText, dsType: "error" }))));
+            } }, index.h(DsOptions, { dsActiveIndex: this.activeIndex, onDsOptionsActiveIndexChange: e => this.activeIndex = e.detail, onDsOptionsEsc: () => { this.isOpen = false; }, dsLabelId: labelId, dsLoading: this.dsLoading, dsLoadingText: this.dsLoadingText, dsOptionsError: this.dsOptionsError, dsOptionsErrorTitle: this.dsOptionsErrorTitle, dsOptionsErrorText: this.dsOptionsErrorText }, index.h("slot", null)))), !!this.dsErrorText && (index.h(this.DsInputValidityTag, { id: this.inputValidityId, dsText: this.dsErrorText, dsType: "error" }))));
     }
     render() {
-        return (index.h("div", { key: 'e5635c0348a16fe23dd8f81827f5d6aecdd21baa', tabIndex: -1, onFocusout: this.handleFocusOut }, this.dsVariant === 'native'
+        return (index.h("div", { key: '4716b1f759f34fd18f9f776fec0c21dcb6f62c00', tabIndex: -1, onFocusout: this.handleFocusOut }, this.dsVariant === 'native'
             ? this.renderNativeSelect()
             : this.renderCustomSelect()));
     }
@@ -479,6 +498,12 @@ const DsSelect = class {
         "dsValue": ["handleStateChange"]
     }; }
 };
+utils.declareComponentDependencies([
+    index.h("ds-icon", null),
+    index.h("ds-input-validity", null),
+    index.h("ds-button", null),
+    index.h("ds-options", null)
+]);
 DsSelect.style = dsSelectCss;
 
 exports.ds_option = DsOption;