@opalkelly/frontpanel-react-components 0.2.0 → 0.2.1

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-import*as e from"react";import n,{useContext as r}from"react";import*as t from"@radix-ui/react-tooltip";import o from"classnames";import*as i from"@radix-ui/react-slider";import*as a from"@radix-ui/react-select";import*as l from"@radix-ui/react-scroll-area";var s,c;!function(e){e[e.Binary=2]="Binary",e[e.Octal=8]="Octal",e[e.Decimal=10]="Decimal",e[e.Hexadecimal=16]="Hexadecimal"}(s||(s={})),function(e){e[e.Off=0]="Off",e[e.On=1]="On"}(c||(c={}));class u{get DigitCount(){return this._DigitCount}get NumeralSystem(){return this._NumeralSystem}get DigitChars(){return this._DigitChars}constructor(e,n){this._DigitCount=e,this._NumeralSystem=n,this._DigitChars=u.GetDigitChars(n)}GetDigitFromValue(e){let n=e%this._NumeralSystem;return n<0&&(n+=this._NumeralSystem),n.toString(this._NumeralSystem)}static GetDigitChars(e){let n;switch(e){case s.Binary:n=u.BINARY_DIGITVALUES;break;case s.Octal:n=u.OCTAL_DIGITVALUES;break;case s.Decimal:n=u.DECIMAL_DIGITVALUES;break;case s.Hexadecimal:n=u.HEXADECIMAL_DIGITVALUES;break;default:n=[]}return n}static ComputeDigitCountFromBits(e,n){const r=(1n<<BigInt(e))-1n;return this.ComputeDigitCountFromValue(r,n)}static ComputeDigitCountFromValue(e,n){const r=BigInt(n);let t,o=e;for(t=0n;t<u.MAX_DIGITS&&0n!==o;t++)o/=r;return t>0n?t:1n}}function d(e){let n=0;if(e>0n){let r=e;for(;r>0n;)r>>=1n,n++}else 0n===e&&(n=1);return n}u.MAX_DIGITS=1024,u.BINARY_DIGITVALUES=["0","1"],u.OCTAL_DIGITVALUES=["0","1","2","3","4","5","6","7"],u.DECIMAL_DIGITVALUES=[...u.OCTAL_DIGITVALUES,"8","9"],u.HEXADECIMAL_DIGITVALUES=[...u.DECIMAL_DIGITVALUES,"A","B","C","D","E","F"];const f=n.createContext({}),p=e=>{const{device:r,workQueue:t,eventSource:o}=e;return n.createElement(f.Provider,{value:{device:r,workQueue:t,eventSource:o}},e.children)};function m(e,n){void 0===n&&(n={});var r=n.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===r&&t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}p.displayName="FrontPanel";m("");const h=e.forwardRef(((n,r)=>e.createElement(t.Provider,null,n.children)));h.displayName="Application";m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n@font-face {\r\n    font-family: "Inter";\r\n    src: url("./fonts/Inter-VariableFont_slnt\\,wght.ttf") format("truetype");\r\n}\r\n');m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okButton {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    padding: var(--button-padding, 6px 12px);\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 8px;\r\n\r\n    /* Style */\r\n    border-width: 0px;\r\n    border-radius: 4px;\r\n    background: var(--brand-12, #44bd84);\r\n\r\n    /* Typography */\r\n    color: var(--Base-White, #fff);\r\n    text-align: center;\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: var(--button-font-size, 12px);\r\n    font-style: normal;\r\n    font-weight: 600;\r\n    line-height: var(--button-line-height, 12px); /* 100% */\r\n\r\n    /* State Pressed */\r\n    &:is(:active) {\r\n        background: #329466;\r\n    }\r\n\r\n    /* State Disabled */\r\n    &:is(:disabled) {\r\n        background: var(--Gray-2, #d0d7df);\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --button-padding: 6px 12px;\r\n        --button-font-size: 12px;\r\n        --button-line-height: 12px;\r\n    }\r\n\r\n    /* Sizes 2*/\r\n    &:where(.ok-r-size-2) {\r\n        --button-padding: 10px 18px;\r\n        --button-font-size: 14px;\r\n        --button-line-height: 14px;\r\n    }\r\n\r\n    /* Sizes 3*/\r\n    &:where(.ok-r-size-3) {\r\n        --button-padding: 18px 22px;\r\n        --button-font-size: 20px;\r\n        --button-line-height: 20px;\r\n    }\r\n}\r\n');m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okTooltipContent {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: 10px;\r\n    align-items: flex-end;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    background: var(--Dark, #343434);\r\n\r\n    /* Drop shadow - tiny */\r\n    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.24);\r\n\r\n    user-select: none;\r\n    animation-duration: 200ms;\r\n    animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);\r\n    will-change: transform, opacity;\r\n}\r\n\r\n.okTooltipContent[data-state="delayed-open"][data-side="top"] {\r\n    animation-name: slideDownAndFade;\r\n}\r\n.okTooltipContent[data-state="delayed-open"][data-side="right"] {\r\n    animation-name: slideLeftAndFade;\r\n}\r\n.okTooltipContent[data-state="delayed-open"][data-side="bottom"] {\r\n    animation-name: slideUpAndFade;\r\n}\r\n.okTooltipContent[data-state="delayed-open"][data-side="left"] {\r\n    animation-name: slideRightAndFade;\r\n}\r\n\r\n.okTooltipText {\r\n    /* Typography */\r\n    color: var(--Light, #fff);\r\n    text-align: center;\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 12px;\r\n    font-style: normal;\r\n    font-weight: 400;\r\n    line-height: 12px; /* 100% */\r\n}\r\n\r\n@keyframes slideUpAndFade {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateY(2px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n}\r\n\r\n@keyframes slideRightAndFade {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateX(-2px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateX(0);\r\n    }\r\n}\r\n\r\n@keyframes slideDownAndFade {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateY(-2px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n}\r\n\r\n@keyframes slideLeftAndFade {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateX(2px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateX(0);\r\n    }\r\n}\r\n');const g=n.forwardRef(((e,r)=>{const{children:i,className:a,open:l,defaultOpen:s,onOpenChange:c,delayDuration:u,disableHoverableContent:d,content:f,container:p,forceMount:m,...h}=e,g={open:l,defaultOpen:s,onOpenChange:c,delayDuration:u,disableHoverableContent:d};return n.createElement(t.Root,{...g},n.createElement(t.Trigger,{asChild:!0},i),n.createElement(t.Portal,{container:p,forceMount:m},n.createElement(t.Content,{sideOffset:4,collisionPadding:10,...h,ref:r,className:o("okTooltipContent",a)},n.createElement("p",{className:"okTooltipText"},f))))}));function y(e){return function(r){return null!=r.tooltip?n.createElement(g,{content:r.tooltip},e):e}}g.displayName="Tooltip";const b=n.forwardRef(((e,r)=>{const{className:t,label:i,size:a=1,onButtonUp:l,onButtonDown:s,onButtonClick:c,...u}=e,d=y(n.createElement("button",{"data-disabled":u.disabled||void 0,...u,ref:r,className:o("okButton",t,"ok-r-size-"+a),onMouseDown:s,onMouseUp:l,onClick:c},i));return n.createElement(d,{...e})}));b.displayName="Button";var v;m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okIndicator {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    padding: var(--indicator-padding, 6px 12px);\r\n    justify-content: flex-start;\r\n    align-items: baseline;\r\n    gap: 4px;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    background: var(--Light, #fff);\r\n\r\n    /* Indicator Icon Style */\r\n    svg.okIndicatorIcon {\r\n        width: var(--indicator-icon-width, 9px);\r\n        height: var(--indicator-icon-height, 9px);\r\n    }\r\n\r\n    /* Label Style */\r\n    .okIndicatorLabel {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        /* TODO: Determine how to get Inter font */\r\n        font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n        font-size: var(--indicator-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 500;\r\n        line-height: var(--indicator-line-height, 12px); /* 100% */\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --indicator-padding: 6px 12px;\r\n        --indicator-font-size: 12px;\r\n        --indicator-line-height: 12px;\r\n        --indicator-icon-width: 9px;\r\n        --indicator-icon-height: 9px;\r\n    }\r\n\r\n    /* Sizes 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --indicator-padding: 10px 18px;\r\n        --indicator-font-size: 14px;\r\n        --indicator-line-height: 14px;\r\n        --indicator-icon-width: 10px;\r\n        --indicator-icon-height: 10px;\r\n    }\r\n\r\n    /* Sizes 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --indicator-padding: 18px 22px;\r\n        --indicator-font-size: 20px;\r\n        --indicator-line-height: 20px;\r\n        --indicator-icon-width: 15px;\r\n        --indicator-icon-height: 15px;\r\n    }\r\n}\r\n'),function(e){e[e.Up=0]="Up",e[e.Down=1]="Down"}(v||(v={}));const x=e.forwardRef(((n,r)=>{const{direction:t=v.Down,color:o="#343434",...i}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"8",viewBox:"0 0 12 8",fill:"none",...i,ref:r},((n,r)=>{let t;return n===v.Up||v.Down,t=e.createElement("path",{d:"M6.75593 7.12713C6.35716 7.58759 5.64284 7.58759 5.24407 7.12713L2.23682 3.65465C1.67594 3.00701 2.136 2 2.99275 2L9.00725 2C9.864 2 10.3241 3.00701 9.76318 3.65465L6.75593 7.12713Z",fill:r}),t})(t,o))}));var w;x.displayName="ChevronIcon",function(e){e[e.Up=0]="Up",e[e.Down=1]="Down"}(w||(w={}));const E=e.forwardRef(((n,r)=>{const{direction:t=w.Down,color:o="#343434",...i}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"10",height:"4",viewBox:"0 0 10 4",fill:"none",...i,ref:r},((n,r)=>{let t;switch(n){case w.Up:t=e.createElement("path",{d:"M5 5.1656e-07L10 4L0 4L5 5.1656e-07Z",fill:r});break;case w.Down:t=e.createElement("path",{d:"M5 4L0 0L10 8.88334e-07L5 4Z",fill:r});break;default:t=e.createElement("path",{d:"M5 5.1656e-07L10 4L0 4L5 5.1656e-07Z",fill:r})}return t})(t,o))}));E.displayName="IndicatorArrowIcon";const S=e.forwardRef(((n,r)=>{const{color:t="#343434",...o}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"10",height:"1",viewBox:"0 0 10 1",fill:"none",...o,ref:r},e.createElement("path",{d:"M8.74228e-08 -8.74228e-07L10 -9.53674e-07L10 1L0 0.999999L8.74228e-08 -8.74228e-07Z",fill:t}))}));S.displayName="IndicatorBarIcon";const k=e.forwardRef(((n,r)=>{const{state:t,color:o="#D0D7DF",colorOnState:i="#44BD84",colorOffState:a="#D0D7DF"}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",...n,ref:r},((n,r,t,o)=>{let i;switch(n){case c.On:i=e.createElement("path",{d:"M5 10C7.76142 10 10 7.76142 10 5C10 2.23858 7.76142 0 5 0C2.23858 0 0 2.23858 0 5C0 7.76142 2.23858 10 5 10Z",fill:t});break;case c.Off:i=e.createElement("path",{d:"M5 10C7.76142 10 10 7.76142 10 5C10 2.23858 7.76142 0 5 0C2.23858 0 0 2.23858 0 5C0 7.76142 2.23858 10 5 10Z",fill:o});break;default:i=e.createElement("path",{d:"M5 10C7.76142 10 10 7.76142 10 5C10 2.23858 7.76142 0 5 0C2.23858 0 0 2.23858 0 5C0 7.76142 2.23858 10 5 10Z",fill:r})}return i})(t,o,i,a))}));k.displayName="IndicatorStateIcon";const I=e.forwardRef(((n,r)=>{const{state:t,color:o="#343434",colorOnState:i="#44BD84",...a}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",...a,ref:r},((n,r,t)=>{let o;switch(n){case c.On:o=e.createElement(e.Fragment,null,e.createElement("circle",{cx:"7",cy:"7",r:"6",stroke:r,strokeWidth:"2"}),e.createElement("circle",{cx:"7",cy:"7",r:"3",fill:t}));break;case c.Off:default:o=e.createElement("circle",{cx:"7",cy:"7",r:"6",stroke:r,strokeWidth:"2"})}return o})(t,o,i))}));I.displayName="RadioToggleStateIcon";const _=e.forwardRef(((n,r)=>{const{state:t,color:o="white",colorOnState:i="white",colorOffState:a="white",...l}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"8",height:"8",viewBox:"0 0 8 8",fill:"none",...l,ref:r},((n,r,t,o)=>{let i;switch(n){case c.On:i=e.createElement("circle",{cx:"4",cy:"4",r:"3.75",fill:t});break;case c.Off:i=e.createElement("circle",{cx:"4",cy:"4",r:"3.75",fill:o});break;default:i=e.createElement("circle",{cx:"4",cy:"4",r:"3.75",fill:r})}return i})(t,o,i,a))}));_.displayName="SwitchToggleStateIcon";const C=n.forwardRef(((e,r)=>{const{className:t,label:i,size:a=1,state:l,...s}=e,u=y(n.createElement("span",{...s,ref:r,className:o("okIndicator",t,"ok-r-size-"+a)},n.createElement(k,{className:"okIndicatorIcon",state:l?c.On:c.Off}),n.createElement("span",{className:o("okIndicatorLabel")},i)));return n.createElement(u,{...e})}));C.displayName="Indicator";m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okLabel {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    flex-direction: column;\r\n    align-items: flex-start;\r\n    gap: 4px;\r\n\r\n    /* Text Style */\r\n    .okLabelText {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n        font-size: 12px;\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: 12px; /* 100% */\r\n    }\r\n\r\n    /* Label Position Left Top*/\r\n    &:where(.ok-pos-left-top) {\r\n        flex-direction: column;\r\n        align-items: flex-start;\r\n    }\r\n\r\n    /* Label Position Left Bottom*/\r\n    &:where(.ok-pos-left-bottom) {\r\n        flex-direction: column-reverse;\r\n        align-items: flex-start;\r\n    }\r\n\r\n    /* Label Position Right Top*/\r\n    &:where(.ok-pos-right-top) {\r\n        flex-direction: column;\r\n        align-items: flex-end;\r\n    }\r\n\r\n    /* Label Position Right Bottom*/\r\n    &:where(.ok-pos-right-bottom) {\r\n        flex-direction: column-reverse;\r\n        align-items: flex-end;\r\n    }\r\n}\r\n');const N=n.forwardRef(((e,r)=>{const{className:t,text:i,horizontalPosition:a="left",verticalPosition:l="top",children:s,...c}=e;return n.createElement("div",{...c,ref:r,className:o("okLabel",t,"ok-pos-"+a+"-"+l)},n.createElement("span",{className:o("okLabelText")},i),s)}));N.displayName="Label";m("/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okNumberDisplay {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: var(--number-display-padding, 6px 12px);\r\n    justify-content: flex-end;\r\n    align-items: center;\r\n    gap: 4px;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    background: #f5f5f5;\r\n\r\n    /* Content Style */\r\n    .okNumberDisplayContent {\r\n        display: flex;\r\n        padding: var(--spacing-0, 0px);\r\n        align-items: center;\r\n        justify-content: flex-end;\r\n        gap: 8px;\r\n        flex: 1 0 0;\r\n    }\r\n\r\n    /* Text Style */\r\n    .okNumberDisplayText {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        font-family: Monaco;\r\n        font-size: var(--number-display-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: var(--number-display-line-height, 12px); /* 100% */\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --number-display-padding: 6px 6px;\r\n        --number-display-font-size: 12px;\r\n        --number-display-line-height: 12px;\r\n    }\r\n\r\n    /* Sizes 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --number-display-padding: 6px 10px;\r\n        --number-display-font-size: 14px;\r\n        --number-display-line-height: 14px;\r\n    }\r\n\r\n    /* Sizes 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --number-display-padding: 6px 18px;\r\n        --number-display-font-size: 20px;\r\n        --number-display-line-height: 20px;\r\n    }\r\n}\r\n");const O=n.forwardRef(((e,r)=>{const{className:t,label:i,size:a=1,numeralSystem:l=s.Decimal,decimalScale:c=0,maximumValue:d,minimumValue:f,value:p}=e,m=n.useMemo((()=>{const e=u.ComputeDigitCountFromValue(d,l),n=u.ComputeDigitCountFromValue(f,l);return e>n?e:n}),[d,f,l]),h=n.useMemo((()=>n.createElement("span",{className:o("okNumberDisplayText","ok-r-size-"+a)},"-")),[a]),g=y(n.createElement("div",{ref:r,className:o("okNumberDisplay",t,"ok-r-size-"+a)},n.createElement("div",{className:"okNumberDisplayContent"},p<0n&&h,n.createElement("span",{className:"okNumberDisplayText"},function(e,n,r,t){let o;if(null!=e){const i=e>=0n?e:-e,a=Number(n),l=i.toString(r).padStart(a,"0");if(r===s.Decimal&&t>0){const e=a-t;if(e>0)o=l.slice(0,e)+"."+l.slice(e);else{const n="0.";o=n.padEnd(n.length-e,"0")+l}}else o=l}else o="Error";return o}(p,m,l,c)))));if(null!=i)return n.createElement(N,{...i},n.createElement("div",{style:{width:"100%"}},n.createElement(g,{...e})));n.createElement(g,{...e})}));O.displayName="NumberDisplay";m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okNumberEntry {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: var(--number-entry-padding, 6px);\r\n    justify-content: flex-end;\r\n    align-items: center;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--brand-12, #44bd84);\r\n    background: var(--Light, #fff);\r\n\r\n    /* Content Style */\r\n    .okNumberEntryContent {\r\n        display: flex;\r\n        height: auto; /*32px;*/\r\n        justify-content: flex-end;\r\n        align-items: center;\r\n        gap: var(--spacing-0, 0px);\r\n        align-self: stretch;\r\n    }\r\n\r\n    /* Text Style */\r\n    .okNumberEntryText {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        font-family: Monaco;\r\n        font-size: var(--number-entry-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: var(--number-entry-line-height, 12px); /* 100% */\r\n        letter-spacing: 1.26px;\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --number-entry-padding: 1px 6px;\r\n        --number-entry-font-size: 12px;\r\n        --number-entry-line-height: 12px;\r\n    }\r\n\r\n    /* Sizes 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --number-entry-padding: 1px 10px;\r\n        --number-entry-font-size: 14px;\r\n        --number-entry-line-height: 14px;\r\n    }\r\n\r\n    /* Sizes 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --number-entry-padding: 1px 18px;\r\n        --number-entry-font-size: 20px;\r\n        --number-entry-line-height: 20px;\r\n    }\r\n}\r\n\r\n.okNumberEntry[data-disabled="true"] {\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    opacity: 0.5;\r\n    background: var(--Gray-3, #e7ebef);\r\n\r\n    pointer-events: none;\r\n}\r\n');m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okDigitEntry {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 1px;\r\n\r\n    /* Content Style */\r\n    .okDigitEntryContent {\r\n        /* Layout */\r\n        display: flex;\r\n        padding: var(--spacing-xxs, 2px);\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n\r\n        /* Style */\r\n        border-radius: 1px;\r\n\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        font-family: Monaco;\r\n        font-size: var(--digit-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: var(--digit-line-height, 12px); /* 200% */\r\n        letter-spacing: 1.26px;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    /* Increment Indicator Style */\r\n    .okDigitEntryIncrementIndicator {\r\n        visibility: hidden;\r\n    }\r\n\r\n    /* Decrement Indicator Style */\r\n    .okDigitEntryDecrementIndicator {\r\n        visibility: hidden;\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --digit-font-size: 12px;\r\n        --digit-line-height: 12px;\r\n    }\r\n\r\n    /* Sizes 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --digit-font-size: 14px;\r\n        --digit-line-height: 14px;\r\n    }\r\n\r\n    /* Sizes 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --digit-font-size: 20px;\r\n        --digit-line-height: 20px;\r\n    }\r\n}\r\n\r\ndiv.okDigitEntry:focus {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 1px;\r\n\r\n    /* Style */\r\n    outline: none;\r\n    overscroll-behavior: none;\r\n\r\n    /* Content Style */\r\n    .okDigitEntryContent {\r\n        /* Layout */\r\n        display: flex;\r\n        padding: var(--spacing-xxs, 2px);\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n\r\n        /* Style */\r\n        border-radius: 1px;\r\n        background: var(--brand-12, #44bd84);\r\n\r\n        /* Typography */\r\n        color: var(--Light, #fff);\r\n        text-align: center;\r\n        font-family: Monaco;\r\n        font-size: var(--digit-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: var(--digit-line-height, 12px); /* 200% */\r\n        letter-spacing: 1.26px;\r\n    }\r\n\r\n    .okDigitEntryIncrementIndicator {\r\n        visibility: visible;\r\n    }\r\n\r\n    .okDigitEntryDecrementIndicator {\r\n        visibility: visible;\r\n    }\r\n\r\n    .okDigitEntryIncrementIndicator[data-enabled="false"] {\r\n        opacity: 0.25;\r\n    }\r\n\r\n    .okDigitEntryDecrementIndicator[data-enabled="false"] {\r\n        opacity: 0.25;\r\n    }\r\n}\r\n');const T=e=>{const r=n.useRef(null),{className:t,variant:i="standard",size:a=1,value:l,maximum:c,minimum:u,numeralSystem:d=s.Decimal,onValueChanged:f}=e,p=n.useRef(l);p.current=e.value;const m=n.useRef(f);m.current=f;n.useEffect((()=>{const e=e=>{e.deltaY<0?(m.current?.(p.current+1,!1),e.stopPropagation(),e.preventDefault()):e.deltaY>0&&(m.current?.(p.current-1,!1),e.stopPropagation(),e.preventDefault())};return r.current?.addEventListener("wheel",e,{passive:!1}),()=>{r.current?.removeEventListener("wheel",e)}}),[r]);const h=null==c||l<c,g=null==u||l>u;return n.createElement("div",{className:o("okDigitEntry",t,"ok-r-size-"+a),ref:r,tabIndex:-1,onMouseEnter:e=>e.currentTarget.focus(),onMouseLeave:e=>e.currentTarget.blur(),onKeyDown:e=>{let n=!1;switch(e.key){case"ArrowUp":f?.(l+1,!1),n=!0;break;case"ArrowDown":f?.(l-1,!1),n=!0;break;case"ArrowRight":{const r=e.currentTarget.nextElementSibling;r?.focus(),n=!0}break;case"ArrowLeft":{const r=e.currentTarget.previousElementSibling;r?.focus(),n=!0}break;default:n=!1}if(n)e.stopPropagation(),e.preventDefault();else{const n=parseInt(e.key,d);if(!Number.isNaN(n)){f?.(n,!0);const r=e.currentTarget.nextElementSibling;r?.focus()}}}},n.createElement((()=>{let e;switch(i){case"standard":e=n.createElement(E,{className:o("okDigitEntryIncrementIndicator"),direction:w.Up,color:"#343434","data-enabled":h});break;case"compact":e=n.createElement(S,{className:o("okDigitEntryIncrementIndicator"),color:"#343434","data-enabled":h});break;default:e=null}return e}),null),n.createElement("div",{className:o("okDigitEntryContent","ok-r-size-"+a)},Math.abs(l).toString(Number(d))),n.createElement((()=>{let e;switch(i){case"standard":e=n.createElement(E,{className:o("okDigitEntryDecrementIndicator"),direction:w.Down,color:"#343434","data-enabled":g});break;case"compact":e=n.createElement(S,{className:o("okDigitEntryDecrementIndicator"),color:"#343434","data-enabled":g});break;default:e=null}return e}),null))};T.displayName="DigitEntry";const z=e=>{const{variant:r="standard",size:t=1,numeralSystem:i,decimalScale:a=0,digitStates:l,onDigitStatesChange:c}=e;return n.createElement(n.Fragment,null,(()=>{const e=l.map(((e,o)=>n.createElement(T,{key:"digit-"+e.id,variant:r,size:t,numeralSystem:i,value:e.value,maximum:e.maximum,minimum:e.minimum,onValueChanged:(e,n)=>{const r=[...l];r[o]={...l[o],value:e},c?.(r,n)}})));if(i===s.Decimal&&a>0){const r=a-e.length;if(r<0)e.splice(a,0,n.createElement("span",{key:"digit-decimal-point",className:o("okNumberEntryText","ok-r-size-"+t)},"."));else{const i="0.",a=i.padEnd(i.length+r,"0");e.push(n.createElement("span",{key:"digit-decimal-prefix",className:o("okNumberEntryText","ok-r-size-"+t)},a))}}return e.reverse()})())};z.displayName="NumberEntryDigits";const D=n.forwardRef(((e,r)=>{const{label:t,tooltip:o,...i}=e,a=null!=t,l=null!=o;return a&&l?n.createElement(N,{...t},n.createElement(g,{content:o},n.createElement("div",{style:{width:"100%"}},n.createElement(P,{ref:r,...i})))):a?n.createElement(N,{...t},n.createElement("div",{style:{width:"100%"}},n.createElement(P,{ref:r,...i}))):l?n.createElement(g,{content:o},n.createElement("div",null,n.createElement(P,{ref:r,...i}))):n.createElement(P,{ref:r,...i})}));D.displayName="NumberEntry";const P=n.forwardRef(((e,r)=>{const{className:t,variant:i="standard",size:a=1,disabled:l=!1,numeralSystem:c=s.Decimal,decimalScale:d=0,maximumValue:f,minimumValue:p,value:m,onValueChange:h}=e,g=n.useMemo((()=>{const e=u.ComputeDigitCountFromValue(f,c),n=u.ComputeDigitCountFromValue(p,c);return Number(e>n?e:n)}),[f,p,c]),y=BigInt(c),b=j(m,f,p,y,g);return n.createElement("div",{ref:r,className:o("okNumberEntry",t,"ok-r-size-"+a),"data-disabled":l||void 0},n.createElement("div",{className:"okNumberEntryContent"},m<0n&&(e=>n.createElement("span",{className:o("okNumberEntryText","ok-r-size-"+e)},"-"))(a),n.createElement(z,{variant:i,size:a,numeralSystem:c,decimalScale:d,digitStates:b,onDigitStatesChange:(e,n)=>{let r=L(e,y);r>=0n!=m>=0n&&0n!==r&&(r+=2n*-m),r<=f&&r>=p&&h?.(r)}})))}));P.displayName="NumberEntryImpl";const L=(e,n)=>{const r=e.length-1;let t=BigInt(e[r].value);for(let o=r-1;o>=0;o--)t=t*n+BigInt(e[o].value);return t},j=(e,n,r,t,o)=>{const i=[];let a=e,l=n-e,s=r-e;for(let e=0;e<o;e++){const n=Number(a%t),r=Math.floor(Number(l+BigInt(n))),o=Math.ceil(Number(s+BigInt(n)));i[e]={id:e,value:n,maximum:R(r,Number(t)),minimum:R(o,Number(t))},a/=t,l/=t,s/=t}return i},R=(e,n)=>{let r;return r=e>=0?e<n?e:void 0:e>-n?e:void 0,r};m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okRangeSlider {\r\n    --range-slider-thumb-outline-size: 2px;\r\n    --range-slider-thumb-border-size: 2px;\r\n    --range-slider-thumb-size: 22px;\r\n    --range-slider-track-size: 8px;\r\n\r\n    /* Layout */\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    gap: 4px;\r\n    align-self: stretch;\r\n    width: 100%;\r\n    height: fit-content;\r\n\r\n    /* Typography */\r\n    color: var(--Dark, #343434);\r\n    text-align: right;\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 12px;\r\n    font-style: normal;\r\n    font-weight: 400;\r\n    line-height: 12px; /* 100% */\r\n}\r\n\r\n/* State Disabled */\r\n.okRangeSlider[data-disabled="true"] {\r\n    opacity: 0.5;\r\n}\r\n\r\n.okRangeSliderLabel {\r\n    width: 100%;\r\n}\r\n\r\n.okRangeSliderRoot {\r\n    /* Layout */\r\n    position: relative;\r\n    display: flex;\r\n    align-items: center;\r\n    width: 100%;\r\n    height: var(--range-slider-thumb-size);\r\n    min-width: 100px;\r\n\r\n    /* Style */\r\n    user-select: none;\r\n    touch-action: none;\r\n}\r\n\r\n.okRangeSliderTrack {\r\n    /* Layout */\r\n    position: relative;\r\n    flex-grow: 1;\r\n    height: var(--range-slider-track-size);\r\n\r\n    /* Style */\r\n    background: var(--Gray-2, #d0d7df);\r\n    border-radius: 9999px;\r\n}\r\n\r\n.okRangeSliderRange {\r\n    /* Layout */\r\n    position: absolute;\r\n    height: 100%;\r\n\r\n    /* Style */\r\n    background-color: #44bd84;\r\n    border-radius: inherit;\r\n}\r\n\r\n.okRangeSliderThumb {\r\n    /* Layout */\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    width: calc(\r\n        var(--range-slider-thumb-size) -\r\n            (2 * (var(--range-slider-thumb-border-size) + var(--range-slider-thumb-outline-size)))\r\n    );\r\n    height: calc(\r\n        var(--range-slider-thumb-size) -\r\n            (2 * (var(--range-slider-thumb-border-size) + var(--range-slider-thumb-outline-size)))\r\n    );\r\n\r\n    /* Style */\r\n    background: var(--Base-White, #fff);\r\n    border: var(--range-slider-thumb-border-size) solid var(--brand-12, #44bd84);\r\n    border-radius: var(--range-slider-thumb-size);\r\n}\r\n\r\n.okRangeSliderThumb:hover {\r\n    background-color: #44bd84;\r\n}\r\n\r\n.okRangeSliderThumb:focus {\r\n    outline: none;\r\n    box-shadow: 0 0 0 var(--range-slider-thumb-outline-size) #d0d7df;\r\n}\r\n\r\n.okRangeSliderThumbLabel {\r\n    /* Layout */\r\n    position: absolute;\r\n    bottom: -14px;\r\n}\r\n');const A=n.forwardRef(((e,r)=>{const{label:t,tooltip:o,...i}=e,a=null!=t,l=null!=o;return a&&l?n.createElement(N,{className:"okRangeSliderLabel",...t},n.createElement(g,{content:o},n.createElement("div",{style:{width:"100%"}},n.createElement(V,{ref:r,...i})))):a?n.createElement(N,{className:"okRangeSliderLabel",...t},n.createElement("div",{style:{width:"100%"}},n.createElement(V,{ref:r,...i}))):l?n.createElement(g,{content:o},n.createElement("div",{style:{width:"100%"}},n.createElement(V,{ref:r,...i}))):n.createElement(V,{ref:r,...i})}));A.displayName="RangeSlider";const V=n.forwardRef(((e,r)=>{const{className:t,tooltip:a,minimumValue:l=0,maximumValue:s=100,onValueChange:c,defaultValue:u=l,value:d,valueStep:f=1,showThumbLabel:p=!0,showTrackLabels:m=!0,disabled:h=!1}=e,y=d??u,[b,v]=n.useState([y]);n.useEffect((()=>{v([y])}),[y]);const x=n.useCallback((e=>{v([e]),c?.(e)}),[c]),w=()=>n.createElement(i.Track,{className:"okRangeSliderTrack"},n.createElement(i.Range,{className:"okRangeSliderRange"})),E=null!=a;return n.createElement("div",{className:o("okRangeSlider",t),"data-disabled":h||void 0},m?n.createElement("span",null,l):null,n.createElement(i.Root,{ref:r,min:l,max:s,step:f,value:b,onValueChange:e=>x(e[0]),orientation:"horizontal",className:"okRangeSliderRoot",disabled:h},E?n.createElement(g,{content:a},n.createElement(w,null)):n.createElement(w,null),n.createElement(i.Thumb,{className:"okRangeSliderThumb"},p?n.createElement("div",{className:"okRangeSliderThumbLabel"},b):null)),m?n.createElement("span",null,s):null)}));V.displayName="RangeSliderImpl";const B=n.createContext({label:{text:"",horizontalPosition:"right",verticalPosition:"top"},size:1,value:void 0}),F=e=>{const{label:r,children:t,size:o=1,tooltip:i,value:l,...s}=e;return n.createElement(a.Root,{value:l,...s},n.createElement(B.Provider,{value:n.useMemo((()=>({label:r,size:o,tooltip:i,value:l})),[r,o,i,l])},t))};F.displayName="SelectEntryRoot";m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryContent {\r\n    /* Layout */\r\n    width: var(--radix-select-trigger-width);\r\n    max-height: var(--radix-select-content-available-height);\r\n    display: flex;\r\n    padding: 10px 18px;\r\n    flex-direction: column;\r\n    overflow: hidden;\r\n    justify-content: center;\r\n    align-items: stretch;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    background: var(--Light, #fff);\r\n    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.24);\r\n\r\n    .okSelectEntryContentInner {\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 10px;\r\n    }\r\n\r\n    /* ScrollArea Root Style */\r\n    .okScrollArea {\r\n        display: flex;\r\n        flex-direction: column;\r\n        overflow: hidden;\r\n        width: 100%;\r\n        height: 100%;\r\n    }\r\n\r\n    /* ScrollArea Viewport Style */\r\n    .okScrollAreaViewport {\r\n        display: flex;\r\n        flex-direction: column;\r\n        width: 100%;\r\n        height: 100%;\r\n        gap: 10px;\r\n\r\n        /* Stop Chrome back/forward two-finger swipe */\r\n        overscroll-behavior-x: contain;\r\n\r\n        &:where(:focus-visible) + :where(.rt-ScrollAreaViewportFocusRing) {\r\n            position: absolute;\r\n            inset: 0;\r\n            pointer-events: none;\r\n            outline: 2px solid var(--focus-8);\r\n            outline-offset: -2px;\r\n        }\r\n    }\r\n\r\n    /* ScrollArea Scrollbar Style */\r\n    .okScrollAreaScrollbar {\r\n        display: flex;\r\n        /* Ensures no selection */\r\n        user-select: none;\r\n        /* Disable browser handling of all panning and zooming gestures on touch devices */\r\n        touch-action: none;\r\n\r\n        &:where([data-orientation="vertical"]) {\r\n            flex-direction: column;\r\n            width: 4px;\r\n        }\r\n        &:where([data-orientation="horizontal"]) {\r\n            flex-direction: row;\r\n            height: 4px;\r\n        }\r\n    }\r\n\r\n    /* ScrollArea Thumb Style */\r\n    .okScrollAreaThumb {\r\n        position: relative;\r\n\r\n        &::before {\r\n            content: "";\r\n            position: absolute;\r\n            top: 50%;\r\n            left: 50%;\r\n            transform: translate(-50%, -50%);\r\n            width: 100%;\r\n            height: 100%;\r\n            min-width: var(--space-4);\r\n            min-height: var(--space-4);\r\n        }\r\n    }\r\n}\r\n');const M=n.forwardRef(((e,r)=>{const{className:t,children:i,container:s,...c}=e,{size:u}=n.useContext(B);return n.createElement(a.Portal,{container:s},n.createElement(a.Content,{sideOffset:4,...c,ref:r,className:o("okSelectEntryContent",t,"ok-r-size-"+u),position:"popper",align:"start"},n.createElement(l.Root,{type:"auto",className:"okScrollArea"},n.createElement(a.Viewport,{asChild:!0},n.createElement(l.Viewport,{className:"okScrollAreaViewport"},n.createElement("div",{className:"okSelectEntryContentInner"},i))),n.createElement(l.Scrollbar,{className:"okScrollAreaScrollbar",orientation:"vertical"},n.createElement(l.Thumb,{className:"okScrollAreaThumb"})))))}));M.displayName="SelectEntryContent";m("/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryGroup {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: 0px;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: flex-start;\r\n    align-self: stretch;\r\n    gap: 10px;\r\n}\r\n");const G=n.forwardRef(((e,r)=>n.createElement(a.Group,{...e,ref:r,className:o("okSelectEntryGroup",e.className)})));G.displayName="SelectEntryGroup";m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryItem {\r\n    /* Layout */\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 4px;\r\n\r\n    /* Style */\r\n    color: var(--Dark, #343434);\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 14px;\r\n    font-style: normal;\r\n    font-weight: 400;\r\n    line-height: 14px; /* 100% */\r\n\r\n    /* Indicator Style */\r\n    .okSelectEntryItemIndicator {\r\n        width: 14px;\r\n        height: 14px;\r\n    }\r\n}\r\n\r\n.okSelectEntryItem[data-disabled] {\r\n    opacity: 0.5;\r\n    pointer-events: none;\r\n}\r\n.okSelectEntryItem[data-highlighted] {\r\n    outline: none;\r\n}\r\n');const W=n.forwardRef(((e,r)=>{const{className:t,children:i,...l}=e,{size:s,value:u}=n.useContext(B);return n.createElement(a.Item,{...l,ref:r,className:o("okSelectEntryItem",t,"ok-r-size-"+s)},n.createElement(I,{state:u===e.value?c.On:c.Off}),n.createElement(a.ItemText,null,i))}));W.displayName="SelectEntryItem";m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryLabel {\r\n    /* Typography */\r\n    color: var(--Gray-1, #989da3);\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 10px;\r\n    font-style: normal;\r\n    font-weight: 300;\r\n    line-height: 12px; /* 120% */\r\n}\r\n');const U=n.forwardRef(((e,r)=>{const{className:t,...i}=e,{size:l}=n.useContext(B);return n.createElement(a.Label,{...i,ref:r,className:o("okSelectEntryLabel",t,"ok-r-size-"+l)})}));U.displayName="SelectEntryLabel";m("/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntrySeparator {\r\n    height: 1px;\r\n\r\n    background: #d0d7df;\r\n}\r\n");const K=n.forwardRef(((e,r)=>n.createElement(a.Separator,{...e,ref:r,className:o("okSelectEntrySeparator",e.className)})));K.displayName="SelectEntrySeparator";m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryTrigger {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: 0px 18px;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    gap: 8px;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    background: var(--Light, #fff);\r\n\r\n    /* Typography */\r\n    color: var(--Dark, #343434);\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 14px;\r\n    font-style: normal;\r\n    font-weight: 400;\r\n    line-height: 14px; /* 100% */\r\n\r\n    /* State Disabled */\r\n    &:is(:disabled) {\r\n        opacity: 0.5;\r\n        background: var(--Gray-3, #e7ebef);\r\n    }\r\n}\r\n\r\n.okSelectEntryTriggerInner {\r\n    /* Layout */\r\n    padding: 10px 0px;\r\n\r\n    /* Style */\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\r\n}\r\n\r\n/* State Disabled */\r\n.okSelectEntryTrigger[data-disabled="true"] {\r\n    opacity: 0.5;\r\n}\r\n');const Q=n.forwardRef(((e,t)=>{const{label:o,tooltip:i,...a}=r(B),l=null!=o,s=null!=i;return l&&s?n.createElement(N,{...o},n.createElement(g,{content:i},n.createElement(X,{ref:t,...e,style:{width:"100%"}}))):l?n.createElement(N,{...o},n.createElement(X,{ref:t,...a,style:{width:"100%"}})):s?n.createElement(g,{content:i},n.createElement("div",null,n.createElement(X,{ref:t,...a}))):n.createElement(X,{ref:t,...a})}));Q.displayName="SelectEntryTrigger";const X=n.forwardRef(((e,r)=>{const{className:t,placeholder:i,...l}=e,{size:s}=n.useContext(B);return n.createElement(a.Trigger,{asChild:!0},n.createElement("button",{...l,ref:r,className:o("okSelectEntryTrigger",t,"ok-r-size-"+s)},n.createElement("span",{className:"okSelectEntryTriggerInner"},n.createElement(a.Value,{placeholder:i})),n.createElement(a.Icon,{asChild:!0},n.createElement(x,{direction:v.Down}))))}));X.displayName="SelectEntryTriggerImpl";const Y=Object.assign({},{Root:F,Trigger:Q,Content:M,Item:W,Group:G,Label:U,Separator:K});m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okToggle {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    padding: var(--toggle-padding, 6px 12px);\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 4px;\r\n\r\n    color: var(--base-white, #fff);\r\n\r\n    /* Style */\r\n    border-width: 0px;\r\n    border-radius: 4px;\r\n    background: var(--brand-12, #44bd84);\r\n\r\n    /* Typography */\r\n    color: var(--Base-White, #fff);\r\n    text-align: center;\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: var(--toggle-font-size, 12px);\r\n    font-style: normal;\r\n    font-weight: 600;\r\n    line-height: 12px; /* 100% */\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --toggle-padding: 6px 12px;\r\n        --toggle-font-size: 12px;\r\n        --toggle-line-height: 12px;\r\n    }\r\n\r\n    /* Size 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --toggle-padding: 10px 18px;\r\n        --toggle-font-size: 14px;\r\n        --toggle-line-height: 14px;\r\n    }\r\n\r\n    /* Size 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --toggle-padding: 18px 22px;\r\n        --toggle-font-size: 20px;\r\n        --toggle-line-height: 20px;\r\n    }\r\n}\r\n\r\n/* State Disabled */\r\n.okToggle[data-disabled="true"] {\r\n    background: var(--Gray-2, #d0d7df);\r\n}\r\n\r\n/* State On */\r\n.okToggle[data-state="on"]:not([data-disabled="true"]) {\r\n    background: #329466;\r\n}\r\n\r\n/* State Off */\r\n.okToggle[data-state="off"]:not([data-disabled="true"]) {\r\n    background: var(--brand-12, #44bd84);\r\n}\r\n');const Z=n.forwardRef(((e,r)=>{const{className:t,size:i=1,disabled:a=!1,tooltip:l,state:s,children:u,onToggleStateChanged:d,...f}=e,p=n.useMemo((()=>{switch(s){case c.On:return"on";case c.Off:return"off";default:return"indeterminate"}}),[s]),m=n.useCallback((()=>{const e=s===c.On?c.Off:c.On;d?.(e)}),[s]);return n.createElement("button",{"data-disabled":a||void 0,ref:r,...f,className:o("okToggle",t,"ok-r-size-"+i),"data-state":p,onClick:m},u)}));Z.displayName="Toggle";m('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okToggleSwitchRoot {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 4px;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n\r\n    /* Switch Style */\r\n    .okToggleSwitch {\r\n        /* Layout */\r\n        display: flex;\r\n        width: var(--toggle-switch-width, 16.5px);\r\n        height: var(--toggle-switch-height, 9px);\r\n        padding: var(--toggle-switch-padding, 0.75px);\r\n        align-items: center;\r\n\r\n        /* Style */\r\n        border-width: 0px;\r\n        border-radius: var(--toggle-switch-border-radius, 4.5px);\r\n        background: var(--Gray-2, #d0d7df);\r\n\r\n        /* Switch Icon Style */\r\n        .okIndicatorIcon {\r\n            width: var(--toggle-switch-icon-width, 9px);\r\n            height: var(--toggle-switch-icon-height, 9px);\r\n        }\r\n    }\r\n\r\n    /* Label Style */\r\n    .okToggleSwitchLabel {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n        font-size: var(--toggle-switch-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 500;\r\n        line-height: var(--toggle-switch-line-height, 12px); /* 100% */\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --toggle-switch-width: 16.5px;\r\n        --toggle-switch-height: 9px;\r\n\r\n        --toggle-switch-padding: 0.75px;\r\n        --toggle-switch-border-radius: 4.5px;\r\n\r\n        --toggle-switch-font-size: 12px;\r\n        --toggle-switch-line-height: 12px;\r\n\r\n        --toggle-switch-icon-width: 7.5px;\r\n        --toggle-switch-icon-height: 7.5px;\r\n    }\r\n\r\n    /* Sizes 2*/\r\n    &:where(.ok-r-size-2) {\r\n        --toggle-switch-width: 18.333px;\r\n        --toggle-switch-height: 10px;\r\n\r\n        --toggle-switch-padding: 0.883px;\r\n        --toggle-switch-border-radius: 5px;\r\n\r\n        --toggle-switch-font-size: 14px;\r\n        --toggle-switch-line-height: 14px;\r\n\r\n        --toggle-switch-icon-width: 8.33px;\r\n        --toggle-switch-icon-height: 8.33px;\r\n    }\r\n\r\n    /* Sizes 3*/\r\n    &:where(.ok-r-size-3) {\r\n        --toggle-switch-width: 27.5px;\r\n        --toggle-switch-height: 15px;\r\n\r\n        --toggle-switch-padding: 1.25px;\r\n        --toggle-switch-border-radius: 7.5px;\r\n\r\n        --toggle-switch-font-size: 20px;\r\n        --toggle-switch-line-height: 20px;\r\n\r\n        --toggle-switch-icon-width: 12.5px;\r\n        --toggle-switch-icon-height: 12.5px;\r\n    }\r\n}\r\n\r\n/* State Disabled */\r\n.okToggleSwitchRoot[data-disabled="true"] {\r\n    opacity: 0.5;\r\n}\r\n\r\n/* State On */\r\n.okToggleSwitch[data-state="on"] {\r\n    justify-content: flex-end;\r\n}\r\n\r\n.okToggleSwitch[data-state="on"]:not([data-disabled="true"]) {\r\n    background: var(--brand-12, #44bd84);\r\n}\r\n\r\n/* State Off */\r\n.okToggleSwitch[data-state="off"] {\r\n    justify-content: flex-start;\r\n}\r\n\r\n.okToggleSwitch[data-state="off"]:not([data-disabled="true"]) {\r\n    background: var(--Gray-2, #d0d7df);\r\n}\r\n');const H=n.forwardRef(((e,r)=>{const{className:t,size:i=1,label:a,disabled:l=!1,state:s,...c}=e,u=y(n.createElement("span",{className:o("okToggleSwitchRoot",t,"ok-r-size-"+i),"data-disabled":l||void 0},n.createElement(Z,{className:o("okToggleSwitch"),ref:r,...c,size:i,disabled:l,state:s},n.createElement(_,{className:"okIndicatorIcon",state:s})),n.createElement("span",{className:o("okToggleSwitchLabel")},a)));return n.createElement(u,{...e})}));function $(e){if(e.__esModule)return e;var n=e.default;if("function"==typeof n){var r=function e(){return this instanceof e?Reflect.construct(n,arguments,this.constructor):n.apply(this,arguments)};r.prototype=n.prototype}else r={};return Object.defineProperty(r,"__esModule",{value:!0}),Object.keys(e).forEach((function(n){var t=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,t.get?t:{enumerable:!0,get:function(){return e[n]}})})),r}H.displayName="ToggleSwitch";var q={};Object.defineProperty(q,"__esModule",{value:!0}),q.Subscription=void 0;var J=function(){function e(e){var n=this;this._cancel=e.cancel,this.name=e.sub.name;var r=e.sub.cancel;e.sub.cancel=function(){n._cancel=null,r()}}return Object.defineProperty(e.prototype,"live",{get:function(){return!!this._cancel},enumerable:!1,configurable:!0}),e.prototype.cancel=function(){return!!this._cancel&&(this._cancel(),this._cancel=null,!0)},e}();q.Subscription=J;var ee={},ne=function(e,n){return ne=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,n){e.__proto__=n}||function(e,n){for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])},ne(e,n)};function re(e,n){if("function"!=typeof n&&null!==n)throw new TypeError("Class extends value "+String(n)+" is not a constructor or null");function r(){this.constructor=e}ne(e,n),e.prototype=null===n?Object.create(n):(r.prototype=n.prototype,new r)}var te=function(){return te=Object.assign||function(e){for(var n,r=1,t=arguments.length;r<t;r++)for(var o in n=arguments[r])Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o]);return e},te.apply(this,arguments)};function oe(e,n){var r={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&n.indexOf(t)<0&&(r[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(t=Object.getOwnPropertySymbols(e);o<t.length;o++)n.indexOf(t[o])<0&&Object.prototype.propertyIsEnumerable.call(e,t[o])&&(r[t[o]]=e[t[o]])}return r}function ie(e,n,r,t){var o,i=arguments.length,a=i<3?n:null===t?t=Object.getOwnPropertyDescriptor(n,r):t;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,n,r,t);else for(var l=e.length-1;l>=0;l--)(o=e[l])&&(a=(i<3?o(a):i>3?o(n,r,a):o(n,r))||a);return i>3&&a&&Object.defineProperty(n,r,a),a}function ae(e,n){return function(r,t){n(r,t,e)}}function le(e,n,r,t,o,i){function a(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var l,s=t.kind,c="getter"===s?"get":"setter"===s?"set":"value",u=!n&&e?t.static?e:e.prototype:null,d=n||(u?Object.getOwnPropertyDescriptor(u,t.name):{}),f=!1,p=r.length-1;p>=0;p--){var m={};for(var h in t)m[h]="access"===h?{}:t[h];for(var h in t.access)m.access[h]=t.access[h];m.addInitializer=function(e){if(f)throw new TypeError("Cannot add initializers after decoration has completed");i.push(a(e||null))};var g=(0,r[p])("accessor"===s?{get:d.get,set:d.set}:d[c],m);if("accessor"===s){if(void 0===g)continue;if(null===g||"object"!=typeof g)throw new TypeError("Object expected");(l=a(g.get))&&(d.get=l),(l=a(g.set))&&(d.set=l),(l=a(g.init))&&o.unshift(l)}else(l=a(g))&&("field"===s?o.unshift(l):d[c]=l)}u&&Object.defineProperty(u,t.name,d),f=!0}function se(e,n,r){for(var t=arguments.length>2,o=0;o<n.length;o++)r=t?n[o].call(e,r):n[o].call(e);return t?r:void 0}function ce(e){return"symbol"==typeof e?e:"".concat(e)}function ue(e,n,r){return"symbol"==typeof n&&(n=n.description?"[".concat(n.description,"]"):""),Object.defineProperty(e,"name",{configurable:!0,value:r?"".concat(r," ",n):n})}function de(e,n){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,n)}function fe(e,n,r,t){return new(r||(r=Promise))((function(o,i){function a(e){try{s(t.next(e))}catch(e){i(e)}}function l(e){try{s(t.throw(e))}catch(e){i(e)}}function s(e){var n;e.done?o(e.value):(n=e.value,n instanceof r?n:new r((function(e){e(n)}))).then(a,l)}s((t=t.apply(e,n||[])).next())}))}function pe(e,n){var r,t,o,i={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]},a=Object.create(("function"==typeof Iterator?Iterator:Object).prototype);return a.next=l(0),a.throw=l(1),a.return=l(2),"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function l(l){return function(s){return function(l){if(r)throw new TypeError("Generator is already executing.");for(;a&&(a=0,l[0]&&(i=0)),i;)try{if(r=1,t&&(o=2&l[0]?t.return:l[0]?t.throw||((o=t.return)&&o.call(t),0):t.next)&&!(o=o.call(t,l[1])).done)return o;switch(t=0,o&&(l=[2&l[0],o.value]),l[0]){case 0:case 1:o=l;break;case 4:return i.label++,{value:l[1],done:!1};case 5:i.label++,t=l[1],l=[0];continue;case 7:l=i.ops.pop(),i.trys.pop();continue;default:if(!(o=i.trys,(o=o.length>0&&o[o.length-1])||6!==l[0]&&2!==l[0])){i=0;continue}if(3===l[0]&&(!o||l[1]>o[0]&&l[1]<o[3])){i.label=l[1];break}if(6===l[0]&&i.label<o[1]){i.label=o[1],o=l;break}if(o&&i.label<o[2]){i.label=o[2],i.ops.push(l);break}o[2]&&i.ops.pop(),i.trys.pop();continue}l=n.call(e,i)}catch(e){l=[6,e],t=0}finally{r=o=0}if(5&l[0])throw l[1];return{value:l[0]?l[1]:void 0,done:!0}}([l,s])}}}var me=Object.create?function(e,n,r,t){void 0===t&&(t=r);var o=Object.getOwnPropertyDescriptor(n,r);o&&!("get"in o?!n.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return n[r]}}),Object.defineProperty(e,t,o)}:function(e,n,r,t){void 0===t&&(t=r),e[t]=n[r]};function he(e,n){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(n,r)||me(n,e,r)}function ge(e){var n="function"==typeof Symbol&&Symbol.iterator,r=n&&e[n],t=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&t>=e.length&&(e=void 0),{value:e&&e[t++],done:!e}}};throw new TypeError(n?"Object is not iterable.":"Symbol.iterator is not defined.")}function ye(e,n){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var t,o,i=r.call(e),a=[];try{for(;(void 0===n||n-- >0)&&!(t=i.next()).done;)a.push(t.value)}catch(e){o={error:e}}finally{try{t&&!t.done&&(r=i.return)&&r.call(i)}finally{if(o)throw o.error}}return a}function be(){for(var e=[],n=0;n<arguments.length;n++)e=e.concat(ye(arguments[n]));return e}function ve(){for(var e=0,n=0,r=arguments.length;n<r;n++)e+=arguments[n].length;var t=Array(e),o=0;for(n=0;n<r;n++)for(var i=arguments[n],a=0,l=i.length;a<l;a++,o++)t[o]=i[a];return t}function xe(e,n,r){if(r||2===arguments.length)for(var t,o=0,i=n.length;o<i;o++)!t&&o in n||(t||(t=Array.prototype.slice.call(n,0,o)),t[o]=n[o]);return e.concat(t||Array.prototype.slice.call(n))}function we(e){return this instanceof we?(this.v=e,this):new we(e)}function Ee(e,n,r){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var t,o=r.apply(e,n||[]),i=[];return t=Object.create(("function"==typeof AsyncIterator?AsyncIterator:Object).prototype),a("next"),a("throw"),a("return",(function(e){return function(n){return Promise.resolve(n).then(e,c)}})),t[Symbol.asyncIterator]=function(){return this},t;function a(e,n){o[e]&&(t[e]=function(n){return new Promise((function(r,t){i.push([e,n,r,t])>1||l(e,n)}))},n&&(t[e]=n(t[e])))}function l(e,n){try{(r=o[e](n)).value instanceof we?Promise.resolve(r.value.v).then(s,c):u(i[0][2],r)}catch(e){u(i[0][3],e)}var r}function s(e){l("next",e)}function c(e){l("throw",e)}function u(e,n){e(n),i.shift(),i.length&&l(i[0][0],i[0][1])}}function Se(e){var n,r;return n={},t("next"),t("throw",(function(e){throw e})),t("return"),n[Symbol.iterator]=function(){return this},n;function t(t,o){n[t]=e[t]?function(n){return(r=!r)?{value:we(e[t](n)),done:!1}:o?o(n):n}:o}}function ke(e){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var n,r=e[Symbol.asyncIterator];return r?r.call(e):(e=ge(e),n={},t("next"),t("throw"),t("return"),n[Symbol.asyncIterator]=function(){return this},n);function t(r){n[r]=e[r]&&function(n){return new Promise((function(t,o){(function(e,n,r,t){Promise.resolve(t).then((function(n){e({value:n,done:r})}),n)})(t,o,(n=e[r](n)).done,n.value)}))}}}function Ie(e,n){return Object.defineProperty?Object.defineProperty(e,"raw",{value:n}):e.raw=n,e}var _e=Object.create?function(e,n){Object.defineProperty(e,"default",{enumerable:!0,value:n})}:function(e,n){e.default=n},Ce=function(e){return Ce=Object.getOwnPropertyNames||function(e){var n=[];for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(n[n.length]=r);return n},Ce(e)};function Ne(e){if(e&&e.__esModule)return e;var n={};if(null!=e)for(var r=Ce(e),t=0;t<r.length;t++)"default"!==r[t]&&me(n,e,r[t]);return _e(n,e),n}function Oe(e){return e&&e.__esModule?e:{default:e}}function Te(e,n,r,t){if("a"===r&&!t)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof n?e!==n||!t:!n.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?t:"a"===r?t.call(e):t?t.value:n.get(e)}function ze(e,n,r,t,o){if("m"===t)throw new TypeError("Private method is not writable");if("a"===t&&!o)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof n?e!==n||!o:!n.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===t?o.call(e,r):o?o.value=r:n.set(e,r),r}function De(e,n){if(null===n||"object"!=typeof n&&"function"!=typeof n)throw new TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?n===e:e.has(n)}function Pe(e,n,r){if(null!=n){if("object"!=typeof n&&"function"!=typeof n)throw new TypeError("Object expected.");var t,o;if(r){if(!Symbol.asyncDispose)throw new TypeError("Symbol.asyncDispose is not defined.");t=n[Symbol.asyncDispose]}if(void 0===t){if(!Symbol.dispose)throw new TypeError("Symbol.dispose is not defined.");t=n[Symbol.dispose],r&&(o=t)}if("function"!=typeof t)throw new TypeError("Object not disposable.");o&&(t=function(){try{o.call(this)}catch(e){return Promise.reject(e)}}),e.stack.push({value:n,dispose:t,async:r})}else r&&e.stack.push({async:!0});return n}var Le="function"==typeof SuppressedError?SuppressedError:function(e,n,r){var t=new Error(r);return t.name="SuppressedError",t.error=e,t.suppressed=n,t};function je(e){function n(n){e.error=e.hasError?new Le(n,e.error,"An error was suppressed during disposal."):n,e.hasError=!0}var r,t=0;return function o(){for(;r=e.stack.pop();)try{if(!r.async&&1===t)return t=0,e.stack.push(r),Promise.resolve().then(o);if(r.dispose){var i=r.dispose.call(r.value);if(r.async)return t|=2,Promise.resolve(i).then(o,(function(e){return n(e),o()}))}else t|=1}catch(e){n(e)}if(1===t)return e.hasError?Promise.reject(e.error):Promise.resolve();if(e.hasError)throw e.error}()}function Re(e,n){return"string"==typeof e&&/^\.\.?\//.test(e)?e.replace(/\.(tsx)$|((?:\.d)?)((?:\.[^./]+?)?)\.([cm]?)ts$/i,(function(e,r,t,o,i){return r?n?".jsx":".js":!t||o&&i?t+o+"."+i.toLowerCase()+"js":e})):e}var Ae={__extends:re,__assign:te,__rest:oe,__decorate:ie,__param:ae,__esDecorate:le,__runInitializers:se,__propKey:ce,__setFunctionName:ue,__metadata:de,__awaiter:fe,__generator:pe,__createBinding:me,__exportStar:he,__values:ge,__read:ye,__spread:be,__spreadArrays:ve,__spreadArray:xe,__await:we,__asyncGenerator:Ee,__asyncDelegator:Se,__asyncValues:ke,__makeTemplateObject:Ie,__importStar:Ne,__importDefault:Oe,__classPrivateFieldGet:Te,__classPrivateFieldSet:ze,__classPrivateFieldIn:De,__addDisposableResource:Pe,__disposeResources:je,__rewriteRelativeImportExtension:Re},Ve=$(Object.freeze({__proto__:null,__addDisposableResource:Pe,get __assign(){return te},__asyncDelegator:Se,__asyncGenerator:Ee,__asyncValues:ke,__await:we,__awaiter:fe,__classPrivateFieldGet:Te,__classPrivateFieldIn:De,__classPrivateFieldSet:ze,__createBinding:me,__decorate:ie,__disposeResources:je,__esDecorate:le,__exportStar:he,__extends:re,__generator:pe,__importDefault:Oe,__importStar:Ne,__makeTemplateObject:Ie,__metadata:de,__param:ae,__propKey:ce,__read:ye,__rest:oe,__rewriteRelativeImportExtension:Re,__runInitializers:se,__setFunctionName:ue,__spread:be,__spreadArray:xe,__spreadArrays:ve,__values:ge,default:Ae})),Be={},Fe={},Me={};Object.defineProperty(Me,"__esModule",{value:!0}),Me.Private=void 0;var Ge=function(){function e(){this.propMap=new WeakMap}return e.prototype.get=function(e){return this.propMap.get(e)},e.prototype.set=function(e,n){this.propMap.set(e,n)},e}();Me.Private=Ge,function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.Private=void 0;var n=Me;Object.defineProperty(e,"Private",{enumerable:!0,get:function(){return n.Private}})}(Fe),Object.defineProperty(Be,"__esModule",{value:!0}),Be.EventConsumer=void 0;var We=new Fe.Private,Ue=function(){function e(e){We.set(this,e)}return Object.defineProperty(e.prototype,"count",{get:function(){return We.get(this).count},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"maxSubs",{get:function(){return We.get(this).maxSubs},enumerable:!1,configurable:!0}),e.prototype.subscribe=function(e,n){return We.get(this).subscribe(e,n)},e.prototype.once=function(e,n){return We.get(this).once(e,n)},e.prototype.toPromise=function(e){return We.get(this).toPromise(e)},e.prototype.getStat=function(e){return We.get(this).getStat(e)},e}();Be.EventConsumer=Ue,Object.defineProperty(ee,"__esModule",{value:!0}),ee.SubEvent=ee.EmitSchedule=void 0;var Ke,Qe=Ve,Xe=q,Ye=Be;!function(e){e.sync="sync",e.async="async",e.next="next"}(Ke||(ee.EmitSchedule=Ke={}));var Ze=function(){function e(e){if(this._subs=[],"object"!=typeof(null!=e?e:{}))throw new TypeError(He.errInvalidOptions);this.options=null!=e?e:{}}return Object.defineProperty(e.prototype,"lastEvent",{get:function(){return this._lastEvent},enumerable:!1,configurable:!0}),e.prototype.toConsumer=function(){return new Ye.EventConsumer(this)},e.prototype.subscribe=function(e,n){if("object"!=typeof(null!=n?n:{}))throw new TypeError(He.errInvalidOptions);var r={event:this,cb:e=n&&"thisArg"in n?e.bind(n.thisArg):e,name:null==n?void 0:n.name,cancel:function(){"function"==typeof(null==n?void 0:n.onCancel)&&n.onCancel()}};if("function"==typeof this.options.onSubscribe){var t={event:r.event,name:r.name,data:r.data};this.options.onSubscribe(t),r.data=t.data}return this._subs.push(r),new Xe.Subscription({cancel:this._createCancel(r),sub:r})},e.prototype.once=function(e,n){var r=this.subscribe((function(t){return r.cancel(),e.call(null==n?void 0:n.thisArg,t)}),n);return r},e.prototype.emit=function(e,n){var r,t=this;if("object"!=typeof(null!=n?n:{}))throw new TypeError(He.errInvalidOptions);var o=null!==(r=null==n?void 0:n.schedule)&&void 0!==r?r:Ke.sync,i="function"==typeof(null==n?void 0:n.onFinished)&&n.onFinished,a="function"==typeof(null==n?void 0:n.onError)&&n.onError,l=o===Ke.sync?He.callNow:He.callNext,s=o===Ke.async?He.callNext:He.callNow,c=function(n){t._lastEvent=e,i&&i(n)};return l((function(){var n=t._getRecipients();n.forEach((function(r,t){return s((function(){if(a)try{var o=r.cb&&r.cb(e);o&&"function"==typeof o.catch&&o.catch((function(e){return a(e,r.name)}))}catch(e){a(e,r.name)}else r.cb&&r.cb(e);t===n.length-1&&c(n.length)}))})),n.length||c(0)})),this},Object.defineProperty(e.prototype,"count",{get:function(){return this._subs.length},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"maxSubs",{get:function(){var e;return null!==(e=this.options.maxSubs)&&void 0!==e?e:0},enumerable:!1,configurable:!0}),e.prototype.getStat=function(e){var n,r={named:{},unnamed:0};this._subs.forEach((function(e){e.name?e.name in r.named?r.named[e.name]++:r.named[e.name]=1:r.unnamed++}));var t=null!==(n=e&&e.minUse)&&void 0!==n?n:0;if(t>1)for(var o in r.named)r.named[o]<t&&delete r.named[o];return r},e.prototype.cancelAll=function(){var e="function"==typeof this.options.onCancel&&this.options.onCancel,n=e?Qe.__spreadArray([],this._subs,!0):[],r=this._subs.length;return this._subs.forEach((function(e){e.cancel(),e.cb=void 0})),this._subs.length=0,e&&n.forEach((function(n){e({event:n.event,name:n.name,data:n.data})})),r},e.prototype.toPromise=function(e){var n=this;if("object"!=typeof(null!=e?e:{}))throw new TypeError(He.errInvalidOptions);var r,t=e||{},o=t.name,i=t.timeout,a=void 0===i?-1:i,l=!1;return new Promise((function(e,t){var i=n.subscribe((function(n){r&&clearTimeout(r),l=!0,i.cancel(),e(n)}),{name:o,onCancel:function(){l||(r&&clearTimeout(r),t(new Error(o?'Event "'.concat(o,'" cancelled.'):"Event cancelled.")))}});Number.isInteger(a)&&a>=0&&(r=setTimeout((function(){l=!0,i.cancel(),t(new Error(o?'Event "'.concat(o,'" timed out.'):"Event timed out."))}),a))}))},e.prototype._getRecipients=function(){var e=this.maxSubs>0?this.maxSubs:this._subs.length;return this._subs.slice(0,e)},e.prototype._createCancel=function(e){var n=this;return function(){n._cancelSub(e)}},e.prototype._cancelSub=function(e){if(this._subs.splice(this._subs.indexOf(e),1),e.cancel(),e.cb=void 0,"function"==typeof this.options.onCancel){var n={event:e.event,name:e.name,data:e.data};this.options.onCancel(n)}},e}();ee.SubEvent=Ze;var He=function(){function e(){}return e.errInvalidOptions='Invalid "options" parameter.',e.callNext="undefined"==typeof process?setTimeout:process.nextTick,e.callNow=function(e){return e()},e}(),$e={};Object.defineProperty($e,"__esModule",{value:!0}),$e.SubEventCount=void 0;var qe=Ve,Je=ee,en=function(e){function n(n){var r=e.call(this,n)||this;r.onCount=new Je.SubEvent;var t=n&&n.emitOptions;return r._notify=function(e){return r.onCount.emit(e,t)},r}return qe.__extends(n,e),n.prototype.cancelAll=function(){var n=this.count;return n&&(e.prototype.cancelAll.call(this),this._notify({newCount:0,prevCount:n})),n},n.prototype._createCancel=function(e){var n=this,r=this._subs;return this._notify({newCount:r.length,prevCount:r.length-1}),function(){n._cancelSub(e),n._notify({newCount:r.length,prevCount:r.length+1})}},n}(Je.SubEvent);$e.SubEventCount=en,function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.EventConsumer=e.SubEventCount=e.EmitSchedule=e.SubEvent=e.Subscription=void 0;var n=q;Object.defineProperty(e,"Subscription",{enumerable:!0,get:function(){return n.Subscription}});var r=ee;Object.defineProperty(e,"SubEvent",{enumerable:!0,get:function(){return r.SubEvent}}),Object.defineProperty(e,"EmitSchedule",{enumerable:!0,get:function(){return r.EmitSchedule}});var t=$e;Object.defineProperty(e,"SubEventCount",{enumerable:!0,get:function(){return t.SubEventCount}});var o=Be;Object.defineProperty(e,"EventConsumer",{enumerable:!0,get:function(){return o.EventConsumer}})}({});const nn=31,rn=63,tn=n.forwardRef(((e,r)=>{const[t,o]=n.useState(e.minimumValue??0n),{device:i,workQueue:a}=n.useContext(f),{maximumValue:l,minimumValue:s,fpEndpoint:c,disabled:u,...p}=e,m=n.useMemo((()=>void 0!==s?function(e,n,r){let t;t=e<r?r:e>n?n:e;return t}(s,l,0n):0n),[s,l]),h=n.useMemo((()=>d(l)),[l]),g=(1n<<BigInt(h))-1n<<BigInt(c.bitOffset),y=n.useCallback((e=>{if(null!=e&&null!=a){let n=e.getWireInValue(c.epAddress),r=0xffffffffn&g,t=(BigInt(n)&r)>>BigInt(c.bitOffset);if(g>0xffffffffn){let o=32n-BigInt(c.bitOffset),i=g>>32n;for(let a=c.epAddress+1;a<=nn&&i>0n;a++)n=e.getWireInValue(a),r=0xffffffffn&i,t|=(BigInt(n)&r)<<o,o+=32n,i>>=32n}o(t)}else o(0n)}),[a,c,g]);n.useEffect((()=>{y(i)}),[i,y]);const b=n.useCallback((async e=>{null!=i&&null!=a&&await a.Post((async()=>{let n=0xffffffffn&g,r=Number(e<<BigInt(c.bitOffset)&n);if(i.setWireInValue(c.epAddress,r,Number(n)),g>0xffffffffn){let t=32n-BigInt(c.bitOffset),o=g>>32n;for(let a=c.epAddress+1;a<=nn&&o>0n;a++)n=0xffffffffn&o,r=Number(e>>t&n),i.setWireInValue(a,r,Number(n)),t+=32n,o>>=32n}await i.updateWireIns()})),y(i)}),[i,a,c,g,y]);return n.createElement(D,{...p,ref:r,disabled:u||null===i,maximumValue:l,minimumValue:m,value:t,onValueChange:b})}));tn.displayName="FrontPanelNumberEntry";m("");const on=n.forwardRef(((e,r)=>{const[t,o]=n.useState(0n),{device:i,workQueue:a,eventSource:l}=n.useContext(f),{maximumValue:s,fpEndpoint:c,...u}=e,p=n.useMemo((()=>d(s)),[s]),m=(1n<<BigInt(p))-1n<<BigInt(c.bitOffset),h=n.useCallback((e=>{if(null!=e&&null!=a){let n=e.getWireOutValue(c.epAddress),r=0xffffffffn&m,t=(BigInt(n)&r)>>BigInt(c.bitOffset);if(m>0xffffffffn){let o=32n-BigInt(c.bitOffset),i=m>>32n;for(let a=c.epAddress+1;a<=rn&&i>0n;a++)n=e.getWireOutValue(a),r=0xffffffffn&i,t|=(BigInt(n)&r)<<o,o+=32n,i>>=32n}o(t)}else o(0n)}),[a,c,m]);return n.useEffect((()=>{h(i);const e=l?.WireOutValuesChangedEvent.Subscribe(h);return()=>{e?.Cancel()}}),[i,l,h]),n.createElement(O,{...u,ref:r,maximumValue:s,minimumValue:0n,value:t})}));on.displayName="FrontPanelNumberDisplay";const an=n.forwardRef(((e,r)=>{const[t,o]=n.useState(!1),{device:i,workQueue:a,eventSource:l}=n.useContext(f),{fpEndpoint:s,...c}=e,u=1<<s.bitOffset,d=n.useCallback((e=>{if(null!=e&&null!=a){const n=e.getWireOutValue(s.epAddress);o((n&u)===u)}else o(!1)}),[a,s,u]);return n.useEffect((()=>{d(i);const e=l?.WireOutValuesChangedEvent.Subscribe(d);return()=>{e?.Cancel()}}),[i,l,d]),n.createElement(C,{...c,ref:r,state:t})}));an.displayName="FrontPanelIndicator";const ln=n.forwardRef(((e,r)=>{const{device:t,workQueue:o}=n.useContext(f),{fpEndpoint:i,disabled:a,...l}=e,s=1<<i.bitOffset,c=n.useCallback((async()=>{null!=t&&null!=o&&await o.Post((async()=>{t.setWireInValue(i.epAddress,0,s),await t.updateWireIns()}))}),[t,o,i,s,o]),u=n.useCallback((async()=>{null!=t&&null!=o&&await o.Post((async()=>{t.setWireInValue(i.epAddress,4294967295,s),await t.updateWireIns()}))}),[t,o,i,s,o]);return n.createElement(b,{...l,ref:r,disabled:a||null==t,onButtonUp:c,onButtonDown:u})}));ln.displayName="FrontPanelPushButton";const sn=n.forwardRef(((e,r)=>{const[t,o]=n.useState(c.Off),{device:i,workQueue:a}=n.useContext(f),{fpEndpoint:l,disabled:s,...u}=e,d=1<<l.bitOffset,p=n.useCallback((e=>{if(null!=e&&null!=a){const n=(e.getWireInValue(l.epAddress)&d)===d?c.On:c.Off;o(n)}else o(c.Off)}),[a,l,d]),m=n.useCallback((async e=>{null!=i&&null!=a&&await a.Post((async()=>{const n=e===c.On?4294967295:0;i.setWireInValue(l.epAddress,n,d),await i.updateWireIns()})),p(i)}),[i,a,l,d]);return n.useEffect((()=>{p(i)}),[i,p]),n.createElement(H,{ref:r,...u,disabled:s||null==i,state:t,onToggleStateChanged:m})}));sn.displayName="FrontPanelToggleSwitch";m("");const cn=n.forwardRef(((e,r)=>{const{device:t,workQueue:o}=n.useContext(f),{fpEndpoint:i,disabled:a,...l}=e,s=n.useCallback((async()=>{null!=t&&null!=o&&await o.Post((async()=>{await t.activateTriggerIn(i.epAddress,i.bitOffset)}))}),[t,o,i]);return n.createElement(b,{...l,ref:r,disabled:a||null==t,onButtonDown:s})}));cn.displayName="FrontPanelTriggerButton";const un=n.forwardRef(((e,r)=>{const[t,o]=n.useState(0n),{device:i,workQueue:a}=n.useContext(f),{fpEndpoint:l,maximumValue:s,disabled:c,...u}=e,p=n.useMemo((()=>d(BigInt(s))),[s]),m=(1n<<BigInt(p))-1n<<BigInt(l.bitOffset),h=n.useCallback((e=>{if(null!=e&&null!=a){const n=e.getWireInValue(l.epAddress),r=(BigInt(n)&m)>>BigInt(l.bitOffset);o(r)}else o(0n)}),[a,l,m]),g=n.useCallback((e=>{null!=i&&null!=a&&a.Post((async()=>{i.setWireInValue(l.epAddress,e<<l.bitOffset,Number(m)),await i.updateWireIns()}))}),[i,a,l,a,m]);return n.useEffect((()=>{h(i)}),[i,h]),n.createElement(A,{...u,ref:r,disabled:c||null==i,defaultValue:Number(t),maximumValue:s,onValueChange:g})}));un.displayName="FrontPanelRangeSlider";const dn=e=>{const[r,t]=n.useState(0n),{device:o,workQueue:i}=n.useContext(f),{fpEndpoint:a,maximumValue:l,disabled:s,...c}=e,u=n.useMemo((()=>d(l)),[l]),p=(1n<<BigInt(u))-1n<<BigInt(a.bitOffset),m=n.useCallback((e=>{if(null!=e&&null!=i){let n=e.getWireInValue(a.epAddress),r=0xffffffffn&p,o=(BigInt(n)&r)>>BigInt(a.bitOffset);if(p>0xffffffffn){let t=32n-BigInt(a.bitOffset),i=p>>32n;for(let l=a.epAddress+1;l<=nn&&i>0n;l++)n=e.getWireInValue(l),r=0xffffffffn&i,o|=(BigInt(n)&r)<<t,t+=32n,i>>=32n}t(o)}else t(0n)}),[i,a,p]),h=n.useCallback((e=>{if(null!=o&&null!=i){const n=BigInt(e);i.Post((async()=>{let e=0xffffffffn&p,r=Number(n<<BigInt(a.bitOffset)&e);if(o.setWireInValue(a.epAddress,r,Number(e)),p>0xffffffffn){let t=32n-BigInt(a.bitOffset),i=p>>32n;const l=32-a.epAddress;for(let s=1;s<l&&i>0n;s++)e=0xffffffffn&i,r=Number(n>>t&e),o.setWireInValue(a.epAddress+s,r,Number(e)),t+=32n,i>>=32n}await o.updateWireIns()}))}m(o)}),[o,i,a,m]);return n.useEffect((()=>{m(o)}),[o,m]),n.createElement(Y.Root,{...c,disabled:s||null==o,value:r.toString(),onValueChange:h})};dn.displayName="FrontPanelSelectEntryRoot";const fn=Object.assign({},{Root:dn,Trigger:Q,Content:M,Item:W,Group:G,Label:U,Separator:K});export{h as Application,b as Button,d as CalculateBitLength,p as FrontPanel,f as FrontPanelContext,an as FrontPanelIndicator,on as FrontPanelNumberDisplay,tn as FrontPanelNumberEntry,ln as FrontPanelPushButton,un as FrontPanelRangeSlider,fn as FrontPanelSelectEntry,dn as FrontPanelSelectEntryRoot,sn as FrontPanelToggleSwitch,cn as FrontPanelTriggerButton,C as Indicator,N as Label,O as NumberDisplay,D as NumberEntry,s as NumeralSystem,u as NumericDigits,A as RangeSlider,Y as SelectEntry,M as SelectEntryContent,G as SelectEntryGroup,W as SelectEntryItem,U as SelectEntryLabel,F as SelectEntryRoot,K as SelectEntrySeparator,Q as SelectEntryTrigger,Z as Toggle,c as ToggleState,H as ToggleSwitch,g as Tooltip};
+import*as e from"react";import n,{useContext as r}from"react";import*as t from"@radix-ui/react-tooltip";import a from"classnames";import*as i from"@radix-ui/react-slider";import*as o from"@radix-ui/react-select";import*as l from"@radix-ui/react-scroll-area";import{WIREIN_ADDRESS_RANGE as s,WIREOUT_ADDRESS_RANGE as c}from"@opalkelly/frontpanel-alloy-core";var d,f;!function(e){e[e.Binary=2]="Binary",e[e.Octal=8]="Octal",e[e.Decimal=10]="Decimal",e[e.Hexadecimal=16]="Hexadecimal"}(d||(d={})),function(e){e[e.Off=0]="Off",e[e.On=1]="On"}(f||(f={}));class u{get DigitCount(){return this._DigitCount}get NumeralSystem(){return this._NumeralSystem}get DigitChars(){return this._DigitChars}constructor(e,n){this._DigitCount=e,this._NumeralSystem=n,this._DigitChars=u.GetDigitChars(n)}GetDigitFromValue(e){let n=e%this._NumeralSystem;return n<0&&(n+=this._NumeralSystem),n.toString(this._NumeralSystem)}static GetDigitChars(e){let n;switch(e){case d.Binary:n=u.BINARY_DIGITVALUES;break;case d.Octal:n=u.OCTAL_DIGITVALUES;break;case d.Decimal:n=u.DECIMAL_DIGITVALUES;break;case d.Hexadecimal:n=u.HEXADECIMAL_DIGITVALUES;break;default:n=[]}return n}static ComputeDigitCountFromBits(e,n){const r=(1n<<BigInt(e))-1n;return this.ComputeDigitCountFromValue(r,n)}static ComputeDigitCountFromValue(e,n){const r=BigInt(n);let t,a=e;for(t=0n;t<u.MAX_DIGITS&&0n!==a;t++)a/=r;return t>0n?t:1n}}function p(e){let n=0;if(e>0n){let r=e;for(;r>0n;)r>>=1n,n++}else 0n===e&&(n=1);return n}u.MAX_DIGITS=1024,u.BINARY_DIGITVALUES=["0","1"],u.OCTAL_DIGITVALUES=["0","1","2","3","4","5","6","7"],u.DECIMAL_DIGITVALUES=[...u.OCTAL_DIGITVALUES,"8","9"],u.HEXADECIMAL_DIGITVALUES=[...u.DECIMAL_DIGITVALUES,"A","B","C","D","E","F"];const m=n.createContext({}),g=e=>{const{device:r,workQueue:t,eventSource:a}=e;return n.createElement(m.Provider,{value:{device:r,workQueue:t,eventSource:a}},e.children)};function h(e,n){void 0===n&&(n={});var r=n.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===r&&t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}g.displayName="FrontPanel";h("");const y=e.forwardRef(((n,r)=>e.createElement(t.Provider,null,n.children)));y.displayName="Application";h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n@font-face {\r\n    font-family: "Inter";\r\n    src: url("./fonts/Inter-VariableFont_slnt\\,wght.ttf") format("truetype");\r\n}\r\n');h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okButton {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    padding: var(--button-padding, 6px 12px);\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 8px;\r\n\r\n    /* Style */\r\n    border-width: 0px;\r\n    border-radius: 4px;\r\n    background: var(--brand-12, #44bd84);\r\n\r\n    /* Typography */\r\n    color: var(--Base-White, #fff);\r\n    text-align: center;\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: var(--button-font-size, 12px);\r\n    font-style: normal;\r\n    font-weight: 600;\r\n    line-height: var(--button-line-height, 12px); /* 100% */\r\n\r\n    /* State Pressed */\r\n    &:is(:active) {\r\n        background: #329466;\r\n    }\r\n\r\n    /* State Disabled */\r\n    &:is(:disabled) {\r\n        background: var(--Gray-2, #d0d7df);\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --button-padding: 6px 12px;\r\n        --button-font-size: 12px;\r\n        --button-line-height: 12px;\r\n    }\r\n\r\n    /* Sizes 2*/\r\n    &:where(.ok-r-size-2) {\r\n        --button-padding: 10px 18px;\r\n        --button-font-size: 14px;\r\n        --button-line-height: 14px;\r\n    }\r\n\r\n    /* Sizes 3*/\r\n    &:where(.ok-r-size-3) {\r\n        --button-padding: 18px 22px;\r\n        --button-font-size: 20px;\r\n        --button-line-height: 20px;\r\n    }\r\n}\r\n');h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okTooltipContent {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: 10px;\r\n    align-items: flex-end;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    background: var(--Dark, #343434);\r\n\r\n    /* Drop shadow - tiny */\r\n    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.24);\r\n\r\n    user-select: none;\r\n    animation-duration: 200ms;\r\n    animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);\r\n    will-change: transform, opacity;\r\n}\r\n\r\n.okTooltipContent[data-state="delayed-open"][data-side="top"] {\r\n    animation-name: slideDownAndFade;\r\n}\r\n.okTooltipContent[data-state="delayed-open"][data-side="right"] {\r\n    animation-name: slideLeftAndFade;\r\n}\r\n.okTooltipContent[data-state="delayed-open"][data-side="bottom"] {\r\n    animation-name: slideUpAndFade;\r\n}\r\n.okTooltipContent[data-state="delayed-open"][data-side="left"] {\r\n    animation-name: slideRightAndFade;\r\n}\r\n\r\n.okTooltipText {\r\n    /* Typography */\r\n    color: var(--Light, #fff);\r\n    text-align: center;\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 12px;\r\n    font-style: normal;\r\n    font-weight: 400;\r\n    line-height: 12px; /* 100% */\r\n}\r\n\r\n@keyframes slideUpAndFade {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateY(2px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n}\r\n\r\n@keyframes slideRightAndFade {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateX(-2px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateX(0);\r\n    }\r\n}\r\n\r\n@keyframes slideDownAndFade {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateY(-2px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n}\r\n\r\n@keyframes slideLeftAndFade {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateX(2px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateX(0);\r\n    }\r\n}\r\n');const x=n.forwardRef(((e,r)=>{const{children:i,className:o,open:l,defaultOpen:s,onOpenChange:c,delayDuration:d,disableHoverableContent:f,content:u,container:p,forceMount:m,...g}=e,h={open:l,defaultOpen:s,onOpenChange:c,delayDuration:d,disableHoverableContent:f};return n.createElement(t.Root,{...h},n.createElement(t.Trigger,{asChild:!0},i),n.createElement(t.Portal,{container:p,forceMount:m},n.createElement(t.Content,{sideOffset:4,collisionPadding:10,...g,ref:r,className:a("okTooltipContent",o)},n.createElement("p",{className:"okTooltipText"},u))))}));function b(e){return function(r){return null!=r.tooltip?n.createElement(x,{content:r.tooltip},e):e}}x.displayName="Tooltip";const w=n.forwardRef(((e,r)=>{const{className:t,label:i,size:o=1,onButtonUp:l,onButtonDown:s,onButtonClick:c,...d}=e,f=b(n.createElement("button",{"data-disabled":d.disabled||void 0,...d,ref:r,className:a("okButton",t,"ok-r-size-"+o),onMouseDown:s,onMouseUp:l,onClick:c},i));return n.createElement(f,{...e})}));w.displayName="Button";var E;h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okIndicator {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    padding: var(--indicator-padding, 6px 12px);\r\n    justify-content: flex-start;\r\n    align-items: baseline;\r\n    gap: 4px;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    background: var(--Light, #fff);\r\n\r\n    /* Indicator Icon Style */\r\n    svg.okIndicatorIcon {\r\n        width: var(--indicator-icon-width, 9px);\r\n        height: var(--indicator-icon-height, 9px);\r\n    }\r\n\r\n    /* Label Style */\r\n    .okIndicatorLabel {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        /* TODO: Determine how to get Inter font */\r\n        font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n        font-size: var(--indicator-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 500;\r\n        line-height: var(--indicator-line-height, 12px); /* 100% */\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --indicator-padding: 6px 12px;\r\n        --indicator-font-size: 12px;\r\n        --indicator-line-height: 12px;\r\n        --indicator-icon-width: 9px;\r\n        --indicator-icon-height: 9px;\r\n    }\r\n\r\n    /* Sizes 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --indicator-padding: 10px 18px;\r\n        --indicator-font-size: 14px;\r\n        --indicator-line-height: 14px;\r\n        --indicator-icon-width: 10px;\r\n        --indicator-icon-height: 10px;\r\n    }\r\n\r\n    /* Sizes 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --indicator-padding: 18px 22px;\r\n        --indicator-font-size: 20px;\r\n        --indicator-line-height: 20px;\r\n        --indicator-icon-width: 15px;\r\n        --indicator-icon-height: 15px;\r\n    }\r\n}\r\n'),function(e){e[e.Up=0]="Up",e[e.Down=1]="Down"}(E||(E={}));const S=e.forwardRef(((n,r)=>{const{direction:t=E.Down,color:a="#343434",...i}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"8",viewBox:"0 0 12 8",fill:"none",...i,ref:r},((n,r)=>{let t;return n===E.Up||E.Down,t=e.createElement("path",{d:"M6.75593 7.12713C6.35716 7.58759 5.64284 7.58759 5.24407 7.12713L2.23682 3.65465C1.67594 3.00701 2.136 2 2.99275 2L9.00725 2C9.864 2 10.3241 3.00701 9.76318 3.65465L6.75593 7.12713Z",fill:r}),t})(t,a))}));var k;S.displayName="ChevronIcon",function(e){e[e.Up=0]="Up",e[e.Down=1]="Down"}(k||(k={}));const v=e.forwardRef(((n,r)=>{const{direction:t=k.Down,color:a="#343434",...i}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"10",height:"4",viewBox:"0 0 10 4",fill:"none",...i,ref:r},((n,r)=>{let t;switch(n){case k.Up:t=e.createElement("path",{d:"M5 5.1656e-07L10 4L0 4L5 5.1656e-07Z",fill:r});break;case k.Down:t=e.createElement("path",{d:"M5 4L0 0L10 8.88334e-07L5 4Z",fill:r});break;default:t=e.createElement("path",{d:"M5 5.1656e-07L10 4L0 4L5 5.1656e-07Z",fill:r})}return t})(t,a))}));v.displayName="IndicatorArrowIcon";const I=e.forwardRef(((n,r)=>{const{color:t="#343434",...a}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"10",height:"1",viewBox:"0 0 10 1",fill:"none",...a,ref:r},e.createElement("path",{d:"M8.74228e-08 -8.74228e-07L10 -9.53674e-07L10 1L0 0.999999L8.74228e-08 -8.74228e-07Z",fill:t}))}));I.displayName="IndicatorBarIcon";const N=e.forwardRef(((n,r)=>{const{state:t,color:a="#D0D7DF",colorOnState:i="#44BD84",colorOffState:o="#D0D7DF"}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",...n,ref:r},((n,r,t,a)=>{let i;switch(n){case f.On:i=e.createElement("path",{d:"M5 10C7.76142 10 10 7.76142 10 5C10 2.23858 7.76142 0 5 0C2.23858 0 0 2.23858 0 5C0 7.76142 2.23858 10 5 10Z",fill:t});break;case f.Off:i=e.createElement("path",{d:"M5 10C7.76142 10 10 7.76142 10 5C10 2.23858 7.76142 0 5 0C2.23858 0 0 2.23858 0 5C0 7.76142 2.23858 10 5 10Z",fill:a});break;default:i=e.createElement("path",{d:"M5 10C7.76142 10 10 7.76142 10 5C10 2.23858 7.76142 0 5 0C2.23858 0 0 2.23858 0 5C0 7.76142 2.23858 10 5 10Z",fill:r})}return i})(t,a,i,o))}));N.displayName="IndicatorStateIcon";const C=e.forwardRef(((n,r)=>{const{state:t,color:a="#343434",colorOnState:i="#44BD84",...o}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",...o,ref:r},((n,r,t)=>{let a;switch(n){case f.On:a=e.createElement(e.Fragment,null,e.createElement("circle",{cx:"7",cy:"7",r:"6",stroke:r,strokeWidth:"2"}),e.createElement("circle",{cx:"7",cy:"7",r:"3",fill:t}));break;case f.Off:default:a=e.createElement("circle",{cx:"7",cy:"7",r:"6",stroke:r,strokeWidth:"2"})}return a})(t,a,i))}));C.displayName="RadioToggleStateIcon";const z=e.forwardRef(((n,r)=>{const{state:t,color:a="white",colorOnState:i="white",colorOffState:o="white",...l}=n;return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"8",height:"8",viewBox:"0 0 8 8",fill:"none",...l,ref:r},((n,r,t,a)=>{let i;switch(n){case f.On:i=e.createElement("circle",{cx:"4",cy:"4",r:"3.75",fill:t});break;case f.Off:i=e.createElement("circle",{cx:"4",cy:"4",r:"3.75",fill:a});break;default:i=e.createElement("circle",{cx:"4",cy:"4",r:"3.75",fill:r})}return i})(t,a,i,o))}));z.displayName="SwitchToggleStateIcon";const T=n.forwardRef(((e,r)=>{const{className:t,label:i,size:o=1,state:l,...s}=e,c=b(n.createElement("span",{...s,ref:r,className:a("okIndicator",t,"ok-r-size-"+o)},n.createElement(N,{className:"okIndicatorIcon",state:l?f.On:f.Off}),n.createElement("span",{className:a("okIndicatorLabel")},i)));return n.createElement(c,{...e})}));T.displayName="Indicator";h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okLabel {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    flex-direction: column;\r\n    align-items: flex-start;\r\n    gap: 4px;\r\n\r\n    /* Text Style */\r\n    .okLabelText {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n        font-size: 12px;\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: 12px; /* 100% */\r\n    }\r\n\r\n    /* Label Position Left Top*/\r\n    &:where(.ok-pos-left-top) {\r\n        flex-direction: column;\r\n        align-items: flex-start;\r\n    }\r\n\r\n    /* Label Position Left Bottom*/\r\n    &:where(.ok-pos-left-bottom) {\r\n        flex-direction: column-reverse;\r\n        align-items: flex-start;\r\n    }\r\n\r\n    /* Label Position Right Top*/\r\n    &:where(.ok-pos-right-top) {\r\n        flex-direction: column;\r\n        align-items: flex-end;\r\n    }\r\n\r\n    /* Label Position Right Bottom*/\r\n    &:where(.ok-pos-right-bottom) {\r\n        flex-direction: column-reverse;\r\n        align-items: flex-end;\r\n    }\r\n}\r\n');const D=n.forwardRef(((e,r)=>{const{className:t,text:i,horizontalPosition:o="left",verticalPosition:l="top",children:s,...c}=e;return n.createElement("div",{...c,ref:r,className:a("okLabel",t,"ok-pos-"+o+"-"+l)},n.createElement("span",{className:a("okLabelText")},i),s)}));D.displayName="Label";h("/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okNumberDisplay {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: var(--number-display-padding, 6px 12px);\r\n    justify-content: flex-end;\r\n    align-items: center;\r\n    gap: 4px;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    background: #f5f5f5;\r\n\r\n    /* Content Style */\r\n    .okNumberDisplayContent {\r\n        display: flex;\r\n        padding: var(--spacing-0, 0px);\r\n        align-items: center;\r\n        justify-content: flex-end;\r\n        gap: 8px;\r\n        flex: 1 0 0;\r\n    }\r\n\r\n    /* Text Style */\r\n    .okNumberDisplayText {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        font-family: Monaco;\r\n        font-size: var(--number-display-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: var(--number-display-line-height, 12px); /* 100% */\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --number-display-padding: 6px 6px;\r\n        --number-display-font-size: 12px;\r\n        --number-display-line-height: 12px;\r\n    }\r\n\r\n    /* Sizes 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --number-display-padding: 6px 10px;\r\n        --number-display-font-size: 14px;\r\n        --number-display-line-height: 14px;\r\n    }\r\n\r\n    /* Sizes 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --number-display-padding: 6px 18px;\r\n        --number-display-font-size: 20px;\r\n        --number-display-line-height: 20px;\r\n    }\r\n}\r\n");const L=n.forwardRef(((e,r)=>{const{className:t,label:i,size:o=1,numeralSystem:l=d.Decimal,decimalScale:s=0,maximumValue:c,minimumValue:f,value:p}=e,m=n.useMemo((()=>{const e=u.ComputeDigitCountFromValue(c,l),n=u.ComputeDigitCountFromValue(f,l);return e>n?e:n}),[c,f,l]),g=n.useMemo((()=>n.createElement("span",{className:a("okNumberDisplayText","ok-r-size-"+o)},"-")),[o]),h=b(n.createElement("div",{ref:r,className:a("okNumberDisplay",t,"ok-r-size-"+o)},n.createElement("div",{className:"okNumberDisplayContent"},p<0n&&g,n.createElement("span",{className:"okNumberDisplayText"},function(e,n,r,t){let a;if(null!=e){const i=e>=0n?e:-e,o=Number(n),l=i.toString(r).padStart(o,"0");if(r===d.Decimal&&t>0){const e=o-t;if(e>0)a=l.slice(0,e)+"."+l.slice(e);else{const n="0.";a=n.padEnd(n.length-e,"0")+l}}else a=l}else a="Error";return a}(p,m,l,s)))));if(null!=i)return n.createElement(D,{...i},n.createElement("div",{style:{width:"100%"}},n.createElement(h,{...e})));n.createElement(h,{...e})}));L.displayName="NumberDisplay";h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okNumberEntry {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: var(--number-entry-padding, 6px);\r\n    justify-content: flex-end;\r\n    align-items: center;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--brand-12, #44bd84);\r\n    background: var(--Light, #fff);\r\n\r\n    /* Content Style */\r\n    .okNumberEntryContent {\r\n        display: flex;\r\n        height: auto; /*32px;*/\r\n        justify-content: flex-end;\r\n        align-items: center;\r\n        gap: var(--spacing-0, 0px);\r\n        align-self: stretch;\r\n    }\r\n\r\n    /* Text Style */\r\n    .okNumberEntryText {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        font-family: Monaco;\r\n        font-size: var(--number-entry-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: var(--number-entry-line-height, 12px); /* 100% */\r\n        letter-spacing: 1.26px;\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --number-entry-padding: 1px 6px;\r\n        --number-entry-font-size: 12px;\r\n        --number-entry-line-height: 12px;\r\n    }\r\n\r\n    /* Sizes 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --number-entry-padding: 1px 10px;\r\n        --number-entry-font-size: 14px;\r\n        --number-entry-line-height: 14px;\r\n    }\r\n\r\n    /* Sizes 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --number-entry-padding: 1px 18px;\r\n        --number-entry-font-size: 20px;\r\n        --number-entry-line-height: 20px;\r\n    }\r\n}\r\n\r\n.okNumberEntry[data-disabled="true"] {\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    opacity: 0.5;\r\n    background: var(--Gray-3, #e7ebef);\r\n\r\n    pointer-events: none;\r\n}\r\n');h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okDigitEntry {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 1px;\r\n\r\n    /* Content Style */\r\n    .okDigitEntryContent {\r\n        /* Layout */\r\n        display: flex;\r\n        padding: var(--spacing-xxs, 2px);\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n\r\n        /* Style */\r\n        border-radius: 1px;\r\n\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        font-family: Monaco;\r\n        font-size: var(--digit-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: var(--digit-line-height, 12px); /* 200% */\r\n        letter-spacing: 1.26px;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    /* Increment Indicator Style */\r\n    .okDigitEntryIncrementIndicator {\r\n        visibility: hidden;\r\n    }\r\n\r\n    /* Decrement Indicator Style */\r\n    .okDigitEntryDecrementIndicator {\r\n        visibility: hidden;\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --digit-font-size: 12px;\r\n        --digit-line-height: 12px;\r\n    }\r\n\r\n    /* Sizes 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --digit-font-size: 14px;\r\n        --digit-line-height: 14px;\r\n    }\r\n\r\n    /* Sizes 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --digit-font-size: 20px;\r\n        --digit-line-height: 20px;\r\n    }\r\n}\r\n\r\ndiv.okDigitEntry:focus {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 1px;\r\n\r\n    /* Style */\r\n    outline: none;\r\n    overscroll-behavior: none;\r\n\r\n    /* Content Style */\r\n    .okDigitEntryContent {\r\n        /* Layout */\r\n        display: flex;\r\n        padding: var(--spacing-xxs, 2px);\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n\r\n        /* Style */\r\n        border-radius: 1px;\r\n        background: var(--brand-12, #44bd84);\r\n\r\n        /* Typography */\r\n        color: var(--Light, #fff);\r\n        text-align: center;\r\n        font-family: Monaco;\r\n        font-size: var(--digit-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 400;\r\n        line-height: var(--digit-line-height, 12px); /* 200% */\r\n        letter-spacing: 1.26px;\r\n    }\r\n\r\n    .okDigitEntryIncrementIndicator {\r\n        visibility: visible;\r\n    }\r\n\r\n    .okDigitEntryDecrementIndicator {\r\n        visibility: visible;\r\n    }\r\n\r\n    .okDigitEntryIncrementIndicator[data-enabled="false"] {\r\n        opacity: 0.25;\r\n    }\r\n\r\n    .okDigitEntryDecrementIndicator[data-enabled="false"] {\r\n        opacity: 0.25;\r\n    }\r\n}\r\n');const O=e=>{const r=n.useRef(null),{className:t,variant:i="standard",size:o=1,value:l,maximum:s,minimum:c,numeralSystem:f=d.Decimal,onValueChanged:u}=e,p=n.useRef(l);p.current=e.value;const m=n.useRef(u);m.current=u;n.useEffect((()=>{const e=e=>{e.deltaY<0?(m.current?.(p.current+1,!1),e.stopPropagation(),e.preventDefault()):e.deltaY>0&&(m.current?.(p.current-1,!1),e.stopPropagation(),e.preventDefault())};return r.current?.addEventListener("wheel",e,{passive:!1}),()=>{r.current?.removeEventListener("wheel",e)}}),[r]);const g=null==s||l<s,h=null==c||l>c;return n.createElement("div",{className:a("okDigitEntry",t,"ok-r-size-"+o),ref:r,tabIndex:-1,onMouseEnter:e=>e.currentTarget.focus(),onMouseLeave:e=>e.currentTarget.blur(),onKeyDown:e=>{let n=!1;switch(e.key){case"ArrowUp":u?.(l+1,!1),n=!0;break;case"ArrowDown":u?.(l-1,!1),n=!0;break;case"ArrowRight":{const r=e.currentTarget.nextElementSibling;r?.focus(),n=!0}break;case"ArrowLeft":{const r=e.currentTarget.previousElementSibling;r?.focus(),n=!0}break;default:n=!1}if(n)e.stopPropagation(),e.preventDefault();else{const n=parseInt(e.key,f);if(!Number.isNaN(n)){u?.(n,!0);const r=e.currentTarget.nextElementSibling;r?.focus()}}}},n.createElement((()=>{let e;switch(i){case"standard":e=n.createElement(v,{className:a("okDigitEntryIncrementIndicator"),direction:k.Up,color:"#343434","data-enabled":g});break;case"compact":e=n.createElement(I,{className:a("okDigitEntryIncrementIndicator"),color:"#343434","data-enabled":g});break;default:e=null}return e}),null),n.createElement("div",{className:a("okDigitEntryContent","ok-r-size-"+o)},Math.abs(l).toString(Number(f))),n.createElement((()=>{let e;switch(i){case"standard":e=n.createElement(v,{className:a("okDigitEntryDecrementIndicator"),direction:k.Down,color:"#343434","data-enabled":h});break;case"compact":e=n.createElement(I,{className:a("okDigitEntryDecrementIndicator"),color:"#343434","data-enabled":h});break;default:e=null}return e}),null))};O.displayName="DigitEntry";const R=e=>{const{variant:r="standard",size:t=1,numeralSystem:i,decimalScale:o=0,digitStates:l,onDigitStatesChange:s}=e;return n.createElement(n.Fragment,null,(()=>{const e=l.map(((e,a)=>n.createElement(O,{key:"digit-"+e.id,variant:r,size:t,numeralSystem:i,value:e.value,maximum:e.maximum,minimum:e.minimum,onValueChanged:(e,n)=>{const r=[...l];r[a]={...l[a],value:e},s?.(r,n)}})));if(i===d.Decimal&&o>0){const r=o-e.length;if(r<0)e.splice(o,0,n.createElement("span",{key:"digit-decimal-point",className:a("okNumberEntryText","ok-r-size-"+t)},"."));else{const i="0.",o=i.padEnd(i.length+r,"0");e.push(n.createElement("span",{key:"digit-decimal-prefix",className:a("okNumberEntryText","ok-r-size-"+t)},o))}}return e.reverse()})())};R.displayName="NumberEntryDigits";const A=n.forwardRef(((e,r)=>{const{label:t,tooltip:a,...i}=e,o=null!=t,l=null!=a;return o&&l?n.createElement(D,{...t},n.createElement(x,{content:a},n.createElement("div",{style:{width:"100%"}},n.createElement(V,{ref:r,...i})))):o?n.createElement(D,{...t},n.createElement("div",{style:{width:"100%"}},n.createElement(V,{ref:r,...i}))):l?n.createElement(x,{content:a},n.createElement("div",null,n.createElement(V,{ref:r,...i}))):n.createElement(V,{ref:r,...i})}));A.displayName="NumberEntry";const V=n.forwardRef(((e,r)=>{const{className:t,variant:i="standard",size:o=1,disabled:l=!1,numeralSystem:s=d.Decimal,decimalScale:c=0,maximumValue:f,minimumValue:p,value:m,onValueChange:g}=e,h=n.useMemo((()=>{const e=u.ComputeDigitCountFromValue(f,s),n=u.ComputeDigitCountFromValue(p,s);return Number(e>n?e:n)}),[f,p,s]),y=BigInt(s),x=P(m,f,p,y,h);return n.createElement("div",{ref:r,className:a("okNumberEntry",t,"ok-r-size-"+o),"data-disabled":l||void 0},n.createElement("div",{className:"okNumberEntryContent"},m<0n&&(e=>n.createElement("span",{className:a("okNumberEntryText","ok-r-size-"+e)},"-"))(o),n.createElement(R,{variant:i,size:o,numeralSystem:s,decimalScale:c,digitStates:x,onDigitStatesChange:(e,n)=>{let r=B(e,y);r>=0n!=m>=0n&&0n!==r&&(r+=2n*-m),r<=f&&r>=p&&g?.(r)}})))}));V.displayName="NumberEntryImpl";const B=(e,n)=>{const r=e.length-1;let t=BigInt(e[r].value);for(let a=r-1;a>=0;a--)t=t*n+BigInt(e[a].value);return t},P=(e,n,r,t,a)=>{const i=[];let o=e,l=n-e,s=r-e;for(let e=0;e<a;e++){const n=Number(o%t),r=Math.floor(Number(l+BigInt(n))),a=Math.ceil(Number(s+BigInt(n)));i[e]={id:e,value:n,maximum:F(r,Number(t)),minimum:F(a,Number(t))},o/=t,l/=t,s/=t}return i},F=(e,n)=>{let r;return r=e>=0?e<n?e:void 0:e>-n?e:void 0,r};h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okRangeSlider {\r\n    --range-slider-thumb-outline-size: 2px;\r\n    --range-slider-thumb-border-size: 2px;\r\n    --range-slider-thumb-size: 22px;\r\n    --range-slider-track-size: 8px;\r\n\r\n    /* Layout */\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    gap: 4px;\r\n    align-self: stretch;\r\n    width: 100%;\r\n    height: fit-content;\r\n\r\n    /* Typography */\r\n    color: var(--Dark, #343434);\r\n    text-align: right;\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 12px;\r\n    font-style: normal;\r\n    font-weight: 400;\r\n    line-height: 12px; /* 100% */\r\n}\r\n\r\n/* State Disabled */\r\n.okRangeSlider[data-disabled="true"] {\r\n    opacity: 0.5;\r\n}\r\n\r\n.okRangeSliderLabel {\r\n    width: 100%;\r\n}\r\n\r\n.okRangeSliderRoot {\r\n    /* Layout */\r\n    position: relative;\r\n    display: flex;\r\n    align-items: center;\r\n    width: 100%;\r\n    height: var(--range-slider-thumb-size);\r\n    min-width: 100px;\r\n\r\n    /* Style */\r\n    user-select: none;\r\n    touch-action: none;\r\n}\r\n\r\n.okRangeSliderTrack {\r\n    /* Layout */\r\n    position: relative;\r\n    flex-grow: 1;\r\n    height: var(--range-slider-track-size);\r\n\r\n    /* Style */\r\n    background: var(--Gray-2, #d0d7df);\r\n    border-radius: 9999px;\r\n}\r\n\r\n.okRangeSliderRange {\r\n    /* Layout */\r\n    position: absolute;\r\n    height: 100%;\r\n\r\n    /* Style */\r\n    background-color: #44bd84;\r\n    border-radius: inherit;\r\n}\r\n\r\n.okRangeSliderThumb {\r\n    /* Layout */\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    width: calc(\r\n        var(--range-slider-thumb-size) -\r\n            (2 * (var(--range-slider-thumb-border-size) + var(--range-slider-thumb-outline-size)))\r\n    );\r\n    height: calc(\r\n        var(--range-slider-thumb-size) -\r\n            (2 * (var(--range-slider-thumb-border-size) + var(--range-slider-thumb-outline-size)))\r\n    );\r\n\r\n    /* Style */\r\n    background: var(--Base-White, #fff);\r\n    border: var(--range-slider-thumb-border-size) solid var(--brand-12, #44bd84);\r\n    border-radius: var(--range-slider-thumb-size);\r\n}\r\n\r\n.okRangeSliderThumb:hover {\r\n    background-color: #44bd84;\r\n}\r\n\r\n.okRangeSliderThumb:focus {\r\n    outline: none;\r\n    box-shadow: 0 0 0 var(--range-slider-thumb-outline-size) #d0d7df;\r\n}\r\n\r\n.okRangeSliderThumbLabel {\r\n    /* Layout */\r\n    position: absolute;\r\n    bottom: -14px;\r\n}\r\n');const M=n.forwardRef(((e,r)=>{const{label:t,tooltip:a,...i}=e,o=null!=t,l=null!=a;return o&&l?n.createElement(D,{className:"okRangeSliderLabel",...t},n.createElement(x,{content:a},n.createElement("div",{style:{width:"100%"}},n.createElement(j,{ref:r,...i})))):o?n.createElement(D,{className:"okRangeSliderLabel",...t},n.createElement("div",{style:{width:"100%"}},n.createElement(j,{ref:r,...i}))):l?n.createElement(x,{content:a},n.createElement("div",{style:{width:"100%"}},n.createElement(j,{ref:r,...i}))):n.createElement(j,{ref:r,...i})}));M.displayName="RangeSlider";const j=n.forwardRef(((e,r)=>{const{className:t,tooltip:o,minimumValue:l=0,maximumValue:s=100,onValueChange:c,defaultValue:d=l,value:f,valueStep:u=1,showThumbLabel:p=!0,showTrackLabels:m=!0,disabled:g=!1}=e,h=f??d,[y,b]=n.useState([h]);n.useEffect((()=>{b([h])}),[h]);const w=n.useCallback((e=>{b([e]),c?.(e)}),[c]),E=()=>n.createElement(i.Track,{className:"okRangeSliderTrack"},n.createElement(i.Range,{className:"okRangeSliderRange"})),S=null!=o;return n.createElement("div",{className:a("okRangeSlider",t),"data-disabled":g||void 0},m?n.createElement("span",null,l):null,n.createElement(i.Root,{ref:r,min:l,max:s,step:u,value:y,onValueChange:e=>w(e[0]),orientation:"horizontal",className:"okRangeSliderRoot",disabled:g},S?n.createElement(x,{content:o},n.createElement(E,null)):n.createElement(E,null),n.createElement(i.Thumb,{className:"okRangeSliderThumb"},p?n.createElement("div",{className:"okRangeSliderThumbLabel"},y):null)),m?n.createElement("span",null,s):null)}));j.displayName="RangeSliderImpl";const G=n.createContext({label:{text:"",horizontalPosition:"right",verticalPosition:"top"},size:1,value:void 0}),W=e=>{const{label:r,children:t,size:a=1,tooltip:i,value:l,...s}=e;return n.createElement(o.Root,{value:l,...s},n.createElement(G.Provider,{value:n.useMemo((()=>({label:r,size:a,tooltip:i,value:l})),[r,a,i,l])},t))};W.displayName="SelectEntryRoot";h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryContent {\r\n    /* Layout */\r\n    width: var(--radix-select-trigger-width);\r\n    max-height: var(--radix-select-content-available-height);\r\n    display: flex;\r\n    padding: 10px 18px;\r\n    flex-direction: column;\r\n    overflow: hidden;\r\n    justify-content: center;\r\n    align-items: stretch;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    background: var(--Light, #fff);\r\n    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.24);\r\n\r\n    .okSelectEntryContentInner {\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 10px;\r\n    }\r\n\r\n    /* ScrollArea Root Style */\r\n    .okScrollArea {\r\n        display: flex;\r\n        flex-direction: column;\r\n        overflow: hidden;\r\n        width: 100%;\r\n        height: 100%;\r\n    }\r\n\r\n    /* ScrollArea Viewport Style */\r\n    .okScrollAreaViewport {\r\n        display: flex;\r\n        flex-direction: column;\r\n        width: 100%;\r\n        height: 100%;\r\n        gap: 10px;\r\n\r\n        /* Stop Chrome back/forward two-finger swipe */\r\n        overscroll-behavior-x: contain;\r\n\r\n        &:where(:focus-visible) + :where(.rt-ScrollAreaViewportFocusRing) {\r\n            position: absolute;\r\n            inset: 0;\r\n            pointer-events: none;\r\n            outline: 2px solid var(--focus-8);\r\n            outline-offset: -2px;\r\n        }\r\n    }\r\n\r\n    /* ScrollArea Scrollbar Style */\r\n    .okScrollAreaScrollbar {\r\n        display: flex;\r\n        /* Ensures no selection */\r\n        user-select: none;\r\n        /* Disable browser handling of all panning and zooming gestures on touch devices */\r\n        touch-action: none;\r\n\r\n        &:where([data-orientation="vertical"]) {\r\n            flex-direction: column;\r\n            width: 4px;\r\n        }\r\n        &:where([data-orientation="horizontal"]) {\r\n            flex-direction: row;\r\n            height: 4px;\r\n        }\r\n    }\r\n\r\n    /* ScrollArea Thumb Style */\r\n    .okScrollAreaThumb {\r\n        position: relative;\r\n\r\n        &::before {\r\n            content: "";\r\n            position: absolute;\r\n            top: 50%;\r\n            left: 50%;\r\n            transform: translate(-50%, -50%);\r\n            width: 100%;\r\n            height: 100%;\r\n            min-width: var(--space-4);\r\n            min-height: var(--space-4);\r\n        }\r\n    }\r\n}\r\n');const U=n.forwardRef(((e,r)=>{const{className:t,children:i,container:s,...c}=e,{size:d}=n.useContext(G);return n.createElement(o.Portal,{container:s},n.createElement(o.Content,{sideOffset:4,...c,ref:r,className:a("okSelectEntryContent",t,"ok-r-size-"+d),position:"popper",align:"start"},n.createElement(l.Root,{type:"auto",className:"okScrollArea"},n.createElement(o.Viewport,{asChild:!0},n.createElement(l.Viewport,{className:"okScrollAreaViewport"},n.createElement("div",{className:"okSelectEntryContentInner"},i))),n.createElement(l.Scrollbar,{className:"okScrollAreaScrollbar",orientation:"vertical"},n.createElement(l.Thumb,{className:"okScrollAreaThumb"})))))}));U.displayName="SelectEntryContent";h("/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryGroup {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: 0px;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: flex-start;\r\n    align-self: stretch;\r\n    gap: 10px;\r\n}\r\n");const _=n.forwardRef(((e,r)=>n.createElement(o.Group,{...e,ref:r,className:a("okSelectEntryGroup",e.className)})));_.displayName="SelectEntryGroup";h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryItem {\r\n    /* Layout */\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 4px;\r\n\r\n    /* Style */\r\n    color: var(--Dark, #343434);\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 14px;\r\n    font-style: normal;\r\n    font-weight: 400;\r\n    line-height: 14px; /* 100% */\r\n\r\n    /* Indicator Style */\r\n    .okSelectEntryItemIndicator {\r\n        width: 14px;\r\n        height: 14px;\r\n    }\r\n}\r\n\r\n.okSelectEntryItem[data-disabled] {\r\n    opacity: 0.5;\r\n    pointer-events: none;\r\n}\r\n.okSelectEntryItem[data-highlighted] {\r\n    outline: none;\r\n}\r\n');const K=n.forwardRef(((e,r)=>{const{className:t,children:i,...l}=e,{size:s,value:c}=n.useContext(G);return n.createElement(o.Item,{...l,ref:r,className:a("okSelectEntryItem",t,"ok-r-size-"+s)},n.createElement(C,{state:c===e.value?f.On:f.Off}),n.createElement(o.ItemText,null,i))}));K.displayName="SelectEntryItem";h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryLabel {\r\n    /* Typography */\r\n    color: var(--Gray-1, #989da3);\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 10px;\r\n    font-style: normal;\r\n    font-weight: 300;\r\n    line-height: 12px; /* 120% */\r\n}\r\n');const Q=n.forwardRef(((e,r)=>{const{className:t,...i}=e,{size:l}=n.useContext(G);return n.createElement(o.Label,{...i,ref:r,className:a("okSelectEntryLabel",t,"ok-r-size-"+l)})}));Q.displayName="SelectEntryLabel";h("/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntrySeparator {\r\n    height: 1px;\r\n\r\n    background: #d0d7df;\r\n}\r\n");const X=n.forwardRef(((e,r)=>n.createElement(o.Separator,{...e,ref:r,className:a("okSelectEntrySeparator",e.className)})));X.displayName="SelectEntrySeparator";h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okSelectEntryTrigger {\r\n    /* Layout */\r\n    display: flex;\r\n    padding: 0px 18px;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    gap: 8px;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n    border: 1px solid var(--Gray-2, #d0d7df);\r\n    background: var(--Light, #fff);\r\n\r\n    /* Typography */\r\n    color: var(--Dark, #343434);\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: 14px;\r\n    font-style: normal;\r\n    font-weight: 400;\r\n    line-height: 14px; /* 100% */\r\n\r\n    /* State Disabled */\r\n    &:is(:disabled) {\r\n        opacity: 0.5;\r\n        background: var(--Gray-3, #e7ebef);\r\n    }\r\n}\r\n\r\n.okSelectEntryTriggerInner {\r\n    /* Layout */\r\n    padding: 10px 0px;\r\n\r\n    /* Style */\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\r\n}\r\n\r\n/* State Disabled */\r\n.okSelectEntryTrigger[data-disabled="true"] {\r\n    opacity: 0.5;\r\n}\r\n');const Y=n.forwardRef(((e,t)=>{const{label:a,tooltip:i,...o}=r(G),l=null!=a,s=null!=i;return l&&s?n.createElement(D,{...a},n.createElement(x,{content:i},n.createElement(Z,{ref:t,...e,style:{width:"100%"}}))):l?n.createElement(D,{...a},n.createElement(Z,{ref:t,...o,style:{width:"100%"}})):s?n.createElement(x,{content:i},n.createElement("div",null,n.createElement(Z,{ref:t,...o}))):n.createElement(Z,{ref:t,...o})}));Y.displayName="SelectEntryTrigger";const Z=n.forwardRef(((e,r)=>{const{className:t,placeholder:i,...l}=e,{size:s}=n.useContext(G);return n.createElement(o.Trigger,{asChild:!0},n.createElement("button",{...l,ref:r,className:a("okSelectEntryTrigger",t,"ok-r-size-"+s)},n.createElement("span",{className:"okSelectEntryTriggerInner"},n.createElement(o.Value,{placeholder:i})),n.createElement(o.Icon,{asChild:!0},n.createElement(S,{direction:E.Down}))))}));Z.displayName="SelectEntryTriggerImpl";const H=Object.assign({},{Root:W,Trigger:Y,Content:U,Item:K,Group:_,Label:Q,Separator:X});h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okToggle {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    padding: var(--toggle-padding, 6px 12px);\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 4px;\r\n\r\n    color: var(--base-white, #fff);\r\n\r\n    /* Style */\r\n    border-width: 0px;\r\n    border-radius: 4px;\r\n    background: var(--brand-12, #44bd84);\r\n\r\n    /* Typography */\r\n    color: var(--Base-White, #fff);\r\n    text-align: center;\r\n    font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n    font-size: var(--toggle-font-size, 12px);\r\n    font-style: normal;\r\n    font-weight: 600;\r\n    line-height: 12px; /* 100% */\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --toggle-padding: 6px 12px;\r\n        --toggle-font-size: 12px;\r\n        --toggle-line-height: 12px;\r\n    }\r\n\r\n    /* Size 2 */\r\n    &:where(.ok-r-size-2) {\r\n        --toggle-padding: 10px 18px;\r\n        --toggle-font-size: 14px;\r\n        --toggle-line-height: 14px;\r\n    }\r\n\r\n    /* Size 3 */\r\n    &:where(.ok-r-size-3) {\r\n        --toggle-padding: 18px 22px;\r\n        --toggle-font-size: 20px;\r\n        --toggle-line-height: 20px;\r\n    }\r\n}\r\n\r\n/* State Disabled */\r\n.okToggle[data-disabled="true"] {\r\n    background: var(--Gray-2, #d0d7df);\r\n}\r\n\r\n/* State On */\r\n.okToggle[data-state="on"]:not([data-disabled="true"]) {\r\n    background: #329466;\r\n}\r\n\r\n/* State Off */\r\n.okToggle[data-state="off"]:not([data-disabled="true"]) {\r\n    background: var(--brand-12, #44bd84);\r\n}\r\n');const q=n.forwardRef(((e,r)=>{const{className:t,size:i=1,disabled:o=!1,tooltip:l,state:s,children:c,onToggleStateChanged:d,...u}=e,p=n.useMemo((()=>{switch(s){case f.On:return"on";case f.Off:return"off";default:return"indeterminate"}}),[s]),m=n.useCallback((()=>{const e=s===f.On?f.Off:f.On;d?.(e)}),[s]);return n.createElement("button",{"data-disabled":o||void 0,ref:r,...u,className:a("okToggle",t,"ok-r-size-"+i),"data-state":p,onClick:m},c)}));q.displayName="Toggle";h('/**\r\n * Copyright (c) 2024 Opal Kelly Incorporated\r\n *\r\n * This source code is licensed under the FrontPanel license.\r\n * See the LICENSE file found in the root directory of this project.\r\n */\r\n\r\n.okToggleSwitchRoot {\r\n    /* Layout */\r\n    display: inline-flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    gap: 4px;\r\n\r\n    /* Style */\r\n    border-radius: 4px;\r\n\r\n    /* Switch Style */\r\n    .okToggleSwitch {\r\n        /* Layout */\r\n        display: flex;\r\n        width: var(--toggle-switch-width, 16.5px);\r\n        height: var(--toggle-switch-height, 9px);\r\n        padding: var(--toggle-switch-padding, 0.75px);\r\n        align-items: center;\r\n\r\n        /* Style */\r\n        border-width: 0px;\r\n        border-radius: var(--toggle-switch-border-radius, 4.5px);\r\n        background: var(--Gray-2, #d0d7df);\r\n\r\n        /* Switch Icon Style */\r\n        .okIndicatorIcon {\r\n            width: var(--toggle-switch-icon-width, 9px);\r\n            height: var(--toggle-switch-icon-height, 9px);\r\n        }\r\n    }\r\n\r\n    /* Label Style */\r\n    .okToggleSwitchLabel {\r\n        /* Typography */\r\n        color: var(--Dark, #343434);\r\n        text-align: center;\r\n        font-family: Inter, "Nunito Sans", sans-serif, ui-sans-serif;\r\n        font-size: var(--toggle-switch-font-size, 12px);\r\n        font-style: normal;\r\n        font-weight: 500;\r\n        line-height: var(--toggle-switch-line-height, 12px); /* 100% */\r\n    }\r\n\r\n    /* Size 1 */\r\n    &:where(.ok-r-size-1) {\r\n        --toggle-switch-width: 16.5px;\r\n        --toggle-switch-height: 9px;\r\n\r\n        --toggle-switch-padding: 0.75px;\r\n        --toggle-switch-border-radius: 4.5px;\r\n\r\n        --toggle-switch-font-size: 12px;\r\n        --toggle-switch-line-height: 12px;\r\n\r\n        --toggle-switch-icon-width: 7.5px;\r\n        --toggle-switch-icon-height: 7.5px;\r\n    }\r\n\r\n    /* Sizes 2*/\r\n    &:where(.ok-r-size-2) {\r\n        --toggle-switch-width: 18.333px;\r\n        --toggle-switch-height: 10px;\r\n\r\n        --toggle-switch-padding: 0.883px;\r\n        --toggle-switch-border-radius: 5px;\r\n\r\n        --toggle-switch-font-size: 14px;\r\n        --toggle-switch-line-height: 14px;\r\n\r\n        --toggle-switch-icon-width: 8.33px;\r\n        --toggle-switch-icon-height: 8.33px;\r\n    }\r\n\r\n    /* Sizes 3*/\r\n    &:where(.ok-r-size-3) {\r\n        --toggle-switch-width: 27.5px;\r\n        --toggle-switch-height: 15px;\r\n\r\n        --toggle-switch-padding: 1.25px;\r\n        --toggle-switch-border-radius: 7.5px;\r\n\r\n        --toggle-switch-font-size: 20px;\r\n        --toggle-switch-line-height: 20px;\r\n\r\n        --toggle-switch-icon-width: 12.5px;\r\n        --toggle-switch-icon-height: 12.5px;\r\n    }\r\n}\r\n\r\n/* State Disabled */\r\n.okToggleSwitchRoot[data-disabled="true"] {\r\n    opacity: 0.5;\r\n}\r\n\r\n/* State On */\r\n.okToggleSwitch[data-state="on"] {\r\n    justify-content: flex-end;\r\n}\r\n\r\n.okToggleSwitch[data-state="on"]:not([data-disabled="true"]) {\r\n    background: var(--brand-12, #44bd84);\r\n}\r\n\r\n/* State Off */\r\n.okToggleSwitch[data-state="off"] {\r\n    justify-content: flex-start;\r\n}\r\n\r\n.okToggleSwitch[data-state="off"]:not([data-disabled="true"]) {\r\n    background: var(--Gray-2, #d0d7df);\r\n}\r\n');const J=n.forwardRef(((e,r)=>{const{className:t,size:i=1,label:o,disabled:l=!1,state:s,...c}=e,d=b(n.createElement("span",{className:a("okToggleSwitchRoot",t,"ok-r-size-"+i),"data-disabled":l||void 0},n.createElement(q,{className:a("okToggleSwitch"),ref:r,...c,size:i,disabled:l,state:s},n.createElement(z,{className:"okIndicatorIcon",state:s})),n.createElement("span",{className:a("okToggleSwitchLabel")},o)));return n.createElement(d,{...e})}));J.displayName="ToggleSwitch";const $=n.forwardRef(((e,r)=>{const[t,a]=n.useState(e.minimumValue??0n),{device:i,workQueue:o}=n.useContext(m),{maximumValue:l,minimumValue:c,fpEndpoint:d,disabled:f,...u}=e,g=n.useMemo((()=>void 0!==c?function(e,n,r){let t;t=e<r?r:e>n?n:e;return t}(c,l,0n):0n),[c,l]),h=n.useMemo((()=>p(l)),[l]),y=(1n<<BigInt(h))-1n<<BigInt(d.bitOffset),x=n.useCallback((e=>{if(null!=e&&null!=o){let n=e.getWireInValue(d.epAddress),r=0xffffffffn&y,t=(BigInt(n)&r)>>BigInt(d.bitOffset);if(y>0xffffffffn){let a=32n-BigInt(d.bitOffset),i=y>>32n;for(let o=d.epAddress+1;o<=s.Maximum&&i>0n;o++)n=e.getWireInValue(o),r=0xffffffffn&i,t|=(BigInt(n)&r)<<a,a+=32n,i>>=32n}a(t)}else a(0n)}),[o,d,y]);n.useEffect((()=>{x(i)}),[i,x]);const b=n.useCallback((async e=>{null!=i&&null!=o&&await o.Post((async()=>{let n=0xffffffffn&y,r=Number(e<<BigInt(d.bitOffset)&n);if(i.setWireInValue(d.epAddress,r,Number(n)),y>0xffffffffn){let t=32n-BigInt(d.bitOffset),a=y>>32n;for(let o=d.epAddress+1;o<=s.Maximum&&a>0n;o++)n=0xffffffffn&a,r=Number(e>>t&n),i.setWireInValue(o,r,Number(n)),t+=32n,a>>=32n}await i.updateWireIns()})),x(i)}),[i,o,d,y,x]);return n.createElement(A,{...u,ref:r,disabled:f||null===i,maximumValue:l,minimumValue:g,value:t,onValueChange:b})}));$.displayName="FrontPanelNumberEntry";h("");const ee=n.forwardRef(((e,r)=>{const[t,a]=n.useState(0n),{device:i,workQueue:o,eventSource:l}=n.useContext(m),{maximumValue:s,fpEndpoint:d,...f}=e,u=n.useMemo((()=>p(s)),[s]),g=(1n<<BigInt(u))-1n<<BigInt(d.bitOffset),h=n.useCallback((e=>{if(null!=e&&null!=o){let n=e.getWireOutValue(d.epAddress),r=0xffffffffn&g,t=(BigInt(n)&r)>>BigInt(d.bitOffset);if(g>0xffffffffn){let a=32n-BigInt(d.bitOffset),i=g>>32n;for(let o=d.epAddress+1;o<=c.Maximum&&i>0n;o++)n=e.getWireOutValue(o),r=0xffffffffn&i,t|=(BigInt(n)&r)<<a,a+=32n,i>>=32n}a(t)}else a(0n)}),[o,d,g]);return n.useEffect((()=>{h(i);const e=l?.WireOutValuesChangedEvent.Subscribe(h);return()=>{e?.Cancel()}}),[i,l,h]),n.createElement(L,{...f,ref:r,maximumValue:s,minimumValue:0n,value:t})}));ee.displayName="FrontPanelNumberDisplay";const ne=n.forwardRef(((e,r)=>{const[t,a]=n.useState(!1),{device:i,workQueue:o,eventSource:l}=n.useContext(m),{fpEndpoint:s,...c}=e,d=1<<s.bitOffset,f=n.useCallback((e=>{if(null!=e&&null!=o){const n=e.getWireOutValue(s.epAddress);a((n&d)===d)}else a(!1)}),[o,s,d]);return n.useEffect((()=>{f(i);const e=l?.WireOutValuesChangedEvent.Subscribe(f);return()=>{e?.Cancel()}}),[i,l,f]),n.createElement(T,{...c,ref:r,state:t})}));ne.displayName="FrontPanelIndicator";const re=n.forwardRef(((e,r)=>{const{device:t,workQueue:a}=n.useContext(m),{fpEndpoint:i,disabled:o,...l}=e,s=1<<i.bitOffset,c=n.useCallback((async()=>{null!=t&&null!=a&&await a.Post((async()=>{t.setWireInValue(i.epAddress,0,s),await t.updateWireIns()}))}),[t,a,i,s,a]),d=n.useCallback((async()=>{null!=t&&null!=a&&await a.Post((async()=>{t.setWireInValue(i.epAddress,4294967295,s),await t.updateWireIns()}))}),[t,a,i,s,a]);return n.createElement(w,{...l,ref:r,disabled:o||null==t,onButtonUp:c,onButtonDown:d})}));re.displayName="FrontPanelPushButton";const te=n.forwardRef(((e,r)=>{const[t,a]=n.useState(f.Off),{device:i,workQueue:o}=n.useContext(m),{fpEndpoint:l,disabled:s,...c}=e,d=1<<l.bitOffset,u=n.useCallback((e=>{if(null!=e&&null!=o){const n=(e.getWireInValue(l.epAddress)&d)===d?f.On:f.Off;a(n)}else a(f.Off)}),[o,l,d]),p=n.useCallback((async e=>{null!=i&&null!=o&&await o.Post((async()=>{const n=e===f.On?4294967295:0;i.setWireInValue(l.epAddress,n,d),await i.updateWireIns()})),u(i)}),[i,o,l,d]);return n.useEffect((()=>{u(i)}),[i,u]),n.createElement(J,{ref:r,...c,disabled:s||null==i,state:t,onToggleStateChanged:p})}));te.displayName="FrontPanelToggleSwitch";h("");const ae=n.forwardRef(((e,r)=>{const{device:t,workQueue:a}=n.useContext(m),{fpEndpoint:i,disabled:o,...l}=e,s=n.useCallback((async()=>{null!=t&&null!=a&&await a.Post((async()=>{await t.activateTriggerIn(i.epAddress,i.bitOffset)}))}),[t,a,i]);return n.createElement(w,{...l,ref:r,disabled:o||null==t,onButtonDown:s})}));ae.displayName="FrontPanelTriggerButton";const ie=n.forwardRef(((e,r)=>{const[t,a]=n.useState(0n),{device:i,workQueue:o}=n.useContext(m),{fpEndpoint:l,maximumValue:s,disabled:c,...d}=e,f=n.useMemo((()=>p(BigInt(s))),[s]),u=(1n<<BigInt(f))-1n<<BigInt(l.bitOffset),g=n.useCallback((e=>{if(null!=e&&null!=o){const n=e.getWireInValue(l.epAddress),r=(BigInt(n)&u)>>BigInt(l.bitOffset);a(r)}else a(0n)}),[o,l,u]),h=n.useCallback((e=>{null!=i&&null!=o&&o.Post((async()=>{i.setWireInValue(l.epAddress,e<<l.bitOffset,Number(u)),await i.updateWireIns()}))}),[i,o,l,o,u]);return n.useEffect((()=>{g(i)}),[i,g]),n.createElement(M,{...d,ref:r,disabled:c||null==i,defaultValue:Number(t),maximumValue:s,onValueChange:h})}));ie.displayName="FrontPanelRangeSlider";const oe=e=>{const[r,t]=n.useState(0n),{device:a,workQueue:i}=n.useContext(m),{fpEndpoint:o,maximumValue:l,disabled:c,...d}=e,f=n.useMemo((()=>p(l)),[l]),u=(1n<<BigInt(f))-1n<<BigInt(o.bitOffset),g=n.useCallback((e=>{if(null!=e&&null!=i){let n=e.getWireInValue(o.epAddress),r=0xffffffffn&u,a=(BigInt(n)&r)>>BigInt(o.bitOffset);if(u>0xffffffffn){let t=32n-BigInt(o.bitOffset),i=u>>32n;for(let l=o.epAddress+1;l<=s.Maximum&&i>0n;l++)n=e.getWireInValue(l),r=0xffffffffn&i,a|=(BigInt(n)&r)<<t,t+=32n,i>>=32n}t(a)}else t(0n)}),[i,o,u]),h=n.useCallback((e=>{if(null!=a&&null!=i){const n=BigInt(e);i.Post((async()=>{let e=0xffffffffn&u,r=Number(n<<BigInt(o.bitOffset)&e);if(a.setWireInValue(o.epAddress,r,Number(e)),u>0xffffffffn){let t=32n-BigInt(o.bitOffset),i=u>>32n;const l=32-o.epAddress;for(let s=1;s<l&&i>0n;s++)e=0xffffffffn&i,r=Number(n>>t&e),a.setWireInValue(o.epAddress+s,r,Number(e)),t+=32n,i>>=32n}await a.updateWireIns()}))}g(a)}),[a,i,o,g]);return n.useEffect((()=>{g(a)}),[a,g]),n.createElement(H.Root,{...d,disabled:c||null==a,value:r.toString(),onValueChange:h})};oe.displayName="FrontPanelSelectEntryRoot";const le=Object.assign({},{Root:oe,Trigger:Y,Content:U,Item:K,Group:_,Label:Q,Separator:X});export{y as Application,w as Button,p as CalculateBitLength,g as FrontPanel,m as FrontPanelContext,ne as FrontPanelIndicator,ee as FrontPanelNumberDisplay,$ as FrontPanelNumberEntry,re as FrontPanelPushButton,ie as FrontPanelRangeSlider,le as FrontPanelSelectEntry,oe as FrontPanelSelectEntryRoot,te as FrontPanelToggleSwitch,ae as FrontPanelTriggerButton,T as Indicator,D as Label,L as NumberDisplay,A as NumberEntry,d as NumeralSystem,u as NumericDigits,M as RangeSlider,H as SelectEntry,U as SelectEntryContent,_ as SelectEntryGroup,K as SelectEntryItem,Q as SelectEntryLabel,W as SelectEntryRoot,X as SelectEntrySeparator,Y as SelectEntryTrigger,q as Toggle,f as ToggleState,J as ToggleSwitch,x as Tooltip};
 //# sourceMappingURL=index.js.map