@deephaven/code-studio 0.54.1-beta.4 → 0.54.1-beta.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/assets/{AppRoot-11285c74.js → AppRoot-a0e847ab.js} +3 -3
- package/build/assets/{AppRoot-11285c74.js.map → AppRoot-a0e847ab.js.map} +1 -1
- package/build/assets/{ControlType-bd0b4b4e.js → ControlType-f172292c.js} +2 -2
- package/build/assets/{ControlType-bd0b4b4e.js.map → ControlType-f172292c.js.map} +1 -1
- package/build/assets/{FontBootstrap-77c3a241.js → FontBootstrap-ed8c22cc.js} +3 -3
- package/build/assets/{FontBootstrap-77c3a241.js.map → FontBootstrap-ed8c22cc.js.map} +1 -1
- package/build/assets/{IrisGrid-7c968bec.js → IrisGrid-2af89f34.js} +2 -2
- package/build/assets/{IrisGrid-7c968bec.js.map → IrisGrid-2af89f34.js.map} +1 -1
- package/build/assets/{IrisGridModelFactory-8c5f1a05.js → IrisGridModelFactory-1017b5b5.js} +2 -2
- package/build/assets/{IrisGridModelFactory-8c5f1a05.js.map → IrisGridModelFactory-1017b5b5.js.map} +1 -1
- package/build/assets/{StyleGuideRoot-0eb15267.js → StyleGuideRoot-2ddf6529.js} +8 -6
- package/build/assets/StyleGuideRoot-2ddf6529.js.map +1 -0
- package/build/assets/{index-9fae41e5.js → index-31470eab.js} +2 -2
- package/build/assets/{index-9fae41e5.js.map → index-31470eab.js.map} +1 -1
- package/build/assets/{index-228403cf.js → index-4ce26a04.js} +2 -2
- package/build/assets/{index-228403cf.js.map → index-4ce26a04.js.map} +1 -1
- package/build/assets/{index-4fe231e6.js → index-c0cceeb0.js} +2 -2
- package/build/assets/{index-4fe231e6.js.map → index-c0cceeb0.js.map} +1 -1
- package/build/assets/{usePlugins-aa8f4db4.js → usePlugins-f76cdd3c.js} +2 -2
- package/build/assets/{usePlugins-aa8f4db4.js.map → usePlugins-f76cdd3c.js.map} +1 -1
- package/build/assets/{useUser-1cdfff74.js → useUser-87e4f86e.js} +2 -2
- package/build/assets/{useUser-1cdfff74.js.map → useUser-87e4f86e.js.map} +1 -1
- package/build/index.html +1 -1
- package/package.json +31 -31
- package/build/assets/StyleGuideRoot-0eb15267.js.map +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as u,F as ee,C as e,G as f,H as ce,Q as nr,aH as D,M as se,_ as ie,L as Fe,aI as wr,aJ as Ie,aK as Cr,aL as _,aM as Sr,aN as Ne,a8 as j,Z as H,aO as B,a0 as _e,aP as Tr,a3 as cr,a5 as ir,a6 as Nr,aQ as kr,ac as Er,ab as te,aR as Ir,aS as Dr,aT as $r,ad as Mr,aU as Ar,aV as Rr,aW as V,aX as Lr,aY as he,aZ as k,a_ as Pr,a$ as Fr,b0 as _r,J as Br,Y as Vr}from"./vendor-fd5d5838.js";import{aN as Be,aO as G,aP as De,aQ as $e,aR as dr,aq as Or,aS as L,aT as Ve,D as Oe,aU as Ue,F as ke,aV as Ur,aW as Hr,aM as Ee,aX as Gr,aY as Wr}from"./index-228403cf.js";import{W as zr}from"./monaco-1410cbed.js";import{ab as de,a8 as hr,a5 as O,ac as ur,B as R,g as Y,m as qr,L as ue,ad as z,ae as Zr,I as Yr,R as Xr,f as X,C as He,O as Kr,a as Qr,S as Jr,c as Q,b as Ge,P as We,h as eo,d as ro}from"./IrisGrid-7c968bec.js";import{M as ze,H as oo,A as to,V as ge,T as ao,D as lo,C as so,a as no,b as co,c as io}from"./FontBootstrap-77c3a241.js";import{u as gr,e as W,a2 as E,K as I,v as ae,B as C,t as ho,k as qe,b8 as Ze,l as uo,C as P,a6 as K,S as me,Z as go,w as mo,d as Ye,g as le,z as vo,L as po,M as xo}from"./usePlugins-aa8f4db4.js";import{L as fo}from"./AppRoot-11285c74.js";import{Q as bo,x as yo,s as jo}from"./ControlType-bd0b4b4e.js";import"./helpers-042e6b4d.js";import"./plotly-1c1a0e42.js";import"./useUser-1cdfff74.js";function Xe(a,r,o,t,l,n,s){try{var i=a[n](s),h=i.value}catch(d){o(d);return}i.done?r(h):Promise.resolve(h).then(t,l)}function ve(a){return function(){var r=this,o=arguments;return new Promise(function(t,l){var n=a.apply(r,o);function s(h){Xe(n,t,l,s,i,"next",h)}function i(h){Xe(n,t,l,s,i,"throw",h)}s(void 0)})}}function $(a,r,o){return r=wo(r),r in a?Object.defineProperty(a,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):a[r]=o,a}function wo(a){var r=Co(a,"string");return typeof r=="symbol"?r:String(r)}function Co(a,r){if(typeof a!="object"||a===null)return a;var o=a[Symbol.toPrimitive];if(o!==void 0){var t=o.call(a,r||"default");if(typeof t!="object")return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(a)}class So extends de{constructor(){var{rowCount:r=1e9,columnCount:o=100,floatingTopRowCount:t=0,floatingBottomRowCount:l=0,floatingLeftColumnCount:n=0,floatingRightColumnCount:s=0,isEditable:i=!1,editedData:h=[]}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};super(),$(this,"numRows",void 0),$(this,"numColumns",void 0),$(this,"floatingTop",void 0),$(this,"floatingBottom",void 0),$(this,"floatingLeft",void 0),$(this,"floatingRight",void 0),$(this,"editable",void 0),$(this,"editedData",void 0),this.numRows=r,this.numColumns=o,this.floatingTop=t,this.floatingBottom=l,this.floatingLeft=n,this.floatingRight=s,this.editable=i,this.editedData=h}get rowCount(){return this.numRows}get columnCount(){return this.numColumns}get floatingTopRowCount(){return this.floatingTop}get floatingBottomRowCount(){return this.floatingBottom}get floatingLeftColumnCount(){return this.floatingLeft}get floatingRightColumnCount(){return this.floatingRight}get isEditable(){return this.editable}textForCell(r,o){var t,l;return(t=(l=this.editedData[r])===null||l===void 0?void 0:l[o])!==null&&t!==void 0?t:"".concat(r,",").concat(o)}colorForCell(r,o,t){return t.textColor}textForColumnHeader(r){return"".concat(r)}textForRowHeader(r){return"".concat(r)}textForRowFooter(r){return"".concat(r)}setValueForCell(r,o,t){var l=this;return ve(function*(){l.editedData[r]==null&&(l.editedData[r]=[]),l.editedData[r][o]="".concat(t)})()}setValueForRanges(r,o){var t=this;return ve(function*(){hr.forEachCell(r,(l,n)=>{t.setValueForCell(l,n,o)})})()}setValues(r){var o=this;return ve(function*(){for(var t=0;t<r.length;t+=1){var l,n,s=r[t];o.setValueForCell((l=s.column)!==null&&l!==void 0?l:s.x,(n=s.row)!==null&&n!==void 0?n:s.y,s.text)}})()}editValueForCell(r,o){return this.textForCell(r,o)}isValidForCell(r,o,t){return!0}isEditableRange(r){return this.isEditable}delete(r){throw new Error("Method not implemented.")}}const Me=So;function w(a,r,o){return r=To(r),r in a?Object.defineProperty(a,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):a[r]=o,a}function To(a){var r=No(a,"string");return typeof r=="symbol"?r:String(r)}function No(a,r){if(typeof a!="object"||a===null)return a;var o=a[Symbol.toPrimitive];if(o!==void 0){var t=o.call(a,r||"default");if(typeof t!="object")return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(a)}class N extends Me{constructor(){var{rowCount:r=N.DEFAULT_ROW_COUNT,columnCount:o=N.DEFAULT_COLUMN_COUNT,children:t=new Map,childRowCount:l=Math.ceil(Math.max(N.MIN_CHILD_ROW_COUNT,r*N.DEFAULT_CHILD_ROW_COUNT_FACTOR)),maxDepth:n=N.MAX_DEPTH}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};super({rowCount:r,columnCount:o}),w(this,"children",void 0),w(this,"childRowCount",void 0),w(this,"maxDepth",void 0),w(this,"getCachedModelRowOffset",O((s,i)=>{for(var h=null,d=i,c=[...s].sort((b,M)=>b[0]-M[0]),g=0;g<c.length;g+=1){var[m,v]=c[g];if(d<=m)break;var x=v.rowCount;if(d<=m+x){h=m,d=d-m-1;break}d-=x}return{key:h,offsetRow:d}})),w(this,"getCachedTextForRowHeader",O((s,i)=>{var{key:h,offsetRow:d}=this.getCachedModelRowOffset(s,i);if(h!=null){var c=s.get(h);if(c!==void 0)return"".concat(h,".").concat(c.textForRowHeader(d))}return"".concat(d)})),w(this,"getCachedTextForCell",O((s,i,h)=>{var{key:d,offsetRow:c}=this.getCachedModelRowOffset(s,h);if(d!=null){var g=s.get(d);if(g!==void 0)return"".concat(d,".").concat(g.textForCell(i,c))}return"".concat(i,",").concat(c)})),w(this,"getCachedIsRowExpandable",O((s,i,h)=>{var d=this.getCachedDepthForRow(s,i);return d<h})),w(this,"getCachedIsRowExpanded",O((s,i)=>{var{key:h,offsetRow:d}=this.getCachedModelRowOffset(s,i);if(h!=null){var c=s.get(h);if(c!==void 0)return c.isRowExpanded(d)}return s.has(d)})),w(this,"getCachedDepthForRow",O((s,i)=>{var{key:h,offsetRow:d}=this.getCachedModelRowOffset(s,i);if(h!=null){var c=s.get(h);if(c!==void 0)return c.depthForRow(d)+1}return 0})),this.children=t,this.childRowCount=l,this.maxDepth=n}textForCell(r,o){return this.getCachedTextForCell(this.children,r,o)}textForRowHeader(r){return this.getCachedTextForRowHeader(this.children,r)}isRowMovable(r){return!1}get hasExpandableRows(){return!0}get isExpandAllAvailable(){return!1}get floatingBottomRowCount(){return 0}isRowExpandable(r){return this.getCachedIsRowExpandable(this.children,r,this.maxDepth)}isRowExpanded(r){return this.getCachedIsRowExpanded(this.children,r)}setRowExpanded(r,o){var t=arguments.length>2&&arguments[2]!==void 0?arguments[2]:!1,{key:l,offsetRow:n}=this.getCachedModelRowOffset(this.children,r),s=new Map(this.children);if(l!=null){var i=this.children.get(l);if(i!==void 0){var{rowCount:h}=i;i.setRowExpanded(n,o,t),this.numRows+=i.rowCount-h}}else if(o){var c=new N({rowCount:this.childRowCount,columnCount:this.numColumns});s.set(n,c),this.numRows+=c.rowCount}else{var d=s.get(n);d!==void 0&&(this.numRows-=d.rowCount,s.delete(n))}this.children=s}expandAll(){throw new Error("Expand all not implemented.")}collapseAll(){throw new Error("Collapse all not implemented.")}depthForRow(r){return this.getCachedDepthForRow(this.children,r)}}w(N,"DEFAULT_ROW_COUNT",1e9);w(N,"DEFAULT_COLUMN_COUNT",100);w(N,"DEFAULT_CHILD_ROW_COUNT_FACTOR",.01);w(N,"MIN_CHILD_ROW_COUNT",10);w(N,"MAX_DEPTH",10);const Ae=N;function pe(a,r,o){return r=ko(r),r in a?Object.defineProperty(a,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):a[r]=o,a}function ko(a){var r=Eo(a,"string");return typeof r=="symbol"?r:String(r)}function Eo(a,r){if(typeof a!="object"||a===null)return a;var o=a[Symbol.toPrimitive];if(o!==void 0){var t=o.call(a,r||"default");if(typeof t!="object")return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(a)}class Io extends de{constructor(r,o){var t;super(),pe(this,"data",void 0),pe(this,"columnHeaders",void 0),pe(this,"numberOfColumns",void 0),this.data=r,this.numberOfColumns=Math.max(...r.map(l=>l.length),(t=o?.length)!==null&&t!==void 0?t:0),this.columnHeaders=o}get rowCount(){return this.data.length}get columnCount(){return this.numberOfColumns}textForCell(r,o){var t;return"".concat((t=this.data[o])===null||t===void 0?void 0:t[r])}textForColumnHeader(r){var o,t;return(o=(t=this.columnHeaders)===null||t===void 0?void 0:t[r])!==null&&o!==void 0?o:""}}const Do=Io;function xe(a,r,o){return r=$o(r),r in a?Object.defineProperty(a,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):a[r]=o,a}function $o(a){var r=Mo(a,"string");return typeof r=="symbol"?r:String(r)}function Mo(a,r){if(typeof a!="object"||a===null)return a;var o=a[Symbol.toPrimitive];if(o!==void 0){var t=o.call(a,r||"default");if(typeof t!="object")return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(a)}class Ao extends de{constructor(r,o){super(),xe(this,"numberOfColumns",void 0),xe(this,"numberOfRows",void 0),xe(this,"viewportData",void 0),this.numberOfColumns=r,this.numberOfRows=o}get columnCount(){return this.numberOfColumns}get rowCount(){return this.numberOfRows}textForCell(r,o){var t,l,n,s,i,h,d,c=o-((t=(l=this.viewportData)===null||l===void 0?void 0:l.rowOffset)!==null&&t!==void 0?t:0),g=r-((n=(s=this.viewportData)===null||s===void 0?void 0:s.columnOffset)!==null&&n!==void 0?n:0);return"".concat((i=(h=this.viewportData)===null||h===void 0||(d=h.data[c])===null||d===void 0?void 0:d[g])!==null&&i!==void 0?i:"")}textForColumnHeader(r){return"".concat(r)}textForRowHeader(r){return"".concat(r)}}const Ro=Ao;function S(a,r,o){return r=Lo(r),r in a?Object.defineProperty(a,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):a[r]=o,a}function Lo(a){var r=Po(a,"string");return typeof r=="symbol"?r:String(r)}function Po(a,r){if(typeof a!="object"||a===null)return a;var o=a[Symbol.toPrimitive];if(o!==void 0){var t=o.call(a,r||"default");if(typeof t!="object")return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(a)}var Fo="proportional",_o=ur.positiveBarColor,Bo=ur.negativeBarColor,Vo="beside",Oo="LTR",Uo="right";function Ho(a){return Array.isArray(a)&&a.every(r=>typeof r=="number")}class Go extends de{constructor(r){var o=arguments.length>1&&arguments[1]!==void 0?arguments[1]:new Map,t=arguments.length>2&&arguments[2]!==void 0?arguments[2]:new Map,l=arguments.length>3&&arguments[3]!==void 0?arguments[3]:new Map,n=arguments.length>4&&arguments[4]!==void 0?arguments[4]:new Map,s=arguments.length>5&&arguments[5]!==void 0?arguments[5]:new Map,i=arguments.length>6&&arguments[6]!==void 0?arguments[6]:new Map,h=arguments.length>7&&arguments[7]!==void 0?arguments[7]:new Map,d=arguments.length>8&&arguments[8]!==void 0?arguments[8]:new Map;super(),S(this,"numberOfColumns",void 0),S(this,"numberOfRows",void 0),S(this,"data",void 0),S(this,"columnMins",void 0),S(this,"columnMaxs",void 0),S(this,"columnAxes",void 0),S(this,"valuePlacements",void 0),S(this,"directions",void 0),S(this,"positiveColors",void 0),S(this,"negativeColors",void 0),S(this,"opacities",void 0),S(this,"textAlignments",void 0),S(this,"markers",void 0),this.positiveColors=t,this.negativeColors=l,this.data=r,this.columnAxes=o,this.valuePlacements=n,this.opacities=s,this.directions=i,this.textAlignments=h,this.markers=d,this.numberOfRows=Math.max(...r.map(m=>m.length)),this.numberOfColumns=r.length,this.columnMins=new Map,this.columnMaxs=new Map;for(var c=0;c<r.length;c+=1){var g=r[c];Ho(g)&&(this.columnMins.set(c,Math.min(...g)),this.columnMaxs.set(c,Math.max(...g)))}}get rowCount(){return this.numberOfRows}get columnCount(){return this.numberOfColumns}textForCell(r,o){var t;return"".concat((t=this.data[r])===null||t===void 0?void 0:t[o])}textForColumnHeader(r){return"".concat(r)}textAlignForCell(r,o){var t;return(t=this.textAlignments.get(r))!==null&&t!==void 0?t:Uo}renderTypeForCell(r,o){return r<20||r%2===o%2?"dataBar":"text"}dataBarOptionsForCell(r,o){var t,l,n,s,i,h,d,c=Be(this.columnMins,r),g=Be(this.columnMaxs,r),m=(t=this.columnAxes.get(r))!==null&&t!==void 0?t:Fo,v=(l=this.valuePlacements.get(r))!==null&&l!==void 0?l:Vo,x=this.opacities.get(r);x==null||x>1?x=1:x<0&&(x=0);var b=(n=this.directions.get(r))!==null&&n!==void 0?n:Oo,M=(s=this.positiveColors.get(r))!==null&&s!==void 0?s:_o,q=(i=this.negativeColors.get(r))!==null&&i!==void 0?i:Bo,A=Number((h=this.data[r])===null||h===void 0?void 0:h[o]),F=A>=0?M:q,re=(d=this.markers.get(r))!==null&&d!==void 0?d:[];return{columnMin:c,columnMax:g,axis:m,color:F,valuePlacement:v,opacity:x,markers:re,direction:b,value:A}}}const Wo=Go,Ke="hide-from-e2e-tests",Qe="sample-section";function*mr(a=1){for(;;)a=a*16807%2147483647,yield a/2147483647}function zo(a=1){const[r]=u.useState(()=>mr(a));return u.useCallback(()=>{const o=r.next();if(o.done===!0)throw new Error("Random number generator unexpectedly finished");return o.value},[r])}function p(a,r=[]){const o=`${Qe}-${a.toLocaleLowerCase().replaceAll(" ","-")}`,t=ee(Qe,...r);return{id:o,className:t}}function T(a,r=[]){const{id:o,className:t}=p(a,r);return{id:o,UNSAFE_className:t}}class Re extends u.Component{static renderAlert(r){return e.jsxs("div",{className:ee("alert",`alert-${r}`),children:[e.jsx("strong",{children:"Well done!"}),"You successfully read this ",r," alert message."]},r)}render(){const r=["success","info","warning","danger"].map(o=>Re.renderAlert(o));return e.jsxs("div",{...p("alerts"),children:[e.jsx("h2",{className:"ui-title",children:"Alerts"}),e.jsx("div",{style:{padding:"1rem 0"},children:r})]})}}class J extends u.Component{static renderButtonBrand(r,o){const t=r.length?`btn-${r}-${o}`:`btn-${o}`;return e.jsx(R,{className:t,style:{marginBottom:"1rem",marginRight:"1rem"},children:o},o)}static renderButtons(r){const o=["primary","secondary","success","info","danger"].map(t=>J.renderButtonBrand(r,t));return e.jsxs("div",{...p(`buttons-${r.length?"outline":"regular"}`),children:[e.jsx("h5",{children:r.length?"Outline":"Regular"}),o]},r)}static renderSocketedButtons(){return e.jsxs("div",{...p("buttons-socketed"),children:[e.jsx("h5",{children:"Socketed Buttons (for linker)"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},children:"Unlinked"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},isLinked:!0,children:"Linked"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},isLinkedSource:!0,children:"Linked Source"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},isLinked:!0,isInvalid:!0,children:"Error"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},disabled:!0,children:"Disabled"})]})}constructor(r){super(r),this.state={toggle:!0}}renderInlineButtons(){const{toggle:r}=this.state;return e.jsxs("div",{...p("buttons-inline"),style:{padding:"1rem 0"},children:[e.jsx("h5",{children:"Inline Buttons"}),"Regular btn-inline:",e.jsx(R,{className:"btn-inline mx-2",children:e.jsx(f,{icon:G})}),"Toggle button (class active):",e.jsx(R,{className:ee("btn-inline mx-2",{active:r}),onClick:()=>{this.setState({toggle:!r})},children:e.jsx(f,{icon:G})}),"Disabled:",e.jsx(R,{className:"btn-inline mx-2",disabled:!0,children:e.jsx(f,{icon:G})}),e.jsx("br",{}),e.jsx("br",{}),e.jsx("span",{children:"btn-link-icon (no text):"}),e.jsx(R,{className:"btn-link btn-link-icon px-2",children:e.jsx(f,{icon:G})}),e.jsx("span",{className:"mx-2",children:"btn-link:"}),e.jsx(R,{className:"btn-link",children:"Text Button"}),e.jsx("span",{className:"mx-2",children:"btn-link (text w/ optional with icon):"}),e.jsxs(R,{className:"btn-link",children:[e.jsx(f,{icon:G}),"Add Item"]})]})}render(){const r=["","outline"].map(l=>J.renderButtons(l)),o=this.renderInlineButtons(),t=J.renderSocketedButtons();return e.jsxs("div",{children:[e.jsx("h2",{className:"ui-title",children:"Buttons"}),e.jsxs("div",{style:{padding:"1rem 0"},children:[r,o,t]})]})}}function qo(){const a=gr();ze.random=zo();const[r]=u.useState(()=>new ze(a));return e.jsxs("div",{...p("charts"),children:[e.jsx("h2",{className:"ui-title",children:"Chart"}),e.jsx("div",{style:{height:500},children:e.jsx(qr,{model:r})})]})}function Zo(){const a=[["100","900"],["200","800"],["300","700"],["400","600"],["500","500"],["600","500"],["700","400"],["800","300"],["850","200"],["8XX","100"],["900","75"]].map(([o,t])=>e.jsxs("div",{className:ee("swatch","gray-swatch",`gray-swatch-${o}`),children:[e.jsxs("span",{children:["Gray-",o]}),e.jsxs("span",{style:{backgroundColor:`var(--dh-color-gray-${t})`},children:["--dh-gray-",t]})]},o)),r=["red","orange","yellow","green","blue","purple","white","black","content-bg","primary","primary-dark","background","foreground"].map(o=>e.jsx("div",{className:ee("swatch",`swatch-${o}`),children:o},o));return e.jsxs("div",{...p("colors"),children:[e.jsx("h2",{className:"ui-title",children:"Colors"}),e.jsxs("div",{className:"row",children:[e.jsx("div",{className:"col",children:a}),e.jsx("div",{className:"col",children:r}),e.jsxs("div",{className:"col",children:[e.jsx("p",{children:"Gray Range is available for background/tab colors, and should cover the full range used in mockups. Always use the semantic color names in your .scss files when applicable for UI elements."}),e.jsx("p",{children:"For refrence key colors are $primary for interactable elements, content-bg as background. White is same as gray-200. Gray-100 is used when white needs an active color. content-bg is between 800 and 900."}),e.jsx("pre",{children:`
|
|
1
|
+
import{r as u,F as ee,C as e,G as f,H as ce,Q as nr,aH as D,M as se,_ as ie,L as _e,aI as wr,aJ as De,aK as Cr,aL as _,aM as Sr,aN as ke,a8 as j,Z as H,aO as B,a0 as Be,aP as Tr,a3 as cr,a5 as ir,a6 as Nr,aQ as kr,ac as Er,ab as te,aR as Ir,aS as Dr,aT as $r,ad as Mr,aU as Ar,aV as Rr,aW as V,aX as Lr,aY as he,aZ as k,a_ as Pr,a$ as Fr,b0 as _r,J as Br,Y as Vr}from"./vendor-fd5d5838.js";import{aN as Ve,aO as G,aP as $e,aQ as Me,aR as dr,aq as Or,aS as L,aT as Oe,D as Ue,aU as He,F as Ee,aV as Ur,aW as Hr,aM as Ie,aX as Gr,aY as Wr}from"./index-4ce26a04.js";import{W as zr}from"./monaco-1410cbed.js";import{ab as de,a8 as hr,a5 as O,ac as ur,B as R,g as Y,m as qr,L as ue,ad as z,ae as Zr,I as Yr,R as Xr,f as X,C as Ge,O as Kr,a as Qr,S as Jr,c as Q,b as We,P as ze,h as eo,d as ro}from"./IrisGrid-2af89f34.js";import{M as qe,H as oo,A as to,V as ge,T as ao,D as lo,C as so,a as no,b as co,c as io}from"./FontBootstrap-ed8c22cc.js";import{u as gr,e as W,a2 as E,K as I,v as ae,B as C,t as ho,k as Ze,b8 as Ye,l as uo,C as P,a6 as K,S as me,Z as go,w as mo,d as Xe,g as le,z as vo,L as po,M as xo}from"./usePlugins-f76cdd3c.js";import{L as fo}from"./AppRoot-a0e847ab.js";import{Q as bo,x as yo,s as jo}from"./ControlType-f172292c.js";import"./helpers-042e6b4d.js";import"./plotly-1c1a0e42.js";import"./useUser-87e4f86e.js";function Ke(t,r,o,a,l,n,s){try{var i=t[n](s),h=i.value}catch(d){o(d);return}i.done?r(h):Promise.resolve(h).then(a,l)}function ve(t){return function(){var r=this,o=arguments;return new Promise(function(a,l){var n=t.apply(r,o);function s(h){Ke(n,a,l,s,i,"next",h)}function i(h){Ke(n,a,l,s,i,"throw",h)}s(void 0)})}}function $(t,r,o){return r=wo(r),r in t?Object.defineProperty(t,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[r]=o,t}function wo(t){var r=Co(t,"string");return typeof r=="symbol"?r:String(r)}function Co(t,r){if(typeof t!="object"||t===null)return t;var o=t[Symbol.toPrimitive];if(o!==void 0){var a=o.call(t,r||"default");if(typeof a!="object")return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(t)}class So extends de{constructor(){var{rowCount:r=1e9,columnCount:o=100,floatingTopRowCount:a=0,floatingBottomRowCount:l=0,floatingLeftColumnCount:n=0,floatingRightColumnCount:s=0,isEditable:i=!1,editedData:h=[]}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};super(),$(this,"numRows",void 0),$(this,"numColumns",void 0),$(this,"floatingTop",void 0),$(this,"floatingBottom",void 0),$(this,"floatingLeft",void 0),$(this,"floatingRight",void 0),$(this,"editable",void 0),$(this,"editedData",void 0),this.numRows=r,this.numColumns=o,this.floatingTop=a,this.floatingBottom=l,this.floatingLeft=n,this.floatingRight=s,this.editable=i,this.editedData=h}get rowCount(){return this.numRows}get columnCount(){return this.numColumns}get floatingTopRowCount(){return this.floatingTop}get floatingBottomRowCount(){return this.floatingBottom}get floatingLeftColumnCount(){return this.floatingLeft}get floatingRightColumnCount(){return this.floatingRight}get isEditable(){return this.editable}textForCell(r,o){var a,l;return(a=(l=this.editedData[r])===null||l===void 0?void 0:l[o])!==null&&a!==void 0?a:"".concat(r,",").concat(o)}colorForCell(r,o,a){return a.textColor}textForColumnHeader(r){return"".concat(r)}textForRowHeader(r){return"".concat(r)}textForRowFooter(r){return"".concat(r)}setValueForCell(r,o,a){var l=this;return ve(function*(){l.editedData[r]==null&&(l.editedData[r]=[]),l.editedData[r][o]="".concat(a)})()}setValueForRanges(r,o){var a=this;return ve(function*(){hr.forEachCell(r,(l,n)=>{a.setValueForCell(l,n,o)})})()}setValues(r){var o=this;return ve(function*(){for(var a=0;a<r.length;a+=1){var l,n,s=r[a];o.setValueForCell((l=s.column)!==null&&l!==void 0?l:s.x,(n=s.row)!==null&&n!==void 0?n:s.y,s.text)}})()}editValueForCell(r,o){return this.textForCell(r,o)}isValidForCell(r,o,a){return!0}isEditableRange(r){return this.isEditable}delete(r){throw new Error("Method not implemented.")}}const Ae=So;function w(t,r,o){return r=To(r),r in t?Object.defineProperty(t,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[r]=o,t}function To(t){var r=No(t,"string");return typeof r=="symbol"?r:String(r)}function No(t,r){if(typeof t!="object"||t===null)return t;var o=t[Symbol.toPrimitive];if(o!==void 0){var a=o.call(t,r||"default");if(typeof a!="object")return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(t)}class N extends Ae{constructor(){var{rowCount:r=N.DEFAULT_ROW_COUNT,columnCount:o=N.DEFAULT_COLUMN_COUNT,children:a=new Map,childRowCount:l=Math.ceil(Math.max(N.MIN_CHILD_ROW_COUNT,r*N.DEFAULT_CHILD_ROW_COUNT_FACTOR)),maxDepth:n=N.MAX_DEPTH}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};super({rowCount:r,columnCount:o}),w(this,"children",void 0),w(this,"childRowCount",void 0),w(this,"maxDepth",void 0),w(this,"getCachedModelRowOffset",O((s,i)=>{for(var h=null,d=i,c=[...s].sort((b,M)=>b[0]-M[0]),g=0;g<c.length;g+=1){var[m,v]=c[g];if(d<=m)break;var x=v.rowCount;if(d<=m+x){h=m,d=d-m-1;break}d-=x}return{key:h,offsetRow:d}})),w(this,"getCachedTextForRowHeader",O((s,i)=>{var{key:h,offsetRow:d}=this.getCachedModelRowOffset(s,i);if(h!=null){var c=s.get(h);if(c!==void 0)return"".concat(h,".").concat(c.textForRowHeader(d))}return"".concat(d)})),w(this,"getCachedTextForCell",O((s,i,h)=>{var{key:d,offsetRow:c}=this.getCachedModelRowOffset(s,h);if(d!=null){var g=s.get(d);if(g!==void 0)return"".concat(d,".").concat(g.textForCell(i,c))}return"".concat(i,",").concat(c)})),w(this,"getCachedIsRowExpandable",O((s,i,h)=>{var d=this.getCachedDepthForRow(s,i);return d<h})),w(this,"getCachedIsRowExpanded",O((s,i)=>{var{key:h,offsetRow:d}=this.getCachedModelRowOffset(s,i);if(h!=null){var c=s.get(h);if(c!==void 0)return c.isRowExpanded(d)}return s.has(d)})),w(this,"getCachedDepthForRow",O((s,i)=>{var{key:h,offsetRow:d}=this.getCachedModelRowOffset(s,i);if(h!=null){var c=s.get(h);if(c!==void 0)return c.depthForRow(d)+1}return 0})),this.children=a,this.childRowCount=l,this.maxDepth=n}textForCell(r,o){return this.getCachedTextForCell(this.children,r,o)}textForRowHeader(r){return this.getCachedTextForRowHeader(this.children,r)}isRowMovable(r){return!1}get hasExpandableRows(){return!0}get isExpandAllAvailable(){return!1}get floatingBottomRowCount(){return 0}isRowExpandable(r){return this.getCachedIsRowExpandable(this.children,r,this.maxDepth)}isRowExpanded(r){return this.getCachedIsRowExpanded(this.children,r)}setRowExpanded(r,o){var a=arguments.length>2&&arguments[2]!==void 0?arguments[2]:!1,{key:l,offsetRow:n}=this.getCachedModelRowOffset(this.children,r),s=new Map(this.children);if(l!=null){var i=this.children.get(l);if(i!==void 0){var{rowCount:h}=i;i.setRowExpanded(n,o,a),this.numRows+=i.rowCount-h}}else if(o){var c=new N({rowCount:this.childRowCount,columnCount:this.numColumns});s.set(n,c),this.numRows+=c.rowCount}else{var d=s.get(n);d!==void 0&&(this.numRows-=d.rowCount,s.delete(n))}this.children=s}expandAll(){throw new Error("Expand all not implemented.")}collapseAll(){throw new Error("Collapse all not implemented.")}depthForRow(r){return this.getCachedDepthForRow(this.children,r)}}w(N,"DEFAULT_ROW_COUNT",1e9);w(N,"DEFAULT_COLUMN_COUNT",100);w(N,"DEFAULT_CHILD_ROW_COUNT_FACTOR",.01);w(N,"MIN_CHILD_ROW_COUNT",10);w(N,"MAX_DEPTH",10);const Re=N;function pe(t,r,o){return r=ko(r),r in t?Object.defineProperty(t,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[r]=o,t}function ko(t){var r=Eo(t,"string");return typeof r=="symbol"?r:String(r)}function Eo(t,r){if(typeof t!="object"||t===null)return t;var o=t[Symbol.toPrimitive];if(o!==void 0){var a=o.call(t,r||"default");if(typeof a!="object")return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(t)}class Io extends de{constructor(r,o){var a;super(),pe(this,"data",void 0),pe(this,"columnHeaders",void 0),pe(this,"numberOfColumns",void 0),this.data=r,this.numberOfColumns=Math.max(...r.map(l=>l.length),(a=o?.length)!==null&&a!==void 0?a:0),this.columnHeaders=o}get rowCount(){return this.data.length}get columnCount(){return this.numberOfColumns}textForCell(r,o){var a;return"".concat((a=this.data[o])===null||a===void 0?void 0:a[r])}textForColumnHeader(r){var o,a;return(o=(a=this.columnHeaders)===null||a===void 0?void 0:a[r])!==null&&o!==void 0?o:""}}const Do=Io;function xe(t,r,o){return r=$o(r),r in t?Object.defineProperty(t,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[r]=o,t}function $o(t){var r=Mo(t,"string");return typeof r=="symbol"?r:String(r)}function Mo(t,r){if(typeof t!="object"||t===null)return t;var o=t[Symbol.toPrimitive];if(o!==void 0){var a=o.call(t,r||"default");if(typeof a!="object")return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(t)}class Ao extends de{constructor(r,o){super(),xe(this,"numberOfColumns",void 0),xe(this,"numberOfRows",void 0),xe(this,"viewportData",void 0),this.numberOfColumns=r,this.numberOfRows=o}get columnCount(){return this.numberOfColumns}get rowCount(){return this.numberOfRows}textForCell(r,o){var a,l,n,s,i,h,d,c=o-((a=(l=this.viewportData)===null||l===void 0?void 0:l.rowOffset)!==null&&a!==void 0?a:0),g=r-((n=(s=this.viewportData)===null||s===void 0?void 0:s.columnOffset)!==null&&n!==void 0?n:0);return"".concat((i=(h=this.viewportData)===null||h===void 0||(d=h.data[c])===null||d===void 0?void 0:d[g])!==null&&i!==void 0?i:"")}textForColumnHeader(r){return"".concat(r)}textForRowHeader(r){return"".concat(r)}}const Ro=Ao;function S(t,r,o){return r=Lo(r),r in t?Object.defineProperty(t,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[r]=o,t}function Lo(t){var r=Po(t,"string");return typeof r=="symbol"?r:String(r)}function Po(t,r){if(typeof t!="object"||t===null)return t;var o=t[Symbol.toPrimitive];if(o!==void 0){var a=o.call(t,r||"default");if(typeof a!="object")return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return(r==="string"?String:Number)(t)}var Fo="proportional",_o=ur.positiveBarColor,Bo=ur.negativeBarColor,Vo="beside",Oo="LTR",Uo="right";function Ho(t){return Array.isArray(t)&&t.every(r=>typeof r=="number")}class Go extends de{constructor(r){var o=arguments.length>1&&arguments[1]!==void 0?arguments[1]:new Map,a=arguments.length>2&&arguments[2]!==void 0?arguments[2]:new Map,l=arguments.length>3&&arguments[3]!==void 0?arguments[3]:new Map,n=arguments.length>4&&arguments[4]!==void 0?arguments[4]:new Map,s=arguments.length>5&&arguments[5]!==void 0?arguments[5]:new Map,i=arguments.length>6&&arguments[6]!==void 0?arguments[6]:new Map,h=arguments.length>7&&arguments[7]!==void 0?arguments[7]:new Map,d=arguments.length>8&&arguments[8]!==void 0?arguments[8]:new Map;super(),S(this,"numberOfColumns",void 0),S(this,"numberOfRows",void 0),S(this,"data",void 0),S(this,"columnMins",void 0),S(this,"columnMaxs",void 0),S(this,"columnAxes",void 0),S(this,"valuePlacements",void 0),S(this,"directions",void 0),S(this,"positiveColors",void 0),S(this,"negativeColors",void 0),S(this,"opacities",void 0),S(this,"textAlignments",void 0),S(this,"markers",void 0),this.positiveColors=a,this.negativeColors=l,this.data=r,this.columnAxes=o,this.valuePlacements=n,this.opacities=s,this.directions=i,this.textAlignments=h,this.markers=d,this.numberOfRows=Math.max(...r.map(m=>m.length)),this.numberOfColumns=r.length,this.columnMins=new Map,this.columnMaxs=new Map;for(var c=0;c<r.length;c+=1){var g=r[c];Ho(g)&&(this.columnMins.set(c,Math.min(...g)),this.columnMaxs.set(c,Math.max(...g)))}}get rowCount(){return this.numberOfRows}get columnCount(){return this.numberOfColumns}textForCell(r,o){var a;return"".concat((a=this.data[r])===null||a===void 0?void 0:a[o])}textForColumnHeader(r){return"".concat(r)}textAlignForCell(r,o){var a;return(a=this.textAlignments.get(r))!==null&&a!==void 0?a:Uo}renderTypeForCell(r,o){return r<20||r%2===o%2?"dataBar":"text"}dataBarOptionsForCell(r,o){var a,l,n,s,i,h,d,c=Ve(this.columnMins,r),g=Ve(this.columnMaxs,r),m=(a=this.columnAxes.get(r))!==null&&a!==void 0?a:Fo,v=(l=this.valuePlacements.get(r))!==null&&l!==void 0?l:Vo,x=this.opacities.get(r);x==null||x>1?x=1:x<0&&(x=0);var b=(n=this.directions.get(r))!==null&&n!==void 0?n:Oo,M=(s=this.positiveColors.get(r))!==null&&s!==void 0?s:_o,q=(i=this.negativeColors.get(r))!==null&&i!==void 0?i:Bo,A=Number((h=this.data[r])===null||h===void 0?void 0:h[o]),F=A>=0?M:q,re=(d=this.markers.get(r))!==null&&d!==void 0?d:[];return{columnMin:c,columnMax:g,axis:m,color:F,valuePlacement:v,opacity:x,markers:re,direction:b,value:A}}}const Wo=Go,fe="hide-from-e2e-tests",Qe="sample-section";function*mr(t=1){for(;;)t=t*16807%2147483647,yield t/2147483647}function zo(t=1){const[r]=u.useState(()=>mr(t));return u.useCallback(()=>{const o=r.next();if(o.done===!0)throw new Error("Random number generator unexpectedly finished");return o.value},[r])}function p(t,r=[]){const o=`${Qe}-${t.toLocaleLowerCase().replaceAll(" ","-")}`,a=ee(Qe,...r);return{id:o,className:a}}function T(t,r=[]){const{id:o,className:a}=p(t,r);return{id:o,UNSAFE_className:a}}class Le extends u.Component{static renderAlert(r){return e.jsxs("div",{className:ee("alert",`alert-${r}`),children:[e.jsx("strong",{children:"Well done!"}),"You successfully read this ",r," alert message."]},r)}render(){const r=["success","info","warning","danger"].map(o=>Le.renderAlert(o));return e.jsxs("div",{...p("alerts"),children:[e.jsx("h2",{className:"ui-title",children:"Alerts"}),e.jsx("div",{style:{padding:"1rem 0"},children:r})]})}}class J extends u.Component{static renderButtonBrand(r,o){const a=r.length?`btn-${r}-${o}`:`btn-${o}`;return e.jsx(R,{className:a,style:{marginBottom:"1rem",marginRight:"1rem"},children:o},o)}static renderButtons(r){const o=["primary","secondary","success","info","danger"].map(a=>J.renderButtonBrand(r,a));return e.jsxs("div",{...p(`buttons-${r.length?"outline":"regular"}`),children:[e.jsx("h5",{children:r.length?"Outline":"Regular"}),o]},r)}static renderSocketedButtons(){return e.jsxs("div",{...p("buttons-socketed"),children:[e.jsx("h5",{children:"Socketed Buttons (for linker)"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},children:"Unlinked"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},isLinked:!0,children:"Linked"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},isLinkedSource:!0,children:"Linked Source"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},isLinked:!0,isInvalid:!0,children:"Error"}),e.jsx(Y,{style:{marginBottom:"1rem",marginRight:"1rem"},disabled:!0,children:"Disabled"})]})}constructor(r){super(r),this.state={toggle:!0}}renderInlineButtons(){const{toggle:r}=this.state;return e.jsxs("div",{...p("buttons-inline"),style:{padding:"1rem 0"},children:[e.jsx("h5",{children:"Inline Buttons"}),"Regular btn-inline:",e.jsx(R,{className:"btn-inline mx-2",children:e.jsx(f,{icon:G})}),"Toggle button (class active):",e.jsx(R,{className:ee("btn-inline mx-2",{active:r}),onClick:()=>{this.setState({toggle:!r})},children:e.jsx(f,{icon:G})}),"Disabled:",e.jsx(R,{className:"btn-inline mx-2",disabled:!0,children:e.jsx(f,{icon:G})}),e.jsx("br",{}),e.jsx("br",{}),e.jsx("span",{children:"btn-link-icon (no text):"}),e.jsx(R,{className:"btn-link btn-link-icon px-2",children:e.jsx(f,{icon:G})}),e.jsx("span",{className:"mx-2",children:"btn-link:"}),e.jsx(R,{className:"btn-link",children:"Text Button"}),e.jsx("span",{className:"mx-2",children:"btn-link (text w/ optional with icon):"}),e.jsxs(R,{className:"btn-link",children:[e.jsx(f,{icon:G}),"Add Item"]})]})}render(){const r=["","outline"].map(l=>J.renderButtons(l)),o=this.renderInlineButtons(),a=J.renderSocketedButtons();return e.jsxs("div",{children:[e.jsx("h2",{className:"ui-title",children:"Buttons"}),e.jsxs("div",{style:{padding:"1rem 0"},children:[r,o,a]})]})}}function qo(){const t=gr();qe.random=zo();const[r]=u.useState(()=>new qe(t));return e.jsxs("div",{...p("charts"),children:[e.jsx("h2",{className:"ui-title",children:"Chart"}),e.jsx("div",{style:{height:500},children:e.jsx(qr,{model:r})})]})}function Zo(){const t=[["100","900"],["200","800"],["300","700"],["400","600"],["500","500"],["600","500"],["700","400"],["800","300"],["850","200"],["8XX","100"],["900","75"]].map(([o,a])=>e.jsxs("div",{className:ee("swatch","gray-swatch",`gray-swatch-${o}`),children:[e.jsxs("span",{children:["Gray-",o]}),e.jsxs("span",{style:{backgroundColor:`var(--dh-color-gray-${a})`},children:["--dh-gray-",a]})]},o)),r=["red","orange","yellow","green","blue","purple","white","black","content-bg","primary","primary-dark","background","foreground"].map(o=>e.jsx("div",{className:ee("swatch",`swatch-${o}`),children:o},o));return e.jsxs("div",{...p("colors"),children:[e.jsx("h2",{className:"ui-title",children:"Colors"}),e.jsxs("div",{className:"row",children:[e.jsx("div",{className:"col",children:t}),e.jsx("div",{className:"col",children:r}),e.jsxs("div",{className:"col",children:[e.jsx("p",{children:"Gray Range is available for background/tab colors, and should cover the full range used in mockups. Always use the semantic color names in your .scss files when applicable for UI elements."}),e.jsx("p",{children:"For refrence key colors are $primary for interactable elements, content-bg as background. White is same as gray-200. Gray-100 is used when white needs an active color. content-bg is between 800 and 900."}),e.jsx("pre",{children:`
|
|
2
2
|
// as semantic colours
|
|
3
3
|
$primary: $interfaceblue;
|
|
4
4
|
$secondary: $gray-600;
|
|
@@ -9,7 +9,7 @@ $success: $green;
|
|
|
9
9
|
$info: $yellow;
|
|
10
10
|
$warning: $orange;
|
|
11
11
|
$danger: $red;
|
|
12
|
-
`})]})]})]})}class Yo extends u.Component{constructor(r){super(r),this.makeContextMenuItems=this.makeContextMenuItems.bind(this)}makeContextMenuItems(r){const o=r!==void 0?` ${r}`:"";return[{title:`Show Alert${o}`,icon
|
|
12
|
+
`})]})]})]})}class Yo extends u.Component{constructor(r){super(r),this.makeContextMenuItems=this.makeContextMenuItems.bind(this)}makeContextMenuItems(r){const o=r!==void 0?` ${r}`:"";return[{title:`Show Alert${o}`,icon:$e,action:()=>{alert(`Alert${o}!`)},shortcut:new W({id:"STYLEGUIDE.SHOW_ALERT",name:"Show Alert",shortcut:[E.CTRL,I.A],macShortcut:[E.CMD,I.A]})},{title:`Log Message${o}`,icon:Me,action:()=>{console.log(`Logging a message${o}!`)},shortcut:new W({id:"STYLEGUIDE.LOG_MESSAGE",name:"Log Message",shortcut:[E.CTRL,I.L],macShortcut:[E.CMD,I.L]})},{title:"Sub-menu",actions:()=>this.makeContextMenuItems((r??0)+1),order:3}].concat(new Array(10).fill({title:`Disabled Option${o}`,disabled:!0,order:2}))}render(){const r=this.makeContextMenuItems(),a=[{title:"Show Shortcuts",icon:dr,action:()=>{alert("Show keyboard shortcuts!")},shortcut:new W({id:"STYLEGUIDE.SHOW_SHORTCUTS",name:"Show Shortcuts",shortcut:[E.CTRL,I.SLASH],macShortcut:[E.CMD,I.SLASH]}),group:ae.groups.global}].concat(r),l=()=>new Promise(n=>{setTimeout(()=>{n(r)},3e3)});return e.jsxs("div",{...p("context-menus"),children:[e.jsx("h2",{className:"ui-title",children:"Context Menu"}),e.jsxs(C,{kind:"primary",style:{cursor:"default",marginBottom:"1rem",marginRight:"1rem"},onClick:()=>{},children:["Right Click Me",e.jsx(ae,{actions:a})]}),e.jsxs(C,{kind:"tertiary",style:{cursor:"default",marginBottom:"1rem",marginRight:"1rem"},onClick:()=>{},children:["Right Click Me",e.jsx(ae,{actions:l})]})]})}}class Xo extends u.Component{constructor(r){super(r),this.sampleInput=ce.createRef(),this.handleUpdateCheckboxMap=this.handleUpdateCheckboxMap.bind(this);const o=["Parent A",new Map([["Child 1",!0],["Child 2",!1]])],a=["Parent B",new Map([["Child 3",!0],["Child 4",!1],["Child 5",!0],["Child 6",!1]])],l=["Leaf Parent",!0];this.state={isShown:!1,checkBoxMap:new Map([o,a,l])}}handleUpdateCheckboxMap(r){this.setState({checkBoxMap:r})}renderChild(){return e.jsxs("div",{className:"p-3",children:[e.jsx("h4",{children:"Sample Child"}),e.jsxs("div",{className:"form-group",children:[e.jsxs("label",{htmlFor:"exampleInput1",children:["Input Label",e.jsx("input",{ref:this.sampleInput,type:"text",className:"form-control",id:"exampleInput1","aria-describedby":"emailHelp",placeholder:"Input Placeholder"})]}),e.jsx("small",{className:"form-text text-muted",children:"Help text for a form input"})]})]})}render(){const{isShown:r,checkBoxMap:o}=this.state;return e.jsxs("div",{...p("dialog"),children:[e.jsx("h2",{className:"ui-title",children:"Popover Dialog"}),e.jsx("p",{children:"Popover dialog that can contain interactive elements, can be set to self close on blur."}),e.jsxs(C,{kind:"primary",style:{marginBottom:"1rem",marginRight:"1rem"},onClick:()=>{r?this.setState({isShown:!1}):this.setState({isShown:!0})},children:["Open Dialog",e.jsx(ho,{options:{placement:"bottom"},isShown:r,onEntered:()=>{this.sampleInput.current&&this.sampleInput.current.focus()},onExited:()=>{this.setState({isShown:!1})},closeOnBlur:!0,interactive:!0,children:this.renderChild()})]}),e.jsx("p",{children:"The Hierarchical Checkbox Menu uses a popover dialog to display hierarchical groups of checkboxes."}),e.jsx(oo,{menuText:"Checkbox Menu",valueMap:o,onUpdateValueMap:this.handleUpdateCheckboxMap})]})}}class Ko extends u.Component{constructor(r){super(r),this.state={isShown:!1}}render(){const r=[{title:"Show Alert",icon:$e,action:()=>{alert("Alert!")},shortcut:new W({id:"STYLEGUIDE.SHOW_ALERT",name:"Show Alert",shortcut:[E.CTRL,I.A],macShortcut:[E.CMD,I.A]})},{title:"Log Message",icon:Me,action:()=>{console.log("Logging a message!")},shortcut:new W({id:"STYLEGUIDE.LOG_MESSAGE",name:"Log Message",shortcut:[E.CTRL,I.L],macShortcut:[E.CMD,I.L]})}],a=[{title:"Show Shortcuts",icon:dr,action:()=>{alert("Show keyboard shortcuts!")},shortcut:new W({id:"STYLEGUIDE.SHOW_SHORTCUTS",name:"Show Shortcuts",shortcut:[E.CTRL,I.SLASH],macShortcut:[E.CMD,I.SLASH]}),group:ae.groups.global}].concat(r),{isShown:l}=this.state;return e.jsxs("div",{...p("dropdown-menus"),children:[e.jsx("h2",{className:"ui-title",children:"Dropdown Menu"}),e.jsx("p",{children:"A simple dropdown menu of actions, can open on click of parent container, or controlled by prop."}),e.jsx(C,{kind:"inline",className:"mx-2",icon:Or,onClick:()=>{},children:e.jsx(Ze,{actions:a})}),e.jsxs(C,{kind:"primary",style:{marginRight:"1rem",minWidth:"165px"},onClick:()=>{l?this.setState({isShown:!1}):this.setState({isShown:!0})},children:["Menu Shown: ",l.toString()]}),e.jsxs("div",{ref:this.button,className:"btn btn-secondary disabled",style:{marginRight:"1rem"},children:["Shown using isShown",e.jsx(Ze,{isShown:l,onMenuClosed:()=>{this.setState({isShown:!1})},actions:a})]})]})}}const Qo=`trades = db.t("LearnDeephaven", "StockTrades").where("Date=\`2017-08-25\`")\\
|
|
13
13
|
.headBy(3, "Sym")\\
|
|
14
14
|
.view("Sym", "Last")
|
|
15
15
|
|
|
@@ -205,7 +205,7 @@ ss = new SimulatorState()
|
|
|
205
205
|
simulation = shares30min.update("Values=(double[])ss.update(Sym, TargetPosition, SharesTraded30Min)", "PositionChange=Values[0]", "Position=Values[1]")
|
|
206
206
|
.dropColumns("Values")
|
|
207
207
|
|
|
208
|
-
`,Je={testPython:Qo,testGroovy:Jo};function et(){return e.jsxs("div",{...p("editors"),children:[e.jsx("h2",{className:"ui-title",children:"Editor"}),e.jsx("h5",{className:"sub-title",children:"Python"}),e.jsx("div",{style:{height:400,position:"relative"},children:e.jsx(
|
|
208
|
+
`,Je={testPython:Qo,testGroovy:Jo};function et(){return e.jsxs("div",{...p("editors"),children:[e.jsx("h2",{className:"ui-title",children:"Editor"}),e.jsx("h5",{className:"sub-title",children:"Python"}),e.jsx("div",{style:{height:400,position:"relative"},children:e.jsx(Ye,{settings:{language:"python",value:Je.testPython}})}),e.jsx("h5",{className:"sub-title",children:"Groovy"}),e.jsx("div",{style:{height:400,position:"relative"},children:e.jsx(Ye,{settings:{language:"groovy",value:Je.testGroovy}})})]})}const rt=[];class ot extends ue{model;editedData;constructor(r,o=new Re){super(r),this.model=o,this.editedData=[]}get rowCount(){return this.model.rowCount}get columnCount(){return this.model.columnCount}get floatingTopRowCount(){return 3}get floatingBottomRowCount(){return 3}get isEditable(){return!0}isEditableRange(r){return this.isEditable}setValues(r){throw new Error("Method not implemented.")}delete(r){throw new Error("Method not implemented.")}get pendingRowCount(){return 0}set pendingRowCount(r){}get pendingDataMap(){return new Map}set pendingDataMap(r){}updateFrozenColumns(r){}getColumnIndexByName(r){return Number(r)}textForCell(r,o){return this.editedData[r]?.[o]??this.model.textForCell(r,o)}textForRowHeader(r){return this.model.textForRowHeader(r)}textForRowFooter(r){return this.model.textForRowHeader(r)}textForColumnHeader(r,o){return this.model.textForColumnHeader(r,o)}get hasExpandableRows(){return this.model.hasExpandableRows}get isExpandAllAvailable(){return!1}isRowExpandable(r){return this.model.isRowExpandable(r)}isRowExpanded(r){return this.model.isRowExpanded(r)}setRowExpanded(r,o,a=!1){this.model.setRowExpanded(r,o,a)}expandAll(){throw new Error("Expand all not implemented.")}collapseAll(){throw new Error("Collapse all not implemented.")}depthForRow(r){return this.model.depthForRow(r)}get columns(){return this.getCachedColumns(this.columnCount)}get groupedColumns(){return rt}getCachedColumns=nr(r=>{const o=[];for(let a=0;a<r;a+=1)o.push({name:this.model.textForColumnHeader(a,0),type:"java.lang.String",description:`Mock column ${a}`});return o});get description(){return"A mock used for testing."}get customColumns(){return[]}set customColumns(r){}get formatColumns(){return[]}set formatColumns(r){}get sort(){return[]}set sort(r){}get filter(){return[]}set filter(r){}set formatter(r){}displayString(r){return`${r}`}valueForCell(r,o){return this.textForCell(r,o)}formatForCell(r,o){}setViewport(){this.dispatchEvent(new CustomEvent(ue.EVENT.UPDATED))}async setValueForCell(r,o,a){this.editedData[r]==null&&(this.editedData[r]=[]),this.editedData[r][o]=`${a}`,this.dispatchEvent(new CustomEvent(ue.EVENT.UPDATED))}async setValueForRanges(r,o){hr.forEachCell(r,(a,l)=>{this.setValueForCell(a,l,o)})}editValueForCell(r,o){return this.textForCell(r,o)}isValidForCell(r,o,a){return!0}async columnStatistics(r){throw new Error("Not defined in mock")}async commitPending(){throw new Error("Not defined in mock")}async export(){throw new Error("Not defined in mock")}get pendingDataErrors(){throw new Error("Not defined in mock")}get rollupConfig(){throw new Error("Not defined in mock")}set rollupConfig(r){throw new Error("Not defined in mock")}get selectDistinctColumns(){throw new Error("Not defined in mock")}set selectDistinctColumns(r){throw new Error("Not defined in mock")}async snapshot(r){throw new Error("Not defined in mock")}async textSnapshot(){throw new Error("Not defined in mock")}get totalsConfig(){throw new Error("Not defined in mock")}set totalsConfig(r){throw new Error("Not defined in mock")}valuesTable(r){throw new Error("Not defined in mock")}seekRow(r,o,a,l,n,s,i){throw new Error("Method not implemented.")}get columnHeaderGroups(){return[]}set columnHeaderGroups(r){}get columnHeaderGroupMap(){return new Map}getColumnHeaderParentGroup(){}get initialMovedColumns(){return[]}get initialMovedRows(){return[]}get initialColumnHeaderGroups(){return[]}}function tt(){const[t]=u.useState(()=>new Do([["Matthew Austins","Toronto",35,22],["Doug Millgore","Toronto",14,33],["Bart Marchant","Boston",20,14],["Luigi Dabest","Pittsburgh",66,33]],["Name","Team","Goals","Assists"]));return e.jsx(z,{model:t})}function at(){const[t]=u.useState(()=>new Ae({isEditable:!0,rowCount:Number.MAX_SAFE_INTEGER,columnCount:Number.MAX_SAFE_INTEGER}));return e.jsx(z,{model:t})}function lt(){const[t]=u.useState(()=>new Re);return e.jsx(z,{model:t})}function st(){const[t]=u.useState(()=>new Ro(1e9,1e6)),r=u.useRef(null),[o,a]=u.useState({top:0,bottom:0,left:0,right:0}),l=u.useCallback(d=>{const{top:c,bottom:g,left:m,right:v}=d;a({top:c,bottom:g,left:m,right:v})},[]),{top:n,bottom:s,left:i,right:h}=o;return u.useEffect(function(){let c=!1;return setTimeout(()=>{if(c)return;const g=[];for(let m=n;m<=s;m+=1){const v=[];for(let x=i;x<=h;x+=1)v.push(`${m},${x}`);g.push(v)}t.viewportData={rowOffset:n,columnOffset:i,data:g},r.current?.forceUpdate()},250),()=>{c=!0}},[n,s,i,h,t]),e.jsx(z,{model:t,onViewChanged:l,ref:r})}function nt(){const t=[100,50,20,10,-10,-20,-50,-30,100,0,1],r=[],o=new Map([[0,"proportional"],[1,"middle"],[2,"directional"],[6,"directional"],[7,"directional"],[8,"directional"],[9,"directional"],[10,"directional"]]),a=new Map([[3,"#72d7df"],[4,"#ac9cf4"]]);a.set(5,["#f3cd5b","#9edc6f"]),a.set(19,["#42f54b","#42b9f5","#352aa8"]);const l=new Map([[3,"#f3cd5b"],[4,"#ac9cf4"]]);l.set(5,["#f95d84","#f3cd5b"]),l.set(19,["#e05536","#e607de","#e6e207"]);const n=new Map([[6,"hide"],[7,"overlap"],[8,"overlap"],[9,"overlap"]]),s=new Map([[7,.5],[8,.5],[9,.5]]),i=new Map([[8,"RTL"],[10,"RTL"],[16,"RTL"],[19,"RTL"]]),h=new Map([[9,"left"],[11,"left"]]),d=new Map([[12,[{value:13,color:"white"},{value:14,color:"gray"}]]]);for(let g=0;g<13;g+=1)r.push(t.slice());r.push([70,60,30,20,-10,-30,-20,-50,80,50,10]),r.push([50,20,10,0,0,-10,-30,10,90,20,40]),r.push([-100,-90,-80,-70,-60,-50,-40,-30,-20,-10,0]),r.push(t.slice()),r.push([100,10.5,11.234,-20.5,-50,-2.5,-15.1234,94.254,25,44.4444,-50.5]),r.push([1e6,10,200,-2e4,-2e6,-25,-9e5,8e5,1e5,45e4,1]),r.push(t.slice()),r.push(t.slice()),r.push(t.slice());const[c]=u.useState(()=>new Wo(r,o,a,l,n,s,i,h,d));return e.jsx(z,{model:c})}function ct(){const t=gr(),[r]=u.useState(new ot(t,new Re)),[o]=u.useState(new Ae),[a]=u.useState({autoSelectRow:!0}),[l]=u.useState({font:'12px Arial, "DejaVu Sans", sans-serif',rowHeight:40});return e.jsx("div",{children:e.jsxs(Zr.Provider,{value:l,children:[e.jsx("h2",{className:"ui-title",children:"Grid"}),e.jsx(D,{...T("grids-grid"),children:e.jsx(z,{model:o,theme:a})}),e.jsx("h2",{className:"ui-title",children:"Static Data"}),e.jsx(D,{...T("grids-static"),height:200,children:e.jsx(tt,{})}),e.jsx("h2",{className:"ui-title",children:"Data Bar"}),e.jsx(D,{...T("grids-data-bar"),height:500,children:e.jsx(nt,{})}),e.jsx("h2",{className:"ui-title",children:"Quadrillion rows and columns"}),e.jsx(D,{...T("grids-quadrillion"),position:"relative",height:500,children:e.jsx(at,{})}),e.jsx("h2",{className:"ui-title",children:"Async example"}),e.jsx(D,{...T("grids-async"),position:"relative",height:500,children:e.jsx(st,{})}),e.jsx("h2",{className:"ui-title",children:"Tree Grid"}),e.jsx(D,{...T("grids-tree"),height:500,children:e.jsx(lt,{})}),e.jsx("h2",{className:"ui-title",children:"Iris Grid"}),e.jsx(D,{...T("grids-iris"),height:500,children:e.jsx(Yr,{model:r})})]})})}async function er(t){try{return await navigator.clipboard.writeText(t)}catch(r){throw new Error(`Unable to copy: ${r}`)}}const it="dh",dt="vs",rr=(t,r)=>r.toLowerCase()+t.split("-").map(o=>o.charAt(0).toUpperCase()+o.slice(1)).join("");function vr({message:t,message:{text:r}}){const[o,a]=u.useState(!1);return u.useEffect(function(){if(r==null||r==="")return;a(!0);const n=setTimeout(()=>{a(!1)},2e3);return()=>{clearTimeout(n)}},[t,r]),e.jsx("p",{className:o?"flash in":"flash out",children:r})}vr.propTypes={message:se.shape({text:se.node}).isRequired};function ht(){const[t,r]=u.useState(!0),[o,a]=u.useState(!0),[l,n]=u.useState(""),[s,i]=u.useState({text:""}),h=Object.values(L).filter(c=>{const g=rr(c.iconName,c.prefix).toLowerCase().indexOf(l.replace(/\s/g,"").replace(/-/g,"").toLowerCase())!==-1,m=t&&c.prefix===it,v=o&&c.prefix===dt;return g&&(m||v)}).map(c=>{const g=rr(c.iconName,c.prefix);return e.jsxs(C,{kind:"inline",className:"card",onClick:()=>{er(g).then(()=>{i({text:e.jsxs("span",{children:[e.jsx(f,{icon:L.vsOutput})," Copied text:"," ",e.jsx("strong",{children:g})]})})}).catch(m=>{i({text:e.jsx("span",{className:"text-danger",children:m.message})})})},children:[e.jsx(ie,{size:"L",children:e.jsx(f,{icon:c})}),e.jsx("label",{title:g,children:g})]},g)}),d=`
|
|
209
209
|
<div className="fa-md fa-layers">
|
|
210
210
|
<FontAwesomeIcon
|
|
211
211
|
mask={vsOrganization}
|
|
@@ -213,11 +213,13 @@ simulation = shares30min.update("Values=(double[])ss.update(Sym, TargetPosition,
|
|
|
213
213
|
transform="down-7 right-7"
|
|
214
214
|
/>
|
|
215
215
|
<FontAwesomeIcon icon={dhAddSmall} />
|
|
216
|
-
</div>`;return e.jsxs("div",{...p("icons"),children:[e.jsx("h2",{className:"ui-title",children:"Icons"}),e.jsx("div",{className:"row",children:e.jsxs("div",{className:"col",children:[e.jsx("h4",{children:"Icon Composition"}),e.jsx("p",{children:"Icons can be used indivudally or composed together using font-awesome composition:"}),e.jsxs("div",{className:"icons",children:[e.jsx("div",{className:"icon card",children:e.jsx(f,{icon:Ve})}),e.jsx("div",{className:"icon card",children:e.jsx(f,{icon:Oe})}),e.jsx("div",{className:"icon card",children:e.jsx(f,{icon:Ue})}),e.jsx("div",{className:"icon card",children:"="}),e.jsxs(C,{kind:"inline",className:"card",onClick:()=>{er(d).then(()=>{i({text:e.jsx("span",{children:"Copied composition example"})})}).catch(c=>{i({text:e.jsx("span",{className:"text-danger",children:c.message})})})},children:[e.jsx("div",{className:"icon",children:e.jsxs("div",{className:"fa-md fa-layers",children:[e.jsx(f,{mask:Ve,icon:Oe,transform:"down-7 right-7"}),e.jsx(f,{icon:Ue})]})}),e.jsx("label",{children:"Custom"})]})]})]})}),e.jsx("hr",{}),e.jsx("div",{className:"row",children:e.jsxs("div",{className:"col",children:[e.jsx("h4",{children:"All available icons"}),e.jsx("p",{children:"If you cannot find or compose a relevant icon for your use case, please request a new one to be created from design."}),e.jsxs("div",{className:"form-inline mb-3",children:[e.jsx("input",{type:"search",placeholder:"Basic icon search...",value:l,className:"form-control",onChange:c=>{n(c.target.value)}}),e.jsx("span",{className:"mx-2",children:"Show: "}),e.jsx(C,{kind:"inline",active:o,className:"mr-2",onClick:()=>t(!o),icon:o?L.vsCheck:L.vsClose,children:"VS ICONS"}),e.jsx(C,{kind:"inline",active:a,className:"mr-2",onClick:()=>r(!a),icon:a?L.vsCheck:L.vsClose,children:"DH ICONS"}),e.jsxs("small",{children:["(",h.length," icon",h.length===1?"":"s",")"]})]}),e.jsxs("div",{className:"icons",children:[h,h.length===0&&e.jsx("p",{className:"no-result",children:"No icons found."}),e.jsx(vr,{message:s})]})]})})]})}const fe=[{title:"Title 1",value:"Value 1"},{title:"Title 2",value:"Value 2"},{title:"Title 3",value:"Value 3"},{title:"Title 4",value:"Value 4"},{title:"Title 5",value:"Value 5"},{title:"Title 6",value:"Value 6"},{title:"Title 7",value:"Value 7"},{title:"Title 8",value:"Value 8"},{title:"Title 9",value:"Value 9"},{title:"Title 9",value:"Value 9"},{title:"Title 10",value:"Value 10"},{title:"Title 11",value:"Value 11"},{title:"Title 12",value:"Value 12"}],ut=[{title:"1 minute",value:1*60*1e3},{title:"5 minutes",value:5*60*1e3},{title:"20 minutes",value:20*60*1e3},{title:"45 minutes",value:45*60*1e3},{title:"1 hour",value:1*60*60*1e3},{title:"4 hours",value:4*60*60*1e3}],or=["Invalid","Valid"];function gt(){const[a,r]=u.useState(!1),[o,t]=u.useState(""),[l,n]=u.useState(!0),[s,i]=u.useState(!1),[h,d]=u.useState(!1),[c,g]=u.useState(!1),[m,v]=u.useState(null),[x,b]=u.useState("1"),[M,q]=u.useState(),[A,F]=u.useState("-DLiveTableMonitor.updateThreads=8 -DLiveTableMonitor.printDependencyInformation=false -Dassertion.heapDump=true -Drequire.heapDump=true -Dassertion.heapDump=true -Drequire.heapDump=true"),[re,xr]=u.useState(""),[Pe,fr]=u.useState(or[0]),br=u.useCallback(y=>{b(y.target.value)},[]),Z=u.useCallback(()=>{r(!a)},[a]),yr=u.useCallback(y=>{t(y.target.value)},[]),jr=u.useCallback(y=>{xr(y.target.value)},[]);return e.jsxs("div",{...p("inputs",["style-guide-inputs"]),children:[e.jsx("h2",{className:"ui-title",children:"Inputs"}),e.jsxs("div",{className:"row",children:[e.jsx("div",{className:"col",children:e.jsxs("form",{children:[e.jsxs("div",{className:"form-group",children:[e.jsxs("label",{htmlFor:"exampleInput1",children:["Input Label",e.jsx("input",{type:"text",className:"form-control",id:"exampleInput1","aria-describedby":"emailHelp",placeholder:"Input Placeholder"})]}),e.jsx("small",{className:"form-text text-muted",children:"Help text for a form imput"})]}),e.jsxs("div",{className:"form-group",children:[e.jsxs("label",{htmlFor:"exampleInput2",children:["Input Label",e.jsx("input",{type:"text",className:"form-control",id:"exampleInput2","aria-describedby":"emailHelp",placeholder:"Input Disabled",disabled:!0})]}),e.jsx("small",{className:"form-text text-muted",children:"Disabled input"})]}),e.jsx("div",{className:"form-group",children:e.jsxs("label",{htmlFor:"exampleInputPassword1",children:["Password",e.jsx("input",{type:"password",className:"form-control",id:"exampleInputPassword1",placeholder:"Password",defaultValue:"123456789"})]})}),e.jsx("div",{className:"form-group",children:e.jsx(uo,{value:o,placeholder:"Search Input",onChange:yr})})]})}),e.jsx("div",{className:"col",children:e.jsxs("form",{children:[e.jsx("h5",{children:" Checkboxes "}),e.jsx(P,{className:"form-group",checked:l,onChange:()=>n(!l),children:"Checked checkbox"}),e.jsx(P,{className:"form-group",checked:s,onChange:()=>i(!s),children:"Unchecked checkbox"}),e.jsx(P,{className:"form-group",disabled:!0,checked:null,children:"Disabled checkbox"}),e.jsx(P,{className:"form-group",isInvalid:!0,checked:h,onChange:()=>d(!h),children:"Invalid checkbox"}),e.jsx(P,{className:"form-group",checked:c,onChange:()=>g(!c),children:"Add radio button"}),e.jsx(P,{className:"form-group",checked:m,onChange:()=>{m==null?v(!0):v(m?!1:null)},children:"Indeterminate Cycle"})]})}),e.jsxs("div",{className:"col",children:[e.jsxs("form",{children:[e.jsx("h5",{children:" Radios "}),e.jsxs(Xr,{onChange:br,value:x,children:[e.jsx(X,{value:"1",children:"Toggle this custom radio"}),e.jsx(X,{value:"2",children:"Or toggle this other custom radio"}),e.jsx(X,{value:"3",disabled:!0,children:"Disabled radio"}),e.jsx(X,{value:"4",isInvalid:!0,children:"Invalid radio"}),e.jsx(e.Fragment,{children:c&&e.jsx(X,{value:"5",children:"Extra radio item"})})]})]}),e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Toggle Buttons"}),e.jsxs("div",{className:"form-inline justify-content-between",children:[e.jsx("label",{children:String(a)}),e.jsx(K,{on:a,onClick:Z})]}),e.jsxs("div",{className:"form-inline justify-content-between",children:[e.jsx("label",{children:String(!a)}),e.jsx(K,{on:!a,onClick:Z})]}),e.jsxs("div",{className:"form-inline justify-content-between",children:[e.jsx("label",{className:"isInvalid",children:"isInvalid"}),e.jsx(K,{on:!a,isInvalid:!0,onClick:Z})]}),e.jsxs("div",{className:"form-inline justify-content-between",children:[e.jsx("label",{className:"disabled",children:"disabled"}),e.jsx(K,{on:!a,disabled:!0,onClick:Z})]})]})]}),e.jsxs("div",{className:"col",children:[e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Selection Menu"}),e.jsxs(me,{onChange:y=>{},defaultValue:"0",className:"custom-select",children:[e.jsx("option",{disabled:!0,value:"0",children:"Custom Selection"}),e.jsx("option",{value:"1",children:"One"}),e.jsx("option",{value:"2",children:"Two"}),e.jsx("option",{value:"3",children:"Three"})]})]}),e.jsx("div",{className:"form-group",children:e.jsxs(me,{onChange:y=>{},defaultValue:"0",className:"custom-select",disabled:!0,children:[e.jsx("option",{disabled:!0,value:"0",children:"Custom Selection"}),e.jsx("option",{value:"1",children:"One"}),e.jsx("option",{value:"2",children:"Two"}),e.jsx("option",{value:"3",children:"Three"})]})}),e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Input with Select"}),e.jsx("div",{className:"input-group",children:e.jsx(He,{options:fe,inputPlaceholder:"10.128.0.8",searchPlaceholder:"Search actions here"})}),e.jsx("br",{}),e.jsx("div",{className:"input-group",children:e.jsx(He,{options:fe,inputPlaceholder:"10.128.0.8",searchPlaceholder:"Search actions here",disabled:!0})})]}),e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"AutoCompleteInput"}),e.jsx(to,{options:fe,noMatchText:"No Matches."})]})]}),e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Validate Label"}),e.jsx(ge,{validationError:re?void 0:"Value not set",isModified:!!re,id:"validateInput1",labelText:"Input Field",hintText:"Hint text",children:e.jsx("input",{type:"text",className:"form-control","aria-describedby":"emailHelp",placeholder:"Type to modify",onChange:jr})}),e.jsx(ge,{validationError:Pe==="Invalid"?"Invalid value":void 0,id:"validateLabelInput2",labelText:"Dropdown",children:e.jsx(me,{onChange:y=>fr(y),value:Pe,children:or.map(y=>e.jsx(Kr,{value:y,children:y},y))})}),e.jsx(ge,{labelText:"Switch",isModified:a,children:e.jsx(K,{on:a,onClick:Z})})]})}),e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Time Input"}),e.jsx(ao,{}),e.jsx("br",{}),e.jsx("h5",{children:"Date Input"}),e.jsx(lo,{}),e.jsx("br",{}),e.jsx("h5",{children:"DateTime Input"}),e.jsx(Qr,{}),e.jsx("br",{}),e.jsx("h5",{children:"Custom Timeselect"}),e.jsx(so,{options:ut,value:M??null,onChange:q,customText:"Custom Timeout",placeholder:"Select a timeout",timeToValue:y=>y*1e3})]})})]}),e.jsx("div",{className:"row",children:e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Auto Resize Textarea"}),e.jsx(no,{value:A,delimiter:" -",onChange:F})]})})})]})}class mt extends u.PureComponent{constructor(r){super(r),this.handleSelect=this.handleSelect.bind(this),this.handleViewportChange=this.handleViewportChange.bind(this),this.selectedItems=[],this.state={items:[],offset:0,itemCount:5e5}}handleSelect(r){const o=this.selectedItems.indexOf(r);o>=0?this.selectedItems.splice(o,1):this.selectedItems.push(r);const t=o<0,{offset:l}=this.state;let{items:n}=this.state;n=[].concat(n);const s=r-l;s>=0&&s<n.length&&(n[s].isSelected=t),this.setState({items:n})}handleViewportChange(r,o){const{itemCount:t}=this.state,l=o-r+1,n=Math.max(0,r-l),s=Math.min(o+l,t),i=[];for(let d=n;d<=s&&d<=t;d+=1){const c=`Item ${d}`,g=this.selectedItems.indexOf(d)>=0;i.push({value:c,isSelected:g})}const h=n;this.setState({offset:h,items:i})}render(){const{offset:r,items:o,itemCount:t}=this.state;return e.jsx(Jr,{itemCount:t,items:o,offset:r,onSelect:this.handleSelect,onViewportChange:this.handleViewportChange})}}class tr extends u.PureComponent{static defaultProps;static propTypes;constructor(r){super(r),this.handleSelect=this.handleSelect.bind(this),this.handleViewportChange=this.handleViewportChange.bind(this),this.selectedItems=[],this.state={items:[],offset:0,itemCount:5e5}}handleSelect(r){const{itemCount:o}=this.state;console.log("Item selected at index",r,"/",o)}handleViewportChange(r,o){const{itemCount:t}=this.state,l=o-r+1,n=Math.max(0,r-l),s=Math.min(o+l,t),i=[];for(let d=n;d<=s;d+=1){const c=`Item ${d}`,g=this.selectedItems.indexOf(d)>=0;i.push({value:c,isSelected:g})}const h=n;this.setState({offset:h,items:i})}render(){const{isMultiSelect:r}=this.props,{offset:o,items:t,itemCount:l}=this.state;return e.jsx(go,{isMultiSelect:r,itemCount:l,items:t,offset:o,onSelect:this.handleSelect,onViewportChange:this.handleViewportChange})}}function vt(){return e.jsxs("div",{...p("item-list-inputs",["style-guide-inputs"]),children:[e.jsx("h2",{className:"ui-title",children:"Item Lists"}),e.jsxs("div",{className:"row",children:[e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Select List"}),e.jsx("div",{style:{height:"300px"},children:e.jsx(mt,{})})]})}),e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Item List"}),e.jsx("div",{style:{height:"300px"},children:e.jsx(tr,{})})]})}),e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Multi Select Item List"}),e.jsx("div",{style:{height:"300px"},children:e.jsx(tr,{isMultiSelect:!0})})]})})]})]})}function pt(){const[a,r]=u.useState(0),[o,t]=u.useState(!0),l=()=>{r(0)};function n(s){return e.jsxs(ce.Fragment,{children:[e.jsxs(C,{kind:"primary",style:{marginBottom:"1rem",marginRight:"1rem"},onClick:()=>{r(s)},children:[s," ",s>1?"Actions":"Action"]}),e.jsx(mo,{isOpen:a===s,headerText:"Header Text",bodyText:"This is where the body text goes",onConfirm:l,onCancel:s>=2?l:void 0,onDiscard:s>=3?l:void 0})]},s)}return e.jsxs("div",{...p("modals"),children:[e.jsx("h2",{className:"ui-title",children:"Basic Modals"}),e.jsx("div",{style:{padding:"1rem"},children:[1,2,3].map(s=>n(s))}),e.jsx("h2",{className:"ui-title",children:"Custom Modal"}),e.jsx("div",{style:{padding:"1rem"},children:e.jsx("div",{className:"modal-dialog theme-bg-light",role:"dialog",children:e.jsxs("div",{className:"modal-content",children:[e.jsxs("div",{className:"modal-header",children:[e.jsx("h5",{className:"modal-title",children:"Modal title"}),e.jsx("button",{type:"button",className:"close","data-dismiss":"modal","aria-label":"Close",children:e.jsx("span",{"aria-hidden":"true",children:"×"})})]}),e.jsxs("div",{className:"modal-body",children:[e.jsx("p",{children:"Modal body text goes here."}),e.jsx(P,{checked:o,onChange:()=>t(!o),children:"Checked checkbox"})]}),e.jsxs("div",{className:"modal-footer",children:[e.jsx(C,{kind:"secondary","data-dismiss":"modal",onClick:()=>{},children:"Close"}),e.jsx(C,{kind:"primary",onClick:()=>{},children:"Save changes"})]})]})})})]})}function xt(){return e.jsxs("div",{...p("progress"),children:[e.jsx("h2",{className:"ui-title",children:"Progress"}),e.jsxs("div",{className:"row",children:[e.jsxs("div",{className:"col",children:[e.jsx("h5",{children:"Determinate Progress Loader"}),e.jsx("br",{}),e.jsx("div",{className:"progress",style:{marginBottom:"1rem"},children:e.jsx("div",{className:"progress-bar bg-primary",style:{width:"25%"},"aria-valuenow":25,"aria-valuemin":0,"aria-valuemax":100})})]}),e.jsxs("div",{className:"col",children:[e.jsx("h5",{children:"Indeterminate Progress Spinner"}),e.jsx(ke,{className:"loading-spinner-large"})]}),e.jsxs("div",{className:"col",children:[e.jsx("h5",{children:"Button Progress Spinner"}),e.jsx(C,{kind:"primary",className:"btn-spinner btn-cancelable",style:{minWidth:"10rem"},onClick:()=>{},children:e.jsxs("span",{children:[e.jsx(ke,{className:"loading-spinner-vertical-align"}),e.jsx("span",{className:"btn-normal-content",children:"Connecting"}),e.jsx("span",{className:"btn-hover-content",children:"Cancel"})]})})]})]})]})}class ft extends u.PureComponent{constructor(r){super(r),this.handleSliderChange=this.handleSliderChange.bind(this),this.state={startTime:24*60*60*.25,endTime:24*60*60*.75}}handleSliderChange(r){const{startTime:o,endTime:t}=r;this.setState({startTime:o}),this.setState({endTime:t})}render(){const{startTime:r,endTime:o}=this.state;return e.jsxs("div",{...p("time-slider-inputs",["style-guide-inputs"]),children:[e.jsx("h2",{className:"ui-title",children:"Time Slider"}),e.jsx(co,{startTime:r,endTime:o,onChange:this.handleSliderChange}),e.jsxs("p",{children:["StartTime: ",Ye.formatTime(r)]}),e.jsxs("p",{children:["EndTime: ",Ye.formatTime(o)]})]})}}function bt(){const r=[$e,De].map(o=>e.jsx(f,{icon:o},`${o.prefix}-${o.iconName}`));return e.jsxs("div",{...p("tooltips"),children:[e.jsx("h2",{className:"ui-title",title:"Make better looking tooltips than this one!",children:"Tooltips"}),e.jsxs("div",{className:"btn btn-primary",style:{cursor:"default",marginBottom:"1rem",marginRight:"1rem"},children:["Simple Tooltip",e.jsx(le,{children:"Text only content"})]}),e.jsxs("div",{className:"btn btn-secondary",style:{cursor:"default",marginBottom:"1rem",marginRight:"1rem"},children:["Complex Tooltip",e.jsxs(le,{children:[e.jsxs("div",{children:["Here is some ",e.jsx("i",{children:"cool"})," ",e.jsx("b",{children:"text"})]}),e.jsx("hr",{}),e.jsx("div",{children:"And some icons down here"}),e.jsxs("div",{children:[e.jsx(ke,{className:"loading-spinner-vertical-align"}),r]})]})]}),e.jsxs("div",{className:"btn btn-success",style:{cursor:"default",marginBottom:"1rem",marginRight:"1rem"},children:["Interactive Tooltip",e.jsxs(le,{interactive:!0,children:[e.jsx("div",{children:"This tooltip is interactive."}),e.jsx("hr",{}),e.jsx(C,{kind:"primary",onClick:()=>{alert("Button clicked!")},children:"Show Alert"})]})]})]})}function yt(){return e.jsxs("div",{...p("typography"),children:[e.jsx("h2",{className:"ui-title",children:"Typography"}),e.jsxs("div",{className:"row",children:[e.jsxs("div",{className:"col",children:[e.jsx("h1",{className:"text-muted","data-no-menu":!0,children:"h1. Unused"}),e.jsx("h2",{className:"text-muted","data-no-menu":!0,children:"h2. Unused"}),e.jsx("h3",{className:"text-muted","data-no-menu":!0,children:"h3. Unused"}),e.jsx("h4",{"data-no-menu":!0,children:"h4. Standard Heading"}),e.jsx("h5",{"data-no-menu":!0,children:"h5. Small Heading"}),e.jsx("h6",{className:"text-muted","data-no-menu":!0,children:"h6. Unused"})]}),e.jsxs("div",{className:"col",children:[e.jsx("h4",{children:"Fonts"}),e.jsx("p",{children:"UI: Fira Sans;"}),e.jsx("p",{className:"text-monospace",children:"Code: Fira Mono;"}),e.jsx("p",{children:'Tables: Fira Sans; font-feature-settings: "tnum";'}),e.jsx("p",{children:"Default font-size: 14px = 1rem"})]})]})]})}class jt extends u.PureComponent{static propTypes;static defaultProps;constructor(r){super(r),this.handleSelectionChange=this.handleSelectionChange.bind(this),this.handleViewportChange=this.handleViewportChange.bind(this),this.itemList=ce.createRef(),this.selectedItems=[],this.state={topRow:null,bottomRow:null}}focusItem(r){this.itemList.current&&this.itemList.current.focusItem(r)}handleSelectionChange(r){console.log("Selection changed",r);const{onSelectionChange:o}=this.props;o(r)}handleViewportChange(r,o){const{items:t}=this.props,l=o-r+1,n=Math.max(0,r-l),s=Math.min(o+l,t.length);this.setState({topRow:n,bottomRow:s})}getViewportItems=nr((r,o,t)=>r==null||o==null?[]:t.slice(r,o));render(){const{draggablePrefix:r,droppableId:o,isDragDisabled:t,isDropDisabled:l,isMultiSelect:n,items:s,selectedRanges:i}=this.props,{topRow:h,bottomRow:d}=this.state;return e.jsx(Q,{draggablePrefix:r,droppableId:o,isDragDisabled:t,isDropDisabled:l,isMultiSelect:n,itemCount:s.length,items:this.getViewportItems(h,d,s),offset:h??0,onSelectionChange:this.handleSelectionChange,onViewportChange:this.handleViewportChange,ref:this.itemList,selectedRanges:i})}}const be=["Draggable Only","Drag and Drop","Droppable Only"],wt=[{isDropDisabled:!0},{},{isDragDisabled:!0}],Ct=(a="Item",r=1e3)=>{const o=[];for(let t=0;t<r;t+=1)o.push(`${a}-${t}`);return o};class ne extends u.Component{static handleDragStart(r){console.log("handleDragStart",r)}static handleDragUpdate(r){console.log("handleDragUpdate",r)}constructor(r){super(r),this.handleDragEnd=this.handleDragEnd.bind(this),this.animationFrame=null;const o=[],t=[],l=[];for(let n=0;n<be.length;n+=1)o[n]=Ct(be[n]),t[n]=[],l[n]=ce.createRef();this.state={items:o,lists:l,selectedRanges:t}}componentWillUnmount(){this.animationFrame!=null&&cancelAnimationFrame(this.animationFrame)}handleDragEnd(r){console.log("handleDragEnd",r);const{source:o,destination:t}=r;if(o==null||t==null)return;const l=Q.getDraggableIndex(o.droppableId),n=Q.getDraggableIndex(t.droppableId),s=l===n;let i=t.index;s&&o.index<t.index&&(i+=1);let h=i;this.setState(({items:d,selectedRanges:c})=>{const g=[...d[l]],m=s?g:[...d[n]],v=Ge.reorder(g,c[l],m,i),x=[...d];x[l]=g,x[n]=m,h=s?Ge.adjustDestinationIndex(i,c[n]):i;const b=[...c];return b[l]=[],b[n]=[[h,h+v.length-1]],{items:x,selectedRanges:b}},()=>{this.animationFrame!=null&&cancelAnimationFrame(this.animationFrame),this.animationFrame=requestAnimationFrame(()=>{this.animationFrame=null;const{lists:d}=this.state;d[n]?.current?.focusItem(h)})})}handleSelectionChange(r,o){this.setState(({selectedRanges:t})=>{const l=[...t];return l[r]=[...o],{selectedRanges:l}})}getSelectionChangeHandler=Fe(r=>this.handleSelectionChange.bind(this,r));getDraggableList=Fe((r,o,t,l)=>e.jsx(jt,{items:r,droppableId:Q.getDraggableId("drop-list",l),draggablePrefix:Q.getDraggableId("draggable-item",l),onSelectionChange:this.getSelectionChangeHandler(l),isMultiSelect:!0,ref:t,selectedRanges:o,...wt[l]}));render(){const{items:r,lists:o,selectedRanges:t}=this.state;return e.jsxs("div",{...p("draggable-lists",["style-guide-inputs"]),children:[e.jsx("h2",{className:"ui-title",children:"Drag and Drop Lists"}),e.jsx("div",{className:"row",children:e.jsx(wr,{onDragStart:ne.handleDragStart,onDragUpdate:ne.handleDragUpdate,onDragEnd:this.handleDragEnd,children:be.map((l,n)=>e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsxs("h5",{children:[l," List"]}),e.jsx("div",{style:{height:"300px"},children:this.getDraggableList(r[n],t[n],o[n],n)})]})},l))})})]})}}let ar=0;function St(){const a=ar;return ar+=1,a}const Tt=mr(25);function ye(a=1,r=5){const o=Number(Tt.next().value);return Math.floor(o*r)+a}function je(a,r=St()){return{id:r,type:a}}function lr(a=ye(),r=ye(),o=ye()){const t=[];for(let l=0;l<a;l+=1)t.push(je("SUBMENU"));for(let l=0;l<r;l+=1)t.push(je("PAGE"));for(let l=0;l<o;l+=1)t.push(je("SWITCH"));return t}function we({type:a,id:r}){switch(a){case"SUBMENU":return`Submenu ${r}`;case"PAGE":return`Page ${r}`;case"SWITCH":return`Switch ${r}`}}function Nt({type:a}){switch(a){case"SUBMENU":return Hr;case"PAGE":return Ur;case"SWITCH":return G}}function kt(){const[a,r]=u.useState([]),[o,t]=u.useState(new Map),l=u.useCallback(c=>{r([...a,c])},[a,r]),n=u.useCallback(()=>{const c=[...a];c.pop(),r(c)},[a,r]),s=u.useCallback(()=>{const c=[a[0]];r(c)},[a,r]),i=u.useCallback(c=>{const g=o.get(c)??!1,m=new Map(o);m.set(c,!g),t(m)},[o,t]),h=u.useCallback(c=>{const g=a[a.length-1],{items:m}=g;if(!m)throw new Error("Navigation handleSelect triggered without items to select");const v=m[c];switch(v.type){case"PAGE":l({title:we(v)});break;case"SUBMENU":l({title:we(v),items:lr()});break;case"SWITCH":i(v.id);break}},[a,i,l]);u.useEffect(function(){r([{title:"Navigation Menu",items:lr()}])},[]);const d=u.useMemo(()=>a.map(({items:c,title:g},m)=>{if(!c)return e.jsx(We,{onBack:n,onClose:s,title:g,children:e.jsx("div",{children:"Page content!"})},g);let v=null;if(c!=null){const x=c.map(b=>{const M=we(b),q=Nt(b);let A,F;return b.type==="SWITCH"&&(A=o.get(b.id)??!1,F=()=>{h(b.id)}),{title:M,icon:q,isOn:A,onChange:F}});v=e.jsx(ro,{onSelect:h,items:x})}else v=e.jsx("div",{children:"Page content"});return e.jsx(We,{onBack:m>0?n:void 0,onClose:m>0?s:void 0,title:g,children:v},g)}),[a,o,h,n,s]);return e.jsxs("div",{...p("navigations"),children:[e.jsx("h2",{className:"ui-title",children:"Navigations"}),e.jsx("div",{className:"navigations",children:e.jsx(eo,{children:d})})]})}const Et=`:root{--dh-color-gray-hue: 219deg;--dh-color-gray-50: hsl(calc(var(--dh-color-gray-hue) + 81deg), 6%, 10%);--dh-color-gray-75: hsl(calc(var(--dh-color-gray-hue) + 61deg), 5%, 13%);--dh-color-gray-100: hsl(calc(var(--dh-color-gray-hue) + 66deg), 5%, 17%);--dh-color-gray-200: hsl(calc(var(--dh-color-gray-hue) + 66deg), 4%, 19%);--dh-color-gray-300: hsl(calc(var(--dh-color-gray-hue) + 66deg), 4%, 21%);--dh-color-gray-400: hsl(calc(var(--dh-color-gray-hue) + 61deg), 2%, 25%);--dh-color-gray-500: hsl(calc(var(--dh-color-gray-hue) + 51deg), 1%, 36%);--dh-color-gray-600: hsl(calc(var(--dh-color-gray-hue) + 81deg), 0%, 57%);--dh-color-gray-700: hsl(calc(var(--dh-color-gray-hue) - 219deg), 1%, 75%);--dh-color-gray-800: hsl(calc(var(--dh-color-gray-hue) - 159deg), 6%, 94%);--dh-color-gray-900: hsl(calc(var(--dh-color-gray-hue) - 159deg), 25%, 98%);--dh-color-black: var(--dh-color-gray-50);--dh-color-white: var(--dh-color-gray-800);--dh-color-blue-hue: 222deg;--dh-color-blue-100: hsl(var(--dh-color-blue-hue) 65% 19%);--dh-color-blue-200: hsl(var(--dh-color-blue-hue) 66% 25%);--dh-color-blue-300: hsl(var(--dh-color-blue-hue) 65% 32%);--dh-color-blue-400: hsl(var(--dh-color-blue-hue) 63% 39%);--dh-color-blue-500: hsl(var(--dh-color-blue-hue) 61% 47%);--dh-color-blue-600: hsl(var(--dh-color-blue-hue) 68% 54%);--dh-color-blue-700: hsl(var(--dh-color-blue-hue) 83% 62%);--dh-color-blue-800: hsl(var(--dh-color-blue-hue) 94% 68%);--dh-color-blue-900: hsl(var(--dh-color-blue-hue) 100% 74%);--dh-color-blue-1000: hsl(var(--dh-color-blue-hue) 100% 80%);--dh-color-blue-1100: hsl(calc(var(--dh-color-blue-hue) - 1deg) 100% 84%);--dh-color-blue-1200: hsl(calc(var(--dh-color-blue-hue) - 1deg) 100% 89%);--dh-color-blue-1300: hsl(var(--dh-color-blue-hue) 100% 93%);--dh-color-blue-1400: hsl(calc(var(--dh-color-blue-hue) + 2deg) 100% 96%);--dh-color-red-hue: 345deg;--dh-color-red-100: hsl(calc(var(--dh-color-red-hue) + 1deg) 54% 18%);--dh-color-red-200: hsl(var(--dh-color-red-hue) 55% 24%);--dh-color-red-300: hsl(calc(var(--dh-color-red-hue) + 1deg) 54% 30%);--dh-color-red-400: hsl(var(--dh-color-red-hue) 54% 37%);--dh-color-red-500: hsl(var(--dh-color-red-hue) 53% 44%);--dh-color-red-600: hsl(var(--dh-color-red-hue) 55% 51%);--dh-color-red-700: hsl(var(--dh-color-red-hue) 71% 59%);--dh-color-red-800: hsl(var(--dh-color-red-hue) 92% 67%);--dh-color-red-900: hsl(calc(var(--dh-color-red-hue) - 1deg) 100% 74%);--dh-color-red-1000: hsl(calc(var(--dh-color-red-hue) - 2deg) 100% 80%);--dh-color-red-1100: hsl(calc(var(--dh-color-red-hue) - 2deg) 100% 85%);--dh-color-red-1200: hsl(calc(var(--dh-color-red-hue) - 1deg) 100% 90%);--dh-color-red-1300: hsl(calc(var(--dh-color-red-hue) - 1deg) 100% 94%);--dh-color-red-1400: hsl(calc(var(--dh-color-red-hue) - 1deg) 100% 96%);--dh-color-orange-hue: 22deg;--dh-color-orange-100: hsl(calc(var(--dh-color-orange-hue) - 2deg) 100% 14%);--dh-color-orange-200: hsl(var(--dh-color-orange-hue) 96% 18%);--dh-color-orange-300: hsl(calc(var(--dh-color-orange-hue) + 1deg) 90% 23%);--dh-color-orange-400: hsl(var(--dh-color-orange-hue) 84% 29%);--dh-color-orange-500: hsl(var(--dh-color-orange-hue) 80% 35%);--dh-color-orange-600: hsl(var(--dh-color-orange-hue) 74% 41%);--dh-color-orange-700: hsl(var(--dh-color-orange-hue) 70% 48%);--dh-color-orange-800: hsl(var(--dh-color-orange-hue) 78% 55%);--dh-color-orange-900: hsl(calc(var(--dh-color-orange-hue) - 1deg) 95% 63%);--dh-color-orange-1000: hsl(var(--dh-color-orange-hue) 100% 71%);--dh-color-orange-1100: hsl(calc(var(--dh-color-orange-hue) + 1deg) 100% 78%);--dh-color-orange-1200: hsl(calc(var(--dh-color-orange-hue) + 2deg) 100% 84%);--dh-color-orange-1300: hsl(calc(var(--dh-color-orange-hue) + 2deg) 100% 90%);--dh-color-orange-1400: hsl(calc(var(--dh-color-orange-hue) + 3deg) 100% 94%);--dh-color-yellow-hue: 49deg;--dh-color-yellow-100: hsl(calc(var(--dh-color-yellow-hue) + 2deg) 100% 9%);--dh-color-yellow-200: hsl(calc(var(--dh-color-yellow-hue) + 1deg) 100% 12%);--dh-color-yellow-300: hsl(calc(var(--dh-color-yellow-hue) + 2deg) 100% 15%);--dh-color-yellow-400: hsl(calc(var(--dh-color-yellow-hue) + 1deg) 90% 20%);--dh-color-yellow-500: hsl(var(--dh-color-yellow-hue) 82% 25%);--dh-color-yellow-600: hsl(calc(var(--dh-color-yellow-hue) - 1deg) 75% 30%);--dh-color-yellow-700: hsl(calc(var(--dh-color-yellow-hue) - 1deg) 70% 35%);--dh-color-yellow-800: hsl(calc(var(--dh-color-yellow-hue) - 2deg) 66% 41%);--dh-color-yellow-900: hsl(calc(var(--dh-color-yellow-hue) - 2deg) 61% 47%);--dh-color-yellow-1000: hsl(calc(var(--dh-color-yellow-hue) - 2deg) 66% 54%);--dh-color-yellow-1100: hsl(calc(var(--dh-color-yellow-hue) - 3deg) 79% 60%);--dh-color-yellow-1200: hsl(calc(var(--dh-color-yellow-hue) - 3deg) 94% 66%);--dh-color-yellow-1300: hsl(var(--dh-color-yellow-hue) 100% 74%);--dh-color-yellow-1400: hsl(calc(var(--dh-color-yellow-hue) + 2deg) 100% 84%);--dh-color-chartreuse-hue: 70deg;--dh-color-chartreuse-100: hsl( calc(var(--dh-color-chartreuse-hue) + 7deg) 100% 8% );--dh-color-chartreuse-200: hsl( calc(var(--dh-color-chartreuse-hue) + 5deg) 84% 12% );--dh-color-chartreuse-300: hsl( calc(var(--dh-color-chartreuse-hue) + 4deg) 73% 16% );--dh-color-chartreuse-400: hsl( calc(var(--dh-color-chartreuse-hue) + 1deg) 67% 20% );--dh-color-chartreuse-500: hsl( calc(var(--dh-color-chartreuse-hue) + 1deg) 62% 25% );--dh-color-chartreuse-600: hsl(var(--dh-color-chartreuse-hue) 59% 30%);--dh-color-chartreuse-700: hsl( calc(var(--dh-color-chartreuse-hue) - 1deg) 56% 35% );--dh-color-chartreuse-800: hsl( calc(var(--dh-color-chartreuse-hue) - 2deg) 53% 40% );--dh-color-chartreuse-900: hsl( calc(var(--dh-color-chartreuse-hue) - 3deg) 50% 45% );--dh-color-chartreuse-1000: hsl( calc(var(--dh-color-chartreuse-hue) - 3deg) 49% 51% );--dh-color-chartreuse-1100: hsl( calc(var(--dh-color-chartreuse-hue) - 3deg) 58% 57% );--dh-color-chartreuse-1200: hsl( calc(var(--dh-color-chartreuse-hue) - 4deg) 67% 64% );--dh-color-chartreuse-1300: hsl( calc(var(--dh-color-chartreuse-hue) - 4deg) 76% 73% );--dh-color-chartreuse-1400: hsl( calc(var(--dh-color-chartreuse-hue) - 4deg) 82% 83% );--dh-color-celery-hue: 126deg;--dh-color-celery-100: hsl(calc(var(--dh-color-celery-hue) + 1deg) 43% 12%);--dh-color-celery-200: hsl(calc(var(--dh-color-celery-hue) - 1deg) 43% 16%);--dh-color-celery-300: hsl(calc(var(--dh-color-celery-hue) - 1deg) 43% 21%);--dh-color-celery-400: hsl(calc(var(--dh-color-celery-hue) - 1deg) 43% 25%);--dh-color-celery-500: hsl(calc(var(--dh-color-celery-hue) - 1deg) 42% 30%);--dh-color-celery-600: hsl(var(--dh-color-celery-hue) 41% 36%);--dh-color-celery-700: hsl(calc(var(--dh-color-celery-hue) - 1deg) 39% 41%);--dh-color-celery-800: hsl(calc(var(--dh-color-celery-hue) - 1deg) 37% 48%);--dh-color-celery-900: hsl(calc(var(--dh-color-celery-hue) - 1deg) 39% 55%);--dh-color-celery-1000: hsl(calc(var(--dh-color-celery-hue) - 1deg) 44% 63%);--dh-color-celery-1100: hsl(calc(var(--dh-color-celery-hue) - 1deg) 48% 71%);--dh-color-celery-1200: hsl(var(--dh-color-celery-hue) 50% 80%);--dh-color-celery-1300: hsl(var(--dh-color-celery-hue) 48% 87%);--dh-color-celery-1400: hsl(calc(var(--dh-color-celery-hue) + 1deg) 50% 93%);--dh-color-green-hue: 94deg;--dh-color-green-100: hsl(calc(var(--dh-color-green-hue) + 1deg) 17% 14%);--dh-color-green-200: hsl(calc(var(--dh-color-green-hue) - 2deg) 19% 18%);--dh-color-green-300: hsl(var(--dh-color-green-hue) 22% 23%);--dh-color-green-400: hsl(var(--dh-color-green-hue) 23% 27%);--dh-color-green-500: hsl(calc(var(--dh-color-green-hue) - 1deg) 26% 32%);--dh-color-green-600: hsl(calc(var(--dh-color-green-hue) + 1deg) 28% 37%);--dh-color-green-700: hsl(calc(var(--dh-color-green-hue) + 1deg) 30% 42%);--dh-color-green-800: hsl(var(--dh-color-green-hue) 32% 48%);--dh-color-green-900: hsl(var(--dh-color-green-hue) 38% 53%);--dh-color-green-1000: hsl(var(--dh-color-green-hue) 47% 58%);--dh-color-green-1100: hsl(var(--dh-color-green-hue) 59% 64%);--dh-color-green-1200: hsl(var(--dh-color-green-hue) 71% 70%);--dh-color-green-1300: hsl(var(--dh-color-green-hue) 81% 79%);--dh-color-green-1400: hsl(calc(var(--dh-color-green-hue) - 1deg) 88% 87%);--dh-color-seafoam-hue: 159deg;--dh-color-seafoam-100: hsl(calc(var(--dh-color-seafoam-hue) - 3deg) 14% 14%);--dh-color-seafoam-200: hsl(calc(var(--dh-color-seafoam-hue) - 1deg) 17% 18%);--dh-color-seafoam-300: hsl(var(--dh-color-seafoam-hue) 20% 23%);--dh-color-seafoam-400: hsl(calc(var(--dh-color-seafoam-hue) - 1deg) 23% 28%);--dh-color-seafoam-500: hsl(calc(var(--dh-color-seafoam-hue) - 1deg) 26% 33%);--dh-color-seafoam-600: hsl(var(--dh-color-seafoam-hue) 29% 37%);--dh-color-seafoam-700: hsl(calc(var(--dh-color-seafoam-hue) + 2deg) 33% 42%);--dh-color-seafoam-800: hsl(calc(var(--dh-color-seafoam-hue) + 2deg) 36% 47%);--dh-color-seafoam-900: hsl(calc(var(--dh-color-seafoam-hue) + 3deg) 42% 51%);--dh-color-seafoam-1000: hsl( calc(var(--dh-color-seafoam-hue) + 2deg) 53% 56% );--dh-color-seafoam-1100: hsl( calc(var(--dh-color-seafoam-hue) + 3deg) 66% 62% );--dh-color-seafoam-1200: hsl( calc(var(--dh-color-seafoam-hue) + 2deg) 76% 70% );--dh-color-seafoam-1300: hsl( calc(var(--dh-color-seafoam-hue) - 1deg) 87% 80% );--dh-color-seafoam-1400: hsl( calc(var(--dh-color-seafoam-hue) - 3deg) 89% 89% );--dh-color-cyan-hue: 186deg;--dh-color-cyan-100: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 38% 13%);--dh-color-cyan-200: hsl(var(--dh-color-cyan-hue) 38% 16%);--dh-color-cyan-300: hsl(var(--dh-color-cyan-hue) 39% 21%);--dh-color-cyan-400: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 38% 26%);--dh-color-cyan-500: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 38% 31%);--dh-color-cyan-600: hsl(var(--dh-color-cyan-hue) 38% 37%);--dh-color-cyan-700: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 38% 42%);--dh-color-cyan-800: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 37% 48%);--dh-color-cyan-900: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 42% 54%);--dh-color-cyan-1000: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 52% 60%);--dh-color-cyan-1100: hsl(var(--dh-color-cyan-hue) 64% 67%);--dh-color-cyan-1200: hsl(var(--dh-color-cyan-hue) 79% 74%);--dh-color-cyan-1300: hsl(var(--dh-color-cyan-hue) 92% 81%);--dh-color-cyan-1400: hsl(var(--dh-color-cyan-hue) 100% 90%);--dh-color-indigo-hue: 235deg;--dh-color-indigo-100: hsl(calc(var(--dh-color-indigo-hue) + 2deg) 58% 24%);--dh-color-indigo-200: hsl(calc(var(--dh-color-indigo-hue) + 1deg) 52% 30%);--dh-color-indigo-300: hsl(calc(var(--dh-color-indigo-hue) + 1deg) 47% 37%);--dh-color-indigo-400: hsl(var(--dh-color-indigo-hue) 43% 44%);--dh-color-indigo-500: hsl(var(--dh-color-indigo-hue) 40% 51%);--dh-color-indigo-600: hsl(var(--dh-color-indigo-hue) 49% 58%);--dh-color-indigo-700: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 60% 65%);--dh-color-indigo-800: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 75% 72%);--dh-color-indigo-900: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 91% 78%);--dh-color-indigo-1000: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 100% 83%);--dh-color-indigo-1100: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 100% 87%);--dh-color-indigo-1200: hsl(var(--dh-color-indigo-hue) 100% 91%);--dh-color-indigo-1300: hsl(calc(var(--dh-color-indigo-hue) - 3deg) 100% 94%);--dh-color-indigo-1400: hsl(calc(var(--dh-color-indigo-hue) + 1deg) 100% 97%);--dh-color-purple-hue: 254deg;--dh-color-purple-100: hsl(calc(var(--dh-color-purple-hue) + 9deg) 73% 23%);--dh-color-purple-200: hsl(calc(var(--dh-color-purple-hue) + 6deg) 59% 30%);--dh-color-purple-300: hsl(calc(var(--dh-color-purple-hue) + 4deg) 50% 37%);--dh-color-purple-400: hsl(calc(var(--dh-color-purple-hue) + 3deg) 43% 44%);--dh-color-purple-500: hsl(calc(var(--dh-color-purple-hue) + 1deg) 38% 50%);--dh-color-purple-600: hsl(var(--dh-color-purple-hue) 45% 57%);--dh-color-purple-700: hsl(calc(var(--dh-color-purple-hue) - 1deg) 54% 64%);--dh-color-purple-800: hsl(calc(var(--dh-color-purple-hue) - 3deg) 64% 71%);--dh-color-purple-900: hsl(calc(var(--dh-color-purple-hue) - 4deg) 79% 78%);--dh-color-purple-1000: hsl(calc(var(--dh-color-purple-hue) - 5deg) 91% 83%);--dh-color-purple-1100: hsl(calc(var(--dh-color-purple-hue) - 5deg) 97% 88%);--dh-color-purple-1200: hsl(calc(var(--dh-color-purple-hue) - 4deg) 100% 91%);--dh-color-purple-1300: hsl(calc(var(--dh-color-purple-hue) - 3deg) 100% 95%);--dh-color-purple-1400: hsl(calc(var(--dh-color-purple-hue) + 6deg) 88% 97%);--dh-color-fuchsia-hue: 286deg;--dh-color-fuchsia-100: hsl( calc(var(--dh-color-fuchsia-hue) + 15deg) 64% 16% );--dh-color-fuchsia-200: hsl( calc(var(--dh-color-fuchsia-hue) + 14deg) 53% 22% );--dh-color-fuchsia-300: hsl( calc(var(--dh-color-fuchsia-hue) + 11deg) 44% 29% );--dh-color-fuchsia-400: hsl(calc(var(--dh-color-fuchsia-hue) + 8deg) 39% 35%);--dh-color-fuchsia-500: hsl(calc(var(--dh-color-fuchsia-hue) + 5deg) 35% 43%);--dh-color-fuchsia-600: hsl(calc(var(--dh-color-fuchsia-hue) + 1deg) 33% 51%);--dh-color-fuchsia-700: hsl(calc(var(--dh-color-fuchsia-hue) - 3deg) 40% 58%);--dh-color-fuchsia-800: hsl(calc(var(--dh-color-fuchsia-hue) - 7deg) 50% 66%);--dh-color-fuchsia-900: hsl(calc(var(--dh-color-fuchsia-hue) - 9deg) 61% 74%);--dh-color-fuchsia-1000: hsl( calc(var(--dh-color-fuchsia-hue) - 11deg) 71% 80% );--dh-color-fuchsia-1100: hsl( calc(var(--dh-color-fuchsia-hue) - 11deg) 76% 85% );--dh-color-fuchsia-1200: hsl( calc(var(--dh-color-fuchsia-hue) - 9deg) 78% 89% );--dh-color-fuchsia-1300: hsl( calc(var(--dh-color-fuchsia-hue) - 6deg) 77% 93% );--dh-color-fuchsia-1400: hsl( calc(var(--dh-color-fuchsia-hue) + 2deg) 71% 96% );--dh-color-magenta-hue: 330deg;--dh-color-magenta-100: hsl(calc(var(--dh-color-magenta-hue) + 3deg) 91% 17%);--dh-color-magenta-200: hsl(calc(var(--dh-color-magenta-hue) + 4deg) 72% 23%);--dh-color-magenta-300: hsl(calc(var(--dh-color-magenta-hue) + 4deg) 60% 30%);--dh-color-magenta-400: hsl(calc(var(--dh-color-magenta-hue) + 4deg) 52% 36%);--dh-color-magenta-500: hsl(calc(var(--dh-color-magenta-hue) + 3deg) 46% 43%);--dh-color-magenta-600: hsl(calc(var(--dh-color-magenta-hue) + 2deg) 42% 50%);--dh-color-magenta-700: hsl(var(--dh-color-magenta-hue) 51% 58%);--dh-color-magenta-800: hsl(calc(var(--dh-color-magenta-hue) - 1deg) 61% 65%);--dh-color-magenta-900: hsl(calc(var(--dh-color-magenta-hue) - 1deg) 76% 72%);--dh-color-magenta-1000: hsl( calc(var(--dh-color-magenta-hue) - 2deg) 92% 79% );--dh-color-magenta-1100: hsl( calc(var(--dh-color-magenta-hue) - 3deg) 100% 85% );--dh-color-magenta-1200: hsl( calc(var(--dh-color-magenta-hue) - 3deg) 100% 89% );--dh-color-magenta-1300: hsl( calc(var(--dh-color-magenta-hue) - 4deg) 100% 93% );--dh-color-magenta-1400: hsl( calc(var(--dh-color-magenta-hue) - 2deg) 100% 96% )}
|
|
216
|
+
</div>`;return e.jsxs("div",{...p("icons"),children:[e.jsx("h2",{className:"ui-title",children:"Icons"}),e.jsx("div",{className:"row",children:e.jsxs("div",{className:"col",children:[e.jsx("h4",{children:"Icon Composition"}),e.jsx("p",{children:"Icons can be used indivudally or composed together using font-awesome composition:"}),e.jsxs("div",{className:"icons",children:[e.jsx("div",{className:"icon card",children:e.jsx(f,{icon:Oe})}),e.jsx("div",{className:"icon card",children:e.jsx(f,{icon:Ue})}),e.jsx("div",{className:"icon card",children:e.jsx(f,{icon:He})}),e.jsx("div",{className:"icon card",children:"="}),e.jsxs(C,{kind:"inline",className:"card",onClick:()=>{er(d).then(()=>{i({text:e.jsx("span",{children:"Copied composition example"})})}).catch(c=>{i({text:e.jsx("span",{className:"text-danger",children:c.message})})})},children:[e.jsx("div",{className:"icon",children:e.jsxs("div",{className:"fa-md fa-layers",children:[e.jsx(f,{mask:Oe,icon:Ue,transform:"down-7 right-7"}),e.jsx(f,{icon:He})]})}),e.jsx("label",{children:"Custom"})]})]})]})}),e.jsx("hr",{}),e.jsx("div",{className:"row",children:e.jsxs("div",{className:"col",children:[e.jsx("h4",{children:"All available icons"}),e.jsx("p",{children:"If you cannot find or compose a relevant icon for your use case, please request a new one to be created from design."}),e.jsxs("div",{className:"form-inline mb-3",children:[e.jsx("input",{type:"search",placeholder:"Basic icon search...",value:l,className:"form-control",onChange:c=>{n(c.target.value)}}),e.jsx("span",{className:"mx-2",children:"Show: "}),e.jsx(C,{kind:"inline",active:o,className:"mr-2",onClick:()=>a(!o),icon:o?L.vsCheck:L.vsClose,children:"VS ICONS"}),e.jsx(C,{kind:"inline",active:t,className:"mr-2",onClick:()=>r(!t),icon:t?L.vsCheck:L.vsClose,children:"DH ICONS"}),e.jsxs("small",{children:["(",h.length," icon",h.length===1?"":"s",")"]})]}),e.jsxs("div",{className:"icons",children:[h,h.length===0&&e.jsx("p",{className:"no-result",children:"No icons found."}),e.jsx(vr,{message:s})]})]})})]})}const be=[{title:"Title 1",value:"Value 1"},{title:"Title 2",value:"Value 2"},{title:"Title 3",value:"Value 3"},{title:"Title 4",value:"Value 4"},{title:"Title 5",value:"Value 5"},{title:"Title 6",value:"Value 6"},{title:"Title 7",value:"Value 7"},{title:"Title 8",value:"Value 8"},{title:"Title 9",value:"Value 9"},{title:"Title 9",value:"Value 9"},{title:"Title 10",value:"Value 10"},{title:"Title 11",value:"Value 11"},{title:"Title 12",value:"Value 12"}],ut=[{title:"1 minute",value:1*60*1e3},{title:"5 minutes",value:5*60*1e3},{title:"20 minutes",value:20*60*1e3},{title:"45 minutes",value:45*60*1e3},{title:"1 hour",value:1*60*60*1e3},{title:"4 hours",value:4*60*60*1e3}],or=["Invalid","Valid"];function gt(){const[t,r]=u.useState(!1),[o,a]=u.useState(""),[l,n]=u.useState(!0),[s,i]=u.useState(!1),[h,d]=u.useState(!1),[c,g]=u.useState(!1),[m,v]=u.useState(null),[x,b]=u.useState("1"),[M,q]=u.useState(),[A,F]=u.useState("-DLiveTableMonitor.updateThreads=8 -DLiveTableMonitor.printDependencyInformation=false -Dassertion.heapDump=true -Drequire.heapDump=true -Dassertion.heapDump=true -Drequire.heapDump=true"),[re,xr]=u.useState(""),[Fe,fr]=u.useState(or[0]),br=u.useCallback(y=>{b(y.target.value)},[]),Z=u.useCallback(()=>{r(!t)},[t]),yr=u.useCallback(y=>{a(y.target.value)},[]),jr=u.useCallback(y=>{xr(y.target.value)},[]);return e.jsxs("div",{...p("inputs",["style-guide-inputs"]),children:[e.jsx("h2",{className:"ui-title",children:"Inputs"}),e.jsxs("div",{className:"row",children:[e.jsx("div",{className:"col",children:e.jsxs("form",{children:[e.jsxs("div",{className:"form-group",children:[e.jsxs("label",{htmlFor:"exampleInput1",children:["Input Label",e.jsx("input",{type:"text",className:"form-control",id:"exampleInput1","aria-describedby":"emailHelp",placeholder:"Input Placeholder"})]}),e.jsx("small",{className:"form-text text-muted",children:"Help text for a form imput"})]}),e.jsxs("div",{className:"form-group",children:[e.jsxs("label",{htmlFor:"exampleInput2",children:["Input Label",e.jsx("input",{type:"text",className:"form-control",id:"exampleInput2","aria-describedby":"emailHelp",placeholder:"Input Disabled",disabled:!0})]}),e.jsx("small",{className:"form-text text-muted",children:"Disabled input"})]}),e.jsx("div",{className:"form-group",children:e.jsxs("label",{htmlFor:"exampleInputPassword1",children:["Password",e.jsx("input",{type:"password",className:"form-control",id:"exampleInputPassword1",placeholder:"Password",defaultValue:"123456789"})]})}),e.jsx("div",{className:"form-group",children:e.jsx(uo,{value:o,placeholder:"Search Input",onChange:yr})})]})}),e.jsx("div",{className:"col",children:e.jsxs("form",{children:[e.jsx("h5",{children:" Checkboxes "}),e.jsx(P,{className:"form-group",checked:l,onChange:()=>n(!l),children:"Checked checkbox"}),e.jsx(P,{className:"form-group",checked:s,onChange:()=>i(!s),children:"Unchecked checkbox"}),e.jsx(P,{className:"form-group",disabled:!0,checked:null,children:"Disabled checkbox"}),e.jsx(P,{className:"form-group",isInvalid:!0,checked:h,onChange:()=>d(!h),children:"Invalid checkbox"}),e.jsx(P,{className:"form-group",checked:c,onChange:()=>g(!c),children:"Add radio button"}),e.jsx(P,{className:"form-group",checked:m,onChange:()=>{m==null?v(!0):v(m?!1:null)},children:"Indeterminate Cycle"})]})}),e.jsxs("div",{className:"col",children:[e.jsxs("form",{children:[e.jsx("h5",{children:" Radios "}),e.jsxs(Xr,{onChange:br,value:x,children:[e.jsx(X,{value:"1",children:"Toggle this custom radio"}),e.jsx(X,{value:"2",children:"Or toggle this other custom radio"}),e.jsx(X,{value:"3",disabled:!0,children:"Disabled radio"}),e.jsx(X,{value:"4",isInvalid:!0,children:"Invalid radio"}),e.jsx(e.Fragment,{children:c&&e.jsx(X,{value:"5",children:"Extra radio item"})})]})]}),e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Toggle Buttons"}),e.jsxs("div",{className:"form-inline justify-content-between",children:[e.jsx("label",{children:String(t)}),e.jsx(K,{on:t,onClick:Z})]}),e.jsxs("div",{className:"form-inline justify-content-between",children:[e.jsx("label",{children:String(!t)}),e.jsx(K,{on:!t,onClick:Z})]}),e.jsxs("div",{className:"form-inline justify-content-between",children:[e.jsx("label",{className:"isInvalid",children:"isInvalid"}),e.jsx(K,{on:!t,isInvalid:!0,onClick:Z})]}),e.jsxs("div",{className:"form-inline justify-content-between",children:[e.jsx("label",{className:"disabled",children:"disabled"}),e.jsx(K,{on:!t,disabled:!0,onClick:Z})]})]})]}),e.jsxs("div",{className:"col",children:[e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Selection Menu"}),e.jsxs(me,{onChange:y=>{},defaultValue:"0",className:"custom-select",children:[e.jsx("option",{disabled:!0,value:"0",children:"Custom Selection"}),e.jsx("option",{value:"1",children:"One"}),e.jsx("option",{value:"2",children:"Two"}),e.jsx("option",{value:"3",children:"Three"})]})]}),e.jsx("div",{className:"form-group",children:e.jsxs(me,{onChange:y=>{},defaultValue:"0",className:"custom-select",disabled:!0,children:[e.jsx("option",{disabled:!0,value:"0",children:"Custom Selection"}),e.jsx("option",{value:"1",children:"One"}),e.jsx("option",{value:"2",children:"Two"}),e.jsx("option",{value:"3",children:"Three"})]})}),e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Input with Select"}),e.jsx("div",{className:"input-group",children:e.jsx(Ge,{options:be,inputPlaceholder:"10.128.0.8",searchPlaceholder:"Search actions here"})}),e.jsx("br",{}),e.jsx("div",{className:"input-group",children:e.jsx(Ge,{options:be,inputPlaceholder:"10.128.0.8",searchPlaceholder:"Search actions here",disabled:!0})})]}),e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"AutoCompleteInput"}),e.jsx(to,{options:be,noMatchText:"No Matches."})]})]}),e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Validate Label"}),e.jsx(ge,{validationError:re?void 0:"Value not set",isModified:!!re,id:"validateInput1",labelText:"Input Field",hintText:"Hint text",children:e.jsx("input",{type:"text",className:"form-control","aria-describedby":"emailHelp",placeholder:"Type to modify",onChange:jr})}),e.jsx(ge,{validationError:Fe==="Invalid"?"Invalid value":void 0,id:"validateLabelInput2",labelText:"Dropdown",children:e.jsx(me,{onChange:y=>fr(y),value:Fe,children:or.map(y=>e.jsx(Kr,{value:y,children:y},y))})}),e.jsx(ge,{labelText:"Switch",isModified:t,children:e.jsx(K,{on:t,onClick:Z})})]})}),e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Time Input"}),e.jsx(ao,{}),e.jsx("br",{}),e.jsx("h5",{children:"Date Input"}),e.jsx(lo,{}),e.jsx("br",{}),e.jsx("h5",{children:"DateTime Input"}),e.jsx(Qr,{}),e.jsx("br",{}),e.jsx("h5",{children:"Custom Timeselect"}),e.jsx(so,{options:ut,value:M??null,onChange:q,customText:"Custom Timeout",placeholder:"Select a timeout",timeToValue:y=>y*1e3})]})})]}),e.jsx("div",{className:"row",children:e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Auto Resize Textarea"}),e.jsx(no,{value:A,delimiter:" -",onChange:F})]})})})]})}class mt extends u.PureComponent{constructor(r){super(r),this.handleSelect=this.handleSelect.bind(this),this.handleViewportChange=this.handleViewportChange.bind(this),this.selectedItems=[],this.state={items:[],offset:0,itemCount:5e5}}handleSelect(r){const o=this.selectedItems.indexOf(r);o>=0?this.selectedItems.splice(o,1):this.selectedItems.push(r);const a=o<0,{offset:l}=this.state;let{items:n}=this.state;n=[].concat(n);const s=r-l;s>=0&&s<n.length&&(n[s].isSelected=a),this.setState({items:n})}handleViewportChange(r,o){const{itemCount:a}=this.state,l=o-r+1,n=Math.max(0,r-l),s=Math.min(o+l,a),i=[];for(let d=n;d<=s&&d<=a;d+=1){const c=`Item ${d}`,g=this.selectedItems.indexOf(d)>=0;i.push({value:c,isSelected:g})}const h=n;this.setState({offset:h,items:i})}render(){const{offset:r,items:o,itemCount:a}=this.state;return e.jsx(Jr,{itemCount:a,items:o,offset:r,onSelect:this.handleSelect,onViewportChange:this.handleViewportChange})}}class tr extends u.PureComponent{static defaultProps;static propTypes;constructor(r){super(r),this.handleSelect=this.handleSelect.bind(this),this.handleViewportChange=this.handleViewportChange.bind(this),this.selectedItems=[],this.state={items:[],offset:0,itemCount:5e5}}handleSelect(r){const{itemCount:o}=this.state;console.log("Item selected at index",r,"/",o)}handleViewportChange(r,o){const{itemCount:a}=this.state,l=o-r+1,n=Math.max(0,r-l),s=Math.min(o+l,a),i=[];for(let d=n;d<=s;d+=1){const c=`Item ${d}`,g=this.selectedItems.indexOf(d)>=0;i.push({value:c,isSelected:g})}const h=n;this.setState({offset:h,items:i})}render(){const{isMultiSelect:r}=this.props,{offset:o,items:a,itemCount:l}=this.state;return e.jsx(go,{isMultiSelect:r,itemCount:l,items:a,offset:o,onSelect:this.handleSelect,onViewportChange:this.handleViewportChange})}}function vt(){return e.jsxs("div",{...p("item-list-inputs",["style-guide-inputs"]),children:[e.jsx("h2",{className:"ui-title",children:"Item Lists"}),e.jsxs("div",{className:"row",children:[e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Select List"}),e.jsx("div",{style:{height:"300px"},children:e.jsx(mt,{})})]})}),e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Item List"}),e.jsx("div",{style:{height:"300px"},children:e.jsx(tr,{})})]})}),e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsx("h5",{children:"Multi Select Item List"}),e.jsx("div",{style:{height:"300px"},children:e.jsx(tr,{isMultiSelect:!0})})]})})]})]})}function pt(){const[t,r]=u.useState(0),[o,a]=u.useState(!0),l=()=>{r(0)};function n(s){return e.jsxs(ce.Fragment,{children:[e.jsxs(C,{kind:"primary",style:{marginBottom:"1rem",marginRight:"1rem"},onClick:()=>{r(s)},children:[s," ",s>1?"Actions":"Action"]}),e.jsx(mo,{isOpen:t===s,headerText:"Header Text",bodyText:"This is where the body text goes",onConfirm:l,onCancel:s>=2?l:void 0,onDiscard:s>=3?l:void 0})]},s)}return e.jsxs("div",{...p("modals"),children:[e.jsx("h2",{className:"ui-title",children:"Basic Modals"}),e.jsx("div",{style:{padding:"1rem"},children:[1,2,3].map(s=>n(s))}),e.jsx("h2",{className:"ui-title",children:"Custom Modal"}),e.jsx("div",{style:{padding:"1rem"},children:e.jsx("div",{className:"modal-dialog theme-bg-light",role:"dialog",children:e.jsxs("div",{className:"modal-content",children:[e.jsxs("div",{className:"modal-header",children:[e.jsx("h5",{className:"modal-title",children:"Modal title"}),e.jsx("button",{type:"button",className:"close","data-dismiss":"modal","aria-label":"Close",children:e.jsx("span",{"aria-hidden":"true",children:"×"})})]}),e.jsxs("div",{className:"modal-body",children:[e.jsx("p",{children:"Modal body text goes here."}),e.jsx(P,{checked:o,onChange:()=>a(!o),children:"Checked checkbox"})]}),e.jsxs("div",{className:"modal-footer",children:[e.jsx(C,{kind:"secondary","data-dismiss":"modal",onClick:()=>{},children:"Close"}),e.jsx(C,{kind:"primary",onClick:()=>{},children:"Save changes"})]})]})})})]})}function xt(){return e.jsxs("div",{...p("progress"),children:[e.jsx("h2",{className:"ui-title",children:"Progress"}),e.jsxs("div",{className:"row",children:[e.jsxs("div",{className:"col",children:[e.jsx("h5",{children:"Determinate Progress Loader"}),e.jsx("br",{}),e.jsx("div",{className:"progress",style:{marginBottom:"1rem"},children:e.jsx("div",{className:"progress-bar bg-primary",style:{width:"25%"},"aria-valuenow":25,"aria-valuemin":0,"aria-valuemax":100})})]}),e.jsxs("div",{className:"col",children:[e.jsx("h5",{children:"Indeterminate Progress Spinner"}),e.jsx(Ee,{className:"loading-spinner-large"})]}),e.jsxs("div",{className:"col",children:[e.jsx("h5",{children:"Button Progress Spinner"}),e.jsx(C,{kind:"primary",className:"btn-spinner btn-cancelable",style:{minWidth:"10rem"},onClick:()=>{},children:e.jsxs("span",{children:[e.jsx(Ee,{className:"loading-spinner-vertical-align"}),e.jsx("span",{className:"btn-normal-content",children:"Connecting"}),e.jsx("span",{className:"btn-hover-content",children:"Cancel"})]})})]})]})]})}class ft extends u.PureComponent{constructor(r){super(r),this.handleSliderChange=this.handleSliderChange.bind(this),this.state={startTime:24*60*60*.25,endTime:24*60*60*.75}}handleSliderChange(r){const{startTime:o,endTime:a}=r;this.setState({startTime:o}),this.setState({endTime:a})}render(){const{startTime:r,endTime:o}=this.state;return e.jsxs("div",{...p("time-slider-inputs",["style-guide-inputs"]),children:[e.jsx("h2",{className:"ui-title",children:"Time Slider"}),e.jsx(co,{startTime:r,endTime:o,onChange:this.handleSliderChange}),e.jsxs("p",{children:["StartTime: ",Xe.formatTime(r)]}),e.jsxs("p",{children:["EndTime: ",Xe.formatTime(o)]})]})}}function bt(){const r=[Me,$e].map(o=>e.jsx(f,{icon:o},`${o.prefix}-${o.iconName}`));return e.jsxs("div",{...p("tooltips"),children:[e.jsx("h2",{className:"ui-title",title:"Make better looking tooltips than this one!",children:"Tooltips"}),e.jsxs("div",{className:"btn btn-primary",style:{cursor:"default",marginBottom:"1rem",marginRight:"1rem"},children:["Simple Tooltip",e.jsx(le,{children:"Text only content"})]}),e.jsxs("div",{className:"btn btn-secondary",style:{cursor:"default",marginBottom:"1rem",marginRight:"1rem"},children:["Complex Tooltip",e.jsxs(le,{children:[e.jsxs("div",{children:["Here is some ",e.jsx("i",{children:"cool"})," ",e.jsx("b",{children:"text"})]}),e.jsx("hr",{}),e.jsx("div",{children:"And some icons down here"}),e.jsxs("div",{children:[e.jsx(Ee,{className:"loading-spinner-vertical-align"}),r]})]})]}),e.jsxs("div",{className:"btn btn-success",style:{cursor:"default",marginBottom:"1rem",marginRight:"1rem"},children:["Interactive Tooltip",e.jsxs(le,{interactive:!0,children:[e.jsx("div",{children:"This tooltip is interactive."}),e.jsx("hr",{}),e.jsx(C,{kind:"primary",onClick:()=>{alert("Button clicked!")},children:"Show Alert"})]})]})]})}function yt(){return e.jsxs("div",{...p("typography"),children:[e.jsx("h2",{className:"ui-title",children:"Typography"}),e.jsxs("div",{className:"row",children:[e.jsxs("div",{className:"col",children:[e.jsx("h1",{className:"text-muted","data-no-menu":!0,children:"h1. Unused"}),e.jsx("h2",{className:"text-muted","data-no-menu":!0,children:"h2. Unused"}),e.jsx("h3",{className:"text-muted","data-no-menu":!0,children:"h3. Unused"}),e.jsx("h4",{"data-no-menu":!0,children:"h4. Standard Heading"}),e.jsx("h5",{"data-no-menu":!0,children:"h5. Small Heading"}),e.jsx("h6",{className:"text-muted","data-no-menu":!0,children:"h6. Unused"})]}),e.jsxs("div",{className:"col",children:[e.jsx("h4",{children:"Fonts"}),e.jsx("p",{children:"UI: Fira Sans;"}),e.jsx("p",{className:"text-monospace",children:"Code: Fira Mono;"}),e.jsx("p",{children:'Tables: Fira Sans; font-feature-settings: "tnum";'}),e.jsx("p",{children:"Default font-size: 14px = 1rem"})]})]})]})}class jt extends u.PureComponent{static propTypes;static defaultProps;constructor(r){super(r),this.handleSelectionChange=this.handleSelectionChange.bind(this),this.handleViewportChange=this.handleViewportChange.bind(this),this.itemList=ce.createRef(),this.selectedItems=[],this.state={topRow:null,bottomRow:null}}focusItem(r){this.itemList.current&&this.itemList.current.focusItem(r)}handleSelectionChange(r){console.log("Selection changed",r);const{onSelectionChange:o}=this.props;o(r)}handleViewportChange(r,o){const{items:a}=this.props,l=o-r+1,n=Math.max(0,r-l),s=Math.min(o+l,a.length);this.setState({topRow:n,bottomRow:s})}getViewportItems=nr((r,o,a)=>r==null||o==null?[]:a.slice(r,o));render(){const{draggablePrefix:r,droppableId:o,isDragDisabled:a,isDropDisabled:l,isMultiSelect:n,items:s,selectedRanges:i}=this.props,{topRow:h,bottomRow:d}=this.state;return e.jsx(Q,{draggablePrefix:r,droppableId:o,isDragDisabled:a,isDropDisabled:l,isMultiSelect:n,itemCount:s.length,items:this.getViewportItems(h,d,s),offset:h??0,onSelectionChange:this.handleSelectionChange,onViewportChange:this.handleViewportChange,ref:this.itemList,selectedRanges:i})}}const ye=["Draggable Only","Drag and Drop","Droppable Only"],wt=[{isDropDisabled:!0},{},{isDragDisabled:!0}],Ct=(t="Item",r=1e3)=>{const o=[];for(let a=0;a<r;a+=1)o.push(`${t}-${a}`);return o};class ne extends u.Component{static handleDragStart(r){console.log("handleDragStart",r)}static handleDragUpdate(r){console.log("handleDragUpdate",r)}constructor(r){super(r),this.handleDragEnd=this.handleDragEnd.bind(this),this.animationFrame=null;const o=[],a=[],l=[];for(let n=0;n<ye.length;n+=1)o[n]=Ct(ye[n]),a[n]=[],l[n]=ce.createRef();this.state={items:o,lists:l,selectedRanges:a}}componentWillUnmount(){this.animationFrame!=null&&cancelAnimationFrame(this.animationFrame)}handleDragEnd(r){console.log("handleDragEnd",r);const{source:o,destination:a}=r;if(o==null||a==null)return;const l=Q.getDraggableIndex(o.droppableId),n=Q.getDraggableIndex(a.droppableId),s=l===n;let i=a.index;s&&o.index<a.index&&(i+=1);let h=i;this.setState(({items:d,selectedRanges:c})=>{const g=[...d[l]],m=s?g:[...d[n]],v=We.reorder(g,c[l],m,i),x=[...d];x[l]=g,x[n]=m,h=s?We.adjustDestinationIndex(i,c[n]):i;const b=[...c];return b[l]=[],b[n]=[[h,h+v.length-1]],{items:x,selectedRanges:b}},()=>{this.animationFrame!=null&&cancelAnimationFrame(this.animationFrame),this.animationFrame=requestAnimationFrame(()=>{this.animationFrame=null;const{lists:d}=this.state;d[n]?.current?.focusItem(h)})})}handleSelectionChange(r,o){this.setState(({selectedRanges:a})=>{const l=[...a];return l[r]=[...o],{selectedRanges:l}})}getSelectionChangeHandler=_e(r=>this.handleSelectionChange.bind(this,r));getDraggableList=_e((r,o,a,l)=>e.jsx(jt,{items:r,droppableId:Q.getDraggableId("drop-list",l),draggablePrefix:Q.getDraggableId("draggable-item",l),onSelectionChange:this.getSelectionChangeHandler(l),isMultiSelect:!0,ref:a,selectedRanges:o,...wt[l]}));render(){const{items:r,lists:o,selectedRanges:a}=this.state;return e.jsxs("div",{...p("draggable-lists",["style-guide-inputs"]),children:[e.jsx("h2",{className:"ui-title",children:"Drag and Drop Lists"}),e.jsx("div",{className:"row",children:e.jsx(wr,{onDragStart:ne.handleDragStart,onDragUpdate:ne.handleDragUpdate,onDragEnd:this.handleDragEnd,children:ye.map((l,n)=>e.jsx("div",{className:"col",children:e.jsxs("div",{className:"form-group",children:[e.jsxs("h5",{children:[l," List"]}),e.jsx("div",{style:{height:"300px"},children:this.getDraggableList(r[n],a[n],o[n],n)})]})},l))})})]})}}let ar=0;function St(){const t=ar;return ar+=1,t}const Tt=mr(25);function je(t=1,r=5){const o=Number(Tt.next().value);return Math.floor(o*r)+t}function we(t,r=St()){return{id:r,type:t}}function lr(t=je(),r=je(),o=je()){const a=[];for(let l=0;l<t;l+=1)a.push(we("SUBMENU"));for(let l=0;l<r;l+=1)a.push(we("PAGE"));for(let l=0;l<o;l+=1)a.push(we("SWITCH"));return a}function Ce({type:t,id:r}){switch(t){case"SUBMENU":return`Submenu ${r}`;case"PAGE":return`Page ${r}`;case"SWITCH":return`Switch ${r}`}}function Nt({type:t}){switch(t){case"SUBMENU":return Hr;case"PAGE":return Ur;case"SWITCH":return G}}function kt(){const[t,r]=u.useState([]),[o,a]=u.useState(new Map),l=u.useCallback(c=>{r([...t,c])},[t,r]),n=u.useCallback(()=>{const c=[...t];c.pop(),r(c)},[t,r]),s=u.useCallback(()=>{const c=[t[0]];r(c)},[t,r]),i=u.useCallback(c=>{const g=o.get(c)??!1,m=new Map(o);m.set(c,!g),a(m)},[o,a]),h=u.useCallback(c=>{const g=t[t.length-1],{items:m}=g;if(!m)throw new Error("Navigation handleSelect triggered without items to select");const v=m[c];switch(v.type){case"PAGE":l({title:Ce(v)});break;case"SUBMENU":l({title:Ce(v),items:lr()});break;case"SWITCH":i(v.id);break}},[t,i,l]);u.useEffect(function(){r([{title:"Navigation Menu",items:lr()}])},[]);const d=u.useMemo(()=>t.map(({items:c,title:g},m)=>{if(!c)return e.jsx(ze,{onBack:n,onClose:s,title:g,children:e.jsx("div",{children:"Page content!"})},g);let v=null;if(c!=null){const x=c.map(b=>{const M=Ce(b),q=Nt(b);let A,F;return b.type==="SWITCH"&&(A=o.get(b.id)??!1,F=()=>{h(b.id)}),{title:M,icon:q,isOn:A,onChange:F}});v=e.jsx(ro,{onSelect:h,items:x})}else v=e.jsx("div",{children:"Page content"});return e.jsx(ze,{onBack:m>0?n:void 0,onClose:m>0?s:void 0,title:g,children:v},g)}),[t,o,h,n,s]);return e.jsxs("div",{...p("navigations"),children:[e.jsx("h2",{className:"ui-title",children:"Navigations"}),e.jsx("div",{className:"navigations",children:e.jsx(eo,{children:d})})]})}const Et=`:root{--dh-color-gray-hue: 219deg;--dh-color-gray-50: hsl(calc(var(--dh-color-gray-hue) + 81deg), 6%, 10%);--dh-color-gray-75: hsl(calc(var(--dh-color-gray-hue) + 61deg), 5%, 13%);--dh-color-gray-100: hsl(calc(var(--dh-color-gray-hue) + 66deg), 5%, 17%);--dh-color-gray-200: hsl(calc(var(--dh-color-gray-hue) + 66deg), 4%, 19%);--dh-color-gray-300: hsl(calc(var(--dh-color-gray-hue) + 66deg), 4%, 21%);--dh-color-gray-400: hsl(calc(var(--dh-color-gray-hue) + 61deg), 2%, 25%);--dh-color-gray-500: hsl(calc(var(--dh-color-gray-hue) + 51deg), 1%, 36%);--dh-color-gray-600: hsl(calc(var(--dh-color-gray-hue) + 81deg), 0%, 57%);--dh-color-gray-700: hsl(calc(var(--dh-color-gray-hue) - 219deg), 1%, 75%);--dh-color-gray-800: hsl(calc(var(--dh-color-gray-hue) - 159deg), 6%, 94%);--dh-color-gray-900: hsl(calc(var(--dh-color-gray-hue) - 159deg), 25%, 98%);--dh-color-black: var(--dh-color-gray-50);--dh-color-white: var(--dh-color-gray-800);--dh-color-blue-hue: 222deg;--dh-color-blue-100: hsl(var(--dh-color-blue-hue) 65% 19%);--dh-color-blue-200: hsl(var(--dh-color-blue-hue) 66% 25%);--dh-color-blue-300: hsl(var(--dh-color-blue-hue) 65% 32%);--dh-color-blue-400: hsl(var(--dh-color-blue-hue) 63% 39%);--dh-color-blue-500: hsl(var(--dh-color-blue-hue) 61% 47%);--dh-color-blue-600: hsl(var(--dh-color-blue-hue) 68% 54%);--dh-color-blue-700: hsl(var(--dh-color-blue-hue) 83% 62%);--dh-color-blue-800: hsl(var(--dh-color-blue-hue) 94% 68%);--dh-color-blue-900: hsl(var(--dh-color-blue-hue) 100% 74%);--dh-color-blue-1000: hsl(var(--dh-color-blue-hue) 100% 80%);--dh-color-blue-1100: hsl(calc(var(--dh-color-blue-hue) - 1deg) 100% 84%);--dh-color-blue-1200: hsl(calc(var(--dh-color-blue-hue) - 1deg) 100% 89%);--dh-color-blue-1300: hsl(var(--dh-color-blue-hue) 100% 93%);--dh-color-blue-1400: hsl(calc(var(--dh-color-blue-hue) + 2deg) 100% 96%);--dh-color-red-hue: 345deg;--dh-color-red-100: hsl(calc(var(--dh-color-red-hue) + 1deg) 54% 18%);--dh-color-red-200: hsl(var(--dh-color-red-hue) 55% 24%);--dh-color-red-300: hsl(calc(var(--dh-color-red-hue) + 1deg) 54% 30%);--dh-color-red-400: hsl(var(--dh-color-red-hue) 54% 37%);--dh-color-red-500: hsl(var(--dh-color-red-hue) 53% 44%);--dh-color-red-600: hsl(var(--dh-color-red-hue) 55% 51%);--dh-color-red-700: hsl(var(--dh-color-red-hue) 71% 59%);--dh-color-red-800: hsl(var(--dh-color-red-hue) 92% 67%);--dh-color-red-900: hsl(calc(var(--dh-color-red-hue) - 1deg) 100% 74%);--dh-color-red-1000: hsl(calc(var(--dh-color-red-hue) - 2deg) 100% 80%);--dh-color-red-1100: hsl(calc(var(--dh-color-red-hue) - 2deg) 100% 85%);--dh-color-red-1200: hsl(calc(var(--dh-color-red-hue) - 1deg) 100% 90%);--dh-color-red-1300: hsl(calc(var(--dh-color-red-hue) - 1deg) 100% 94%);--dh-color-red-1400: hsl(calc(var(--dh-color-red-hue) - 1deg) 100% 96%);--dh-color-orange-hue: 22deg;--dh-color-orange-100: hsl(calc(var(--dh-color-orange-hue) - 2deg) 100% 14%);--dh-color-orange-200: hsl(var(--dh-color-orange-hue) 96% 18%);--dh-color-orange-300: hsl(calc(var(--dh-color-orange-hue) + 1deg) 90% 23%);--dh-color-orange-400: hsl(var(--dh-color-orange-hue) 84% 29%);--dh-color-orange-500: hsl(var(--dh-color-orange-hue) 80% 35%);--dh-color-orange-600: hsl(var(--dh-color-orange-hue) 74% 41%);--dh-color-orange-700: hsl(var(--dh-color-orange-hue) 70% 48%);--dh-color-orange-800: hsl(var(--dh-color-orange-hue) 78% 55%);--dh-color-orange-900: hsl(calc(var(--dh-color-orange-hue) - 1deg) 95% 63%);--dh-color-orange-1000: hsl(var(--dh-color-orange-hue) 100% 71%);--dh-color-orange-1100: hsl(calc(var(--dh-color-orange-hue) + 1deg) 100% 78%);--dh-color-orange-1200: hsl(calc(var(--dh-color-orange-hue) + 2deg) 100% 84%);--dh-color-orange-1300: hsl(calc(var(--dh-color-orange-hue) + 2deg) 100% 90%);--dh-color-orange-1400: hsl(calc(var(--dh-color-orange-hue) + 3deg) 100% 94%);--dh-color-yellow-hue: 49deg;--dh-color-yellow-100: hsl(calc(var(--dh-color-yellow-hue) + 2deg) 100% 9%);--dh-color-yellow-200: hsl(calc(var(--dh-color-yellow-hue) + 1deg) 100% 12%);--dh-color-yellow-300: hsl(calc(var(--dh-color-yellow-hue) + 2deg) 100% 15%);--dh-color-yellow-400: hsl(calc(var(--dh-color-yellow-hue) + 1deg) 90% 20%);--dh-color-yellow-500: hsl(var(--dh-color-yellow-hue) 82% 25%);--dh-color-yellow-600: hsl(calc(var(--dh-color-yellow-hue) - 1deg) 75% 30%);--dh-color-yellow-700: hsl(calc(var(--dh-color-yellow-hue) - 1deg) 70% 35%);--dh-color-yellow-800: hsl(calc(var(--dh-color-yellow-hue) - 2deg) 66% 41%);--dh-color-yellow-900: hsl(calc(var(--dh-color-yellow-hue) - 2deg) 61% 47%);--dh-color-yellow-1000: hsl(calc(var(--dh-color-yellow-hue) - 2deg) 66% 54%);--dh-color-yellow-1100: hsl(calc(var(--dh-color-yellow-hue) - 3deg) 79% 60%);--dh-color-yellow-1200: hsl(calc(var(--dh-color-yellow-hue) - 3deg) 94% 66%);--dh-color-yellow-1300: hsl(var(--dh-color-yellow-hue) 100% 74%);--dh-color-yellow-1400: hsl(calc(var(--dh-color-yellow-hue) + 2deg) 100% 84%);--dh-color-chartreuse-hue: 70deg;--dh-color-chartreuse-100: hsl( calc(var(--dh-color-chartreuse-hue) + 7deg) 100% 8% );--dh-color-chartreuse-200: hsl( calc(var(--dh-color-chartreuse-hue) + 5deg) 84% 12% );--dh-color-chartreuse-300: hsl( calc(var(--dh-color-chartreuse-hue) + 4deg) 73% 16% );--dh-color-chartreuse-400: hsl( calc(var(--dh-color-chartreuse-hue) + 1deg) 67% 20% );--dh-color-chartreuse-500: hsl( calc(var(--dh-color-chartreuse-hue) + 1deg) 62% 25% );--dh-color-chartreuse-600: hsl(var(--dh-color-chartreuse-hue) 59% 30%);--dh-color-chartreuse-700: hsl( calc(var(--dh-color-chartreuse-hue) - 1deg) 56% 35% );--dh-color-chartreuse-800: hsl( calc(var(--dh-color-chartreuse-hue) - 2deg) 53% 40% );--dh-color-chartreuse-900: hsl( calc(var(--dh-color-chartreuse-hue) - 3deg) 50% 45% );--dh-color-chartreuse-1000: hsl( calc(var(--dh-color-chartreuse-hue) - 3deg) 49% 51% );--dh-color-chartreuse-1100: hsl( calc(var(--dh-color-chartreuse-hue) - 3deg) 58% 57% );--dh-color-chartreuse-1200: hsl( calc(var(--dh-color-chartreuse-hue) - 4deg) 67% 64% );--dh-color-chartreuse-1300: hsl( calc(var(--dh-color-chartreuse-hue) - 4deg) 76% 73% );--dh-color-chartreuse-1400: hsl( calc(var(--dh-color-chartreuse-hue) - 4deg) 82% 83% );--dh-color-celery-hue: 126deg;--dh-color-celery-100: hsl(calc(var(--dh-color-celery-hue) + 1deg) 43% 12%);--dh-color-celery-200: hsl(calc(var(--dh-color-celery-hue) - 1deg) 43% 16%);--dh-color-celery-300: hsl(calc(var(--dh-color-celery-hue) - 1deg) 43% 21%);--dh-color-celery-400: hsl(calc(var(--dh-color-celery-hue) - 1deg) 43% 25%);--dh-color-celery-500: hsl(calc(var(--dh-color-celery-hue) - 1deg) 42% 30%);--dh-color-celery-600: hsl(var(--dh-color-celery-hue) 41% 36%);--dh-color-celery-700: hsl(calc(var(--dh-color-celery-hue) - 1deg) 39% 41%);--dh-color-celery-800: hsl(calc(var(--dh-color-celery-hue) - 1deg) 37% 48%);--dh-color-celery-900: hsl(calc(var(--dh-color-celery-hue) - 1deg) 39% 55%);--dh-color-celery-1000: hsl(calc(var(--dh-color-celery-hue) - 1deg) 44% 63%);--dh-color-celery-1100: hsl(calc(var(--dh-color-celery-hue) - 1deg) 48% 71%);--dh-color-celery-1200: hsl(var(--dh-color-celery-hue) 50% 80%);--dh-color-celery-1300: hsl(var(--dh-color-celery-hue) 48% 87%);--dh-color-celery-1400: hsl(calc(var(--dh-color-celery-hue) + 1deg) 50% 93%);--dh-color-green-hue: 94deg;--dh-color-green-100: hsl(calc(var(--dh-color-green-hue) + 1deg) 17% 14%);--dh-color-green-200: hsl(calc(var(--dh-color-green-hue) - 2deg) 19% 18%);--dh-color-green-300: hsl(var(--dh-color-green-hue) 22% 23%);--dh-color-green-400: hsl(var(--dh-color-green-hue) 23% 27%);--dh-color-green-500: hsl(calc(var(--dh-color-green-hue) - 1deg) 26% 32%);--dh-color-green-600: hsl(calc(var(--dh-color-green-hue) + 1deg) 28% 37%);--dh-color-green-700: hsl(calc(var(--dh-color-green-hue) + 1deg) 30% 42%);--dh-color-green-800: hsl(var(--dh-color-green-hue) 32% 48%);--dh-color-green-900: hsl(var(--dh-color-green-hue) 38% 53%);--dh-color-green-1000: hsl(var(--dh-color-green-hue) 47% 58%);--dh-color-green-1100: hsl(var(--dh-color-green-hue) 59% 64%);--dh-color-green-1200: hsl(var(--dh-color-green-hue) 71% 70%);--dh-color-green-1300: hsl(var(--dh-color-green-hue) 81% 79%);--dh-color-green-1400: hsl(calc(var(--dh-color-green-hue) - 1deg) 88% 87%);--dh-color-seafoam-hue: 159deg;--dh-color-seafoam-100: hsl(calc(var(--dh-color-seafoam-hue) - 3deg) 14% 14%);--dh-color-seafoam-200: hsl(calc(var(--dh-color-seafoam-hue) - 1deg) 17% 18%);--dh-color-seafoam-300: hsl(var(--dh-color-seafoam-hue) 20% 23%);--dh-color-seafoam-400: hsl(calc(var(--dh-color-seafoam-hue) - 1deg) 23% 28%);--dh-color-seafoam-500: hsl(calc(var(--dh-color-seafoam-hue) - 1deg) 26% 33%);--dh-color-seafoam-600: hsl(var(--dh-color-seafoam-hue) 29% 37%);--dh-color-seafoam-700: hsl(calc(var(--dh-color-seafoam-hue) + 2deg) 33% 42%);--dh-color-seafoam-800: hsl(calc(var(--dh-color-seafoam-hue) + 2deg) 36% 47%);--dh-color-seafoam-900: hsl(calc(var(--dh-color-seafoam-hue) + 3deg) 42% 51%);--dh-color-seafoam-1000: hsl( calc(var(--dh-color-seafoam-hue) + 2deg) 53% 56% );--dh-color-seafoam-1100: hsl( calc(var(--dh-color-seafoam-hue) + 3deg) 66% 62% );--dh-color-seafoam-1200: hsl( calc(var(--dh-color-seafoam-hue) + 2deg) 76% 70% );--dh-color-seafoam-1300: hsl( calc(var(--dh-color-seafoam-hue) - 1deg) 87% 80% );--dh-color-seafoam-1400: hsl( calc(var(--dh-color-seafoam-hue) - 3deg) 89% 89% );--dh-color-cyan-hue: 186deg;--dh-color-cyan-100: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 38% 13%);--dh-color-cyan-200: hsl(var(--dh-color-cyan-hue) 38% 16%);--dh-color-cyan-300: hsl(var(--dh-color-cyan-hue) 39% 21%);--dh-color-cyan-400: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 38% 26%);--dh-color-cyan-500: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 38% 31%);--dh-color-cyan-600: hsl(var(--dh-color-cyan-hue) 38% 37%);--dh-color-cyan-700: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 38% 42%);--dh-color-cyan-800: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 37% 48%);--dh-color-cyan-900: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 42% 54%);--dh-color-cyan-1000: hsl(calc(var(--dh-color-cyan-hue) - 1deg) 52% 60%);--dh-color-cyan-1100: hsl(var(--dh-color-cyan-hue) 64% 67%);--dh-color-cyan-1200: hsl(var(--dh-color-cyan-hue) 79% 74%);--dh-color-cyan-1300: hsl(var(--dh-color-cyan-hue) 92% 81%);--dh-color-cyan-1400: hsl(var(--dh-color-cyan-hue) 100% 90%);--dh-color-indigo-hue: 235deg;--dh-color-indigo-100: hsl(calc(var(--dh-color-indigo-hue) + 2deg) 58% 24%);--dh-color-indigo-200: hsl(calc(var(--dh-color-indigo-hue) + 1deg) 52% 30%);--dh-color-indigo-300: hsl(calc(var(--dh-color-indigo-hue) + 1deg) 47% 37%);--dh-color-indigo-400: hsl(var(--dh-color-indigo-hue) 43% 44%);--dh-color-indigo-500: hsl(var(--dh-color-indigo-hue) 40% 51%);--dh-color-indigo-600: hsl(var(--dh-color-indigo-hue) 49% 58%);--dh-color-indigo-700: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 60% 65%);--dh-color-indigo-800: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 75% 72%);--dh-color-indigo-900: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 91% 78%);--dh-color-indigo-1000: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 100% 83%);--dh-color-indigo-1100: hsl(calc(var(--dh-color-indigo-hue) - 1deg) 100% 87%);--dh-color-indigo-1200: hsl(var(--dh-color-indigo-hue) 100% 91%);--dh-color-indigo-1300: hsl(calc(var(--dh-color-indigo-hue) - 3deg) 100% 94%);--dh-color-indigo-1400: hsl(calc(var(--dh-color-indigo-hue) + 1deg) 100% 97%);--dh-color-purple-hue: 254deg;--dh-color-purple-100: hsl(calc(var(--dh-color-purple-hue) + 9deg) 73% 23%);--dh-color-purple-200: hsl(calc(var(--dh-color-purple-hue) + 6deg) 59% 30%);--dh-color-purple-300: hsl(calc(var(--dh-color-purple-hue) + 4deg) 50% 37%);--dh-color-purple-400: hsl(calc(var(--dh-color-purple-hue) + 3deg) 43% 44%);--dh-color-purple-500: hsl(calc(var(--dh-color-purple-hue) + 1deg) 38% 50%);--dh-color-purple-600: hsl(var(--dh-color-purple-hue) 45% 57%);--dh-color-purple-700: hsl(calc(var(--dh-color-purple-hue) - 1deg) 54% 64%);--dh-color-purple-800: hsl(calc(var(--dh-color-purple-hue) - 3deg) 64% 71%);--dh-color-purple-900: hsl(calc(var(--dh-color-purple-hue) - 4deg) 79% 78%);--dh-color-purple-1000: hsl(calc(var(--dh-color-purple-hue) - 5deg) 91% 83%);--dh-color-purple-1100: hsl(calc(var(--dh-color-purple-hue) - 5deg) 97% 88%);--dh-color-purple-1200: hsl(calc(var(--dh-color-purple-hue) - 4deg) 100% 91%);--dh-color-purple-1300: hsl(calc(var(--dh-color-purple-hue) - 3deg) 100% 95%);--dh-color-purple-1400: hsl(calc(var(--dh-color-purple-hue) + 6deg) 88% 97%);--dh-color-fuchsia-hue: 286deg;--dh-color-fuchsia-100: hsl( calc(var(--dh-color-fuchsia-hue) + 15deg) 64% 16% );--dh-color-fuchsia-200: hsl( calc(var(--dh-color-fuchsia-hue) + 14deg) 53% 22% );--dh-color-fuchsia-300: hsl( calc(var(--dh-color-fuchsia-hue) + 11deg) 44% 29% );--dh-color-fuchsia-400: hsl(calc(var(--dh-color-fuchsia-hue) + 8deg) 39% 35%);--dh-color-fuchsia-500: hsl(calc(var(--dh-color-fuchsia-hue) + 5deg) 35% 43%);--dh-color-fuchsia-600: hsl(calc(var(--dh-color-fuchsia-hue) + 1deg) 33% 51%);--dh-color-fuchsia-700: hsl(calc(var(--dh-color-fuchsia-hue) - 3deg) 40% 58%);--dh-color-fuchsia-800: hsl(calc(var(--dh-color-fuchsia-hue) - 7deg) 50% 66%);--dh-color-fuchsia-900: hsl(calc(var(--dh-color-fuchsia-hue) - 9deg) 61% 74%);--dh-color-fuchsia-1000: hsl( calc(var(--dh-color-fuchsia-hue) - 11deg) 71% 80% );--dh-color-fuchsia-1100: hsl( calc(var(--dh-color-fuchsia-hue) - 11deg) 76% 85% );--dh-color-fuchsia-1200: hsl( calc(var(--dh-color-fuchsia-hue) - 9deg) 78% 89% );--dh-color-fuchsia-1300: hsl( calc(var(--dh-color-fuchsia-hue) - 6deg) 77% 93% );--dh-color-fuchsia-1400: hsl( calc(var(--dh-color-fuchsia-hue) + 2deg) 71% 96% );--dh-color-magenta-hue: 330deg;--dh-color-magenta-100: hsl(calc(var(--dh-color-magenta-hue) + 3deg) 91% 17%);--dh-color-magenta-200: hsl(calc(var(--dh-color-magenta-hue) + 4deg) 72% 23%);--dh-color-magenta-300: hsl(calc(var(--dh-color-magenta-hue) + 4deg) 60% 30%);--dh-color-magenta-400: hsl(calc(var(--dh-color-magenta-hue) + 4deg) 52% 36%);--dh-color-magenta-500: hsl(calc(var(--dh-color-magenta-hue) + 3deg) 46% 43%);--dh-color-magenta-600: hsl(calc(var(--dh-color-magenta-hue) + 2deg) 42% 50%);--dh-color-magenta-700: hsl(var(--dh-color-magenta-hue) 51% 58%);--dh-color-magenta-800: hsl(calc(var(--dh-color-magenta-hue) - 1deg) 61% 65%);--dh-color-magenta-900: hsl(calc(var(--dh-color-magenta-hue) - 1deg) 76% 72%);--dh-color-magenta-1000: hsl( calc(var(--dh-color-magenta-hue) - 2deg) 92% 79% );--dh-color-magenta-1100: hsl( calc(var(--dh-color-magenta-hue) - 3deg) 100% 85% );--dh-color-magenta-1200: hsl( calc(var(--dh-color-magenta-hue) - 3deg) 100% 89% );--dh-color-magenta-1300: hsl( calc(var(--dh-color-magenta-hue) - 4deg) 100% 93% );--dh-color-magenta-1400: hsl( calc(var(--dh-color-magenta-hue) - 2deg) 100% 96% )}
|
|
217
217
|
`,It=`:root{--dh-color-accent: var(--dh-color-blue-700);--dh-color-border: var(--dh-color-gray-500);--dh-color-background: var(--dh-color-black);--dh-color-foreground: var(--dh-color-white);--dh-color-content-background: var(--dh-color-gray-100);--dh-color-heading-text: var(--dh-color-gray-900);--dh-color-text: var(--dh-color-gray-800);--dh-color-text-disabled: var(--dh-color-gray-400);--dh-color-text-highlight: hsla(var(--dh-color-blue-hue), 83%, 62%, .3);--dh-color-accent-100: var(--dh-color-blue-100);--dh-color-accent-200: var(--dh-color-blue-200);--dh-color-accent-300: var(--dh-color-blue-300);--dh-color-accent-400: var(--dh-color-blue-400);--dh-color-accent-500: var(--dh-color-blue-500);--dh-color-accent-600: var(--dh-color-blue-600);--dh-color-accent-700: var(--dh-color-blue-700);--dh-color-accent-800: var(--dh-color-blue-800);--dh-color-accent-900: var(--dh-color-blue-900);--dh-color-accent-1000: var(--dh-color-blue-1000);--dh-color-accent-1100: var(--dh-color-blue-1100);--dh-color-accent-1200: var(--dh-color-blue-1200);--dh-color-accent-1300: var(--dh-color-blue-1300);--dh-color-accent-1400: var(--dh-color-blue-1400);--dh-color-accent-background-default: var(--dh-color-accent-600);--dh-color-accent-background-hover: var(--dh-color-accent-500);--dh-color-accent-background-down: var(--dh-color-accent-400);--dh-color-accent-background-key-focus: var(--dh-color-accent-500);--dh-color-default-gray-bg: var(--dh-color-gray-700);--dh-color-default-blue-bg: var(--dh-color-blue-700);--dh-color-default-red-bg: var(--dh-color-red-700);--dh-color-default-orange-bg: var(--dh-color-orange-800);--dh-color-default-yellow-bg: var(--dh-color-yellow-1000);--dh-color-default-chartreuse-bg: var(--dh-color-chartreuse-900);--dh-color-default-celery-bg: var(--dh-color-celery-800);--dh-color-default-green-bg: var(--dh-color-green-700);--dh-color-default-seafoam-bg: var(--dh-color-seafoam-700);--dh-color-default-cyan-bg: var(--dh-color-cyan-700);--dh-color-default-indigo-bg: var(--dh-color-indigo-700);--dh-color-default-purple-bg: var(--dh-color-purple-700);--dh-color-default-fuchsia-bg: var(--dh-color-fuchsia-700);--dh-color-default-magenta-bg: var(--dh-color-magenta-700);--dh-color-focus: var(--dh-color-blue-800);--dh-color-focus-border: var(--dh-color-blue-800);--dh-color-focus-ring: var(--dh-color-focus);--dh-color-highlight-active: hsla(var(--dh-color-gray-hue), 0%, 94%, .15);--dh-color-highlight-hover: hsla(var(--dh-color-gray-hue), 0%, 100%, .08);--dh-color-highlight-invalid: hsla(var(--dh-color-red-hue), 80%, 48%, .15);--dh-color-highlight-selected: hsla(var(--dh-color-blue-hue), 83%, 62%, .13);--dh-color-highlight-selected-hover: hsla( var(--dh-color-blue-hue), 83%, 62%, .2 );--dh-color-dropshadow: hsla(var(--dh-color-gray-hue), 0, 0, .8);--dh-color-overlay-modal-bg: hsla(var(--dh-color-gray-hue), 0%, 0%, .6);--dh-color-overlay-hover-bg: hsla(var(--dh-color-gray-hue), 0%, 100%, .08);--dh-color-negative-default-bg: var(--dh-color-red-600);--dh-color-negative-hover-bg: var(--dh-color-red-500);--dh-color-negative-down-bg: var(--dh-color-red-400);--dh-color-negative-key-focus-bg: var(--dh-color-red-500);--dh-neutral-default-bg: var(--dh-color-gray-500);--dh-neutral-hover-bg: var(--dh-color-gray-400);--dh-neutral-down-bg: var(--dh-color-gray-300);--dh-neutral-key-focus-bg: var(--dh-color-gray-400);--dh-neutral-subdued-default-bg: var(--dh-color-gray-400);--dh-neutral-subdued-hover-bg: var(--dh-color-gray-300);--dh-neutral-subdued-down-bg: var(--dh-color-gray-200);--dh-neutral-subdued-key-focus-bg: var(--dh-color-gray-300);--dh-color-positive-default-bg: var(--dh-color-green-900);--dh-color-positive-hover-bg: var(--dh-color-green-800);--dh-color-positive-down-bg: var(--dh-color-green-700);--dh-color-positive-key-focus-bg: var(--dh-color-green-800);--dh-color-info-default-bg: var(--dh-color-cyan-1000);--dh-color-info-hover-bg: var(--dh-color-cyan-900);--dh-color-info-down-bg: var(--dh-color-cyan-800);--dh-color-info-key-focus-bg: var(--dh-color-cyan-900);--dh-color-notice-default-bg: var(--dh-color-yellow-1000);--dh-color-notice-hover-bg: var(--dh-color-yellow-900);--dh-color-notice-down-bg: var(--dh-color-yellow-800);--dh-color-notice-key-focus-bg: var(--dh-color-yellow-1000);--dh-color-visual-blue: var(--dh-color-blue-700);--dh-color-visual-celery: var(--dh-color-celery-1000);--dh-color-visual-chartreuse: var(--dh-color-chartreuse-1100);--dh-color-visual-cyan: var(--dh-color-cyan-1100);--dh-color-visual-fuchsia: var(--dh-color-fuchsia-900);--dh-color-visual-gray: var(--dh-color-gray-600);--dh-color-visual-green: var(--dh-color-green-1100);--dh-color-visual-indigo: var(--dh-color-indigo-900);--dh-color-visual-magenta: var(--dh-color-magenta-900);--dh-color-visual-orange: var(--dh-color-orange-900);--dh-color-visual-purple: var(--dh-color-purple-900);--dh-color-visual-red: var(--dh-color-red-800);--dh-color-visual-seafoam: var(--dh-color-seafoam-1100);--dh-color-visual-yellow: var(--dh-color-yellow-1200);--dh-color-visual-positive: var(--dh-color-green-1100);--dh-color-visual-negative: var(--dh-color-red-800);--dh-color-visual-notice: var(--dh-color-yellow-1200);--dh-color-visual-info: var(--dh-color-cyan-1100);--dh-color-well-bg: hsla(var(--dh-color-gray-hue) 0% 92% .02);--dh-color-well-border: hsla(var(--dh-color-gray-hue) 0% 94% .05)}
|
|
218
218
|
`,Dt=`:root{--dh-color-chart-bg: var(--dh-color-content-background);--dh-color-chart-plot-bg: var(--dh-color-gray-200);--dh-color-chart-title: var(--dh-color-white);--dh-color-chart-colorway: var(--dh-color-visual-cyan) var(--dh-color-visual-green) var(--dh-color-visual-yellow) var(--dh-color-visual-purple) var(--dh-color-visual-orange) var(--dh-color-visual-red) var(--dh-color-visual-chartreuse) var(--dh-color-visual-fuchsia) var(--dh-color-visual-seafoam) var(--dh-color-visual-magenta) var(--dh-color-white);--dh-color-chart-grid: var(--dh-color-gray-400);--dh-color-chart-axis-line: var(--dh-color-gray-500);--dh-color-chart-axis-line-zero: var(--dh-color-gray-700);--dh-color-chart-active: var(--dh-color-accent-600);--dh-color-chart-range-bg: hsla(var(--dh-color-gray-hue), 1%, 36%, .7);--dh-color-chart-area: var(--dh-color-visual-blue);--dh-color-chart-trend: var(--dh-color-green-1200);--dh-color-chart-error-band-line: var(--dh-color-green-1400);--dh-color-chart-error-band-fill: hsla( var(--dh-color-green-hue), 71%, 70%, .1 );--dh-color-chart-ohlc-increase: var(--dh-color-visual-green);--dh-color-chart-ohlc-decrease: var(--dh-color-visual-red);--dh-color-chart-line-deprecated: var(--dh-color-visual-green)}
|
|
219
219
|
`,$t=`:root{--dh-color-editor-bg: var(--dh-color-content-background);--dh-color-editor-fg: var(--dh-color-gray-900);--dh-color-editor-error-fg: var(--dh-color-visual-red);--dh-color-editor-line-number-fg: var(--dh-color-gray-700);--dh-color-editor-line-highlight-bg: var(--dh-color-gray-200);--dh-color-editor-selection-bg: var(--dh-color-text-highlight);--dh-color-editor-comment: var(--dh-color-gray-700);--dh-color-editor-delimiter: var(--dh-color-gray-700);--dh-color-editor-identifier-js: var(--dh-color-visual-yellow);--dh-color-editor-identifier-namespace: var(--dh-color-visual-red);--dh-color-editor-identifier: var(--dh-color-gray-900);--dh-color-editor-keyword: var(--dh-color-visual-cyan);--dh-color-editor-number: var(--dh-color-visual-purple);--dh-color-editor-operator: var(--dh-color-visual-red);--dh-color-editor-predefined: var(--dh-color-visual-green);--dh-color-editor-storage: var(--dh-color-visual-red);--dh-color-editor-string-delim: var(--dh-color-gray-700);--dh-color-editor-string: var(--dh-color-visual-yellow);--dh-color-editor-focus-border: var(--dh-color-focus-border);--dh-color-editor-input-option-active-border: var(--dh-color-focus-ring);--dh-color-editor-input-bg: var(--dh-color-background);--dh-color-editor-input-fg: var(--dh-color-text);--dh-color-editor-input-border: var(--dh-color-border);--dh-color-editor-context-menu-bg: var(--dh-color-gray-300);--dh-color-editor-context-menu-fg: var(--dh-color-gray-900);--dh-color-editor-menu-selection-bg: var(--dh-color-highlight-hover);--dh-color-editor-log-date: var(--dh-color-gray-700);--dh-color-editor-log-error: var(--dh-color-visual-red);--dh-color-editor-log-info: var(--dh-color-visual-cyan);--dh-color-editor-log-stdout: var(--dh-color-gray-900);--dh-color-editor-log-warn: var(--dh-color-visual-yellow);--dh-color-editor-log-debug: var(--dh-color-visual-purple);--dh-color-editor-log-trace: var(--dh-color-visual-green);--dh-color-editor-find-bg: var(--dh-color-gray-200);--dh-color-editor-find-match-bg: var(--dh-color-highlight-selected);--dh-color-editor-find-match-highlight-bg: var( --dh-color-highlight-selected-hover );--dh-color-editor-find-option-active-bg: var(--dh-color-accent-700);--dh-color-editor-find-option-active-fg: var(--dh-color-gray-900);--dh-color-editor-suggest-bg: var(--dh-color-gray-200);--dh-color-editor-suggest-border: var(--dh-color-gray-400);--dh-color-editor-suggest-fg: var(--dh-color-white);--dh-color-editor-suggest-selected-bg: var(--dh-color-highlight-selected);--dh-color-editor-suggest-selected-fg: var(--dh-color-white);--dh-color-editor-suggest-highlight-fg: var(--dh-color-accent-700);--dh-color-editor-suggest-focus-highlight-fg: var(--dh-color-accent-700);--dh-color-editor-suggest-hover-bg: var(--dh-color-highlight-hover);--dh-color-editor-link-foreground: var(--dh-color-accent-1000);--dh-color-editor-link-active-fg: var(--dh-color-accent-1100)}
|
|
220
220
|
`,Mt=`:root{--dh-color-grid-bg: var(--dh-color-background);--dh-color-grid-header-bg: var(--dh-color-gray-100);--dh-color-grid-header-text: var(--dh-color-heading-text);--dh-color-grid-header-separator: var(--dh-color-gray-50);--dh-color-grid-header-separator-hover: var(--dh-color-gray-600);--dh-color-grid-header-separator-hidden-hover: var(--dh-color-accent-700);--dh-color-grid-header-sort-bar: var(--dh-color-visual-purple);--dh-color-grid-header-reverse-bar: var(--dh-color-visual-green);--dh-color-grid-header-bar-casing: var(--dh-color-gray-50);--dh-color-grid-row-0-bg: var(--dh-color-gray-300);--dh-color-grid-row-1-bg: var(--dh-color-gray-100);--dh-color-grid-row-hover-bg: var(--dh-color-highlight-hover);--dh-color-grid-row-hover-bg-selected: var( --dh-color-highlight-selected-hover );--dh-color-grid-selection: var(--dh-color-highlight-selected);--dh-color-grid-selection-outline: var(--dh-color-accent-900);--dh-color-grid-selection-outline-casing: var(--dh-color-gray-50);--dh-color-grid-scroll-bar-active-selection-tick: var(--dh-color-accent-400);--dh-color-grid-scroll-bar-bg: var(--dh-color-gray-100);--dh-color-grid-scroll-bar-hover-bg: var(--dh-color-gray-200);--dh-color-grid-scroll-bar-casing: var(--dh-color-gray-400);--dh-color-grid-scroll-bar-corner: var(--dh-color-gray-100);--dh-color-grid-scroll-bar: var(--dh-color-gray-500);--dh-color-grid-scroll-bar-hover: var(--dh-color-gray-600);--dh-color-grid-scroll-bar-active: var(--dh-color-gray-700);--dh-color-grid-text: var(--dh-color-text);--dh-color-grid-text-hyperlink: var(--dh-color-accent-1000);--dh-color-grid-text-pending: var(--dh-color-yellow-1300);--dh-color-grid-text-error: var(--dh-color-visual-negative);--dh-color-grid-date: var(--dh-color-visual-notice);--dh-color-grid-number-positive: var(--dh-color-visual-positive);--dh-color-grid-number-negative: var(--dh-color-visual-negative);--dh-color-grid-number-zero: var(--dh-color-visual-notice);--dh-color-grid-string-null: var(--dh-color-gray-600);--dh-color-grid-filter-bar-active-bg: var(--dh-color-accent-300);--dh-color-grid-filter-bar-active: var(--dh-color-accent-600);--dh-color-grid-filter-bar-expanded-bg: var(--dh-color-gray-200);--dh-color-grid-filter-bar-expanded-active-bg: var(--dh-color-accent-100);--dh-color-grid-filter-bar-expanded-active-cell-bg: var( --dh-color-accent-200 );--dh-color-grid-filter-bar-separator: var(--dh-color-gray-600);--dh-color-grid-filter-bar-error: var(--dh-color-visual-negative);--dh-color-grid-filter-icon: var(--dh-color-accent-600);--dh-color-grid-context-menu-sort-icon: var(--dh-color-visual-purple);--dh-color-grid-context-menu-reverse-icon: var(--dh-color-visual-green);--dh-color-grid-column-linker-hover-bg: var( --dh-color-highlight-selected-hover );--dh-color-grid-column-grouped-divider: var(--dh-color-gray-50);--dh-color-grid-tree-line: var(--dh-color-gray-500);--dh-color-grid-tree-marker: var(--dh-color-gray-700);--dh-color-grid-tree-marker-hover: var(--dh-color-gray-900);--dh-color-grid-floating-row: var(--dh-color-gray-300);--dh-color-grid-floating-row-bg: var(--dh-color-gray-200);--dh-color-grid-floating-divider-inner: var(--dh-color-gray-200);--dh-color-grid-floating-divider-outer: var(--dh-color-gray-50);--dh-color-grid-overflow-button: var(--dh-color-gray-700);--dh-color-grid-overflow-button-hover: var(--dh-color-gray-900);--dh-color-grid-data-bar-positive: var(--dh-color-visual-positive);--dh-color-grid-data-bar-negative: var(--dh-color-visual-negative);--dh-color-grid-data-bar-marker: var(--dh-color-white);--dh-color-grid-data-bar-zero-line: var(--dh-color-gray-300);--dh-color-grid-scrim: var(--dh-color-gray-50)}
|
|
221
221
|
`,At=`:root{--dh-color-quickactions-bg: hsla(var(--dh-color-gray-hue), 0%, 11%, .9);--dh-color-radial-reaction: hsla(var(--dh-color-gray-hue), 0%, 92%, .6);--dh-color-colorpicker-border: hsla(var(--dh-color-gray-hue), 0%, 94%, .1)}
|
|
222
|
-
`,Rt="_themeColors_1nrrl_1",Lt="_label_1nrrl_8",Pt="_swatch_1nrrl_17",Ce={themeColors:Rt,label:Lt,swatch:Pt},Ft={"--dh-color-black":"gray","--dh-color-white":"gray","--dh-color-visual-positive":"Visual Status","--dh-color-visual-negative":"Visual Status","--dh-color-visual-notice":"Visual Status","--dh-color-visual-info":"Visual Status","--dh-color-editor-bg":"editor","--dh-color-editor-fg":"editor","--dh-color-editor-context-menu-bg":"menus","--dh-color-editor-context-menu-fg":"menus","--dh-color-editor-menu-selection-bg":"menus","--dh-color-grid-bg":"grid","--dh-color-grid-number-positive":"Data Types","--dh-color-grid-number-negative":"Data Types","--dh-color-grid-number-zero":"Data Types","--dh-color-grid-date":"Data Types","--dh-color-grid-string-null":"Data Types"},oe={editor:{line:"editor",comment:"code",string:"code",number:"code",delimiter:"code",identifier:"code",keyword:"code",operator:"code",storage:"code",predefined:"code",selection:"state",focus:"state"},chart:{axis:"Chart",bg:"Chart",grid:"Chart",plot:"Chart",title:"Chart",active:"Data",trend:"Data",area:"Data",range:"Data",line:"Deprecated"},grid:{data:"Data Bars",context:"Context Menu"},semantic:{positive:"status",negative:"status",notice:"status",info:"status",well:"wells"}},_t={"Theme Color Palette":U(Et,1),"Semantic Colors":U(It,1,oe.semantic),"Chart Colors":U(Dt,2,oe.chart),"Editor Colors":U($t,2,oe.editor),"Grid Colors":U(Mt,2,oe.grid),"Component Colors":U(At,1)};function Bt(){return e.jsx(e.Fragment,{children:Object.entries(_t).map(([a,r])=>e.jsxs("div",{...p(a),children:[e.jsx("h2",{className:"ui-title",children:a}),e.jsx("div",{className:Ce.themeColors,children:Object.entries(r).map(([o,t])=>e.jsxs("div",{style:{gridRow:`span ${t.length+1}`},children:[e.jsx("span",{className:Ce.label,children:o}),t.map(({name:l,value:n})=>e.jsxs("div",{className:Ce.swatch,style:{backgroundColor:n,color:`var(--dh-color-${Vt(n)})`},children:[e.jsxs(le,{children:[e.jsx("div",{children:l}),e.jsx("div",{children:n}),e.jsx("div",{children:Ee.normalizeCssColor(n).replace(/^(#[a-f0-9]{6})ff$/,"$1")})]}),e.jsx("span",{children:l.replace("--dh-color-","")}),l.endsWith("-hue")?e.jsx("span",{children:n}):null]},l))]},o))})]},a))})}function Vt(a){const r=Ee.parseRgba(Ee.asRgbOrRgbaString(a)??"");if(r==null||r.a<.5)return"white";const{r:o,g:t,b:l}=r;return(299*o+587*t+114*l)/1e3>=128?"black":"white"}function Ot(a){const r=getComputedStyle(document.documentElement);return a.split(/[\n;]/g).map(t=>/^(?:\s{2}|:root\{)?(--dh-color-(?:[^:]+))/.exec(t)?.[1]).filter(t=>!!t).map(t=>{const l=r.getPropertyValue(t);return t==="--dh-color-chart-colorway"?l.split("hsl").filter(Boolean).map(s=>`hsl${s.trim()}`).map((s,i)=>({name:`${t}-${i}`,value:s})):{name:t,value:l}}).flat()}function U(a,r,o={}){return Ot(a).reduce((n,{name:s,value:i})=>{const h=/^--dh-color-([^-]+)(?:-([^-]+))?/.exec(s);let d=Ft[s]??h?.[r]??h?.[1]??"???";return d=o[d]??d,n[d]==null&&(n[d]=[]),s==="--dh-color-black"&&n[d].push({name:"",value:""}),n[d].push({name:s,value:i}),n},{})}const Se="data-menu-category",Ut="data-no-menu",pr="spectrum-component-samples";function Ht(){return e.jsxs("div",{id:pr,children:[e.jsx("h2",{className:"ui-title","data-no-menu":!0,children:"Spectrum Components"}),e.jsxs(Ie,{gap:20,columns:Cr("0px","1fr"),children:[e.jsxs(_,{...T("spectrum-buttons"),children:[e.jsx("h3",{children:"Buttons"}),e.jsx(Gt,{})]}),e.jsxs(_,{...T("spectrum-collections"),children:[e.jsx("h3",{children:"Collections"}),e.jsx(Zt,{})]}),e.jsxs(_,{...T("spectrum-content"),children:[e.jsx("h3",{children:"Content"}),e.jsx(qt,{})]}),e.jsxs(_,{...T("spectrum-forms"),children:[e.jsx("h3",{children:"Forms"}),e.jsx(zt,{})]}),e.jsxs(_,{...T("spectrum-overlays"),children:[e.jsx("h3",{children:"Overlays"}),e.jsx(Wt,{})]}),e.jsxs(_,{...T("spectrum-well"),children:[e.jsx("h3",{children:"Wells"}),e.jsx(Sr,{children:"This is a well."})]})]})]})}function Gt(){return e.jsxs(Ie,{autoFlow:"column",columnGap:"size-250",rowGap:"size-150",columns:Ne(4,"size-2000"),rows:Ne(8,"size-400"),children:[e.jsx("label",{children:'Button style="outline"'}),e.jsx(j,{variant:"primary",style:"outline",children:"Primary"}),e.jsx(j,{variant:"secondary",style:"outline",children:"Secondary"}),e.jsx(j,{variant:"accent",style:"outline",children:"Accent"}),e.jsx(j,{variant:"negative",style:"outline",children:"Negative"}),e.jsx(j,{variant:"primary",staticColor:"black",style:"outline",children:"Static Black"}),e.jsx(j,{variant:"primary",staticColor:"white",style:"outline",children:"Static White"}),e.jsx(j,{variant:"primary",isDisabled:!0,style:"outline",children:"Disabled"}),e.jsx("label",{children:'Button style="fill"'}),e.jsx(j,{variant:"primary",style:"fill",children:"Primary"}),e.jsx(j,{variant:"secondary",style:"fill",children:"Secondary"}),e.jsx(j,{variant:"accent",style:"fill",children:"Accent"}),e.jsx(j,{variant:"negative",style:"fill",children:"Negative"}),e.jsx(j,{variant:"primary",staticColor:"black",style:"fill",children:"Static Black"}),e.jsx(j,{variant:"primary",staticColor:"white",style:"fill",children:"Static White"}),e.jsx(j,{variant:"primary",isDisabled:!0,style:"fill",children:"Disabled"}),e.jsx("label",{children:"Action Button"}),e.jsx(H,{children:"Normal"}),e.jsx(H,{gridRow:"span 3",isQuiet:!0,children:"Quiet"}),e.jsx(H,{staticColor:"black",children:"Static Black"}),e.jsx(H,{staticColor:"white",children:"Static White"}),e.jsx(H,{isDisabled:!0,children:"Disabled"}),e.jsx("label",{children:"Toggle Button"}),e.jsx(B,{children:"Normal"}),e.jsx(B,{isQuiet:!0,children:"Quiet"}),e.jsx(B,{gridRow:"span 2",isEmphasized:!0,children:"Emphasized"}),e.jsx(B,{staticColor:"black",children:"Static Black"}),e.jsx(B,{staticColor:"white",children:"Static White"}),e.jsx(B,{isDisabled:!0,children:"Disabled"})]})}function Wt(){return e.jsxs(e.Fragment,{children:[e.jsx(_e,{children:"Contextual Help"}),e.jsxs(Tr,{variant:"info",children:[e.jsx(cr,{children:"Need help?"}),e.jsx(ir,{children:e.jsx(_e,{children:"This is a helpful description of the thing you need help with."})})]})]})}function zt(){return e.jsx(Nr,{children:e.jsxs(Ie,{gap:20,columns:Ne("auto-fit","210px"),children:[e.jsx(kr,{label:"Text Field"}),e.jsxs(Er,{label:"Combobox",menuTrigger:"focus",defaultSelectedKey:"two",children:[e.jsx(te,{children:"One"},"one"),e.jsx(te,{children:"Two"},"two"),e.jsx(te,{children:"Three"},"three")]}),e.jsx(Ir,{children:"Checkbox"}),e.jsx(Dr,{label:"Slider",defaultValue:24}),e.jsx($r,{children:"Switch"})]})})}function qt(){return e.jsxs(Mr,{children:[e.jsx(ie,{size:"XL",children:e.jsx(f,{icon:L.vsEmptyWindow})}),e.jsx(cr,{children:"Illustrated Message"}),e.jsx(ir,{children:"This is the content of the message."})]})}function Zt(){return e.jsxs(e.Fragment,{children:[e.jsx("label",{id:"table-view-sample",children:"Table View"}),e.jsxs(Ar,{"aria-labelledby":"table-view-sample",selectionMode:"multiple",children:[e.jsxs(Rr,{children:[e.jsxs(V,{title:"Person",children:[e.jsx(V,{allowsResizing:!0,children:"Name"}),e.jsx(V,{children:"Age"})]}),e.jsxs(V,{title:"Address",children:[e.jsx(V,{allowsResizing:!0,children:"City"}),e.jsx(V,{children:"State"})]})]}),e.jsxs(Lr,{children:[e.jsxs(he,{children:[e.jsx(k,{children:"John"}),e.jsx(k,{children:"42"}),e.jsx(k,{children:"San Francisco"}),e.jsx(k,{children:"CA"})]}),e.jsxs(he,{children:[e.jsx(k,{children:"Jane"}),e.jsx(k,{children:"38"}),e.jsx(k,{children:"San Francisco"}),e.jsx(k,{children:"CA"})]}),e.jsxs(he,{children:[e.jsx(k,{children:"Becky"}),e.jsx(k,{children:"12"}),e.jsx(k,{children:"San Francisco"}),e.jsx(k,{children:"CA"})]})]})]})]})}function Te({"data-menu-category":a}){return e.jsx("div",{"data-menu-category":a})}function Yt(){const[a,r]=u.useState([]);u.useEffect(()=>{let t={category:"",items:[]};const l=[t],n=document.querySelector(`#${pr}`);document.querySelectorAll(`h2,h3,[${Se}]`).forEach(s=>{if(s.textContent==null||s.hasAttribute(Ut))return;if(s.hasAttribute(Se)){t={category:s.getAttribute(Se)??"",items:[]},l.push(t);return}const i=`${n?.contains(s)===!0?"spectrum-":""}${s.textContent}`.toLowerCase().replace(/\s/g,"-");s.id=i,t.items.push({id:i,label:s.textContent})}),r(l)},[]),u.useEffect(()=>{const t=window.location.hash===""?null:document.querySelector(window.location.hash);t&&setTimeout(()=>{t.scrollIntoView()},0)},[]);const o=u.useCallback(t=>{const l=String(t);document.getElementById(l)?.scrollIntoView({behavior:"smooth"}),setTimeout(()=>{window.location.hash=l},1e3)},[]);return e.jsxs(Pr,{children:[e.jsx(H,{children:e.jsx(ie,{children:e.jsx(f,{icon:Gr})})}),e.jsx(Fr,{items:a,onAction:o,children:({category:t,items:l})=>e.jsx(_r,{items:l,title:t,children:({id:n,label:s})=>e.jsx(te,{children:s},n)},t)})]})}function Xt(){const a=u.useCallback(()=>{window.scrollTo({top:0,behavior:"smooth"}),setTimeout(()=>{window.location.hash=""},500)},[]);return u.useEffect(()=>{function r(){document.documentElement.dataset.scroll=String(window.scrollY>120)}return document.addEventListener("scroll",r,{passive:!0}),()=>{document.removeEventListener("scroll",r)}},[]),e.jsx(j,{UNSAFE_className:"goto-top-button",variant:"accent",onPress:a,children:e.jsx(ie,{children:e.jsx(f,{icon:Wr})})})}const sr={position:"sticky",justifyContent:"end",zIndex:1,UNSAFE_style:{float:"right"}};function Kt(){return e.jsxs("div",{className:"container style-guide-container",children:[e.jsx(D,{justifyContent:"space-between",alignItems:"center",marginTop:"2rem",marginBottom:"1rem",children:e.jsx("h1",{style:{paddingTop:"2rem"},children:"Deephaven UI Components"})}),e.jsx(D,{...sr,UNSAFE_className:Ke,marginTop:-56,top:20,children:e.jsx(Yt,{})}),e.jsx(D,{...sr,UNSAFE_className:Ke,top:"calc(100vh - 40px)",marginTop:-32,children:e.jsx(Xt,{})}),e.jsx(yt,{}),e.jsx(Te,{"data-menu-category":"Colors"}),e.jsx(Zo,{}),e.jsx(Bt,{}),e.jsx(Te,{"data-menu-category":"Components"}),e.jsx(J,{}),e.jsx(xt,{}),e.jsx(Re,{}),e.jsx(gt,{}),e.jsx(vt,{}),e.jsx(ne,{}),e.jsx(ft,{}),e.jsx(Xo,{}),e.jsx(pt,{}),e.jsx(Yo,{}),e.jsx(Ko,{}),e.jsx(kt,{}),e.jsx(bt,{}),e.jsx(ht,{}),e.jsx(et,{}),e.jsx(ct,{}),e.jsx(qo,{}),e.jsx(vo,{}),e.jsx(Te,{"data-menu-category":"Spectrum Components"}),e.jsx(Ht,{})]})}function Le(a){const{workspace:r,setWorkspace:o}=a;return u.useEffect(()=>{fo.makeDefaultWorkspace({getLayouts:async()=>[],getLayout:async()=>({})}).then(o)},[o]),r!=null?e.jsx(Kt,{}):null}Le.propTypes={workspace:se.shape({}),setWorkspace:se.func.isRequired};Le.defaultProps={workspace:null};const Qt=a=>({workspace:yo(a)}),Jt=Br(Qt,{setWorkspace:bo})(Le);function ha(){return po.register(new URL("./download/serviceWorker.js",window.location.href)),xo.init({getWorker:()=>new zr}),window["__react-beautiful-dnd-disable-dev-warnings"]=!0,e.jsx(io,{children:e.jsx(Vr,{store:jo,children:e.jsx(Jt,{})})})}export{ha as StyleGuideRoot,ha as default};
|
|
223
|
-
|
|
222
|
+
`,Rt="_themeColors_1nrrl_1",Lt="_label_1nrrl_8",Pt="_swatch_1nrrl_17",Se={themeColors:Rt,label:Lt,swatch:Pt},Ft={"--dh-color-black":"gray","--dh-color-white":"gray","--dh-color-visual-positive":"Visual Status","--dh-color-visual-negative":"Visual Status","--dh-color-visual-notice":"Visual Status","--dh-color-visual-info":"Visual Status","--dh-color-editor-bg":"editor","--dh-color-editor-fg":"editor","--dh-color-editor-context-menu-bg":"menus","--dh-color-editor-context-menu-fg":"menus","--dh-color-editor-menu-selection-bg":"menus","--dh-color-grid-bg":"grid","--dh-color-grid-number-positive":"Data Types","--dh-color-grid-number-negative":"Data Types","--dh-color-grid-number-zero":"Data Types","--dh-color-grid-date":"Data Types","--dh-color-grid-string-null":"Data Types"},oe={editor:{line:"editor",comment:"code",string:"code",number:"code",delimiter:"code",identifier:"code",keyword:"code",operator:"code",storage:"code",predefined:"code",selection:"state",focus:"state"},chart:{axis:"Chart",bg:"Chart",grid:"Chart",plot:"Chart",title:"Chart",active:"Data",trend:"Data",area:"Data",range:"Data",line:"Deprecated"},grid:{data:"Data Bars",context:"Context Menu"},semantic:{positive:"status",negative:"status",notice:"status",info:"status",well:"wells"}},_t={"Theme Color Palette":U(Et,1),"Semantic Colors":U(It,1,oe.semantic),"Chart Colors":U(Dt,2,oe.chart),"Editor Colors":U($t,2,oe.editor),"Grid Colors":U(Mt,2,oe.grid),"Component Colors":U(At,1)};function Bt(){return e.jsx(e.Fragment,{children:Object.entries(_t).map(([t,r])=>e.jsxs("div",{...p(t),children:[e.jsx("h2",{className:"ui-title",children:t}),e.jsx("div",{className:Se.themeColors,children:Object.entries(r).map(([o,a])=>e.jsxs("div",{style:{gridRow:`span ${a.length+1}`},children:[e.jsx("span",{className:Se.label,children:o}),a.map(({name:l,value:n})=>e.jsxs("div",{className:Se.swatch,style:{backgroundColor:n,color:`var(--dh-color-${Vt(n)})`},children:[e.jsxs(le,{children:[e.jsx("div",{children:l}),e.jsx("div",{children:n}),e.jsx("div",{children:Ie.normalizeCssColor(n).replace(/^(#[a-f0-9]{6})ff$/,"$1")})]}),e.jsx("span",{children:l.replace("--dh-color-","")}),l.endsWith("-hue")?e.jsx("span",{children:n}):null]},l))]},o))})]},t))})}function Vt(t){const r=Ie.parseRgba(Ie.asRgbOrRgbaString(t)??"");if(r==null||r.a<.5)return"white";const{r:o,g:a,b:l}=r;return(299*o+587*a+114*l)/1e3>=128?"black":"white"}function Ot(t){const r=getComputedStyle(document.documentElement);return t.split(/[\n;]/g).map(a=>/^(?:\s{2}|:root\{)?(--dh-color-(?:[^:]+))/.exec(a)?.[1]).filter(a=>!!a).map(a=>{const l=r.getPropertyValue(a);return a==="--dh-color-chart-colorway"?l.split("hsl").filter(Boolean).map(s=>`hsl${s.trim()}`).map((s,i)=>({name:`${a}-${i}`,value:s})):{name:a,value:l}}).flat()}function U(t,r,o={}){return Ot(t).reduce((n,{name:s,value:i})=>{const h=/^--dh-color-([^-]+)(?:-([^-]+))?/.exec(s);let d=Ft[s]??h?.[r]??h?.[1]??"???";return d=o[d]??d,n[d]==null&&(n[d]=[]),s==="--dh-color-black"&&n[d].push({name:"",value:""}),n[d].push({name:s,value:i}),n},{})}const Te="data-menu-category",Ut="data-no-menu",pr="spectrum-component-samples";function Ht(){return e.jsxs("div",{id:pr,children:[e.jsx("h2",{className:"ui-title","data-no-menu":!0,children:"Spectrum Components"}),e.jsxs(De,{gap:20,columns:Cr("0px","1fr"),children:[e.jsxs(_,{...T("spectrum-buttons"),children:[e.jsx("h3",{children:"Buttons"}),e.jsx(Gt,{})]}),e.jsxs(_,{...T("spectrum-collections"),children:[e.jsx("h3",{children:"Collections"}),e.jsx(Zt,{})]}),e.jsxs(_,{...T("spectrum-content"),children:[e.jsx("h3",{children:"Content"}),e.jsx(qt,{})]}),e.jsxs(_,{...T("spectrum-forms"),children:[e.jsx("h3",{children:"Forms"}),e.jsx(zt,{})]}),e.jsxs(_,{...T("spectrum-overlays"),children:[e.jsx("h3",{children:"Overlays"}),e.jsx(Wt,{})]}),e.jsxs(_,{...T("spectrum-well"),children:[e.jsx("h3",{children:"Wells"}),e.jsx(Sr,{children:"This is a well."})]})]})]})}function Gt(){return e.jsxs(De,{autoFlow:"column",columnGap:"size-250",rowGap:"size-150",columns:ke(4,"size-2000"),rows:ke(8,"size-400"),children:[e.jsx("label",{children:'Button style="outline"'}),e.jsx(j,{variant:"primary",style:"outline",children:"Primary"}),e.jsx(j,{variant:"secondary",style:"outline",children:"Secondary"}),e.jsx(j,{variant:"accent",style:"outline",children:"Accent"}),e.jsx(j,{variant:"negative",style:"outline",children:"Negative"}),e.jsx(j,{variant:"primary",staticColor:"black",style:"outline",children:"Static Black"}),e.jsx(j,{variant:"primary",staticColor:"white",style:"outline",children:"Static White"}),e.jsx(j,{variant:"primary",isDisabled:!0,style:"outline",children:"Disabled"}),e.jsx("label",{children:'Button style="fill"'}),e.jsx(j,{variant:"primary",style:"fill",children:"Primary"}),e.jsx(j,{variant:"secondary",style:"fill",children:"Secondary"}),e.jsx(j,{variant:"accent",style:"fill",children:"Accent"}),e.jsx(j,{variant:"negative",style:"fill",children:"Negative"}),e.jsx(j,{variant:"primary",staticColor:"black",style:"fill",children:"Static Black"}),e.jsx(j,{variant:"primary",staticColor:"white",style:"fill",children:"Static White"}),e.jsx(j,{variant:"primary",isDisabled:!0,style:"fill",children:"Disabled"}),e.jsx("label",{children:"Action Button"}),e.jsx(H,{children:"Normal"}),e.jsx(H,{gridRow:"span 3",isQuiet:!0,children:"Quiet"}),e.jsx(H,{staticColor:"black",children:"Static Black"}),e.jsx(H,{staticColor:"white",children:"Static White"}),e.jsx(H,{isDisabled:!0,children:"Disabled"}),e.jsx("label",{children:"Toggle Button"}),e.jsx(B,{children:"Normal"}),e.jsx(B,{isQuiet:!0,children:"Quiet"}),e.jsx(B,{gridRow:"span 2",isEmphasized:!0,children:"Emphasized"}),e.jsx(B,{staticColor:"black",children:"Static Black"}),e.jsx(B,{staticColor:"white",children:"Static White"}),e.jsx(B,{isDisabled:!0,children:"Disabled"})]})}function Wt(){return e.jsxs(e.Fragment,{children:[e.jsx(Be,{children:"Contextual Help"}),e.jsxs(Tr,{variant:"info",children:[e.jsx(cr,{children:"Need help?"}),e.jsx(ir,{children:e.jsx(Be,{children:"This is a helpful description of the thing you need help with."})})]})]})}function zt(){return e.jsx(Nr,{children:e.jsxs(De,{gap:20,columns:ke("auto-fit","210px"),children:[e.jsx(kr,{label:"Text Field"}),e.jsxs(Er,{label:"Combobox",menuTrigger:"focus",defaultSelectedKey:"two",children:[e.jsx(te,{children:"One"},"one"),e.jsx(te,{children:"Two"},"two"),e.jsx(te,{children:"Three"},"three")]}),e.jsx(Ir,{children:"Checkbox"}),e.jsx(Dr,{label:"Slider",defaultValue:24}),e.jsx($r,{children:"Switch"})]})})}function qt(){return e.jsxs(Mr,{children:[e.jsx(ie,{size:"XL",children:e.jsx(f,{icon:L.vsEmptyWindow})}),e.jsx(cr,{children:"Illustrated Message"}),e.jsx(ir,{children:"This is the content of the message."})]})}function Zt(){return e.jsxs(e.Fragment,{children:[e.jsx("label",{id:"table-view-sample",children:"Table View"}),e.jsxs(Ar,{"aria-labelledby":"table-view-sample",selectionMode:"multiple",children:[e.jsxs(Rr,{children:[e.jsxs(V,{title:"Person",children:[e.jsx(V,{allowsResizing:!0,children:"Name"}),e.jsx(V,{children:"Age"})]}),e.jsxs(V,{title:"Address",children:[e.jsx(V,{allowsResizing:!0,children:"City"}),e.jsx(V,{children:"State"})]})]}),e.jsxs(Lr,{children:[e.jsxs(he,{children:[e.jsx(k,{children:"John"}),e.jsx(k,{children:"42"}),e.jsx(k,{children:"San Francisco"}),e.jsx(k,{children:"CA"})]}),e.jsxs(he,{children:[e.jsx(k,{children:"Jane"}),e.jsx(k,{children:"38"}),e.jsx(k,{children:"San Francisco"}),e.jsx(k,{children:"CA"})]}),e.jsxs(he,{children:[e.jsx(k,{children:"Becky"}),e.jsx(k,{children:"12"}),e.jsx(k,{children:"San Francisco"}),e.jsx(k,{children:"CA"})]})]})]})]})}function Ne({"data-menu-category":t}){return e.jsx("div",{"data-menu-category":t})}function Yt(){const[t,r]=u.useState([]);u.useEffect(()=>{let a={category:"",items:[]};const l=[a],n=document.querySelector(`#${pr}`);document.querySelectorAll(`h2,h3,[${Te}]`).forEach(s=>{if(s.textContent==null||s.hasAttribute(Ut))return;if(s.hasAttribute(Te)){a={category:s.getAttribute(Te)??"",items:[]},l.push(a);return}const i=`${n?.contains(s)===!0?"spectrum-":""}${s.textContent}`.toLowerCase().replace(/\s/g,"-");s.id=i,a.items.push({id:i,label:s.textContent})}),r(l)},[]),u.useEffect(()=>{const a=window.location.hash===""?null:document.querySelector(window.location.hash);a&&setTimeout(()=>{a.scrollIntoView()},0)},[]);const o=u.useCallback(a=>{const l=String(a);document.getElementById(l)?.scrollIntoView({behavior:"smooth"}),setTimeout(()=>{window.location.hash=l},1e3)},[]);return e.jsxs(Pr,{children:[e.jsx(H,{children:e.jsx(ie,{children:e.jsx(f,{icon:Gr})})}),e.jsx(Fr,{items:t,onAction:o,children:({category:a,items:l})=>e.jsx(_r,{items:l,title:a,children:({id:n,label:s})=>e.jsx(te,{children:s},n)},a)})]})}function Xt(){const t=u.useCallback(()=>{window.scrollTo({top:0,behavior:"smooth"}),setTimeout(()=>{window.location.hash=""},500)},[]);return u.useEffect(()=>{function r(){document.documentElement.dataset.scroll=String(window.scrollY>120)}return document.addEventListener("scroll",r,{passive:!0}),()=>{document.removeEventListener("scroll",r)}},[]),e.jsx(j,{UNSAFE_className:"goto-top-button",variant:"accent",onPress:t,children:e.jsx(ie,{children:e.jsx(f,{icon:Wr})})})}const sr={position:"sticky",justifyContent:"end",zIndex:1,UNSAFE_style:{float:"right"}};function Kt(){const t=window.location.search.includes("isolateSection=true");return e.jsxs("div",{className:"container style-guide-container",children:[t&&e.jsx("style",{children:`.${fe}, .sample-section:not(${window.location.hash}), :not(.sample-section) > h2 {
|
|
223
|
+
display: none;
|
|
224
|
+
}`}),e.jsx(D,{justifyContent:"space-between",alignItems:"center",marginTop:"2rem",marginBottom:"1rem",children:e.jsx("h1",{style:{paddingTop:"2rem"},children:"Deephaven UI Components"})}),e.jsx(D,{...sr,UNSAFE_className:fe,marginTop:-56,top:20,children:e.jsx(Yt,{})}),e.jsx(D,{...sr,UNSAFE_className:fe,top:"calc(100vh - 40px)",marginTop:-32,children:e.jsx(Xt,{})}),e.jsx(yt,{}),e.jsx(Ne,{"data-menu-category":"Colors"}),e.jsx(Zo,{}),e.jsx(Bt,{}),e.jsx(Ne,{"data-menu-category":"Components"}),e.jsx(J,{}),e.jsx(xt,{}),e.jsx(Le,{}),e.jsx(gt,{}),e.jsx(vt,{}),e.jsx(ne,{}),e.jsx(ft,{}),e.jsx(Xo,{}),e.jsx(pt,{}),e.jsx(Yo,{}),e.jsx(Ko,{}),e.jsx(kt,{}),e.jsx(bt,{}),e.jsx(ht,{}),e.jsx(et,{}),e.jsx(ct,{}),e.jsx(qo,{}),e.jsx(vo,{}),e.jsx(Ne,{"data-menu-category":"Spectrum Components"}),e.jsx(Ht,{})]})}function Pe(t){const{workspace:r,setWorkspace:o}=t;return u.useEffect(()=>{fo.makeDefaultWorkspace({getLayouts:async()=>[],getLayout:async()=>({})}).then(o)},[o]),r!=null?e.jsx(Kt,{}):null}Pe.propTypes={workspace:se.shape({}),setWorkspace:se.func.isRequired};Pe.defaultProps={workspace:null};const Qt=t=>({workspace:yo(t)}),Jt=Br(Qt,{setWorkspace:bo})(Pe);function ha(){return po.register(new URL("./download/serviceWorker.js",window.location.href)),xo.init({getWorker:()=>new zr}),window["__react-beautiful-dnd-disable-dev-warnings"]=!0,e.jsx(io,{children:e.jsx(Vr,{store:jo,children:e.jsx(Jt,{})})})}export{ha as StyleGuideRoot,ha as default};
|
|
225
|
+
//# sourceMappingURL=StyleGuideRoot-2ddf6529.js.map
|