@duetds/components 10.0.0-alpha.8 → 10.0.0

package/lib/cjs/duet-choice_2.cjs.entry.js

@@ -3,35 +3,173 @@
  */
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var index = require('./index-C0kw3uAi.js');
+var _commonjsHelpers = require('./_commonjsHelpers-4N64IRaP.js');
+var themeableComponent = require('./themeable-component-BEm0vuJc.js');
+var commonStrings = require('./common-strings-CC6Xpjb8.js');
+var createId = require('./create-id-DtslnIOq.js');
+var keyboardUtils = require('./keyboard-utils-D9UlHbik.js');
+var languageUtils = require('./language-utils-v37OZJFe.js');
+var slotUtils = require('./slot-utils-DFmRJ2pY.js');
+require('./string-utils-B35hEUBv.js');
 
-const index = require('./index-9c3aea30.js');
-const themeableComponent = require('./themeable-component-996b489c.js');
-const commonStrings = require('./common-strings-2984301e.js');
-const createId = require('./create-id-1f8c438f.js');
-const keyboardUtils = require('./keyboard-utils-f7c9f980.js');
-const languageUtils = require('./language-utils-9499975c.js');
-const slotUtils = require('./slot-utils-799906b5.js');
-require('./string-utils-7b13c16e.js');
+var messagingInfo;
+var hasRequiredMessagingInfo;
 
-var messagingInfo={"title":"messaging-info","tags":"messaging info information circle","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M13.5 17.25A2.252 2.252 0 0 1 11.25 15v-3.75h-.75a.75.75 0 0 1 0-1.5h.75c.827 0 1.5.673 1.5 1.5V15c0 .414.336.75.75.75h.75a.75.75 0 0 1 0 1.5z\"/><circle cx=\"11.625\" cy=\"7.125\" r=\"1.125\"/><path d=\"M12 24C5.383 24 0 18.617 0 12S5.383 0 12 0s12 5.383 12 12-5.383 12-12 12zm0-22.5C6.21 1.5 1.5 6.21 1.5 12S6.21 22.5 12 22.5 22.5 17.79 22.5 12 17.79 1.5 12 1.5z\"/></svg>"};
+function requireMessagingInfo () {
+	if (hasRequiredMessagingInfo) return messagingInfo;
+	hasRequiredMessagingInfo = 1;
+	messagingInfo={"title":"messaging-info","tags":"messaging info information circle","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M13.5 17.25A2.252 2.252 0 0 1 11.25 15v-3.75h-.75a.75.75 0 0 1 0-1.5h.75c.827 0 1.5.673 1.5 1.5V15c0 .414.336.75.75.75h.75a.75.75 0 0 1 0 1.5z\"/><circle cx=\"11.625\" cy=\"7.125\" r=\"1.125\"/><path d=\"M12 24C5.383 24 0 18.617 0 12S5.383 0 12 0s12 5.383 12 12-5.383 12-12 12zm0-22.5C6.21 1.5 1.5 6.21 1.5 12S6.21 22.5 12 22.5 22.5 17.79 22.5 12 17.79 1.5 12 1.5z\"/></svg>"};
+	return messagingInfo;
+}
 
-const duetChoiceCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;flex-direction:column;width:auto;max-width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(.vertical){margin-right:0 !important}@media (min-width: 48em){:host(.horizontal){margin-bottom:0 !important}}@media (min-width: 48em){:host(.horizontal-responsive){margin-bottom:0 !important;margin-right:16px !important}:host(.horizontal-responsive):last-child,:host(.horizontal-responsive):last-of-type{margin-right:0 !important}}:host(:last-child:not(:only-child)){margin-right:0 !important}.duet-choice-card{position:relative;display:block;width:100%;min-width:8rem;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;-webkit-hyphens:auto;hyphens:auto;line-height:1.1;color:rgb(8, 42, 77) !important;text-align:left;background:rgb(255, 255, 255);border-width:1px;border-radius:8px}.duet-choice-card.duet-p-0{padding:0 !important}.duet-choice-card.duet-m-0{margin:0 !important}.duet-theme-turva .duet-choice-card{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58) !important}.duet-choice-card-flextainer{display:flex}.duet-choice-label{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;gap:12px;align-items:center;justify-content:flex-start;width:100%;height:100%;min-height:3.875rem;padding:calc(1rem + 1px);font-size:1rem;font-weight:600;text-decoration:none;word-break:break-word;cursor:pointer;border:1px solid rgb(212, 223, 229);border-radius:8px;transition:background-color 150ms ease, border-color 300ms ease}.duet-choice-label.has-before-text .duet-choice-card-icon,.duet-choice-label.has-before-text .duet-choice-card-text{align-self:flex-start;margin-top:0.25rem}.duet-choice-label>div:last-child{flex:1;align-self:flex-start;justify-self:flex-end;margin-top:0.25rem}.has-info .duet-choice-label{border-top-right-radius:0;border-bottom-right-radius:0}.info .duet-choice-label{border-bottom-right-radius:0;border-bottom-left-radius:0}.duet-theme-turva .duet-choice-label{border-color:rgb(222, 224, 228)}.duet-theme-turva .info .duet-choice-label{border-color:rgb(222, 224, 228)}.duet-choice-label:active{opacity:0.75;transition:none !important}.checked>.duet-choice-label{padding:1rem;background:rgb(240, 247, 250);border-color:rgb(0, 119, 179) !important;border-width:2px}.checked>.duet-choice-label .duet-checkmark-container{border-color:rgb(0, 119, 179)}.duet-theme-turva .checked>.duet-choice-label{background:rgb(245, 247, 250);border-color:rgb(23, 28, 58) !important}.duet-theme-turva .checked>.duet-choice-label .duet-checkmark-container{border-color:rgb(198, 12, 48)}.checked.collapsible>.duet-choice-label,.collapsible-force-expanded.collapsible>.duet-choice-label{padding-bottom:calc(1rem + 2px) !important;border-bottom:0 !important;border-bottom-right-radius:0;border-bottom-left-radius:0}:host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked){border-color:rgb(0, 119, 179);border-width:2px}:host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked) .duet-checkmark-container{border-color:rgb(127, 150, 165)}.duet-theme-turva :host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked){border-color:rgb(23, 28, 58)}.duet-theme-turva :host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked) .duet-checkmark-container{border-color:rgb(143, 147, 158)}.duet-theme-turva .info :host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked){border-color:rgb(143, 147, 158)}:host(:not(.no-hover):not(.disabled):not([checked]):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked){padding:1rem}input:focus{outline:0}:host(.user-is-tabbing) .checked.focus.duet-choice-label{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3)}:host(.user-is-tabbing) :not(.checked).focus.duet-choice-label{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .checked.focus.duet-choice-label{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2)}:host(.user-is-tabbing) .duet-theme-turva :not(.checked).focus.duet-choice-label{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.disabled.duet-choice-label{color:rgb(98, 121, 138) !important;cursor:default !important;background:rgb(245, 248, 250) !important;border-color:rgb(212, 223, 229) !important}.disabled.duet-choice-label .duet-choice-card-icon{color:rgb(98, 121, 138)}.duet-theme-turva .disabled.duet-choice-label .duet-choice-card-icon{color:rgb(143, 147, 158)}.disabled.duet-choice-label .duet-checkmark{border-color:rgb(98, 121, 138) !important}.disabled.duet-choice-label:hover,.disabled.duet-choice-label:active,.disabled.duet-choice-label:focus{box-shadow:none !important;opacity:1 !important;transition:none !important}.duet-theme-turva .disabled.duet-choice-label{color:rgb(143, 147, 158) !important;background:rgb(245, 247, 250) !important;border-color:rgb(222, 224, 228) !important}.duet-theme-turva .disabled.duet-choice-label .duet-checkmark{border-color:rgb(143, 147, 158) !important}.checked>.disabled.duet-choice-label{border-color:rgb(127, 150, 165) !important}.duet-theme-turva .checked>.disabled.duet-choice-label{border-color:rgb(143, 147, 158) !important}.duet-checkmark-container{position:relative;width:20px;height:20px;margin-left:auto;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 300ms ease}.duet-theme-turva .duet-checkmark-container{border-color:rgb(143, 147, 158)}.checked>.duet-choice-label .duet-checkmark-container{background:rgb(0, 119, 179);border-color:rgb(0, 119, 179);transition:none}.duet-theme-turva .checked>.duet-choice-label .duet-checkmark-container{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58) !important}.duet-checkmark-container.duet-checkmark-radio{border-radius:50%}label.disabled .duet-checkmark-container{background:rgb(181, 198, 208) !important;border-color:rgb(181, 198, 208) !important}.duet-theme-turva label.disabled .duet-checkmark-container{border-color:rgb(199, 202, 207) !important}.checked>label.disabled .duet-checkmark-container{background:rgb(181, 198, 208) !important}.duet-theme-turva .checked>label.disabled .duet-checkmark-container{background:rgb(199, 202, 207) !important;border-color:rgb(199, 202, 207) !important}.duet-checkmark{position:absolute;top:10px;left:3px;width:5.3333333333px;height:11.8518518519px;border-top:2px solid rgb(255, 255, 255);border-right:2px solid rgb(255, 255, 255);opacity:1;transform:scaleX(-1) rotate(135deg) translateZ(0);transform-origin:left top;animation-name:duet-checkmark;animation-duration:600ms;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes duet-checkmark{0%{width:0;height:0;opacity:1}20%{width:5.3333333333px;height:0;opacity:1}40%,100%{width:5.3333333333px;height:11.8518518519px;opacity:1}}.duet-choice-card-icon{position:relative;color:rgb(0, 119, 179)}.duet-theme-turva .duet-choice-card-icon{color:rgb(164, 4, 40)}.duet-choice-card-icon duet-icon{display:block}.duet-choice-section-hidden{display:none}.duet-choice-card-info.duet-choice-card-collapsed,.duet-choice-card-collapsed.duet-choice-card-collapsible{position:relative;width:auto;padding:0 !important;background:unset !important;border:0;border-radius:0}.duet-choice-card-info,.duet-choice-card-collapsible{padding:20px !important;position:relative;width:100%;font-weight:400;color:rgb(8, 42, 77);border:1px solid rgb(212, 223, 229);border-top:0;border-radius:0 0 8px 8px;transition:border-color 300ms ease}@media (min-width: 36em){.duet-choice-card-info,.duet-choice-card-collapsible{padding:28px !important}}.duet-theme-turva .duet-choice-card-info,.duet-theme-turva .duet-choice-card-collapsible{color:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.checked>.duet-choice-card-info,.checked>.duet-choice-card-collapsible{display:block}.duet-choice-card-info-expanded,.duet-choice-card-collapsible-expanded{display:block}.duet-choice-card-collapsible{background:rgb(255, 255, 255);border:1px solid rgb(212, 223, 229);border-top:0}.duet-choice-card-collapsible.duet-theme-turva{background:rgb(255, 255, 255);border-color:rgb(222, 224, 228)}.duet-choice-card-collapsible.checked{padding:19px !important;padding-top:20px !important;border-color:rgb(0, 119, 179);border-width:2px}@media (min-width: 36em){.duet-choice-card-collapsible.checked{padding:27px !important;padding-top:28px !important}}.duet-choice-card-collapsible.checked.duet-theme-turva{border-color:rgb(23, 28, 58)}.duet-choice-card-collapsible-disabled{background:rgb(245, 248, 250);border-color:rgb(212, 223, 229)}.duet-choice-card-collapsible-disabled.checked{border-color:rgb(212, 223, 229)}.duet-choice-card-collapsible-disabled.duet-theme-turva{background:rgb(245, 247, 250);border-color:rgb(222, 224, 228)}.duet-choice-card-collapsible-disabled.duet-theme-turva.checked{border-color:rgb(222, 224, 228)}.duet-choice-card-info{font-size:0.875rem;line-height:1.5;background:rgb(245, 248, 250);transition:150ms ease-out}.duet-choice-card-info.duet-theme-turva{background:rgb(245, 247, 250);border-color:rgb(222, 224, 228)}.duet-choice-card-info.duet-choice-card-collapsed .duet-choice-info-container ::slotted(*){display:none}:host(.user-is-tabbing) .duet-choice-info-container:focus{display:block;outline:none;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.disabled) .duet-choice-card-collapsible{border-color:rgb(127, 150, 165)}:host(.disabled) .duet-choice-card-collapsible.duet-theme-turva{border-color:rgb(143, 147, 158)}:host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-collapsible:not(.checked){border-color:rgb(0, 119, 179);border-width:2px}.duet-theme-turva :host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-collapsible:not(.checked){border-color:rgb(143, 147, 158)}:host([collapsible-force-expanded]:not(.no-hover):not(.disabled):hover)>.duet-choice-card-collapsible:not(.checked){padding:19px !important;padding-top:20px !important}@media (min-width: 36em){:host([collapsible-force-expanded]:not(.no-hover):not(.disabled):hover)>.duet-choice-card-collapsible:not(.checked){padding:27px !important;padding-top:28px !important}}.duet-choice-info-toggle{display:flex;flex-shrink:0;align-items:flex-start;justify-content:center;width:57.6px;padding-top:1.25rem;cursor:pointer;background:rgb(255, 255, 255);border:1px solid rgb(212, 223, 229);border-left:0 none;border-top-right-radius:8px;border-bottom-right-radius:8px;-webkit-appearance:none;appearance:none}.duet-choice-info-toggle[aria-expanded=true]{background:rgb(245, 248, 250);border-bottom-color:transparent;border-bottom-right-radius:0}.duet-theme-turva .duet-choice-info-toggle[aria-expanded=true]{background:rgb(245, 247, 250)}.duet-choice-info-toggle[disabled]{pointer-events:none;background:rgb(245, 248, 250) !important;border-color:rgb(212, 223, 229) !important}.duet-choice-info-toggle[disabled] .duet-choice-info-icon{color:rgb(127, 150, 165) !important}.duet-choice-info-toggle[disabled].duet-theme-turva{background:rgb(245, 247, 250) !important;border-color:rgb(222, 224, 228) !important}.duet-choice-info-toggle[disabled].duet-theme-turva .duet-choice-info-icon{color:rgb(143, 147, 158) !important}.duet-choice-info-toggle:focus{outline:none}:host(.user-is-tabbing) .duet-choice-info-toggle:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-choice-info-toggle:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.checked+.duet-choice-info-toggle{border-left-color:rgb(0, 119, 179) !important}.duet-choice-info-toggle duet-icon{display:block}.duet-choice-info-toggle .duet-choice-info-icon{color:rgb(0, 119, 179)}.duet-theme-turva .duet-choice-info-toggle .duet-choice-info-icon{color:rgb(198, 12, 48)}:host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label .duet-choice-info-toggle{border-left-color:rgb(127, 150, 165)}.duet-theme-turva :host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label .duet-choice-info-toggle{border-left-color:rgb(143, 147, 158)}.duet-choice-input,*::slotted([slot=choiceradioinput]){position:absolute !important;width:100%;height:100%;opacity:0}";
-const DuetChoiceStyle0 = duetChoiceCss;
+var messagingInfoExports = requireMessagingInfo();
+var infoIcon = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(messagingInfoExports);
+
+const duetChoiceCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;flex-direction:column;width:auto;max-width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host:last-of-type:not(:last-child){margin-right:16px !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(.vertical){margin-right:0 !important}@media (min-width: 48em){:host(.horizontal){margin-bottom:0 !important}}@media (min-width: 22.5em){:host(.horizontal-responsive-x-small){margin-bottom:0 !important;margin-right:16px !important}:host(.horizontal-responsive-x-small):last-child,:host(.horizontal-responsive-x-small):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.horizontal-responsive-x-small):last-of-type:not(:last-child){margin-right:16px !important}}@media (min-width: 36em){:host(.horizontal-responsive-small){margin-bottom:0 !important;margin-right:16px !important}:host(.horizontal-responsive-small):last-child,:host(.horizontal-responsive-small):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.horizontal-responsive-small):last-of-type:not(:last-child){margin-right:16px !important}}@media (min-width: 48em){:host(.horizontal-responsive-medium){margin-bottom:0 !important;margin-right:16px !important}:host(.horizontal-responsive-medium):last-child,:host(.horizontal-responsive-medium):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.horizontal-responsive-medium):last-of-type:not(:last-child){margin-right:16px !important}}@media (min-width: 62em){:host(.horizontal-responsive-large){margin-bottom:0 !important;margin-right:16px !important}:host(.horizontal-responsive-large):last-child,:host(.horizontal-responsive-large):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.horizontal-responsive-large):last-of-type:not(:last-child){margin-right:16px !important}}@media (min-width: 64.0625em){:host(.horizontal-responsive-x-large){margin-bottom:0 !important;margin-right:16px !important}:host(.horizontal-responsive-x-large):last-child,:host(.horizontal-responsive-x-large):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.horizontal-responsive-x-large):last-of-type:not(:last-child){margin-right:16px !important}}:host(:last-child:not(:only-child)){margin-right:0 !important}:host(.vertical-stretch) .duet-choice-card-flextainer{height:100%}:host(.vertical-stretch) .duet-choice-card-flextainer .duet-choice-label{align-items:flex-start}:host(.vertical-stretch) .duet-choice-card-flextainer .duet-choice-label>div{margin-top:0.25rem}.duet-choice-card{position:relative;display:block;width:100%;min-width:8rem;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.1;color:rgb(8, 42, 77) !important;text-align:left;-webkit-hyphens:auto;hyphens:auto;background:rgb(255, 255, 255);border-width:1px;border-radius:8px}.duet-choice-card.duet-p-0{padding:0 !important}.duet-choice-card.duet-m-0{margin:0 !important}.duet-theme-turva .duet-choice-card{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58) !important}.duet-choice-card-flextainer{display:flex}.duet-choice-label{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;gap:12px;align-items:center;justify-content:flex-start;width:100%;height:100%;min-height:3.875rem;padding:calc(1rem + 1px);font-size:1rem;font-weight:600;word-break:break-word;text-decoration:none;cursor:pointer;border:1px solid rgb(212, 223, 229);border-radius:8px;transition:background-color 150ms ease, border-color 300ms ease}.duet-choice-label.has-before-text .duet-choice-card-icon,.duet-choice-label.has-before-text .duet-choice-card-text{align-self:flex-start;margin-top:0.25rem}.duet-choice-label>div:last-child{flex:1;align-self:flex-start;justify-self:flex-end;margin-top:0.25rem}.has-info .duet-choice-label{border-top-right-radius:0;border-bottom-right-radius:0}.info .duet-choice-label{border-bottom-right-radius:0;border-bottom-left-radius:0}.duet-theme-turva .duet-choice-label{border-color:rgb(222, 224, 228)}.duet-theme-turva .info .duet-choice-label{border-color:rgb(222, 224, 228)}.duet-choice-label:active{opacity:0.75;transition:none !important}.checked>.duet-choice-label{padding:1rem;background:rgb(240, 247, 250);border-color:rgb(0, 119, 179) !important;border-width:2px}.checked>.duet-choice-label .duet-checkmark-container{border-color:rgb(0, 119, 179)}.duet-theme-turva .checked>.duet-choice-label{background:rgb(245, 247, 250);border-color:rgb(23, 28, 58) !important}.duet-theme-turva .checked>.duet-choice-label .duet-checkmark-container{border-color:rgb(198, 12, 48)}.checked.collapsible>.duet-choice-label,.collapsible-force-expanded.collapsible>.duet-choice-label{padding-bottom:calc(1rem + 2px) !important;border-bottom:0 !important;border-bottom-right-radius:0;border-bottom-left-radius:0}:host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked){border-color:rgb(0, 119, 179);border-width:2px}:host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked) .duet-checkmark-container{border-color:rgb(127, 150, 165)}:host(.duet-theme-turva:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked){border-color:rgb(23, 28, 58)}:host(.duet-theme-turva:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked) .duet-checkmark-container{border-color:rgb(143, 147, 158)}.info :host(.duet-theme-turva:not(.no-hover):not(.disabled):hover){border-color:rgb(143, 147, 158)}:host(:not(.no-hover):not(.disabled):not([checked]):hover)>.duet-choice-card-flextainer .duet-choice-label:not(.checked){padding:1rem}input:focus{outline:0}.checked.focus.duet-choice-label{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .checked.focus.duet-choice-label,.checked.focus.duet-choice-label.duet-theme-turva,.duet-theme-turva2 .checked.focus.duet-choice-label,.checked.focus.duet-choice-label.duet-theme-turva2{outline-color:rgba(53, 79, 101, 0.8)}.disabled.duet-choice-label{color:rgb(98, 121, 138) !important;cursor:default !important;background:rgb(245, 248, 250) !important;border-color:rgb(212, 223, 229) !important}.disabled.duet-choice-label .duet-choice-card-icon{color:rgb(98, 121, 138)}.duet-theme-turva .disabled.duet-choice-label .duet-choice-card-icon{color:rgb(143, 147, 158)}.disabled.duet-choice-label .duet-checkmark{border-color:rgb(98, 121, 138) !important}.disabled.duet-choice-label:hover,.disabled.duet-choice-label:active,.disabled.duet-choice-label:focus{outline:none !important;opacity:1 !important;transition:none !important}.duet-theme-turva .disabled.duet-choice-label{color:rgb(143, 147, 158) !important;background:rgb(245, 247, 250) !important;border-color:rgb(222, 224, 228) !important}.duet-theme-turva .disabled.duet-choice-label .duet-checkmark{border-color:rgb(143, 147, 158) !important}.checked>.disabled.duet-choice-label{border-color:rgb(127, 150, 165) !important}.duet-theme-turva .checked>.disabled.duet-choice-label{border-color:rgb(143, 147, 158) !important}.duet-checkmark-container{position:relative;width:20px;height:20px;margin-left:auto;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 300ms ease}.duet-theme-turva .duet-checkmark-container{border-color:rgb(143, 147, 158)}.checked>.duet-choice-label .duet-checkmark-container{background:rgb(0, 119, 179);border-color:rgb(0, 119, 179);transition:none}.duet-theme-turva .checked>.duet-choice-label .duet-checkmark-container{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58) !important}.duet-checkmark-container.duet-checkmark-radio{border-radius:50%}label.disabled .duet-checkmark-container{background:rgb(181, 198, 208) !important;border-color:rgb(181, 198, 208) !important}.duet-theme-turva label.disabled .duet-checkmark-container{border-color:rgb(199, 202, 207) !important}.checked>label.disabled .duet-checkmark-container{background:rgb(181, 198, 208) !important}.duet-theme-turva .checked>label.disabled .duet-checkmark-container{background:rgb(199, 202, 207) !important;border-color:rgb(199, 202, 207) !important}.duet-checkmark{position:absolute;top:10px;left:3px;width:5.3333333333px;height:11.8518518519px;border-top:2px solid rgb(255, 255, 255);border-right:2px solid rgb(255, 255, 255);opacity:1;transform:scaleX(-1) rotate(135deg) translateZ(0);transform-origin:left top;animation-name:duet-checkmark;animation-duration:600ms;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes duet-checkmark{0%{width:0;height:0;opacity:1}20%{width:5.3333333333px;height:0;opacity:1}40%,100%{width:5.3333333333px;height:11.8518518519px;opacity:1}}.duet-choice-card-icon{position:relative;color:rgb(0, 119, 179)}.duet-theme-turva .duet-choice-card-icon{color:rgb(164, 4, 40)}.duet-choice-card-icon duet-icon{display:block}.duet-choice-section-hidden{display:none}.duet-choice-card-info.duet-choice-card-collapsed,.duet-choice-card-collapsed.duet-choice-card-collapsible{position:relative;width:auto;padding:0 !important;background:unset !important;border:0;border-radius:0}.duet-choice-card-info,.duet-choice-card-collapsible{padding:20px !important;position:relative;width:100%;font-weight:400;color:rgb(8, 42, 77);border:1px solid rgb(212, 223, 229);border-top:0;border-radius:0 0 8px 8px;transition:border-color 300ms ease}@media (min-width: 36em){.duet-choice-card-info,.duet-choice-card-collapsible{padding:28px !important}}.duet-theme-turva .duet-choice-card-info,.duet-theme-turva .duet-choice-card-collapsible{color:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.checked>.duet-choice-card-info,.checked>.duet-choice-card-collapsible{display:block}.duet-choice-card-info-expanded,.duet-choice-card-collapsible-expanded{display:block}.duet-choice-card-collapsible{background:rgb(255, 255, 255);border:1px solid rgb(212, 223, 229);border-top:0}.duet-choice-card-collapsible.duet-theme-turva{background:rgb(255, 255, 255);border-color:rgb(222, 224, 228)}.duet-choice-card-collapsible.checked{padding:19px !important;padding-top:20px !important;border-color:rgb(0, 119, 179);border-width:2px}@media (min-width: 36em){.duet-choice-card-collapsible.checked{padding:27px !important;padding-top:28px !important}}.duet-choice-card-collapsible.checked.duet-theme-turva{border-color:rgb(23, 28, 58)}.duet-choice-card-collapsible-disabled{background:rgb(245, 248, 250);border-color:rgb(212, 223, 229)}.duet-choice-card-collapsible-disabled.checked{border-color:rgb(212, 223, 229)}.duet-choice-card-collapsible-disabled.duet-theme-turva{background:rgb(245, 247, 250);border-color:rgb(222, 224, 228)}.duet-choice-card-collapsible-disabled.duet-theme-turva.checked{border-color:rgb(222, 224, 228)}.duet-choice-card-info{font-size:0.875rem;line-height:1.5;background:rgb(245, 248, 250);transition:150ms ease-out}.duet-choice-card-info.duet-theme-turva{background:rgb(245, 247, 250);border-color:rgb(222, 224, 228)}.duet-choice-card-info.duet-choice-card-collapsed .duet-choice-info-container ::slotted(*){display:none}:host(.user-is-tabbing) .duet-choice-info-container:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8);display:block}.duet-theme-turva :host(.user-is-tabbing) .duet-choice-info-container:focus,:host(.user-is-tabbing) .duet-choice-info-container:focus.duet-theme-turva,.duet-theme-turva2 :host(.user-is-tabbing) .duet-choice-info-container:focus,:host(.user-is-tabbing) .duet-choice-info-container:focus.duet-theme-turva2{outline-color:rgba(53, 79, 101, 0.8)}:host(.disabled) .duet-choice-card-collapsible{border-color:rgb(127, 150, 165)}:host(.disabled) .duet-choice-card-collapsible.duet-theme-turva{border-color:rgb(143, 147, 158)}:host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-collapsible:not(.checked){border-color:rgb(0, 119, 179);border-width:2px}.duet-theme-turva :host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-collapsible:not(.checked){border-color:rgb(143, 147, 158)}:host([collapsible-force-expanded]:not(.no-hover):not(.disabled):hover)>.duet-choice-card-collapsible:not(.checked){padding:19px !important;padding-top:20px !important}@media (min-width: 36em){:host([collapsible-force-expanded]:not(.no-hover):not(.disabled):hover)>.duet-choice-card-collapsible:not(.checked){padding:27px !important;padding-top:28px !important}}.duet-choice-info-toggle{display:flex;flex-shrink:0;align-items:flex-start;justify-content:center;width:57.6px;padding-top:1.25rem;-webkit-appearance:none;appearance:none;cursor:pointer;background:rgb(255, 255, 255);border:1px solid rgb(212, 223, 229);border-left:0 none;border-top-right-radius:8px;border-bottom-right-radius:8px}.duet-choice-info-toggle:focus{outline:0}:host(.user-is-tabbing) .duet-choice-info-toggle:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva :host(.user-is-tabbing) .duet-choice-info-toggle:focus,:host(.user-is-tabbing) .duet-choice-info-toggle:focus.duet-theme-turva,.duet-theme-turva2 :host(.user-is-tabbing) .duet-choice-info-toggle:focus,:host(.user-is-tabbing) .duet-choice-info-toggle:focus.duet-theme-turva2{outline-color:rgba(53, 79, 101, 0.8)}.duet-choice-info-toggle[aria-expanded=true]{background:rgb(245, 248, 250);border-bottom-color:transparent;border-bottom-right-radius:0}.duet-theme-turva .duet-choice-info-toggle[aria-expanded=true]{background:rgb(245, 247, 250)}.duet-choice-info-toggle[disabled]{pointer-events:none;background:rgb(245, 248, 250) !important;border-color:rgb(212, 223, 229) !important}.duet-choice-info-toggle[disabled] .duet-choice-info-icon{color:rgb(127, 150, 165) !important}.duet-choice-info-toggle[disabled].duet-theme-turva{background:rgb(245, 247, 250) !important;border-color:rgb(222, 224, 228) !important}.duet-choice-info-toggle[disabled].duet-theme-turva .duet-choice-info-icon{color:rgb(143, 147, 158) !important}.checked+.duet-choice-info-toggle{border-left-color:rgb(0, 119, 179) !important}.duet-choice-info-toggle duet-icon{display:block}.duet-choice-info-toggle .duet-choice-info-icon{color:rgb(0, 119, 179)}.duet-theme-turva .duet-choice-info-toggle .duet-choice-info-icon{color:rgb(198, 12, 48)}:host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label .duet-choice-info-toggle{border-left-color:rgb(127, 150, 165)}.duet-theme-turva :host(:not(.no-hover):not(.disabled):hover)>.duet-choice-card-flextainer .duet-choice-label .duet-choice-info-toggle{border-left-color:rgb(143, 147, 158)}.duet-choice-input,*::slotted([slot=choiceinput]){position:absolute !important;width:100%;height:100%;opacity:0}:host(.duet-theme-turva2) .duet-theme-turva .duet-choice-card{color:rgb(23, 42, 59) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-choice-label{border-color:rgb(178, 194, 205)}.info :host(.duet-theme-turva2) .duet-theme-turva .duet-choice-label{border-color:rgb(178, 194, 205)}:host(.duet-theme-turva2) .duet-theme-turva .checked>.duet-choice-label{background:rgb(245, 246, 247);border-color:rgb(23, 42, 59) !important}:host(.duet-theme-turva2) .duet-theme-turva .checked>.duet-choice-label .duet-checkmark-container{border-color:rgb(230, 23, 64)}.duet-choice-label :host(.duet-theme-turva2) .duet-theme-turva .checked>.duet-choice-label .duet-checkmark-container{background:rgb(23, 42, 59);border-color:rgb(23, 42, 59) !important}:host(.duet-theme-turva2) .duet-theme-turva.duet-choice-card-info,:host(.duet-theme-turva2) .duet-theme-turva.duet-choice-card-collapsible{color:rgb(23, 42, 59);border-color:rgb(23, 42, 59)}:host(.duet-theme-turva2) .duet-theme-turva.duet-choice-card-collapsible{border-color:rgb(178, 194, 205)}:host(.duet-theme-turva2) .duet-theme-turva.duet-choice-card-collapsible.checked{border-color:rgb(23, 42, 59)}:host(.duet-theme-turva2) .duet-theme-turva.duet-choice-card-info{background:rgb(245, 246, 247);border-color:rgb(178, 194, 205)}:host(.duet-theme-turva2) .duet-theme-turva .duet-checkmark-container{border-color:rgb(120, 145, 164)}:host(.duet-theme-turva2) .duet-theme-turva.duet-choice-info-toggle{border-color:rgb(178, 194, 205)}:host(.duet-theme-turva2) .duet-theme-turva.duet-choice-info-toggle[aria-expanded=true]{background:rgb(245, 246, 247);border-bottom-color:transparent}:host(.duet-theme-turva2:not(.no-hover):not(.disabled):hover)>.duet-theme-turva.duet-choice-card-flextainer .duet-choice-label:not(.checked){border-color:rgb(23, 42, 59)}:host(.duet-theme-turva2:not(.no-hover):not(.disabled):hover)>.duet-theme-turva.duet-choice-card-flextainer .duet-choice-label:not(.checked) .duet-checkmark-container{border-color:rgb(120, 145, 164)}";
 
 const DuetChoice = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.duetChoiceReady = index.createEvent(this, "duetChoiceReady", 7);
-        this.duetChoiceRemove = index.createEvent(this, "duetChoiceRemove", 7);
         this.duetChange = index.createEvent(this, "duetChange", 7);
         this.duetFocus = index.createEvent(this, "duetFocus", 7);
         this.duetBlur = index.createEvent(this, "duetBlur", 7);
+        this.focus = false;
         this.hasHeader = false;
         this.choiceId = createId.createID("DuetChoice");
         this.expandId = createId.createID("DuetChoiceExpand");
         this.headerId = createId.createID("DuetChoiceHeader");
         this.infoButtonId = createId.createID("DuetChoiceInfoButton");
+        /**
+         * State() variables
+         * Inlined decorator, alphabetical order.
+         */
+        this.isHovering = false;
+        this.isInfoOpen = false;
+        /**
+         * Theme of the choice.
+         */
+        this.theme = "";
+        /**
+         * Label for the choice button.
+         */
+        this.label = "label";
+        /**
+         * Property to change accessibleLabelInfoButton defaults on the component.
+         * normally you would handle these strings on an application level and override accessibleLabelInfoButton when needed
+         */
+        this.accessibleLabelInfoButtonDefaults = commonStrings.DuetStringsExternalDefaults;
+        /**
+         * Accessible label that is read for screen reader users in the info toggle trigger button.
+         * Not visible for normal users.
+         * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
+         */
+        this.accessibleLabelInfoButton = languageUtils.getLocaleString(this.accessibleLabelInfoButtonDefaults);
+        /**
+         * Aria Details of the component
+         */
+        this.accessibleDetails = undefined;
+        /**
+         * String of id's that indicate alternative labels elements
+         */
+        this.accessibleLabelledBy = undefined;
+        /**
+         * Aria description the button
+         */
+        this.accessibleDescription = undefined;
+        /**
+         * Additional caption to show inside the label of the choice button.
+         */
+        this.caption = "";
+        /**
+         * Type of the choice button. You can set the type of the choice to be either
+         * “radio” or “checkbox”. Depending on this selection we convey the selection
+         * type to assistive technologies as well. When type “radio” is chosen it is
+         * required to place the choices inside Choice Group component.
+         */
+        this.type = "checkbox";
+        /**
+         * Checked state of the choice button.
+         */
+        this.checked = false;
+        /**
+         * Makes the choice button open a new section underneath it when clicked or
+         * tapped. This new section can be used to show more options related to this
+         * choice. Please note that this feature can’t be used together with the "info"
+         * functionality and that it only accepts plain dom nodes (no shadow dom elements
+         * such as duet-paragraph can be used as this will break accessibility)
+         */
+        this.collapsible = false;
+        /**
+         * This attribute works only when the 'collapsible' attribute is set to true.
+         * It maintains the visibility of the additional content section, regardless of whether the input is checked or not.
+         */
+        this.collapsibleForceExpanded = false;
+        /**
+         * Controls the margin of the component.
+         */
+        this.margin = "auto";
+        /**
+         * Icon to display to the left of the choice button label.
+         */
+        this.icon = "";
+        /**
+         * Expands the choice button to fill 100% of the container width.
+         */
+        this.expand = false;
+        /**
+         * Controls the padding of the component.
+         */
+        this.padding = "auto";
+        /**
+         * Makes the choice component disabled. This prevents users from being able to
+         * interact with the choice, and conveys its inactive state to assistive technologies.
+         */
+        this.disabled = false;
+        /**
+         * Set whether the input is required or not. Please note that this is necessary for
+         * accessible inputs when the user is required to fill them. When using this property
+         * you need to also set “novalidate” attribute to your form element to prevent
+         * browser from displaying its own validation errors.
+         */
+        this.required = false;
+        /**
+         * Accessible info label defaults
+         */
+        this.infoLabelDefaults = {
+            fi: "Lisätietoja vaihtoehdosta",
+            en: "More information about",
+            sv: "Mera information om",
+        };
+        /**
+         * Accessible info label
+         * @default  {
+         *     fi: "Lisätietoja vaihtoehdosta",
+         *     en: "More information about",
+         *     sv: "Mera information om",
+         *   }
+         */
+        this.infoLabel = languageUtils.getLocaleString(this.infoLabelDefaults, languageUtils.getLanguage());
+        /**
+         * Accessible collapsible notification defaults
+         */
+        this.collapsibleNotificationDefaults = {
+            fi: "Tämä valinta sisältää lisätietoja, jotka avautuivat alle",
+            en: "This choice has additional information opened below",
+            sv: "Det här val har mer information som öppnades nedan",
+        };
+        /**
+         * Accessible collapsible notification. If a collapsible choice has no header, and contains other
+         * elements than duet-paragraph, duet-heading or duet-fieldset, this is used as the accessible
+         * notification of opening the collapsible content (added to aria-describedby).
+         * @default {
+         *    fi: "Tämä valinta sisältää lisätietoja, jotka avautuivat alle",
+         *    en: "This choice has additional information opened below",
+         *    sv: "Det här val har mer information som öppnades nedan",
+         *   }
+         */
+        this.collapsibleNotification = languageUtils.getLocaleString(this.collapsibleNotificationDefaults, languageUtils.getLanguage());
         this.radioInputListenersRemove = radioInput => {
             radioInput.removeEventListener("change", this.onChange);
             radioInput.removeEventListener("keydown", this.handleKeyDown);
@@ -44,45 +182,45 @@ const DuetChoice = class {
             radioInput.addEventListener("focus", this.onFocus);
             radioInput.addEventListener("blur", this.onBlur);
         };
-        this.radioInputSetUp = () => {
-            const slotInput = this.element.querySelector("input[slot=choiceradioinput]");
-            const radioInput = slotInput || document.createElement("input");
-            radioInput.slot = "choiceradioinput";
-            radioInput.disabled = this.getDisabled();
-            radioInput.id = this.identifier || this.choiceId;
-            radioInput.type = "radio";
-            radioInput.name = this.name;
-            radioInput.value = this.value;
-            radioInput.checked = this.checked;
-            radioInput.required = this.required;
-            radioInput.ariaDescription = this.accessibleDescription;
+        this.inputSetUp = () => {
+            const slotInput = this.element.querySelectorAll(":scope > input");
+            const input = slotInput[slotInput.length - 1] || document.createElement("input");
+            input.slot = "choiceinput";
+            input.disabled = this.getDisabled();
+            input.id = this.identifier || this.choiceId;
+            input.type = this.type;
+            input.name = this.name;
+            input.value = this.value;
+            input.checked = this.checked;
+            input.required = this.required;
+            input.ariaDescription = this.accessibleDescription;
             if (this.accessibleControls) {
-                radioInput.setAttribute("aria-controls", this.accessibleControls);
+                input.setAttribute("aria-controls", this.accessibleControls);
             }
             if (this.accessibleActiveDescendant) {
-                radioInput.setAttribute("aria-activedescendant", this.accessibleActiveDescendant);
+                input.setAttribute("aria-activedescendant", this.accessibleActiveDescendant);
             }
             if (this.accessibleLabelledBy) {
-                radioInput.setAttribute("aria-labelledby", this.accessibleLabelledBy);
+                input.setAttribute("aria-labelledby", this.accessibleLabelledBy);
             }
             if (this.accessibleDetails) {
-                radioInput.setAttribute("aria-details", this.accessibleDetails);
+                input.setAttribute("aria-details", this.accessibleDetails);
             }
             if (this.accessibleOwns) {
-                radioInput.setAttribute("aria-owns", this.accessibleOwns);
+                input.setAttribute("aria-owns", this.accessibleOwns);
             }
             if (this.getAriaDescribedby()) {
-                radioInput.setAttribute("aria-describedby", this.getAriaDescribedby());
+                input.setAttribute("aria-describedby", this.getAriaDescribedby());
             }
-            radioInput.ariaLabel = this.getLabel();
-            if (slotInput) {
-                this.radioInputListenersRemove(radioInput);
+            input.ariaLabel = this.getLabel();
+            if (slotInput.length > 0) {
+                this.radioInputListenersRemove(input);
             }
             else {
-                this.element.appendChild(radioInput);
+                this.element.appendChild(input);
             }
-            this.radioInputListenersAdd(radioInput);
-            this.focusableElement = radioInput;
+            this.radioInputListenersAdd(input);
+            this.focusableElement = input;
         };
         /**
          * Component event handling.
@@ -163,49 +301,6 @@ const DuetChoice = class {
                 }, 150);
             }
         };
-        this.focus = false;
-        this.isHovering = false;
-        this.isInfoOpen = false;
-        this.theme = "";
-        this.label = "label";
-        this.accessibleLabelInfoButtonDefaults = commonStrings.DuetStringsExternalDefaults;
-        this.accessibleLabelInfoButton = languageUtils.getLocaleString(this.accessibleLabelInfoButtonDefaults);
-        this.accessibleActiveDescendant = undefined;
-        this.accessibleControls = undefined;
-        this.accessibleOwns = undefined;
-        this.accessibleDescribedBy = undefined;
-        this.accessibleDetails = undefined;
-        this.accessibleLabelledBy = undefined;
-        this.accessibleDescription = undefined;
-        this.caption = "";
-        this.value = undefined;
-        this.type = "checkbox";
-        this.name = undefined;
-        this.checked = false;
-        this.collapsible = false;
-        this.collapsibleForceExpanded = false;
-        this.margin = "auto";
-        this.icon = "";
-        this.expand = false;
-        this.padding = "auto";
-        this.identifier = undefined;
-        this.groupDirection = undefined;
-        this.groupDisabled = undefined;
-        this.groupResponsive = undefined;
-        this.disabled = false;
-        this.required = false;
-        this.infoLabelDefaults = {
-            fi: "Lisätietoja vaihtoehdosta",
-            en: "More information about",
-            sv: "Mera information om",
-        };
-        this.infoLabel = languageUtils.getLocaleString(this.infoLabelDefaults, languageUtils.getLanguage());
-        this.collapsibleNotificationDefaults = {
-            fi: "Tämä valinta sisältää lisätietoja, jotka avautuivat alle",
-            en: "This choice has additional information opened below",
-            sv: "Det här val har mer information som öppnades nedan",
-        };
-        this.collapsibleNotification = languageUtils.getLocaleString(this.collapsibleNotificationDefaults, languageUtils.getLanguage());
     }
     /**
      * Component lifecycle events.
@@ -229,14 +324,11 @@ const DuetChoice = class {
         this.duetChoiceReady.emit();
     }
     componentDidRender() {
-        if (this.type === "radio") {
-            this.radioInputSetUp();
-        }
+        this.inputSetUp();
     }
     disconnectedCallback() {
         languageUtils.disconnectLanguageChangeObserver(this);
         keyboardUtils.unsubscribeTabbingChange(this);
-        this.duetChoiceRemove.emit();
     }
     /**
      * Sets focus on the specified `duet-choice`. Use this method instead of the global
@@ -276,7 +368,7 @@ const DuetChoice = class {
         if (this.accessibleDescribedBy) {
             return this.accessibleDescribedBy;
         }
-        if (this.collapsible || this.hasInfo) {
+        if ((this.collapsible || this.hasInfo) && this.getExpanded()) {
             if (this.hasHeader) {
                 return this.headerId;
             }
@@ -343,19 +435,19 @@ const DuetChoice = class {
      * Always the last one in the class.
      */
     render() {
-        const identifier = this.identifier || this.choiceId;
-        return (index.h(index.Host, { key: 'e45e3d883ff601f42cda53bb745589a6cff07669', class: {
+        return (index.h(index.Host, { key: '74c4b0c1afd04d78513d2f428df66aea0c755a30', class: {
                 horizontal: this.groupDirection === "horizontal" && !this.groupResponsive,
-                "horizontal-responsive": this.groupDirection === "horizontal" && this.groupResponsive,
+                [`horizontal-responsive-${this.groupResponsive}`]: this.groupDirection === "horizontal" && !!this.groupResponsive,
+                "vertical-stretch": this.groupDirection === "horizontal",
                 "duet-m-0": this.margin === "none",
                 "duet-expand": this.expand,
                 "duet-theme-turva": this.theme === "turva",
                 "no-hover": this.isHovering,
                 disabled: this.getDisabled(),
-            } }, index.h("div", { key: '269cb0465b9088983bb4a9c3b0fab4ee0e4a2bd4', class: {
+            } }, index.h("div", { key: '40f23ef0315551c972d13462c800fbc08170bb60', class: {
                 "duet-choice-card-flextainer": true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, index.h("div", { key: 'f58dab3ebe6b31f9284d609e62d8c97e3056160a', class: {
+            } }, index.h("div", { key: '0cc5f080734a81eb10bc8810c3416f8cc16a0d25', class: {
                 "duet-choice-card": true,
                 "has-icon": !!this.icon,
                 "has-info": this.hasInfo,
@@ -364,26 +456,25 @@ const DuetChoice = class {
                 collapsible: this.collapsible,
                 "collapsible-force-expanded": this.collapsibleForceExpanded,
                 "duet-p-0": this.padding === "none",
-            } }, this.type === "checkbox" && (index.h("input", { key: '0223b78eb319e469137a52e6b64898d0862eafac', class: "duet-choice-input", type: this.type, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, disabled: this.getDisabled(), required: this.required, id: identifier, name: this.name, value: this.value, checked: this.checked, "aria-label": this.getLabel(), "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedby(), onKeyDown: this.handleKeyDown, ref: input => (this.focusableElement = input) })), index.h("slot", { key: 'b438afa42e1d50c6aa9a145e656aed1b0f801efa', name: "choiceradioinput" }), index.h("label", { key: 'c08ba3234495038c9dedce7247aef93e9171e4c1', class: {
+            } }, index.h("slot", { key: '65d5bb2cd8c8c0b4f5ed9811b38b48b7335c0df4', name: "choiceinput" }), index.h("label", { key: '98b47986d36a16dc5349cd465c5273dc463aab1b', class: {
                 "duet-choice-label": true,
                 "has-before-text": this.hasBeforeText,
                 checked: this.checked,
                 focus: this.focus,
                 disabled: this.getDisabled(),
-            }, onClick: this.onClick }, this.hasBeforeText && index.h("slot", { key: '822b608190ed8058e5083664364f7802f36bbc12', name: "before-text" }), this.icon && (index.h("div", { key: '47be54fb7c3c00ab9cdff531a158e3bf8131d1eb', class: "duet-choice-card-icon" }, index.h("duet-icon", { key: 'ba85bd90adcc57f4f3b4641d10417f14c0a3d0a7', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), index.h("div", { key: '9bffd97bdf78929c3e18eed10f9903c068f84284', class: "duet-choice-card-text" }, index.h("div", { key: '7378526d0c1be754eeef8acb758b800534710af6' }, this.hasLabel ? index.h("slot", { name: "label" }) : this.label), this.caption && (index.h("div", { key: '2c026043a64085f44ec11e2b59fa7d3625880b98' }, index.h("duet-spacer", { key: '23bd4874a25550df5c010a4ac2f4753b7bebe095', size: "xx-small" }), index.h("duet-caption", { key: '1e91ca0d61dcbb29b48095ade98d69f35f8d034e', margin: "none", selected: this.checked }, this.caption))), this.hasAdditional && (index.h("div", { key: 'af539e1466767e981b523efd118aaadec4c3ac7e' }, index.h("duet-spacer", { key: '3062fe17e11d61e8e02364762088fc33e3f123fd', size: "xx-small" }), index.h("slot", { key: '2a4faf03104769cf9c8c12b3700608ccbf353233', name: "additional" })))), index.h("div", { key: 'a31c056ac9d543e7ee157fd4e2dddfd64cc823a9' }, index.h("div", { key: '8e139394a6669f009546db7274152790fb099cb0', class: { "duet-checkmark-container": true, "duet-checkmark-radio": this.type === "radio" } }, this.checked && index.h("div", { key: '661c15b7dd0fbe9012e16841c1f082e85fd8f6de', class: "duet-checkmark" }))))), this.hasInfo && !this.collapsible && (index.h("button", { key: 'c8b30535f36197e9f435b806ca23f0c8cbf81e4a', ref: button => (this.infoButtonEl = button), id: this.infoButtonId, class: {
+            }, onClick: this.onClick }, this.hasBeforeText && index.h("slot", { key: 'b29fd679de70ab070b1b821dc4a2c8e091914073', name: "before-text" }), this.icon && (index.h("div", { key: '1881e659c9c7c4fbdb0935e54850f4f70c28975f', class: "duet-choice-card-icon" }, index.h("duet-icon", { key: '91d0be349f26a8c0f0bfae30ce809d6c98fdf833', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), index.h("div", { key: 'e38af0b72bbd56517fc3cd08db6bd0e35d1941a0', class: "duet-choice-card-text" }, index.h("div", { key: 'afe1e13db8d21c88042eb740b03920c60ca3f0b8' }, this.hasLabel ? index.h("slot", { name: "label" }) : this.label), this.caption && (index.h("div", { key: 'db42771f819ba0b951458505be33fa27d96c626e' }, index.h("duet-spacer", { key: 'ece32f47f5c075f949156ae62ea4d53f2bc9a75a', size: "xx-small" }), index.h("duet-caption", { key: 'eb570008d5b29058acbe690a92e93cfaa66810e7', margin: "none", selected: this.checked }, this.caption))), this.hasAdditional && (index.h("div", { key: 'ddd0d7cf3e349528ae6ec6c013df72449aae340a' }, index.h("duet-spacer", { key: 'b8b542af5b875cb32591d12125726441bfc71927', size: "xx-small" }), index.h("slot", { key: '40409b224b5b2acdd0689cadc4332b8bff4750d9', name: "additional" })))), index.h("div", { key: 'ad56ee344580c7cb2a9abca5651375dd9d725e24' }, index.h("div", { key: '2c5bdf19e1001fd6bb57bfe3b2cdc44c217c64f7', class: { "duet-checkmark-container": true, "duet-checkmark-radio": this.type === "radio" } }, this.checked && index.h("div", { key: 'cfea1353992716f4d965ce0db1869d9914db7bc6', class: "duet-checkmark" }))))), this.hasInfo && !this.collapsible && (index.h("button", { key: 'c3073fdf9da1c74366e9fd43a07321587db86374', ref: button => (this.infoButtonEl = button), id: this.infoButtonId, class: {
                 "duet-choice-info-toggle": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, onClick: this.toggleInfo, disabled: this.getDisabled(), "aria-expanded": this.isInfoOpen ? "true" : "false", "aria-label": `${this.infoLabel} ${this.label}`, "aria-controls": this.expandId, tabindex: this.type === "radio" && !this.checked ? "-1" : "0", type: "button", onKeyUp: e => this.handleEscape(e) }, index.h("div", { key: 'a658c863b61f1d5f8949e24ed9a59108c8a6fa76', class: "duet-choice-info-icon" }, index.h("duet-icon", { key: '6d4aae6cdecafd186807a43914409cb35e8fdb38', icon: messagingInfo.svg, margin: "none", size: "small", color: "currentColor" }))))), this.collapsible && (index.h("span", { key: '9796521f397d0b976a84884108d4138a054c3b92', id: `${this.choiceId}-collapsible-notification`, hidden: true }, this.collapsibleNotification)), this.collapsible || this.hasInfo ? (index.h("div", { class: this.getClassNames(), id: this.expandId }, index.h("span", { class: {
+            }, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, onClick: this.toggleInfo, disabled: this.getDisabled(), "aria-expanded": this.isInfoOpen ? "true" : "false", "aria-label": `${this.infoLabel} ${this.label}`, "aria-controls": this.expandId, tabindex: this.type === "radio" && !this.checked ? "-1" : "0", type: "button", onKeyUp: e => this.handleEscape(e) }, index.h("div", { key: '6fa70b3e97c81f44e8d4bdce9d1511680a19d674', class: "duet-choice-info-icon" }, index.h("duet-icon", { key: '2129ca97e0d1e45ca69cd17ad0dd5de7fd4dfafb', icon: infoIcon.svg, margin: "none", size: "small", color: "currentColor" }))))), this.collapsible && (index.h("span", { key: '4990fa0e4b60b0e87076113b5e302b06d55d566f', id: `${this.choiceId}-collapsible-notification`, hidden: true }, this.collapsibleNotification)), this.collapsible || this.hasInfo ? (index.h("div", { class: this.getClassNames(), id: this.expandId }, index.h("span", { class: {
                 "duet-choice-section-visible": this.collapsible ? this.getExpanded() : this.isInfoOpen,
                 "duet-choice-section-hidden": this.collapsible ? !this.getExpanded() : !this.isInfoOpen,
-            } }, index.h("span", { id: this.headerId }, index.h("slot", { name: "header" })), this.hasInfo ? (index.h("span", { ref: span => (this.infoContainer = span), tabindex: "0", class: "duet-choice-info-container", onKeyUp: e => this.handleEscape(e) }, index.h("span", null, index.h("slot", { name: "info" })), index.h("slot", null))) : (index.h("span", { id: `${this.choiceId}-collapsible-content` }, index.h("slot", null)))))) : null));
+            } }, index.h("span", { id: this.headerId }, index.h("slot", { name: "header" })), this.hasInfo ? (index.h("span", { ref: span => (this.infoContainer = span), tabindex: "-1", class: "duet-choice-info-container", onKeyUp: e => this.handleEscape(e) }, index.h("span", null, index.h("slot", { name: "info" })), index.h("slot", null))) : (index.h("span", { id: `${this.choiceId}-collapsible-content` }, index.h("slot", null)))))) : null));
     }
     get element() { return index.getElement(this); }
 };
-DuetChoice.style = DuetChoiceStyle0;
+DuetChoice.style = duetChoiceCss;
 
-const duetChoiceGroupCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}:host(.horizontal) .duet-choice-group{display:block;margin-bottom:-12px}:host(.horizontal) .duet-choice-group.duet-no-stacking{display:flex}@media (min-width: 48em){:host(.horizontal) .duet-choice-group{margin-bottom:0}}@media (max-width: 35.9375em){:host(.horizontal) .duet-choice-group{display:flex}}:host(.horizontal.duet-choice-group-breakpoint-x-small) .duet-choice-group:not(.duet-no-stacking){display:flex}@media (max-width: 22.5em){:host(.horizontal.duet-choice-group-breakpoint-x-small) .duet-choice-group:not(.duet-no-stacking){display:block}}:host(.horizontal.duet-choice-group-breakpoint-small) .duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 36em){:host(.horizontal.duet-choice-group-breakpoint-small) .duet-choice-group:not(.duet-no-stacking){display:flex}}:host(.horizontal.duet-choice-group-breakpoint-medium) .duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 48em){:host(.horizontal.duet-choice-group-breakpoint-medium) .duet-choice-group:not(.duet-no-stacking){display:flex}}:host(.horizontal.duet-choice-group-breakpoint-large) .duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 62em){:host(.horizontal.duet-choice-group-breakpoint-large) .duet-choice-group:not(.duet-no-stacking){display:flex}}:host(.horizontal.duet-choice-group-breakpoint-x-large) .duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 64.0625em){:host(.horizontal.duet-choice-group-breakpoint-x-large) .duet-choice-group:not(.duet-no-stacking){display:flex}}.duet-choice-group{position:relative;width:100%;margin-bottom:-12px}";
-const DuetChoiceGroupStyle0 = duetChoiceGroupCss;
+const duetChoiceGroupCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;display:block;width:100%}:host(.horizontal) .duet-choice-group{display:block;margin-bottom:-12px}:host(.horizontal) .duet-choice-group.duet-no-stacking{display:flex}@media (min-width: 48em){:host(.horizontal) .duet-choice-group{margin-bottom:0}}@media (max-width: 35.9375em){:host(.horizontal) .duet-choice-group{display:flex}}:host(.horizontal.duet-choice-group-breakpoint-x-small) .duet-choice-group:not(.duet-no-stacking){display:flex}@media (max-width: 22.5em){:host(.horizontal.duet-choice-group-breakpoint-x-small) .duet-choice-group:not(.duet-no-stacking){display:block}}:host(.horizontal.duet-choice-group-breakpoint-small) .duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 36em){:host(.horizontal.duet-choice-group-breakpoint-small) .duet-choice-group:not(.duet-no-stacking){display:flex}}:host(.horizontal.duet-choice-group-breakpoint-medium) .duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 48em){:host(.horizontal.duet-choice-group-breakpoint-medium) .duet-choice-group:not(.duet-no-stacking){display:flex}}:host(.horizontal.duet-choice-group-breakpoint-large) .duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 62em){:host(.horizontal.duet-choice-group-breakpoint-large) .duet-choice-group:not(.duet-no-stacking){display:flex}}:host(.horizontal.duet-choice-group-breakpoint-x-large) .duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 64.0625em){:host(.horizontal.duet-choice-group-breakpoint-x-large) .duet-choice-group:not(.duet-no-stacking){display:flex}}.duet-choice-group{position:relative;width:100%;margin-bottom:-12px}";
 
 const DuetChoiceGroup = class {
     constructor(hostRef) {
@@ -391,61 +482,113 @@ const DuetChoiceGroup = class {
         this.choiceGroupName = "duet-choice-group";
         this.choices = new Set();
         /**
-         * Component event handling.
+         * Direction of the choice group.
          */
-        this.onSelect = (ev) => {
-            if (ev.detail.component !== "duet-choice") {
-                return;
-            }
-            const selectedChoice = ev.target;
-            if (selectedChoice && this.choices.has(selectedChoice)) {
-                this.value = selectedChoice.value;
-            }
-        };
-        this.onChoiceReady = (ev) => {
-            const choice = ev.target;
-            if (choice.closest("duet-choice-group") === this.element && !this.choices.has(choice)) {
-                this.choices.add(choice);
-                this.updateChoices();
-            }
-        };
-        this.onChoiceRemove = (ev) => {
-            const choice = ev.target;
-            this.choices.delete(choice);
-            this.updateChoices();
-        };
         this.direction = "vertical";
+        /**
+         * Controls the margin of the component.
+         */
         this.margin = "auto";
+        /**
+         * Theme of the choice group.
+         */
         this.theme = "";
+        /**
+         * Display choice group in error state along with an error message.
+         */
         this.error = "";
-        this.name = undefined;
+        /**
+         * Legend displayed for the choice buttons in this group.
+         */
         this.label = "Label";
+        /**
+         * Visually hide the label, but still show it to screen readers.
+         */
         this.labelHidden = false;
+        /**
+         * Additional caption to show inside the label of the choice group.
+         */
         this.caption = undefined;
+        /**
+         * Tooltip to display next to the label of the choice group.
+         */
         this.tooltip = undefined;
+        /**
+         * With direction setting you can force the tooltip to always open towards left
+         * or right instead of automatically determining the direction.
+         */
         this.tooltipDirection = "auto";
+        /**
+         * Enable or disable the automatic responsive behaviour of the choice group
+         * component when horizontal setting is used. Setting this option to "true"
+         * makes sure that contents are stacked vertically on mobile.
+         */
         this.responsive = false;
+        /**
+         * Switch the breakpoint used to trigger the content stacking. These match to
+         * similar media query tokens eg.: $media-query-small, $media-query-medium.
+         */
         this.breakpoint = "small";
-        this.value = undefined;
-        this.disabled = undefined;
+        /**
+         * Sets whether making a choice is required or optional. Will set contained choices to required as well.
+         */
         this.required = false;
+        /**
+         * The aria-live attribute for the error message. When the input is validated on blur, use "off", as using "polite" or "assertive"
+         * makes the screen reader read the error message twice. When the input is validated on submit, use "polite", as "off" would leave
+         * the messages unread by screen readers. Use "assertive" only in those rare cases when "polite" would leave the error message
+         * unread by screen readers.
+         */
         this.accessibleLiveError = "polite";
+        // Call this.updateChoices when a child choice has been removed - addtions are handled by events
+        this.childObserverCallback = (mutationList) => {
+            if (mutationList.some(r => {
+                var _a;
+                return ((_a = r.removedNodes) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
+                    Array.from(r.removedNodes.values()).some(n => n.nodeName.toLowerCase() === "duet-choice");
+            })) {
+                this.updateChoices();
+            }
+        };
+        /**
+         * Component event handling.
+         */
+        this.onSelect = (ev) => {
+            if (ev.detail.component !== "duet-choice") {
+                return;
+            }
+            const selectedChoice = ev.target;
+            if (selectedChoice && this.choices.has(selectedChoice)) {
+                this.value = selectedChoice.value;
+            }
+        };
+        this.onChoiceReady = () => {
+            this.updateChoices();
+        };
+    }
+    removeDisabledAttributeWhenFalse() {
+        if (!this.disabled) {
+            this.element.removeAttribute("disabled");
+        }
     }
     /**
      * Component lifecycle events.
      */
     async connectedCallback() {
+        this.childObserver = new MutationObserver(this.childObserverCallback.bind(this));
+        this.childObserver.observe(this.element, { childList: true, subtree: true });
         this.setInitialValue();
         this.updateChoices();
     }
     disconnectedCallback() {
-        if (this.mutationO) {
-            this.mutationO.disconnect();
-            this.mutationO = undefined;
+        if (this.childObserver) {
+            this.childObserver.disconnect();
+            this.childObserver = undefined;
         }
     }
     componentWillLoad() {
         themeableComponent.inheritGlobalTheme(this);
+        this.removeDisabledAttributeWhenFalse();
         slotUtils.checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
     }
     setInitialValue() {
@@ -467,13 +610,19 @@ const DuetChoiceGroup = class {
         var _a;
         const value = (_a = this.value) !== null && _a !== void 0 ? _a : this.initialValue;
         let hasChecked = false;
+        this.choices.clear();
+        this.element.querySelectorAll("duet-choice").forEach((choice) => {
+            if (choice.closest("duet-choice-group") === this.element) {
+                this.choices.add(choice);
+            }
+        });
         // Walk the DOM in reverse order, since the last selected one wins
         for (const choice of Array.from(this.choices)) {
             choice.name = this.name;
             choice.required = this.required;
             choice.groupDisabled = this.disabled;
             choice.groupDirection = this.direction;
-            choice.groupResponsive = this.responsive;
+            choice.groupResponsive = this.responsive ? this.breakpoint : undefined;
             if (!hasChecked && choice.value === value) {
                 // Correct value for this choice, but this choice isn't checked yet
                 // and we haven't found a checked yet
@@ -498,25 +647,25 @@ const DuetChoiceGroup = class {
      * Always the last one in the class.
      */
     render() {
-        return (index.h(index.Host, { key: '7b938818686b05db520fbe91c79a8bd415953252', onDuetChange: this.onSelect, onDuetChoiceReady: this.onChoiceReady, onDuetChoiceRemove: this.onChoiceRemove, class: {
+        return (index.h(index.Host, { key: '39267534dcf19f7f942ef44d869d302552ad8463', onDuetChange: this.onSelect, onDuetChoiceReady: this.onChoiceReady, class: {
                 horizontal: this.direction === "horizontal",
                 "duet-choice-group-breakpoint-x-small": this.responsive && this.breakpoint === "x-small",
                 "duet-choice-group-breakpoint-small": this.responsive && this.breakpoint === "small",
                 "duet-choice-group-breakpoint-medium": this.responsive && this.breakpoint === "medium",
                 "duet-choice-group-breakpoint-large": this.responsive && this.breakpoint === "large",
                 "duet-choice-group-breakpoint-x-large": this.responsive && this.breakpoint === "x-large",
-            } }, index.h("duet-fieldset", { key: '80087165b139cbd999a2399514b9520044f195e6', label: this.label, labelHidden: this.labelHidden, compactLabel: true, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (index.h("duet-tooltip", { key: 'e5f2b0838c718e2ecb4e3c20e71dc8882454159c', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), index.h("slot", { key: 'c56ccec0fd534ad20d6125e9c0d6f7ad7f377110', name: "tooltip" }), index.h("div", { key: '2fe2c5122b5a801959f7de400ec5bd3f974d78cd', class: { [this.choiceGroupName]: true, "duet-no-stacking": !this.responsive } }, index.h("slot", { key: 'd45976650a1c57151eee04088e9b29db2a4e76be' })))));
+            } }, index.h("duet-fieldset", { key: '1e292babf2206d42d58c46f88bed02959e595dc1', label: this.label, labelHidden: this.labelHidden, compactLabel: true, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (index.h("duet-tooltip", { key: '435735b34c7f437aba23bda2eebd7fa78aa30f3d', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), index.h("slot", { key: '898fe0c09e0b5ba4c62d21af1c06f8c0353c0e08', name: "tooltip" }), index.h("div", { key: 'de8a0372a7be4adb5c97bccb01c1ef11d71a012b', class: { [this.choiceGroupName]: true, "duet-no-stacking": !this.responsive } }, index.h("slot", { key: '28a116e0e58afe8867e9bd3229dc618895961301' })))));
     }
     get element() { return index.getElement(this); }
     static get watchers() { return {
+        "disabled": ["removeDisabledAttributeWhenFalse", "updateChoices"],
         "value": ["setInitialValue", "updateChoices"],
-        "disabled": ["updateChoices"],
         "name": ["updateChoices"],
         "direction": ["updateChoices"],
         "responsive": ["updateChoices"]
     }; }
 };
-DuetChoiceGroup.style = DuetChoiceGroupStyle0;
+DuetChoiceGroup.style = duetChoiceGroupCss;
 
 exports.duet_choice = DuetChoice;
 exports.duet_choice_group = DuetChoiceGroup;