@apipass/design-system 4.1.0 → 4.2.2

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.
Files changed (77) hide show
  1. package/dist/lib/embedded-styles.js +1 -1
  2. package/dist/lib/lib.index.cjs +1 -1
  3. package/dist/lib/lib.index.js +696 -694
  4. package/dist/lib/lib.index.js.map +1 -1
  5. package/dist/lib/style.css +1 -1
  6. package/dist/lib/ui/components/DataTable/DataTable.cjs +1 -1
  7. package/dist/lib/ui/components/Widget/Widget.cjs +1 -1
  8. package/dist/lib/ui/components/WidgetGrid/WidgetGrid.cjs +1 -1
  9. package/dist/lib/ui/components/charts/TimeSeriesChart/time-series-option.cjs +1 -1
  10. package/dist/lib/ui/components/charts/TimeSeriesChart/time-series-option.cjs.map +1 -1
  11. package/dist/lib/ui/components/charts/TimeSeriesChart/time-series-option.js +66 -50
  12. package/dist/lib/ui/components/charts/TimeSeriesChart/time-series-option.js.map +1 -1
  13. package/dist/lib/ui/primitives/Button/Button.cjs +1 -1
  14. package/dist/lib/ui/primitives/CodeBlock/CodeBlock.cjs +1 -1
  15. package/dist/lib/ui/primitives/CodeEditor/CodeEditor.cjs +1 -1
  16. package/dist/lib/ui/primitives/ComboBox/ComboBox.cjs +1 -1
  17. package/dist/lib/ui/primitives/ComboBox/ComboBox.cjs.map +1 -1
  18. package/dist/lib/ui/primitives/ComboBox/ComboBox.js +60 -37
  19. package/dist/lib/ui/primitives/ComboBox/ComboBox.js.map +1 -1
  20. package/dist/lib/ui/primitives/DateRangePicker/DateRangePicker.cjs +1 -1
  21. package/dist/lib/ui/primitives/FileUpload/FileUpload.cjs +1 -1
  22. package/dist/lib/ui/primitives/FileUpload/FileUpload.js +10 -10
  23. package/dist/lib/ui/primitives/IconButton/IconButton.cjs +1 -1
  24. package/dist/lib/ui/primitives/Input/Input.js +2 -2
  25. package/dist/lib/ui/primitives/JsonViewer/JsonEditor.cjs +1 -1
  26. package/dist/lib/ui/primitives/JsonViewer/JsonViewer.cjs +1 -1
  27. package/dist/lib/ui/primitives/Link/Link.cjs +1 -1
  28. package/dist/lib/ui/primitives/Link/Link.js +3 -3
  29. package/dist/lib/ui/primitives/Menu/Menu.cjs +1 -1
  30. package/dist/lib/ui/primitives/Menu/Menu.cjs.map +1 -1
  31. package/dist/lib/ui/primitives/Menu/Menu.js +28 -28
  32. package/dist/lib/ui/primitives/Menu/Menu.js.map +1 -1
  33. package/dist/lib/ui/primitives/Search/Search.cjs +1 -1
  34. package/dist/lib/ui/primitives/Search/Search.js +8 -8
  35. package/dist/lib/ui/primitives/Select/MultiSelect.cjs +2 -0
  36. package/dist/lib/ui/primitives/Select/MultiSelect.cjs.map +1 -0
  37. package/dist/lib/ui/primitives/Select/MultiSelect.js +113 -0
  38. package/dist/lib/ui/primitives/Select/MultiSelect.js.map +1 -0
  39. package/dist/lib/ui/primitives/Select/Select.cjs +1 -1
  40. package/dist/lib/ui/primitives/Select/Select.cjs.map +1 -1
  41. package/dist/lib/ui/primitives/Select/Select.js +19 -12
  42. package/dist/lib/ui/primitives/Select/Select.js.map +1 -1
  43. package/dist/lib/vendor/@monaco-editor/react/dist/index.cjs +1 -1
  44. package/dist/lib/vendor/@monaco-editor/react/dist/index.cjs.map +1 -1
  45. package/dist/lib/vendor/@monaco-editor/react/dist/index.js +21 -21
  46. package/dist/lib/vendor/@react-aria/interactions/dist/useFocusable.cjs +1 -1
  47. package/dist/lib/vendor/@react-aria/interactions/dist/useFocusable.js +4 -4
  48. package/dist/lib/vendor/@react-aria/ssr/dist/SSRProvider.js.map +1 -1
  49. package/dist/lib/vendor/@react-stately/utils/dist/useControlledState.cjs +1 -1
  50. package/dist/lib/vendor/react-draggable/build/cjs/Draggable.cjs +2 -2
  51. package/dist/lib/vendor/react-draggable/build/cjs/Draggable.js +8 -8
  52. package/dist/lib/vendor/react-grid-layout/build/GridItem.cjs +1 -1
  53. package/dist/lib/vendor/react-grid-layout/build/ReactGridLayout.cjs +1 -1
  54. package/dist/lib/vendor/react-grid-layout/build/ReactGridLayout.js +6 -6
  55. package/dist/lib/vendor/react-grid-layout/build/ReactGridLayout.js.map +1 -1
  56. package/dist/lib/vendor/react-grid-layout/build/ReactGridLayoutPropTypes.js +2 -2
  57. package/dist/lib/vendor/react-grid-layout/build/ResponsiveReactGridLayout.cjs +1 -1
  58. package/dist/lib/vendor/react-grid-layout/build/ResponsiveReactGridLayout.js.map +1 -1
  59. package/dist/lib/vendor/react-grid-layout/build/components/WidthProvider.cjs +1 -1
  60. package/dist/lib/vendor/react-grid-layout/build/components/WidthProvider.js +6 -6
  61. package/dist/lib/vendor/react-grid-layout/build/components/WidthProvider.js.map +1 -1
  62. package/dist/lib/vendor/react-grid-layout/build/utils.cjs +1 -1
  63. package/dist/lib/vendor/react-grid-layout/build/utils.js +27 -27
  64. package/dist/lib/vendor/react-resizable/build/Resizable.cjs +1 -1
  65. package/dist/lib/vendor/react-resizable/build/Resizable.js +17 -17
  66. package/dist/lib/vendor/react-resizable/build/Resizable.js.map +1 -1
  67. package/dist/lib/vendor/react-resizable/build/ResizableBox.cjs +1 -1
  68. package/dist/lib/vendor/react-resizable/build/ResizableBox.js +5 -5
  69. package/dist/lib/vendor/react-resizable/build/ResizableBox.js.map +1 -1
  70. package/dist/lib/vendor/react-resizable/build/utils.cjs +1 -1
  71. package/dist/lib/vendor/react-resizable/build/utils.cjs.map +1 -1
  72. package/dist/lib/vendor/react-resizable/build/utils.js +2 -2
  73. package/dist/lib/vendor/react-toastify/dist/index.cjs +1 -1
  74. package/dist/lib/vendor/react-toastify/dist/index.js +10 -10
  75. package/dist/types/ui/primitives/Select/MultiSelect.d.ts +15 -0
  76. package/dist/types/ui/primitives/index.d.ts +1 -0
  77. package/package.json +1 -1
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("react");;/* empty css */const Z=require("../../primitives/Search/Search.cjs"),t=require("../../primitives/Table/Table.cjs"),_=require("../../icons/IconChevronDown.cjs"),A=require("../../icons/IconChevronRight.cjs"),K=require("../../primitives/Pagination/Pagination.cjs"),ee=require("../../primitives/PermissionGate/PermissionGate.cjs"),ae=require("../../layout/Flex/Flex.cjs");function se({action:n,item:c}){const o=n.isAllowed!==!1,d=e.jsx("button",{className:"data-table-row-action-btn","aria-label":n.label,disabled:!o,onClick:o?()=>n.onPress(c):void 0,children:n.icon});return o?d:e.jsx(ee.PermissionGate,{isAllowed:!1,noAccessLabel:n.noAccessLabel??"",children:d})}function M({columns:n,data:c,actions:o,rowActions:d,rowActionsLabel:R="",searchPlaceholder:L="Search...",searchKeys:g=[],isLoading:k=!1,loadingMessage:N="Loading...",emptyMessage:D="No records found",previousLabel:I="Previous",nextLabel:$="Next",pageSize:b=10,nestedColumns:T,getNestedData:S,nestedLoadingMessage:B="Loading...",nestedEmptyMessage:E="No records found",nestedSearchKeys:F,nestedSearchPlaceholder:G,nestedActions:j,nestedPageSize:H}){const[p,O]=h.useState(""),[Q,v]=h.useState(1),[z,J]=h.useState(new Set),[P,w]=h.useState(new Map),q=!!S&&!!T,f=!!d;function U(a){const s=a.id;J(r=>{const i=new Set(r);if(i.has(s))i.delete(s);else if(i.add(s),!P.has(s)){const l=S(a);l instanceof Promise?(w(u=>new Map(u).set(s,{status:"loading",data:[]})),l.then(u=>{w(Y=>new Map(Y).set(s,{status:"loaded",data:u}))})):w(u=>new Map(u).set(s,{status:"loaded",data:l}))}return i})}const x=g.length>0,V=x||!!o,m=h.useMemo(()=>{if(!p.trim()||!x)return c;const a=p.toLowerCase();return c.filter(s=>g.some(r=>String(s[r]??"").toLowerCase().includes(a)))},[c,p,g,x]),y=Math.max(1,Math.ceil(m.length/b)),C=Math.min(Q,y),W=m.slice((C-1)*b,C*b);function X(a,s){return s.render?s.render(a):String(a[s.key]??"")}return e.jsxs(ae.Flex,{direction:"column",gap:"300",className:"data-table",children:[V&&e.jsxs("div",{className:"data-table-toolbar",children:[x&&e.jsx(Z.Search,{placeholder:L,onSearch:a=>{O(a),v(1)},className:"data-table-search"}),o&&e.jsx("div",{className:"data-table-actions",children:o})]}),k?e.jsx("div",{role:"status","aria-live":"polite","aria-label":N,className:"data-table-status",children:N}):m.length===0?e.jsx("div",{role:"status",className:"data-table-status data-table-empty",children:D}):e.jsxs(t.Table,{grid:!0,children:[e.jsxs(t.TableHead,{children:[q&&e.jsx(t.TableColumn,{className:"data-table-expand-col"}),n.map((a,s)=>e.jsx(t.TableColumn,{align:a.align,isRowHeader:s===0,children:a.label},String(a.key))),f&&e.jsx(t.TableColumn,{align:"right",className:"data-table-row-actions-col",children:R})]}),e.jsx(t.TableBody,{children:W.flatMap(a=>{const s=z.has(a.id),r=P.get(a.id),i=[e.jsxs(t.TableRow,{id:a.id,children:[q&&e.jsx(t.TableCell,{className:"data-table-expand-cell",children:e.jsx("button",{className:"data-table-expand-btn","aria-label":s?"Collapse row":"Expand row","aria-expanded":s,onClick:()=>U(a),children:s?e.jsx(_.IconChevronDown,{size:"16"}):e.jsx(A.IconChevronRight,{size:"16"})})}),n.map(l=>e.jsx(t.TableCell,{align:l.align,children:X(a,l)},String(l.key))),f&&e.jsx(t.TableCell,{align:"right",className:"data-table-row-actions-cell",children:e.jsx("div",{className:"data-table-row-actions",children:(typeof d=="function"?d(a):d).map(l=>e.jsx(se,{action:l,item:a},l.key))})})]},a.id)];return s&&i.push(e.jsx(t.TableRow,{id:`${a.id}-nested`,className:"data-table-nested-row",children:e.jsx(t.TableCell,{colSpan:n.length+1+(f?1:0),className:"data-table-nested-cell",children:e.jsx(M,{columns:T,data:(r==null?void 0:r.data)??[],isLoading:!r||r.status==="loading",loadingMessage:B,emptyMessage:E,searchKeys:F,searchPlaceholder:G,actions:j==null?void 0:j(a),pageSize:H??b})})},`${a.id}-nested`)),i})})]}),e.jsx(K.Pagination,{page:C,totalPages:y,onPageChange:v,previousLabel:I,nextLabel:$})]})}exports.DataTable=M;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("react");;/* empty css */const Z=require("../../primitives/Search/Search.cjs"),t=require("../../primitives/Table/Table.cjs"),_=require("../../icons/IconChevronDown.cjs"),A=require("../../icons/IconChevronRight.cjs"),K=require("../../primitives/Pagination/Pagination.cjs"),ee=require("../../primitives/PermissionGate/PermissionGate.cjs"),ae=require("../../layout/Flex/Flex.cjs");function se({action:n,item:c}){const o=n.isAllowed!==!1,d=e.jsx("button",{className:"data-table-row-action-btn","aria-label":n.label,disabled:!o,onClick:o?()=>n.onPress(c):void 0,children:n.icon});return o?d:e.jsx(ee.PermissionGate,{isAllowed:!1,noAccessLabel:n.noAccessLabel??"",children:d})}function M({columns:n,data:c,actions:o,rowActions:d,rowActionsLabel:R="",searchPlaceholder:L="Search...",searchKeys:g=[],isLoading:k=!1,loadingMessage:N="Loading...",emptyMessage:D="No records found",previousLabel:I="Previous",nextLabel:E="Next",pageSize:b=10,nestedColumns:T,getNestedData:S,nestedLoadingMessage:B="Loading...",nestedEmptyMessage:F="No records found",nestedSearchKeys:G,nestedSearchPlaceholder:H,nestedActions:j,nestedPageSize:$}){const[p,O]=h.useState(""),[Q,v]=h.useState(1),[z,J]=h.useState(new Set),[P,w]=h.useState(new Map),q=!!S&&!!T,f=!!d;function U(a){const s=a.id;J(r=>{const i=new Set(r);if(i.has(s))i.delete(s);else if(i.add(s),!P.has(s)){const l=S(a);l instanceof Promise?(w(u=>new Map(u).set(s,{status:"loading",data:[]})),l.then(u=>{w(Y=>new Map(Y).set(s,{status:"loaded",data:u}))})):w(u=>new Map(u).set(s,{status:"loaded",data:l}))}return i})}const x=g.length>0,V=x||!!o,m=h.useMemo(()=>{if(!p.trim()||!x)return c;const a=p.toLowerCase();return c.filter(s=>g.some(r=>String(s[r]??"").toLowerCase().includes(a)))},[c,p,g,x]),y=Math.max(1,Math.ceil(m.length/b)),C=Math.min(Q,y),W=m.slice((C-1)*b,C*b);function X(a,s){return s.render?s.render(a):String(a[s.key]??"")}return e.jsxs(ae.Flex,{direction:"column",gap:"300",className:"data-table",children:[V&&e.jsxs("div",{className:"data-table-toolbar",children:[x&&e.jsx(Z.Search,{placeholder:L,onSearch:a=>{O(a),v(1)},className:"data-table-search"}),o&&e.jsx("div",{className:"data-table-actions",children:o})]}),k?e.jsx("div",{role:"status","aria-live":"polite","aria-label":N,className:"data-table-status",children:N}):m.length===0?e.jsx("div",{role:"status",className:"data-table-status data-table-empty",children:D}):e.jsxs(t.Table,{grid:!0,children:[e.jsxs(t.TableHead,{children:[q&&e.jsx(t.TableColumn,{className:"data-table-expand-col"}),n.map((a,s)=>e.jsx(t.TableColumn,{align:a.align,isRowHeader:s===0,children:a.label},String(a.key))),f&&e.jsx(t.TableColumn,{align:"right",className:"data-table-row-actions-col",children:R})]}),e.jsx(t.TableBody,{children:W.flatMap(a=>{const s=z.has(a.id),r=P.get(a.id),i=[e.jsxs(t.TableRow,{id:a.id,children:[q&&e.jsx(t.TableCell,{className:"data-table-expand-cell",children:e.jsx("button",{className:"data-table-expand-btn","aria-label":s?"Collapse row":"Expand row","aria-expanded":s,onClick:()=>U(a),children:s?e.jsx(_.IconChevronDown,{size:"16"}):e.jsx(A.IconChevronRight,{size:"16"})})}),n.map(l=>e.jsx(t.TableCell,{align:l.align,children:X(a,l)},String(l.key))),f&&e.jsx(t.TableCell,{align:"right",className:"data-table-row-actions-cell",children:e.jsx("div",{className:"data-table-row-actions",children:(typeof d=="function"?d(a):d).map(l=>e.jsx(se,{action:l,item:a},l.key))})})]},a.id)];return s&&i.push(e.jsx(t.TableRow,{id:`${a.id}-nested`,className:"data-table-nested-row",children:e.jsx(t.TableCell,{colSpan:n.length+1+(f?1:0),className:"data-table-nested-cell",children:e.jsx(M,{columns:T,data:(r==null?void 0:r.data)??[],isLoading:!r||r.status==="loading",loadingMessage:B,emptyMessage:F,searchKeys:G,searchPlaceholder:H,actions:j==null?void 0:j(a),pageSize:$??b})})},`${a.id}-nested`)),i})})]}),e.jsx(K.Pagination,{page:C,totalPages:y,onPageChange:v,previousLabel:I,nextLabel:E})]})}exports.DataTable=M;
2
2
  //# sourceMappingURL=DataTable.cjs.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("../../../vendor/clsx/dist/clsx.cjs"),i=require("react");;/* empty css */const y=require("../../primitives/Tooltip/Tooltip.cjs"),z=require("../../icons/IconInfo.cjs"),B=require("../../icons/IconChevronDown.cjs"),u=require("../../primitives/IconButton/IconButton.cjs"),S=i.forwardRef(function({title:g,description:o,descriptionButtonLabel:x,headerActions:n,isCollapsible:s,collapseButtonLabel:m,expandButtonLabel:h,collapsed:a,defaultCollapsed:j,onCollapsedChange:r,children:w,className:f,...v},I){const d=i.useId(),c=a!==void 0,[p,N]=i.useState(j??!1),t=s===!0&&(c?a===!0:p);function q(){const l=!t;c||N(l),r==null||r(l)}return e.jsxs("div",{ref:I,className:b.clsx("widget",f),...v,"data-collapsed":t||void 0,children:[e.jsxs("div",{className:"widget-header widget-drag-handle",children:[e.jsxs("span",{className:"widget-header-title-group",children:[e.jsx("span",{className:"widget-header-title",children:g}),o&&e.jsx(y.Tooltip,{content:o,placement:"bottom",offset:4,children:e.jsx(u.IconButton,{"aria-label":x,variant:"subtle",size:"small",className:"widget-header-description-trigger",children:e.jsx(z.IconInfo,{size:"14"})})})]}),(n||s)&&e.jsxs("div",{className:"widget-header-actions",children:[n,s&&e.jsx(u.IconButton,{"aria-label":t?h:m,"aria-expanded":!t,"aria-controls":d,variant:"subtle",size:"small",className:"widget-header-collapse-trigger",onPress:q,children:e.jsx(B.IconChevronDown,{size:"16",className:"widget-header-collapse-indicator"})})]})]}),e.jsx("div",{id:d,className:"widget-body",hidden:t,children:w})]})});exports.Widget=S;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("../../../vendor/clsx/dist/clsx.cjs"),r=require("react");;/* empty css */const y=require("../../primitives/Tooltip/Tooltip.cjs"),z=require("../../icons/IconInfo.cjs"),B=require("../../icons/IconChevronDown.cjs"),u=require("../../primitives/IconButton/IconButton.cjs"),R=r.forwardRef(function({title:g,description:o,descriptionButtonLabel:x,headerActions:n,isCollapsible:s,collapseButtonLabel:m,expandButtonLabel:h,collapsed:a,defaultCollapsed:j,onCollapsedChange:i,children:w,className:f,...v},I){const d=r.useId(),c=a!==void 0,[p,N]=r.useState(j??!1),t=s===!0&&(c?a===!0:p);function q(){const l=!t;c||N(l),i==null||i(l)}return e.jsxs("div",{ref:I,className:b.clsx("widget",f),...v,"data-collapsed":t||void 0,children:[e.jsxs("div",{className:"widget-header widget-drag-handle",children:[e.jsxs("span",{className:"widget-header-title-group",children:[e.jsx("span",{className:"widget-header-title",children:g}),o&&e.jsx(y.Tooltip,{content:o,placement:"bottom",offset:4,children:e.jsx(u.IconButton,{"aria-label":x,variant:"subtle",size:"small",className:"widget-header-description-trigger",children:e.jsx(z.IconInfo,{size:"14"})})})]}),(n||s)&&e.jsxs("div",{className:"widget-header-actions",children:[n,s&&e.jsx(u.IconButton,{"aria-label":t?h:m,"aria-expanded":!t,"aria-controls":d,variant:"subtle",size:"small",className:"widget-header-collapse-trigger",onPress:q,children:e.jsx(B.IconChevronDown,{size:"16",className:"widget-header-collapse-indicator"})})]})]}),e.jsx("div",{id:d,className:"widget-body",hidden:t,children:w})]})});exports.Widget=R;
2
2
  //# sourceMappingURL=Widget.cjs.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react/jsx-runtime"),A=require("../../../vendor/clsx/dist/clsx.cjs"),D=require("react"),l=require("../../../_virtual/index.cjs");;/* empty css */;/* empty css */;/* empty css */const G=l.WidthProvider(l),T=".widget-drag-handle",_=".widget-header-actions";function S({layout:c,onLayoutChange:r,cols:u=12,rowHeight:o=80,isEditable:n=!1,isDraggable:m,isResizable:E,className:q,style:R,children:i}){const b=c.map(({id:e,x:t,y:a,w:s,h:d})=>({i:e,x:t,y:a,w:s,h:d}));function x(e){r==null||r(e.map(({i:t,x:a,y:s,w:d,h:y})=>({id:t,x:a,y:s,w:d,h:y})))}return g.jsx(G,{className:A.clsx("widget-grid",q),style:R,layout:b,cols:u,rowHeight:o,isDraggable:m??n,isResizable:E??n,draggableHandle:T,draggableCancel:_,onLayoutChange:x,children:(Array.isArray(i)?i:[i]).map(e=>D.isValidElement(e)?g.jsx("div",{className:"widget-grid-item",children:e},e.key):e)})}exports.WidgetGrid=S;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),A=require("../../../vendor/clsx/dist/clsx.cjs"),D=require("react"),c=require("../../../_virtual/index.cjs");;/* empty css */;/* empty css */;/* empty css */const G=c.WidthProvider(c),T=".widget-drag-handle",_=".widget-header-actions";function S({layout:g,onLayoutChange:r,cols:u=12,rowHeight:o=80,isEditable:n=!1,isDraggable:m,isResizable:E,className:R,style:q,children:i}){const b=g.map(({id:e,x:t,y:a,w:s,h:d})=>({i:e,x:t,y:a,w:s,h:d}));function x(e){r==null||r(e.map(({i:t,x:a,y:s,w:d,h:y})=>({id:t,x:a,y:s,w:d,h:y})))}return l.jsx(G,{className:A.clsx("widget-grid",R),style:q,layout:b,cols:u,rowHeight:o,isDraggable:m??n,isResizable:E??n,draggableHandle:T,draggableCancel:_,onLayoutChange:x,children:(Array.isArray(i)?i:[i]).map(e=>D.isValidElement(e)?l.jsx("div",{className:"widget-grid-item",children:e},e.key):e)})}exports.WidgetGrid=S;
2
2
  //# sourceMappingURL=WidgetGrid.cjs.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=32,s={top:16,right:16,bottom:24,left:56},b=6,u=.15,p={thin:1,normal:2,thick:4},f="solid",L="normal";function m(o){const{valueFormatter:l}=o;if(l)return t=>t===null?"":l(t)}function h(o){const{showValueLabels:l,theme:t}=o,i=m(o);return{show:l,position:"top",color:t.labelColor,formatter:i?e=>i(e.value[1]):void 0}}function S(o,l,t){const i=o.points.map(r=>[r.timestamp,r.value]),e=h(l);return l.displayType==="bar"?{id:o.id,name:o.name,type:"bar",data:i,itemStyle:{color:t},label:e}:{id:o.id,name:o.name,type:"line",data:i,showSymbol:l.showSymbols,symbolSize:b,lineStyle:{color:t,type:l.line.style??f,width:p[l.line.width??L]},itemStyle:{color:t},areaStyle:l.displayType==="area"?{color:t,opacity:u}:void 0,label:e}}function C(o){const{series:l,legend:t,yAxis:i,theme:e,seriesColorOverrides:r}=o,a=t!=="none"&&l.length>0,n=m(o);return{animation:!1,color:e.seriesColors,textStyle:{fontFamily:e.fontFamily,color:e.labelColor},grid:{...s,top:a?s.top+d:s.top,containLabel:!1},legend:a?{type:"scroll",top:0,left:0,icon:"roundRect",itemHeight:8,itemWidth:12,textStyle:{color:e.labelColor}}:{show:!1},tooltip:{trigger:"axis",backgroundColor:e.tooltipBackgroundColor,borderColor:e.tooltipBorderColor,textStyle:{color:e.labelColor},valueFormatter:n},xAxis:{type:"time",axisLine:{lineStyle:{color:e.axisLineColor}},axisTick:{show:!1},axisLabel:{color:e.labelColor,hideOverlap:!0},splitLine:{show:!1}},yAxis:{type:i.scale==="log"?"log":"value",scale:i.includeZero!==!0,min:i.min,max:i.max,axisLine:{show:!1},axisLabel:{color:e.labelColor,formatter:n},splitLine:{lineStyle:{color:e.splitLineColor}}},series:l.map((c,y)=>S(c,o,r[c.id]??e.seriesColors[y%e.seriesColors.length]))}}exports.buildTimeSeriesOption=C;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=32,n={top:16,right:16,bottom:24,left:56},f=6,y=.15,L={thin:1,normal:2,thick:4},g="solid",b="normal",h=new Intl.DateTimeFormat(void 0,{year:"numeric"}),p=new Intl.DateTimeFormat(void 0,{day:"2-digit",month:"2-digit"}),S=new Intl.DateTimeFormat(void 0,{hour:"2-digit",minute:"2-digit",hour12:!1}),E=new Intl.DateTimeFormat(void 0,{hour:"2-digit",minute:"2-digit",second:"2-digit",hour12:!1});function T(o){const e=new Date(o);return e.getSeconds()!==0||e.getMilliseconds()!==0?E.format(e):e.getHours()!==0||e.getMinutes()!==0?S.format(e):e.getMonth()===0&&e.getDate()===1?h.format(e):p.format(e)}function c(o){const{valueFormatter:e}=o;if(e)return i=>i===null?"":e(i)}function C(o){const{showValueLabels:e,theme:i}=o,l=c(o);return{show:e,position:"top",color:i.labelColor,formatter:l?t=>l(t.value[1]):void 0}}function x(o,e,i){const l=o.points.map(r=>[r.timestamp,r.value]),t=C(e);return e.displayType==="bar"?{id:o.id,name:o.name,type:"bar",data:l,itemStyle:{color:i},label:t}:{id:o.id,name:o.name,type:"line",data:l,showSymbol:e.showSymbols,symbolSize:f,lineStyle:{color:i,type:e.line.style??g,width:L[e.line.width??b]},itemStyle:{color:i},areaStyle:e.displayType==="area"?{color:i,opacity:y}:void 0,label:t}}function _(o){const{series:e,legend:i,yAxis:l,theme:t,seriesColorOverrides:r}=o,s=i!=="none"&&e.length>0,a=c(o);return{animation:!1,color:t.seriesColors,textStyle:{fontFamily:t.fontFamily,color:t.labelColor},grid:{...n,top:s?n.top+u:n.top,containLabel:!1},legend:s?{type:"scroll",top:0,left:0,icon:"roundRect",itemHeight:8,itemWidth:12,textStyle:{color:t.labelColor}}:{show:!1},tooltip:{trigger:"axis",backgroundColor:t.tooltipBackgroundColor,borderColor:t.tooltipBorderColor,textStyle:{color:t.labelColor},valueFormatter:a},xAxis:{type:"time",axisLine:{lineStyle:{color:t.axisLineColor}},axisTick:{show:!1},axisLabel:{color:t.labelColor,hideOverlap:!0,formatter:T},splitLine:{show:!1}},yAxis:{type:l.scale==="log"?"log":"value",scale:l.includeZero!==!0,min:l.min,max:l.max,axisLine:{show:!1},axisLabel:{color:t.labelColor,formatter:a},splitLine:{lineStyle:{color:t.splitLineColor}}},series:e.map((m,d)=>x(m,o,r[m.id]??t.seriesColors[d%t.seriesColors.length]))}}exports.buildTimeSeriesOption=_;
2
2
  //# sourceMappingURL=time-series-option.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"time-series-option.cjs","sources":["../../../../../../src/ui/components/charts/TimeSeriesChart/time-series-option.ts"],"sourcesContent":["import type { ChartTheme } from \"../chart-theme\";\n\nexport interface TimeSeriesPoint {\n timestamp: number;\n value: number | null;\n}\n\nexport interface TimeSeriesData {\n id: string;\n name: string;\n points: TimeSeriesPoint[];\n // Nome de token, nunca hex: é o que mantém a cor válida nos dois temas. Sem ele a série\n // recebe a próxima cor da paleta.\n colorToken?: string;\n}\n\nexport type TimeSeriesDisplayType = \"line\" | \"bar\" | \"area\";\n\nexport type TimeSeriesLineStyle = \"solid\" | \"dashed\" | \"dotted\";\n\nexport type TimeSeriesLineWidth = \"thin\" | \"normal\" | \"thick\";\n\nexport interface TimeSeriesLineOptions {\n style?: TimeSeriesLineStyle;\n width?: TimeSeriesLineWidth;\n}\n\nexport type TimeSeriesLegendMode = \"inline\" | \"none\";\n\nexport type TimeSeriesAxisScale = \"linear\" | \"log\";\n\nexport interface TimeSeriesYAxisOptions {\n scale?: TimeSeriesAxisScale;\n min?: number;\n max?: number;\n includeZero?: boolean;\n}\n\nexport interface TimeSeriesOptionInput {\n series: TimeSeriesData[];\n displayType: TimeSeriesDisplayType;\n legend: TimeSeriesLegendMode;\n line: TimeSeriesLineOptions;\n yAxis: TimeSeriesYAxisOptions;\n theme: ChartTheme;\n showSymbols: boolean;\n showValueLabels: boolean;\n seriesColorOverrides: Record<string, string>;\n valueFormatter?: (value: number) => string;\n}\n\nconst LEGEND_HEIGHT_PX: number = 32;\n\nconst GRID_WITHOUT_LEGEND = { top: 16, right: 16, bottom: 24, left: 56 } as const;\n\nconst SYMBOL_SIZE_PX: number = 6;\n\nconst AREA_OPACITY: number = 0.15;\n\nconst LINE_WIDTH_PX: Record<TimeSeriesLineWidth, number> = { thin: 1, normal: 2, thick: 4 };\n\nconst DEFAULT_LINE_STYLE: TimeSeriesLineStyle = \"solid\";\n\nconst DEFAULT_LINE_WIDTH: TimeSeriesLineWidth = \"normal\";\n\n// O ponto de gap chega ao formatter como `null` — o ECharts monta o bloco do tooltip sem marcar\n// `noValue`, então formata o vazio junto com o resto. O tipo público promete `number` ao\n// consumidor, e é esta guarda que mantém a promessa em vez de transformá-la em aviso.\nfunction nullSafeValueFormatter(\n input: TimeSeriesOptionInput,\n): ((value: number | null) => string) | undefined {\n const { valueFormatter } = input;\n if (!valueFormatter) return undefined;\n return (value: number | null) => (value === null ? \"\" : valueFormatter(value));\n}\n\nfunction seriesLabel(input: TimeSeriesOptionInput): Record<string, unknown> {\n const { showValueLabels, theme } = input;\n const formatValue: ((value: number | null) => string) | undefined = nullSafeValueFormatter(input);\n return {\n show: showValueLabels,\n position: \"top\",\n color: theme.labelColor,\n formatter: formatValue\n ? (params: { value: [number, number | null] }) => formatValue(params.value[1])\n : undefined,\n };\n}\n\nfunction seriesEntry(\n data: TimeSeriesData,\n input: TimeSeriesOptionInput,\n color: string,\n): Record<string, unknown> {\n const values: Array<[number, number | null]> = data.points.map((point: TimeSeriesPoint) => [\n point.timestamp,\n point.value,\n ]);\n const label: Record<string, unknown> = seriesLabel(input);\n\n if (input.displayType === \"bar\") {\n return { id: data.id, name: data.name, type: \"bar\", data: values, itemStyle: { color }, label };\n }\n\n return {\n id: data.id,\n name: data.name,\n type: \"line\",\n data: values,\n showSymbol: input.showSymbols,\n symbolSize: SYMBOL_SIZE_PX,\n lineStyle: {\n color,\n type: input.line.style ?? DEFAULT_LINE_STYLE,\n width: LINE_WIDTH_PX[input.line.width ?? DEFAULT_LINE_WIDTH],\n },\n itemStyle: { color },\n areaStyle: input.displayType === \"area\" ? { color, opacity: AREA_OPACITY } : undefined,\n label,\n };\n}\n\n// O retorno é `Record<string, unknown>` de propósito, e não `EChartsOption`: é o que impede\n// um tipo da biblioteca de vazar para o resto do design system.\nexport function buildTimeSeriesOption(input: TimeSeriesOptionInput): Record<string, unknown> {\n const { series, legend, yAxis, theme, seriesColorOverrides } = input;\n const isLegendVisible: boolean = legend !== \"none\" && series.length > 0;\n const formatValue: ((value: number | null) => string) | undefined = nullSafeValueFormatter(input);\n\n return {\n animation: false,\n color: theme.seriesColors,\n textStyle: { fontFamily: theme.fontFamily, color: theme.labelColor },\n grid: {\n ...GRID_WITHOUT_LEGEND,\n top: isLegendVisible ? GRID_WITHOUT_LEGEND.top + LEGEND_HEIGHT_PX : GRID_WITHOUT_LEGEND.top,\n containLabel: false,\n },\n legend: isLegendVisible\n ? {\n type: \"scroll\",\n top: 0,\n left: 0,\n icon: \"roundRect\",\n itemHeight: 8,\n itemWidth: 12,\n textStyle: { color: theme.labelColor },\n }\n : { show: false },\n tooltip: {\n trigger: \"axis\",\n backgroundColor: theme.tooltipBackgroundColor,\n borderColor: theme.tooltipBorderColor,\n textStyle: { color: theme.labelColor },\n valueFormatter: formatValue,\n },\n xAxis: {\n type: \"time\",\n axisLine: { lineStyle: { color: theme.axisLineColor } },\n axisTick: { show: false },\n axisLabel: { color: theme.labelColor, hideOverlap: true },\n splitLine: { show: false },\n },\n yAxis: {\n type: yAxis.scale === \"log\" ? \"log\" : \"value\",\n scale: yAxis.includeZero !== true,\n min: yAxis.min,\n max: yAxis.max,\n axisLine: { show: false },\n axisLabel: { color: theme.labelColor, formatter: formatValue },\n splitLine: { lineStyle: { color: theme.splitLineColor } },\n },\n series: series.map((data: TimeSeriesData, index: number) =>\n seriesEntry(\n data,\n input,\n seriesColorOverrides[data.id] ?? theme.seriesColors[index % theme.seriesColors.length],\n ),\n ),\n };\n}\n"],"names":["LEGEND_HEIGHT_PX","GRID_WITHOUT_LEGEND","SYMBOL_SIZE_PX","AREA_OPACITY","LINE_WIDTH_PX","DEFAULT_LINE_STYLE","DEFAULT_LINE_WIDTH","nullSafeValueFormatter","input","valueFormatter","value","seriesLabel","showValueLabels","theme","formatValue","params","seriesEntry","data","color","values","point","label","buildTimeSeriesOption","series","legend","yAxis","seriesColorOverrides","isLegendVisible","index"],"mappings":"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"}
1
+ {"version":3,"file":"time-series-option.cjs","sources":["../../../../../../src/ui/components/charts/TimeSeriesChart/time-series-option.ts"],"sourcesContent":["import type { ChartTheme } from \"../chart-theme\";\n\nexport interface TimeSeriesPoint {\n timestamp: number;\n value: number | null;\n}\n\nexport interface TimeSeriesData {\n id: string;\n name: string;\n points: TimeSeriesPoint[];\n // Nome de token, nunca hex: é o que mantém a cor válida nos dois temas. Sem ele a série\n // recebe a próxima cor da paleta.\n colorToken?: string;\n}\n\nexport type TimeSeriesDisplayType = \"line\" | \"bar\" | \"area\";\n\nexport type TimeSeriesLineStyle = \"solid\" | \"dashed\" | \"dotted\";\n\nexport type TimeSeriesLineWidth = \"thin\" | \"normal\" | \"thick\";\n\nexport interface TimeSeriesLineOptions {\n style?: TimeSeriesLineStyle;\n width?: TimeSeriesLineWidth;\n}\n\nexport type TimeSeriesLegendMode = \"inline\" | \"none\";\n\nexport type TimeSeriesAxisScale = \"linear\" | \"log\";\n\nexport interface TimeSeriesYAxisOptions {\n scale?: TimeSeriesAxisScale;\n min?: number;\n max?: number;\n includeZero?: boolean;\n}\n\nexport interface TimeSeriesOptionInput {\n series: TimeSeriesData[];\n displayType: TimeSeriesDisplayType;\n legend: TimeSeriesLegendMode;\n line: TimeSeriesLineOptions;\n yAxis: TimeSeriesYAxisOptions;\n theme: ChartTheme;\n showSymbols: boolean;\n showValueLabels: boolean;\n seriesColorOverrides: Record<string, string>;\n valueFormatter?: (value: number) => string;\n}\n\nconst LEGEND_HEIGHT_PX: number = 32;\n\nconst GRID_WITHOUT_LEGEND = { top: 16, right: 16, bottom: 24, left: 56 } as const;\n\nconst SYMBOL_SIZE_PX: number = 6;\n\nconst AREA_OPACITY: number = 0.15;\n\nconst LINE_WIDTH_PX: Record<TimeSeriesLineWidth, number> = { thin: 1, normal: 2, thick: 4 };\n\nconst DEFAULT_LINE_STYLE: TimeSeriesLineStyle = \"solid\";\n\nconst DEFAULT_LINE_WIDTH: TimeSeriesLineWidth = \"normal\";\n\n// O eixo de tempo do ECharts rotula a marca de dia so com o numero do dia -- \"2\", \"3\", \"4\" --, que\n// sozinho nao diz nem o mes. Aqui a marca de dia vira data e a marca dentro do dia vira hora, que e\n// o que se espera de uma serie temporal.\n//\n// A precisao sai do proprio instante, e nao de um nivel pedido ao ECharts: ele alinha as marcas ao\n// nivel que cabe no eixo, entao meia-noite e marca de dia, minuto cheio e marca de hora, e assim por\n// diante. Ler o instante e o que permite usar `Intl` e escrever a data na convencao de quem le -- o\n// objeto de niveis do ECharts so aceita template, e um `{dd}/{MM}` fixo seria lido como mes/dia por\n// metade dos usuarios.\nconst YEAR_LABEL: Intl.DateTimeFormat = new Intl.DateTimeFormat(undefined, { year: \"numeric\" });\n\nconst DAY_LABEL: Intl.DateTimeFormat = new Intl.DateTimeFormat(undefined, {\n day: \"2-digit\",\n month: \"2-digit\",\n});\n\nconst MINUTE_LABEL: Intl.DateTimeFormat = new Intl.DateTimeFormat(undefined, {\n hour: \"2-digit\",\n minute: \"2-digit\",\n hour12: false,\n});\n\nconst SECOND_LABEL: Intl.DateTimeFormat = new Intl.DateTimeFormat(undefined, {\n hour: \"2-digit\",\n minute: \"2-digit\",\n second: \"2-digit\",\n hour12: false,\n});\n\nfunction timeAxisLabel(timestamp: number): string {\n const instant: Date = new Date(timestamp);\n if (instant.getSeconds() !== 0 || instant.getMilliseconds() !== 0) return SECOND_LABEL.format(instant);\n if (instant.getHours() !== 0 || instant.getMinutes() !== 0) return MINUTE_LABEL.format(instant);\n // Primeiro de janeiro e a marca de ano do ECharts, e ali a data sem o ano nao situa ninguem.\n if (instant.getMonth() === 0 && instant.getDate() === 1) return YEAR_LABEL.format(instant);\n return DAY_LABEL.format(instant);\n}\n\n// O ponto de gap chega ao formatter como `null` — o ECharts monta o bloco do tooltip sem marcar\n// `noValue`, então formata o vazio junto com o resto. O tipo público promete `number` ao\n// consumidor, e é esta guarda que mantém a promessa em vez de transformá-la em aviso.\nfunction nullSafeValueFormatter(\n input: TimeSeriesOptionInput,\n): ((value: number | null) => string) | undefined {\n const { valueFormatter } = input;\n if (!valueFormatter) return undefined;\n return (value: number | null) => (value === null ? \"\" : valueFormatter(value));\n}\n\nfunction seriesLabel(input: TimeSeriesOptionInput): Record<string, unknown> {\n const { showValueLabels, theme } = input;\n const formatValue: ((value: number | null) => string) | undefined = nullSafeValueFormatter(input);\n return {\n show: showValueLabels,\n position: \"top\",\n color: theme.labelColor,\n formatter: formatValue\n ? (params: { value: [number, number | null] }) => formatValue(params.value[1])\n : undefined,\n };\n}\n\nfunction seriesEntry(\n data: TimeSeriesData,\n input: TimeSeriesOptionInput,\n color: string,\n): Record<string, unknown> {\n const values: Array<[number, number | null]> = data.points.map((point: TimeSeriesPoint) => [\n point.timestamp,\n point.value,\n ]);\n const label: Record<string, unknown> = seriesLabel(input);\n\n if (input.displayType === \"bar\") {\n return { id: data.id, name: data.name, type: \"bar\", data: values, itemStyle: { color }, label };\n }\n\n return {\n id: data.id,\n name: data.name,\n type: \"line\",\n data: values,\n showSymbol: input.showSymbols,\n symbolSize: SYMBOL_SIZE_PX,\n lineStyle: {\n color,\n type: input.line.style ?? DEFAULT_LINE_STYLE,\n width: LINE_WIDTH_PX[input.line.width ?? DEFAULT_LINE_WIDTH],\n },\n itemStyle: { color },\n areaStyle: input.displayType === \"area\" ? { color, opacity: AREA_OPACITY } : undefined,\n label,\n };\n}\n\n// O retorno é `Record<string, unknown>` de propósito, e não `EChartsOption`: é o que impede\n// um tipo da biblioteca de vazar para o resto do design system.\nexport function buildTimeSeriesOption(input: TimeSeriesOptionInput): Record<string, unknown> {\n const { series, legend, yAxis, theme, seriesColorOverrides } = input;\n const isLegendVisible: boolean = legend !== \"none\" && series.length > 0;\n const formatValue: ((value: number | null) => string) | undefined = nullSafeValueFormatter(input);\n\n return {\n animation: false,\n color: theme.seriesColors,\n textStyle: { fontFamily: theme.fontFamily, color: theme.labelColor },\n grid: {\n ...GRID_WITHOUT_LEGEND,\n top: isLegendVisible ? GRID_WITHOUT_LEGEND.top + LEGEND_HEIGHT_PX : GRID_WITHOUT_LEGEND.top,\n containLabel: false,\n },\n legend: isLegendVisible\n ? {\n type: \"scroll\",\n top: 0,\n left: 0,\n icon: \"roundRect\",\n itemHeight: 8,\n itemWidth: 12,\n textStyle: { color: theme.labelColor },\n }\n : { show: false },\n tooltip: {\n trigger: \"axis\",\n backgroundColor: theme.tooltipBackgroundColor,\n borderColor: theme.tooltipBorderColor,\n textStyle: { color: theme.labelColor },\n valueFormatter: formatValue,\n },\n xAxis: {\n type: \"time\",\n axisLine: { lineStyle: { color: theme.axisLineColor } },\n axisTick: { show: false },\n axisLabel: { color: theme.labelColor, hideOverlap: true, formatter: timeAxisLabel },\n splitLine: { show: false },\n },\n yAxis: {\n type: yAxis.scale === \"log\" ? \"log\" : \"value\",\n scale: yAxis.includeZero !== true,\n min: yAxis.min,\n max: yAxis.max,\n axisLine: { show: false },\n axisLabel: { color: theme.labelColor, formatter: formatValue },\n splitLine: { lineStyle: { color: theme.splitLineColor } },\n },\n series: series.map((data: TimeSeriesData, index: number) =>\n seriesEntry(\n data,\n input,\n seriesColorOverrides[data.id] ?? theme.seriesColors[index % theme.seriesColors.length],\n ),\n ),\n };\n}\n"],"names":["LEGEND_HEIGHT_PX","GRID_WITHOUT_LEGEND","SYMBOL_SIZE_PX","AREA_OPACITY","LINE_WIDTH_PX","DEFAULT_LINE_STYLE","DEFAULT_LINE_WIDTH","YEAR_LABEL","DAY_LABEL","MINUTE_LABEL","SECOND_LABEL","timeAxisLabel","timestamp","instant","nullSafeValueFormatter","input","valueFormatter","value","seriesLabel","showValueLabels","theme","formatValue","params","seriesEntry","data","color","values","point","label","buildTimeSeriesOption","series","legend","yAxis","seriesColorOverrides","isLegendVisible","index"],"mappings":"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"}
@@ -1,88 +1,104 @@
1
- const s = { top: 16, right: 16, bottom: 24, left: 56 }, d = 6, b = 0.15, p = { thin: 1, normal: 2, thick: 4 }, L = "solid", f = "normal";
2
- function m(o) {
3
- const { valueFormatter: l } = o;
4
- if (l)
5
- return (t) => t === null ? "" : l(t);
1
+ const n = { top: 16, right: 16, bottom: 24, left: 56 }, u = 6, f = 0.15, y = { thin: 1, normal: 2, thick: 4 }, L = "solid", g = "normal", h = new Intl.DateTimeFormat(void 0, { year: "numeric" }), E = new Intl.DateTimeFormat(void 0, {
2
+ day: "2-digit",
3
+ month: "2-digit"
4
+ }), b = new Intl.DateTimeFormat(void 0, {
5
+ hour: "2-digit",
6
+ minute: "2-digit",
7
+ hour12: !1
8
+ }), p = new Intl.DateTimeFormat(void 0, {
9
+ hour: "2-digit",
10
+ minute: "2-digit",
11
+ second: "2-digit",
12
+ hour12: !1
13
+ });
14
+ function S(t) {
15
+ const e = new Date(t);
16
+ return e.getSeconds() !== 0 || e.getMilliseconds() !== 0 ? p.format(e) : e.getHours() !== 0 || e.getMinutes() !== 0 ? b.format(e) : e.getMonth() === 0 && e.getDate() === 1 ? h.format(e) : E.format(e);
6
17
  }
7
- function h(o) {
8
- const { showValueLabels: l, theme: t } = o, i = m(o);
18
+ function c(t) {
19
+ const { valueFormatter: e } = t;
20
+ if (e)
21
+ return (i) => i === null ? "" : e(i);
22
+ }
23
+ function T(t) {
24
+ const { showValueLabels: e, theme: i } = t, l = c(t);
9
25
  return {
10
- show: l,
26
+ show: e,
11
27
  position: "top",
12
- color: t.labelColor,
13
- formatter: i ? (e) => i(e.value[1]) : void 0
28
+ color: i.labelColor,
29
+ formatter: l ? (o) => l(o.value[1]) : void 0
14
30
  };
15
31
  }
16
- function u(o, l, t) {
17
- const i = o.points.map((r) => [
32
+ function _(t, e, i) {
33
+ const l = t.points.map((r) => [
18
34
  r.timestamp,
19
35
  r.value
20
- ]), e = h(l);
21
- return l.displayType === "bar" ? { id: o.id, name: o.name, type: "bar", data: i, itemStyle: { color: t }, label: e } : {
22
- id: o.id,
23
- name: o.name,
36
+ ]), o = T(e);
37
+ return e.displayType === "bar" ? { id: t.id, name: t.name, type: "bar", data: l, itemStyle: { color: i }, label: o } : {
38
+ id: t.id,
39
+ name: t.name,
24
40
  type: "line",
25
- data: i,
26
- showSymbol: l.showSymbols,
27
- symbolSize: d,
41
+ data: l,
42
+ showSymbol: e.showSymbols,
43
+ symbolSize: u,
28
44
  lineStyle: {
29
- color: t,
30
- type: l.line.style ?? L,
31
- width: p[l.line.width ?? f]
45
+ color: i,
46
+ type: e.line.style ?? L,
47
+ width: y[e.line.width ?? g]
32
48
  },
33
- itemStyle: { color: t },
34
- areaStyle: l.displayType === "area" ? { color: t, opacity: b } : void 0,
35
- label: e
49
+ itemStyle: { color: i },
50
+ areaStyle: e.displayType === "area" ? { color: i, opacity: f } : void 0,
51
+ label: o
36
52
  };
37
53
  }
38
- function x(o) {
39
- const { series: l, legend: t, yAxis: i, theme: e, seriesColorOverrides: r } = o, a = t !== "none" && l.length > 0, n = m(o);
54
+ function x(t) {
55
+ const { series: e, legend: i, yAxis: l, theme: o, seriesColorOverrides: r } = t, s = i !== "none" && e.length > 0, a = c(t);
40
56
  return {
41
57
  animation: !1,
42
- color: e.seriesColors,
43
- textStyle: { fontFamily: e.fontFamily, color: e.labelColor },
58
+ color: o.seriesColors,
59
+ textStyle: { fontFamily: o.fontFamily, color: o.labelColor },
44
60
  grid: {
45
- ...s,
46
- top: a ? s.top + 32 : s.top,
61
+ ...n,
62
+ top: s ? n.top + 32 : n.top,
47
63
  containLabel: !1
48
64
  },
49
- legend: a ? {
65
+ legend: s ? {
50
66
  type: "scroll",
51
67
  top: 0,
52
68
  left: 0,
53
69
  icon: "roundRect",
54
70
  itemHeight: 8,
55
71
  itemWidth: 12,
56
- textStyle: { color: e.labelColor }
72
+ textStyle: { color: o.labelColor }
57
73
  } : { show: !1 },
58
74
  tooltip: {
59
75
  trigger: "axis",
60
- backgroundColor: e.tooltipBackgroundColor,
61
- borderColor: e.tooltipBorderColor,
62
- textStyle: { color: e.labelColor },
63
- valueFormatter: n
76
+ backgroundColor: o.tooltipBackgroundColor,
77
+ borderColor: o.tooltipBorderColor,
78
+ textStyle: { color: o.labelColor },
79
+ valueFormatter: a
64
80
  },
65
81
  xAxis: {
66
82
  type: "time",
67
- axisLine: { lineStyle: { color: e.axisLineColor } },
83
+ axisLine: { lineStyle: { color: o.axisLineColor } },
68
84
  axisTick: { show: !1 },
69
- axisLabel: { color: e.labelColor, hideOverlap: !0 },
85
+ axisLabel: { color: o.labelColor, hideOverlap: !0, formatter: S },
70
86
  splitLine: { show: !1 }
71
87
  },
72
88
  yAxis: {
73
- type: i.scale === "log" ? "log" : "value",
74
- scale: i.includeZero !== !0,
75
- min: i.min,
76
- max: i.max,
89
+ type: l.scale === "log" ? "log" : "value",
90
+ scale: l.includeZero !== !0,
91
+ min: l.min,
92
+ max: l.max,
77
93
  axisLine: { show: !1 },
78
- axisLabel: { color: e.labelColor, formatter: n },
79
- splitLine: { lineStyle: { color: e.splitLineColor } }
94
+ axisLabel: { color: o.labelColor, formatter: a },
95
+ splitLine: { lineStyle: { color: o.splitLineColor } }
80
96
  },
81
- series: l.map(
82
- (c, y) => u(
83
- c,
84
- o,
85
- r[c.id] ?? e.seriesColors[y % e.seriesColors.length]
97
+ series: e.map(
98
+ (m, d) => _(
99
+ m,
100
+ t,
101
+ r[m.id] ?? o.seriesColors[d % o.seriesColors.length]
86
102
  )
87
103
  )
88
104
  };
@@ -1 +1 @@
1
- {"version":3,"file":"time-series-option.js","sources":["../../../../../../src/ui/components/charts/TimeSeriesChart/time-series-option.ts"],"sourcesContent":["import type { ChartTheme } from \"../chart-theme\";\n\nexport interface TimeSeriesPoint {\n timestamp: number;\n value: number | null;\n}\n\nexport interface TimeSeriesData {\n id: string;\n name: string;\n points: TimeSeriesPoint[];\n // Nome de token, nunca hex: é o que mantém a cor válida nos dois temas. Sem ele a série\n // recebe a próxima cor da paleta.\n colorToken?: string;\n}\n\nexport type TimeSeriesDisplayType = \"line\" | \"bar\" | \"area\";\n\nexport type TimeSeriesLineStyle = \"solid\" | \"dashed\" | \"dotted\";\n\nexport type TimeSeriesLineWidth = \"thin\" | \"normal\" | \"thick\";\n\nexport interface TimeSeriesLineOptions {\n style?: TimeSeriesLineStyle;\n width?: TimeSeriesLineWidth;\n}\n\nexport type TimeSeriesLegendMode = \"inline\" | \"none\";\n\nexport type TimeSeriesAxisScale = \"linear\" | \"log\";\n\nexport interface TimeSeriesYAxisOptions {\n scale?: TimeSeriesAxisScale;\n min?: number;\n max?: number;\n includeZero?: boolean;\n}\n\nexport interface TimeSeriesOptionInput {\n series: TimeSeriesData[];\n displayType: TimeSeriesDisplayType;\n legend: TimeSeriesLegendMode;\n line: TimeSeriesLineOptions;\n yAxis: TimeSeriesYAxisOptions;\n theme: ChartTheme;\n showSymbols: boolean;\n showValueLabels: boolean;\n seriesColorOverrides: Record<string, string>;\n valueFormatter?: (value: number) => string;\n}\n\nconst LEGEND_HEIGHT_PX: number = 32;\n\nconst GRID_WITHOUT_LEGEND = { top: 16, right: 16, bottom: 24, left: 56 } as const;\n\nconst SYMBOL_SIZE_PX: number = 6;\n\nconst AREA_OPACITY: number = 0.15;\n\nconst LINE_WIDTH_PX: Record<TimeSeriesLineWidth, number> = { thin: 1, normal: 2, thick: 4 };\n\nconst DEFAULT_LINE_STYLE: TimeSeriesLineStyle = \"solid\";\n\nconst DEFAULT_LINE_WIDTH: TimeSeriesLineWidth = \"normal\";\n\n// O ponto de gap chega ao formatter como `null` — o ECharts monta o bloco do tooltip sem marcar\n// `noValue`, então formata o vazio junto com o resto. O tipo público promete `number` ao\n// consumidor, e é esta guarda que mantém a promessa em vez de transformá-la em aviso.\nfunction nullSafeValueFormatter(\n input: TimeSeriesOptionInput,\n): ((value: number | null) => string) | undefined {\n const { valueFormatter } = input;\n if (!valueFormatter) return undefined;\n return (value: number | null) => (value === null ? \"\" : valueFormatter(value));\n}\n\nfunction seriesLabel(input: TimeSeriesOptionInput): Record<string, unknown> {\n const { showValueLabels, theme } = input;\n const formatValue: ((value: number | null) => string) | undefined = nullSafeValueFormatter(input);\n return {\n show: showValueLabels,\n position: \"top\",\n color: theme.labelColor,\n formatter: formatValue\n ? (params: { value: [number, number | null] }) => formatValue(params.value[1])\n : undefined,\n };\n}\n\nfunction seriesEntry(\n data: TimeSeriesData,\n input: TimeSeriesOptionInput,\n color: string,\n): Record<string, unknown> {\n const values: Array<[number, number | null]> = data.points.map((point: TimeSeriesPoint) => [\n point.timestamp,\n point.value,\n ]);\n const label: Record<string, unknown> = seriesLabel(input);\n\n if (input.displayType === \"bar\") {\n return { id: data.id, name: data.name, type: \"bar\", data: values, itemStyle: { color }, label };\n }\n\n return {\n id: data.id,\n name: data.name,\n type: \"line\",\n data: values,\n showSymbol: input.showSymbols,\n symbolSize: SYMBOL_SIZE_PX,\n lineStyle: {\n color,\n type: input.line.style ?? DEFAULT_LINE_STYLE,\n width: LINE_WIDTH_PX[input.line.width ?? DEFAULT_LINE_WIDTH],\n },\n itemStyle: { color },\n areaStyle: input.displayType === \"area\" ? { color, opacity: AREA_OPACITY } : undefined,\n label,\n };\n}\n\n// O retorno é `Record<string, unknown>` de propósito, e não `EChartsOption`: é o que impede\n// um tipo da biblioteca de vazar para o resto do design system.\nexport function buildTimeSeriesOption(input: TimeSeriesOptionInput): Record<string, unknown> {\n const { series, legend, yAxis, theme, seriesColorOverrides } = input;\n const isLegendVisible: boolean = legend !== \"none\" && series.length > 0;\n const formatValue: ((value: number | null) => string) | undefined = nullSafeValueFormatter(input);\n\n return {\n animation: false,\n color: theme.seriesColors,\n textStyle: { fontFamily: theme.fontFamily, color: theme.labelColor },\n grid: {\n ...GRID_WITHOUT_LEGEND,\n top: isLegendVisible ? GRID_WITHOUT_LEGEND.top + LEGEND_HEIGHT_PX : GRID_WITHOUT_LEGEND.top,\n containLabel: false,\n },\n legend: isLegendVisible\n ? {\n type: \"scroll\",\n top: 0,\n left: 0,\n icon: \"roundRect\",\n itemHeight: 8,\n itemWidth: 12,\n textStyle: { color: theme.labelColor },\n }\n : { show: false },\n tooltip: {\n trigger: \"axis\",\n backgroundColor: theme.tooltipBackgroundColor,\n borderColor: theme.tooltipBorderColor,\n textStyle: { color: theme.labelColor },\n valueFormatter: formatValue,\n },\n xAxis: {\n type: \"time\",\n axisLine: { lineStyle: { color: theme.axisLineColor } },\n axisTick: { show: false },\n axisLabel: { color: theme.labelColor, hideOverlap: true },\n splitLine: { show: false },\n },\n yAxis: {\n type: yAxis.scale === \"log\" ? \"log\" : \"value\",\n scale: yAxis.includeZero !== true,\n min: yAxis.min,\n max: yAxis.max,\n axisLine: { show: false },\n axisLabel: { color: theme.labelColor, formatter: formatValue },\n splitLine: { lineStyle: { color: theme.splitLineColor } },\n },\n series: series.map((data: TimeSeriesData, index: number) =>\n seriesEntry(\n data,\n input,\n seriesColorOverrides[data.id] ?? theme.seriesColors[index % theme.seriesColors.length],\n ),\n ),\n };\n}\n"],"names":["GRID_WITHOUT_LEGEND","SYMBOL_SIZE_PX","AREA_OPACITY","LINE_WIDTH_PX","DEFAULT_LINE_STYLE","DEFAULT_LINE_WIDTH","nullSafeValueFormatter","input","valueFormatter","value","seriesLabel","showValueLabels","theme","formatValue","params","seriesEntry","data","color","values","point","label","buildTimeSeriesOption","series","legend","yAxis","seriesColorOverrides","isLegendVisible","index"],"mappings":"AAqDA,MAAMA,IAAsB,EAAE,KAAK,IAAI,OAAO,IAAI,QAAQ,IAAI,MAAM,GAAA,GAE9DC,IAAyB,GAEzBC,IAAuB,MAEvBC,IAAqD,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,EAAA,GAElFC,IAA0C,SAE1CC,IAA0C;AAKhD,SAASC,EACPC,GACgD;AAChD,QAAM,EAAE,gBAAAC,MAAmBD;AAC3B,MAAKC;AACL,WAAO,CAACC,MAA0BA,MAAU,OAAO,KAAKD,EAAeC,CAAK;AAC9E;AAEA,SAASC,EAAYH,GAAuD;AAC1E,QAAM,EAAE,iBAAAI,GAAiB,OAAAC,EAAA,IAAUL,GAC7BM,IAA8DP,EAAuBC,CAAK;AAChG,SAAO;AAAA,IACL,MAAMI;AAAA,IACN,UAAU;AAAA,IACV,OAAOC,EAAM;AAAA,IACb,WAAWC,IACP,CAACC,MAA+CD,EAAYC,EAAO,MAAM,CAAC,CAAC,IAC3E;AAAA,EAAA;AAER;AAEA,SAASC,EACPC,GACAT,GACAU,GACyB;AACzB,QAAMC,IAAyCF,EAAK,OAAO,IAAI,CAACG,MAA2B;AAAA,IACzFA,EAAM;AAAA,IACNA,EAAM;AAAA,EAAA,CACP,GACKC,IAAiCV,EAAYH,CAAK;AAExD,SAAIA,EAAM,gBAAgB,QACjB,EAAE,IAAIS,EAAK,IAAI,MAAMA,EAAK,MAAM,MAAM,OAAO,MAAME,GAAQ,WAAW,EAAE,OAAAD,EAAA,GAAS,OAAAG,EAAA,IAGnF;AAAA,IACL,IAAIJ,EAAK;AAAA,IACT,MAAMA,EAAK;AAAA,IACX,MAAM;AAAA,IACN,MAAME;AAAA,IACN,YAAYX,EAAM;AAAA,IAClB,YAAYN;AAAA,IACZ,WAAW;AAAA,MACT,OAAAgB;AAAA,MACA,MAAMV,EAAM,KAAK,SAASH;AAAA,MAC1B,OAAOD,EAAcI,EAAM,KAAK,SAASF,CAAkB;AAAA,IAAA;AAAA,IAE7D,WAAW,EAAE,OAAAY,EAAA;AAAA,IACb,WAAWV,EAAM,gBAAgB,SAAS,EAAE,OAAAU,GAAO,SAASf,MAAiB;AAAA,IAC7E,OAAAkB;AAAA,EAAA;AAEJ;AAIO,SAASC,EAAsBd,GAAuD;AAC3F,QAAM,EAAE,QAAAe,GAAQ,QAAAC,GAAQ,OAAAC,GAAO,OAAAZ,GAAO,sBAAAa,MAAyBlB,GACzDmB,IAA2BH,MAAW,UAAUD,EAAO,SAAS,GAChET,IAA8DP,EAAuBC,CAAK;AAEhG,SAAO;AAAA,IACL,WAAW;AAAA,IACX,OAAOK,EAAM;AAAA,IACb,WAAW,EAAE,YAAYA,EAAM,YAAY,OAAOA,EAAM,WAAA;AAAA,IACxD,MAAM;AAAA,MACJ,GAAGZ;AAAA,MACH,KAAK0B,IAAkB1B,EAAoB,MAAM,KAAmBA,EAAoB;AAAA,MACxF,cAAc;AAAA,IAAA;AAAA,IAEhB,QAAQ0B,IACJ;AAAA,MACE,MAAM;AAAA,MACN,KAAK;AAAA,MACL,MAAM;AAAA,MACN,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,WAAW,EAAE,OAAOd,EAAM,WAAA;AAAA,IAAW,IAEvC,EAAE,MAAM,GAAA;AAAA,IACZ,SAAS;AAAA,MACP,SAAS;AAAA,MACT,iBAAiBA,EAAM;AAAA,MACvB,aAAaA,EAAM;AAAA,MACnB,WAAW,EAAE,OAAOA,EAAM,WAAA;AAAA,MAC1B,gBAAgBC;AAAA,IAAA;AAAA,IAElB,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU,EAAE,WAAW,EAAE,OAAOD,EAAM,gBAAc;AAAA,MACpD,UAAU,EAAE,MAAM,GAAA;AAAA,MAClB,WAAW,EAAE,OAAOA,EAAM,YAAY,aAAa,GAAA;AAAA,MACnD,WAAW,EAAE,MAAM,GAAA;AAAA,IAAM;AAAA,IAE3B,OAAO;AAAA,MACL,MAAMY,EAAM,UAAU,QAAQ,QAAQ;AAAA,MACtC,OAAOA,EAAM,gBAAgB;AAAA,MAC7B,KAAKA,EAAM;AAAA,MACX,KAAKA,EAAM;AAAA,MACX,UAAU,EAAE,MAAM,GAAA;AAAA,MAClB,WAAW,EAAE,OAAOZ,EAAM,YAAY,WAAWC,EAAA;AAAA,MACjD,WAAW,EAAE,WAAW,EAAE,OAAOD,EAAM,iBAAe;AAAA,IAAE;AAAA,IAE1D,QAAQU,EAAO;AAAA,MAAI,CAACN,GAAsBW,MACxCZ;AAAA,QACEC;AAAA,QACAT;AAAA,QACAkB,EAAqBT,EAAK,EAAE,KAAKJ,EAAM,aAAae,IAAQf,EAAM,aAAa,MAAM;AAAA,MAAA;AAAA,IACvF;AAAA,EACF;AAEJ;"}
1
+ {"version":3,"file":"time-series-option.js","sources":["../../../../../../src/ui/components/charts/TimeSeriesChart/time-series-option.ts"],"sourcesContent":["import type { ChartTheme } from \"../chart-theme\";\n\nexport interface TimeSeriesPoint {\n timestamp: number;\n value: number | null;\n}\n\nexport interface TimeSeriesData {\n id: string;\n name: string;\n points: TimeSeriesPoint[];\n // Nome de token, nunca hex: é o que mantém a cor válida nos dois temas. Sem ele a série\n // recebe a próxima cor da paleta.\n colorToken?: string;\n}\n\nexport type TimeSeriesDisplayType = \"line\" | \"bar\" | \"area\";\n\nexport type TimeSeriesLineStyle = \"solid\" | \"dashed\" | \"dotted\";\n\nexport type TimeSeriesLineWidth = \"thin\" | \"normal\" | \"thick\";\n\nexport interface TimeSeriesLineOptions {\n style?: TimeSeriesLineStyle;\n width?: TimeSeriesLineWidth;\n}\n\nexport type TimeSeriesLegendMode = \"inline\" | \"none\";\n\nexport type TimeSeriesAxisScale = \"linear\" | \"log\";\n\nexport interface TimeSeriesYAxisOptions {\n scale?: TimeSeriesAxisScale;\n min?: number;\n max?: number;\n includeZero?: boolean;\n}\n\nexport interface TimeSeriesOptionInput {\n series: TimeSeriesData[];\n displayType: TimeSeriesDisplayType;\n legend: TimeSeriesLegendMode;\n line: TimeSeriesLineOptions;\n yAxis: TimeSeriesYAxisOptions;\n theme: ChartTheme;\n showSymbols: boolean;\n showValueLabels: boolean;\n seriesColorOverrides: Record<string, string>;\n valueFormatter?: (value: number) => string;\n}\n\nconst LEGEND_HEIGHT_PX: number = 32;\n\nconst GRID_WITHOUT_LEGEND = { top: 16, right: 16, bottom: 24, left: 56 } as const;\n\nconst SYMBOL_SIZE_PX: number = 6;\n\nconst AREA_OPACITY: number = 0.15;\n\nconst LINE_WIDTH_PX: Record<TimeSeriesLineWidth, number> = { thin: 1, normal: 2, thick: 4 };\n\nconst DEFAULT_LINE_STYLE: TimeSeriesLineStyle = \"solid\";\n\nconst DEFAULT_LINE_WIDTH: TimeSeriesLineWidth = \"normal\";\n\n// O eixo de tempo do ECharts rotula a marca de dia so com o numero do dia -- \"2\", \"3\", \"4\" --, que\n// sozinho nao diz nem o mes. Aqui a marca de dia vira data e a marca dentro do dia vira hora, que e\n// o que se espera de uma serie temporal.\n//\n// A precisao sai do proprio instante, e nao de um nivel pedido ao ECharts: ele alinha as marcas ao\n// nivel que cabe no eixo, entao meia-noite e marca de dia, minuto cheio e marca de hora, e assim por\n// diante. Ler o instante e o que permite usar `Intl` e escrever a data na convencao de quem le -- o\n// objeto de niveis do ECharts so aceita template, e um `{dd}/{MM}` fixo seria lido como mes/dia por\n// metade dos usuarios.\nconst YEAR_LABEL: Intl.DateTimeFormat = new Intl.DateTimeFormat(undefined, { year: \"numeric\" });\n\nconst DAY_LABEL: Intl.DateTimeFormat = new Intl.DateTimeFormat(undefined, {\n day: \"2-digit\",\n month: \"2-digit\",\n});\n\nconst MINUTE_LABEL: Intl.DateTimeFormat = new Intl.DateTimeFormat(undefined, {\n hour: \"2-digit\",\n minute: \"2-digit\",\n hour12: false,\n});\n\nconst SECOND_LABEL: Intl.DateTimeFormat = new Intl.DateTimeFormat(undefined, {\n hour: \"2-digit\",\n minute: \"2-digit\",\n second: \"2-digit\",\n hour12: false,\n});\n\nfunction timeAxisLabel(timestamp: number): string {\n const instant: Date = new Date(timestamp);\n if (instant.getSeconds() !== 0 || instant.getMilliseconds() !== 0) return SECOND_LABEL.format(instant);\n if (instant.getHours() !== 0 || instant.getMinutes() !== 0) return MINUTE_LABEL.format(instant);\n // Primeiro de janeiro e a marca de ano do ECharts, e ali a data sem o ano nao situa ninguem.\n if (instant.getMonth() === 0 && instant.getDate() === 1) return YEAR_LABEL.format(instant);\n return DAY_LABEL.format(instant);\n}\n\n// O ponto de gap chega ao formatter como `null` — o ECharts monta o bloco do tooltip sem marcar\n// `noValue`, então formata o vazio junto com o resto. O tipo público promete `number` ao\n// consumidor, e é esta guarda que mantém a promessa em vez de transformá-la em aviso.\nfunction nullSafeValueFormatter(\n input: TimeSeriesOptionInput,\n): ((value: number | null) => string) | undefined {\n const { valueFormatter } = input;\n if (!valueFormatter) return undefined;\n return (value: number | null) => (value === null ? \"\" : valueFormatter(value));\n}\n\nfunction seriesLabel(input: TimeSeriesOptionInput): Record<string, unknown> {\n const { showValueLabels, theme } = input;\n const formatValue: ((value: number | null) => string) | undefined = nullSafeValueFormatter(input);\n return {\n show: showValueLabels,\n position: \"top\",\n color: theme.labelColor,\n formatter: formatValue\n ? (params: { value: [number, number | null] }) => formatValue(params.value[1])\n : undefined,\n };\n}\n\nfunction seriesEntry(\n data: TimeSeriesData,\n input: TimeSeriesOptionInput,\n color: string,\n): Record<string, unknown> {\n const values: Array<[number, number | null]> = data.points.map((point: TimeSeriesPoint) => [\n point.timestamp,\n point.value,\n ]);\n const label: Record<string, unknown> = seriesLabel(input);\n\n if (input.displayType === \"bar\") {\n return { id: data.id, name: data.name, type: \"bar\", data: values, itemStyle: { color }, label };\n }\n\n return {\n id: data.id,\n name: data.name,\n type: \"line\",\n data: values,\n showSymbol: input.showSymbols,\n symbolSize: SYMBOL_SIZE_PX,\n lineStyle: {\n color,\n type: input.line.style ?? DEFAULT_LINE_STYLE,\n width: LINE_WIDTH_PX[input.line.width ?? DEFAULT_LINE_WIDTH],\n },\n itemStyle: { color },\n areaStyle: input.displayType === \"area\" ? { color, opacity: AREA_OPACITY } : undefined,\n label,\n };\n}\n\n// O retorno é `Record<string, unknown>` de propósito, e não `EChartsOption`: é o que impede\n// um tipo da biblioteca de vazar para o resto do design system.\nexport function buildTimeSeriesOption(input: TimeSeriesOptionInput): Record<string, unknown> {\n const { series, legend, yAxis, theme, seriesColorOverrides } = input;\n const isLegendVisible: boolean = legend !== \"none\" && series.length > 0;\n const formatValue: ((value: number | null) => string) | undefined = nullSafeValueFormatter(input);\n\n return {\n animation: false,\n color: theme.seriesColors,\n textStyle: { fontFamily: theme.fontFamily, color: theme.labelColor },\n grid: {\n ...GRID_WITHOUT_LEGEND,\n top: isLegendVisible ? GRID_WITHOUT_LEGEND.top + LEGEND_HEIGHT_PX : GRID_WITHOUT_LEGEND.top,\n containLabel: false,\n },\n legend: isLegendVisible\n ? {\n type: \"scroll\",\n top: 0,\n left: 0,\n icon: \"roundRect\",\n itemHeight: 8,\n itemWidth: 12,\n textStyle: { color: theme.labelColor },\n }\n : { show: false },\n tooltip: {\n trigger: \"axis\",\n backgroundColor: theme.tooltipBackgroundColor,\n borderColor: theme.tooltipBorderColor,\n textStyle: { color: theme.labelColor },\n valueFormatter: formatValue,\n },\n xAxis: {\n type: \"time\",\n axisLine: { lineStyle: { color: theme.axisLineColor } },\n axisTick: { show: false },\n axisLabel: { color: theme.labelColor, hideOverlap: true, formatter: timeAxisLabel },\n splitLine: { show: false },\n },\n yAxis: {\n type: yAxis.scale === \"log\" ? \"log\" : \"value\",\n scale: yAxis.includeZero !== true,\n min: yAxis.min,\n max: yAxis.max,\n axisLine: { show: false },\n axisLabel: { color: theme.labelColor, formatter: formatValue },\n splitLine: { lineStyle: { color: theme.splitLineColor } },\n },\n series: series.map((data: TimeSeriesData, index: number) =>\n seriesEntry(\n data,\n input,\n seriesColorOverrides[data.id] ?? theme.seriesColors[index % theme.seriesColors.length],\n ),\n ),\n };\n}\n"],"names":["GRID_WITHOUT_LEGEND","SYMBOL_SIZE_PX","AREA_OPACITY","LINE_WIDTH_PX","DEFAULT_LINE_STYLE","DEFAULT_LINE_WIDTH","YEAR_LABEL","DAY_LABEL","MINUTE_LABEL","SECOND_LABEL","timeAxisLabel","timestamp","instant","nullSafeValueFormatter","input","valueFormatter","value","seriesLabel","showValueLabels","theme","formatValue","params","seriesEntry","data","color","values","point","label","buildTimeSeriesOption","series","legend","yAxis","seriesColorOverrides","isLegendVisible","index"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),l=require("../../../vendor/clsx/dist/clsx.cjs"),d=require("react"),i=require("react-aria-components");;/* empty css */const B=d.forwardRef(function({className:e,size:r="medium",variant:s="primary",...t},o){const c=l.clsx(e,"button",`button-size-${r}`,`button-variant-${s}`),{style:h,...u}=t;return m(t)?a.jsx(i.Link,{...u,className:c,ref:o,children:t.children}):a.jsx(i.Button,{...u,className:c,ref:o,children:t.children})}),b=d.forwardRef(function({className:e,size:r="medium",variant:s="danger-primary",...t},o){const c=l.clsx(e,"button",`button-size-${r}`,`button-variant-${s}`),{style:h,...u}=t;return m(t)?a.jsx(i.Link,{...u,className:c,ref:o,children:t.children}):a.jsx(i.Button,{...u,className:c,ref:o,children:t.children})});function m(n){return"href"in n}const x=({align:n="start",className:e,...r})=>{const s=l.clsx(e,"button-group",`button-group-align-${n}`);return a.jsx("div",{className:s,...r})};exports.Button=B;exports.ButtonDanger=b;exports.ButtonGroup=x;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),l=require("../../../vendor/clsx/dist/clsx.cjs"),d=require("react"),i=require("react-aria-components");;/* empty css */const b=d.forwardRef(function({className:e,size:r="medium",variant:s="primary",...t},o){const c=l.clsx(e,"button",`button-size-${r}`,`button-variant-${s}`),{style:h,...u}=t;return m(t)?a.jsx(i.Link,{...u,className:c,ref:o,children:t.children}):a.jsx(i.Button,{...u,className:c,ref:o,children:t.children})}),x=d.forwardRef(function({className:e,size:r="medium",variant:s="danger-primary",...t},o){const c=l.clsx(e,"button",`button-size-${r}`,`button-variant-${s}`),{style:h,...u}=t;return m(t)?a.jsx(i.Link,{...u,className:c,ref:o,children:t.children}):a.jsx(i.Button,{...u,className:c,ref:o,children:t.children})});function m(n){return"href"in n}const B=({align:n="start",className:e,...r})=>{const s=l.clsx(e,"button-group",`button-group-align-${n}`);return a.jsx("div",{className:s,...r})};exports.Button=b;exports.ButtonDanger=x;exports.ButtonGroup=B;
2
2
  //# sourceMappingURL=Button.cjs.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react");;/* empty css */const a=require("../IconButton/IconButton.cjs"),l=require("../../icons/IconCheck.cjs"),d=require("../../icons/IconCopy.cjs");function u({text:c,copyLabel:n="Copy",copiedLabel:i="Copied"}){const[o,t]=s.useState(!1);function r(){navigator.clipboard.writeText(c).then(()=>{t(!0),setTimeout(()=>t(!1),2e3)}).catch(()=>{})}return e.jsxs("div",{className:"codeblock","data-copied":o||void 0,children:[e.jsx("code",{className:"codeblock-text",children:c}),e.jsx(a.IconButton,{"aria-label":o?i:n,variant:"subtle",size:"small",onPress:r,children:o?e.jsx(l.IconCheck,{}):e.jsx(d.IconCopy,{})})]})}exports.CodeBlock=u;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react");;/* empty css */const a=require("../IconButton/IconButton.cjs"),l=require("../../icons/IconCheck.cjs"),d=require("../../icons/IconCopy.cjs");function u({text:c,copyLabel:n="Copy",copiedLabel:i="Copied"}){const[o,t]=r.useState(!1);function s(){navigator.clipboard.writeText(c).then(()=>{t(!0),setTimeout(()=>t(!1),2e3)}).catch(()=>{})}return e.jsxs("div",{className:"codeblock","data-copied":o||void 0,children:[e.jsx("code",{className:"codeblock-text",children:c}),e.jsx(a.IconButton,{"aria-label":o?i:n,variant:"subtle",size:"small",onPress:s,children:o?e.jsx(l.IconCheck,{}):e.jsx(d.IconCopy,{})})]})}exports.CodeBlock=u;
2
2
  //# sourceMappingURL=CodeBlock.cjs.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("../../../vendor/clsx/dist/clsx.cjs"),u=require("react"),F=require("../../../vendor/@monaco-editor/react/dist/index.cjs");;/* empty css */const m=require("../Fieldset/Fieldset.cjs"),g=require("../Button/Button.cjs");function j({value:d,defaultValue:s,onChange:o,language:i="javascript",theme:n="vs",height:r="300px",isDisabled:t=!1,isReadOnly:a=!1,options:f,className:p,editorRef:l}){const[c,v]=u.useState(!1),E=u.useRef(null);function N(x,R){l&&(l.current=x),x.onDidFocusEditorWidget(()=>v(!0)),x.onDidBlurEditorWidget(()=>v(!1))}const C=h.clsx("code-editor-wrapper",p,{"code-editor-focused":c,"code-editor-disabled":t});return e.jsx("div",{ref:E,className:C,"data-disabled":t||void 0,style:{height:r},children:e.jsx(F.default,{height:"100%",value:d,defaultValue:s,language:i,theme:n,onChange:o,onMount:N,loading:e.jsx("div",{className:"code-editor-loading"}),options:{readOnly:a||t,minimap:{enabled:!1},scrollBeyondLastLine:!1,fontSize:13,lineNumbersMinChars:3,...f}})})}function q({className:d,label:s,description:o,errorMessage:i,...n}){const r=u.useId(),t=h.clsx(d,"field");return e.jsxs("div",{className:t,children:[s&&e.jsx(m.Label,{htmlFor:r,children:s}),e.jsx(j,{...n}),o&&e.jsx(m.Description,{children:o}),i&&typeof i=="string"&&e.jsx(m.FieldError,{children:i})]})}const y="Clique no editor e pressione F1 para visualizar os atalhos do teclado";function B({title:d,shortcutHint:s=y,onBeautify:o,className:i,isDisabled:n=!1,isReadOnly:r=!1,...t}){const a=u.useRef(null),f=!n&&!r;function p(){var l,c;if(o){o();return}(c=(l=a.current)==null?void 0:l.getAction("editor.action.formatDocument"))==null||c.run()}return e.jsxs("div",{className:h.clsx("code-editor-panel",i),children:[f&&e.jsxs("div",{className:"code-editor-panel-header",children:[e.jsxs("div",{className:"code-editor-panel-title-group",children:[e.jsx("span",{className:"code-editor-panel-title",children:d}),s&&e.jsxs("span",{className:"code-editor-panel-hint",children:["(",s,")"]})]}),e.jsx(g.Button,{size:"small",variant:"primary",onPress:p,children:"Beautify"})]}),e.jsx(j,{...t,isDisabled:n,isReadOnly:r,editorRef:a})]})}exports.CodeEditor=j;exports.CodeEditorField=q;exports.CodeEditorPanel=B;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("../../../vendor/clsx/dist/clsx.cjs"),u=require("react"),F=require("../../../vendor/@monaco-editor/react/dist/index.cjs");;/* empty css */const m=require("../Fieldset/Fieldset.cjs"),g=require("../Button/Button.cjs");function j({value:d,defaultValue:s,onChange:o,language:i="javascript",theme:n="vs",height:r="300px",isDisabled:t=!1,isReadOnly:a=!1,options:f,className:p,editorRef:l}){const[c,v]=u.useState(!1),E=u.useRef(null);function N(x,B){l&&(l.current=x),x.onDidFocusEditorWidget(()=>v(!0)),x.onDidBlurEditorWidget(()=>v(!1))}const C=h.clsx("code-editor-wrapper",p,{"code-editor-focused":c,"code-editor-disabled":t});return e.jsx("div",{ref:E,className:C,"data-disabled":t||void 0,style:{height:r},children:e.jsx(F.default,{height:"100%",value:d,defaultValue:s,language:i,theme:n,onChange:o,onMount:N,loading:e.jsx("div",{className:"code-editor-loading"}),options:{readOnly:a||t,minimap:{enabled:!1},scrollBeyondLastLine:!1,fontSize:13,lineNumbersMinChars:3,...f}})})}function q({className:d,label:s,description:o,errorMessage:i,...n}){const r=u.useId(),t=h.clsx(d,"field");return e.jsxs("div",{className:t,children:[s&&e.jsx(m.Label,{htmlFor:r,children:s}),e.jsx(j,{...n}),o&&e.jsx(m.Description,{children:o}),i&&typeof i=="string"&&e.jsx(m.FieldError,{children:i})]})}const y="Clique no editor e pressione F1 para visualizar os atalhos do teclado";function R({title:d,shortcutHint:s=y,onBeautify:o,className:i,isDisabled:n=!1,isReadOnly:r=!1,...t}){const a=u.useRef(null),f=!n&&!r;function p(){var l,c;if(o){o();return}(c=(l=a.current)==null?void 0:l.getAction("editor.action.formatDocument"))==null||c.run()}return e.jsxs("div",{className:h.clsx("code-editor-panel",i),children:[f&&e.jsxs("div",{className:"code-editor-panel-header",children:[e.jsxs("div",{className:"code-editor-panel-title-group",children:[e.jsx("span",{className:"code-editor-panel-title",children:d}),s&&e.jsxs("span",{className:"code-editor-panel-hint",children:["(",s,")"]})]}),e.jsx(g.Button,{size:"small",variant:"primary",onPress:p,children:"Beautify"})]}),e.jsx(j,{...t,isDisabled:n,isReadOnly:r,editorRef:a})]})}exports.CodeEditor=j;exports.CodeEditorField=q;exports.CodeEditorPanel=R;
2
2
  //# sourceMappingURL=CodeEditor.cjs.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("../../../vendor/clsx/dist/clsx.cjs"),g=require("react"),s=require("react-aria-components");;/* empty css */const q=require("../../hooks/useOverlayPortal.cjs"),t=require("../Fieldset/Fieldset.cjs"),f=require("../Input/Input.cjs"),p=require("../../icons/IconChevronDown.cjs"),x=require("../ListBox/ListBox.cjs"),I=require("../../icons/IconCheck.cjs");function N({className:o,label:r,description:n,errorMessage:c,placeholder:i,children:b,items:d,...j}){const C=u.clsx(o,"combobox-container"),a=g.useRef(null),h=q.useOverlayPortalContainer();return e.jsx(m,{className:C,...j,children:e.jsxs(t.Field,{children:[r&&e.jsx(t.Label,{children:r}),e.jsxs(s.Group,{className:"combobox",children:[e.jsx(f.Input,{className:"combobox-input",placeholder:i,onPointerDown:B=>{var l;document.activeElement===B.currentTarget&&((l=a.current)==null||l.click())}}),e.jsx(s.Button,{ref:a,className:"combobox-trigger",children:e.jsx(p.IconChevronDown,{"aria-hidden":"true"})})]}),e.jsx(s.Popover,{UNSTABLE_portalContainer:h,children:e.jsx(x.ListBox,{items:d,children:b})}),n&&e.jsx(t.Description,{children:n}),e.jsx(t.FieldError,{children:c})]})})}function m({...o}){return e.jsx(s.ComboBox,{menuTrigger:"focus",...o})}function v({children:o,className:r,...n}){const c=u.clsx(r,"combobox-item"),i=typeof o=="string"?o:"";return e.jsx(x.ListBoxItem,{textValue:i,className:c,...n,children:e.jsxs(e.Fragment,{children:[e.jsx(I.IconCheck,{className:"combobox-item-check"}),o]})})}exports.ComboBox=m;exports.ComboBoxField=N;exports.ComboBoxItem=v;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("../../../vendor/clsx/dist/clsx.cjs"),x=require("react"),c=require("react-aria-components");;/* empty css */const v=require("../../hooks/useOverlayPortal.cjs"),s=require("../Fieldset/Fieldset.cjs"),g=require("../Input/Input.cjs"),B=require("../../icons/IconChevronDown.cjs"),b=require("../ListBox/ListBox.cjs"),q=require("../../icons/IconCheck.cjs");function N(o){const n=o.getRootNode();return n instanceof ShadowRoot||n instanceof Document?n.activeElement:null}function I(o){x.useEffect(()=>{const n=o.current;if(!n)return;function t(r){r.preventDefault()}return n.addEventListener("mousedown",t),()=>n.removeEventListener("mousedown",t)},[o])}function F({className:o,label:n,description:t,errorMessage:r,placeholder:i,children:f,items:j,...p}){const h=m.clsx(o,"combobox-container"),u=x.useRef(null);I(u);const C=v.useOverlayPortalContainer();return e.jsx(d,{className:h,...p,children:e.jsxs(s.Field,{children:[n&&e.jsx(s.Label,{children:n}),e.jsxs(c.Group,{className:"combobox",children:[e.jsx(g.Input,{className:"combobox-input",placeholder:i,onPointerDown:a=>{var l;N(a.currentTarget)===a.currentTarget&&((l=u.current)==null||l.click())}}),e.jsx(c.Button,{ref:u,className:"combobox-trigger",children:e.jsx(B.IconChevronDown,{"aria-hidden":"true"})})]}),e.jsx(c.Popover,{className:"combobox-popover",UNSTABLE_portalContainer:C,children:e.jsx(b.ListBox,{items:j,children:f})}),t&&e.jsx(s.Description,{children:t}),e.jsx(s.FieldError,{children:r})]})})}function d({...o}){return e.jsx(c.ComboBox,{menuTrigger:"focus",...o})}function E({children:o,className:n,...t}){const r=m.clsx(n,"combobox-item"),i=typeof o=="string"?o:"";return e.jsx(b.ListBoxItem,{textValue:i,className:r,...t,children:e.jsxs(e.Fragment,{children:[e.jsx(q.IconCheck,{className:"combobox-item-check"}),o]})})}exports.ComboBox=d;exports.ComboBoxField=F;exports.ComboBoxItem=E;
2
2
  //# sourceMappingURL=ComboBox.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.cjs","sources":["../../../../../src/ui/primitives/ComboBox/ComboBox.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconCheck, IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Input,\n ListBox,\n ListBoxItem,\n Label,\n SharedFieldProps,\n type ListBoxItemProps,\n} from \"primitives\";\nimport { useRef } from \"react\";\nimport {\n Button as RACButton,\n ComboBox as RACComboBox,\n Group as RACGroup,\n Popover as RACPopover,\n type ComboBoxProps as RACComboBoxProps,\n} from \"react-aria-components\";\nimport \"./combobox.css\";\n\nexport interface ComboBoxFieldProps<T extends object>\n extends Omit<ComboBoxProps<T>, \"children\">,\n SharedFieldProps {\n items?: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\nexport function ComboBoxField<T extends object>({\n className,\n label,\n description,\n errorMessage,\n placeholder,\n children,\n items,\n ...props\n}: ComboBoxFieldProps<T>) {\n const classNames = clsx(className, \"combobox-container\");\n const triggerRef = useRef<HTMLButtonElement | null>(null);\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <ComboBox className={classNames} {...props}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACGroup className=\"combobox\">\n <Input\n className=\"combobox-input\"\n placeholder={placeholder}\n onPointerDown={(event) => {\n if (document.activeElement === event.currentTarget) {\n triggerRef.current?.click();\n }\n }}\n />\n <RACButton ref={triggerRef} className=\"combobox-trigger\">\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n </RACGroup>\n <RACPopover UNSTABLE_portalContainer={portalContainer}>\n <ListBox items={items}>{children}</ListBox>\n </RACPopover>\n {description && <Description>{description}</Description>}\n <FieldError>{errorMessage}</FieldError>\n </Field>\n </ComboBox>\n );\n}\n\nexport type ComboBoxProps<T extends object> = RACComboBoxProps<T>;\nexport function ComboBox<T extends object>({ ...props }: ComboBoxProps<T>) {\n return <RACComboBox<T> menuTrigger=\"focus\" {...props} />;\n}\n\nexport type ComboBoxItemProps = ListBoxItemProps;\nexport function ComboBoxItem({ children, className, ...props }: ComboBoxItemProps) {\n const classNames = clsx(className, \"combobox-item\");\n const textValue = typeof children === \"string\" ? children : \"\";\n return (\n <ListBoxItem textValue={textValue} className={classNames} {...props}>\n <>\n <IconCheck className=\"combobox-item-check\" />\n {children}\n </>\n </ListBoxItem>\n );\n}\n"],"names":["ComboBoxField","className","label","description","errorMessage","placeholder","children","items","props","classNames","clsx","triggerRef","useRef","portalContainer","useOverlayPortalContainer","ComboBox","Field","jsx","Label","jsxs","RACGroup","Input","event","_a","RACButton","IconChevronDown","RACPopover","ListBox","Description","FieldError","RACComboBox","ComboBoxItem","textValue","ListBoxItem","Fragment","IconCheck"],"mappings":"2eA8BO,SAASA,EAAgC,CAC9C,UAAAC,EACA,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,YAAAC,EACA,SAAAC,EACA,MAAAC,EACA,GAAGC,CACL,EAA0B,CACxB,MAAMC,EAAaC,EAAAA,KAAKT,EAAW,oBAAoB,EACjDU,EAAaC,EAAAA,OAAiC,IAAI,EAGlDC,EAAkBC,EAAAA,0BAAA,EACxB,aACGC,EAAA,CAAS,UAAWN,EAAa,GAAGD,EACnC,gBAACQ,EAAAA,MAAA,CACE,SAAA,CAAAd,GAASe,EAAAA,IAACC,EAAAA,OAAO,SAAAhB,CAAA,CAAM,EACxBiB,EAAAA,KAACC,EAAAA,MAAA,CAAS,UAAU,WAClB,SAAA,CAAAH,EAAAA,IAACI,EAAAA,MAAA,CACC,UAAU,iBACV,YAAAhB,EACA,cAAgBiB,GAAU,OACpB,SAAS,gBAAkBA,EAAM,iBACnCC,EAAAZ,EAAW,UAAX,MAAAY,EAAoB,QAExB,CAAA,CAAA,EAEFN,EAAAA,IAACO,EAAAA,OAAA,CAAU,IAAKb,EAAY,UAAU,mBACpC,SAAAM,EAAAA,IAACQ,EAAAA,gBAAA,CAAgB,cAAY,MAAA,CAAO,CAAA,CACtC,CAAA,EACF,EACAR,EAAAA,IAACS,EAAAA,SAAW,yBAA0Bb,EACpC,eAACc,EAAAA,QAAA,CAAQ,MAAApB,EAAe,SAAAD,EAAS,CAAA,CACnC,EACCH,GAAec,EAAAA,IAACW,EAAAA,YAAA,CAAa,SAAAzB,CAAA,CAAY,EAC1Cc,EAAAA,IAACY,EAAAA,YAAY,SAAAzB,CAAA,CAAa,CAAA,CAAA,CAC5B,CAAA,CACF,CAEJ,CAGO,SAASW,EAA2B,CAAE,GAAGP,GAA2B,CACzE,OAAOS,EAAAA,IAACa,EAAAA,SAAA,CAAe,YAAY,QAAS,GAAGtB,EAAO,CACxD,CAGO,SAASuB,EAAa,CAAE,SAAAzB,EAAU,UAAAL,EAAW,GAAGO,GAA4B,CACjF,MAAMC,EAAaC,EAAAA,KAAKT,EAAW,eAAe,EAC5C+B,EAAY,OAAO1B,GAAa,SAAWA,EAAW,GAC5D,aACG2B,EAAAA,YAAA,CAAY,UAAAD,EAAsB,UAAWvB,EAAa,GAAGD,EAC5D,SAAAW,EAAAA,KAAAe,EAAAA,SAAA,CACE,SAAA,CAAAjB,EAAAA,IAACkB,EAAAA,UAAA,CAAU,UAAU,qBAAA,CAAsB,EAC1C7B,CAAA,CAAA,CACH,CAAA,CACF,CAEJ"}
1
+ {"version":3,"file":"ComboBox.cjs","sources":["../../../../../src/ui/primitives/ComboBox/ComboBox.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconCheck, IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Input,\n ListBox,\n ListBoxItem,\n Label,\n SharedFieldProps,\n type ListBoxItemProps,\n} from \"primitives\";\nimport { useEffect, useRef } from \"react\";\nimport {\n Button as RACButton,\n ComboBox as RACComboBox,\n Group as RACGroup,\n Popover as RACPopover,\n type ComboBoxProps as RACComboBoxProps,\n} from \"react-aria-components\";\nimport \"./combobox.css\";\n\nexport interface ComboBoxFieldProps<T extends object>\n extends Omit<ComboBoxProps<T>, \"children\">,\n SharedFieldProps {\n items?: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\n\n// `document.activeElement` para no host da shadow root: quem sabe o que está focado\n// dentro dela é a própria raiz. Ver ui/hooks/useOverlayPortal.\nfunction activeElementOf(element: Element): Element | null {\n const root = element.getRootNode();\n return root instanceof ShadowRoot || root instanceof Document\n ? root.activeElement\n : null;\n}\n\n// O react-aria pede `preventFocusOnPress` para o botão do dropdown, mas a implementação\n// dele guarda `document.activeElement` — que dentro de uma shadow root devolve o host, e\n// não o input. O botão fica com o foco de verdade, o input nunca mais recebe blur, e a\n// partir daí só escolher um item fecha o dropdown: clicar fora não fecha nada. Impedir o\n// padrão do mousedown é o que mantém o foco no input, dentro e fora da shadow root.\n//\n// Via listener nativo, e não por prop: o `useButton` do react-aria só repassa ao <button>\n// os handlers que ele mesmo declara, e descarta um `onMouseDown` vindo de fora.\nfunction useKeepFocusOnInput(triggerRef: React.RefObject<HTMLButtonElement | null>): void {\n useEffect(() => {\n const trigger: HTMLButtonElement | null = triggerRef.current;\n if (!trigger) return undefined;\n\n function preventFocus(event: MouseEvent): void {\n event.preventDefault();\n }\n\n trigger.addEventListener(\"mousedown\", preventFocus);\n return () => trigger.removeEventListener(\"mousedown\", preventFocus);\n }, [triggerRef]);\n}\n\nexport function ComboBoxField<T extends object>({\n className,\n label,\n description,\n errorMessage,\n placeholder,\n children,\n items,\n ...props\n}: ComboBoxFieldProps<T>) {\n const classNames = clsx(className, \"combobox-container\");\n const triggerRef = useRef<HTMLButtonElement | null>(null);\n useKeepFocusOnInput(triggerRef);\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <ComboBox className={classNames} {...props}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACGroup className=\"combobox\">\n <Input\n className=\"combobox-input\"\n placeholder={placeholder}\n onPointerDown={(event) => {\n if (activeElementOf(event.currentTarget) === event.currentTarget) {\n triggerRef.current?.click();\n }\n }}\n />\n <RACButton ref={triggerRef} className=\"combobox-trigger\">\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n </RACGroup>\n <RACPopover\n className=\"combobox-popover\"\n UNSTABLE_portalContainer={portalContainer}\n >\n <ListBox items={items}>{children}</ListBox>\n </RACPopover>\n {description && <Description>{description}</Description>}\n <FieldError>{errorMessage}</FieldError>\n </Field>\n </ComboBox>\n );\n}\n\nexport type ComboBoxProps<T extends object> = RACComboBoxProps<T>;\nexport function ComboBox<T extends object>({ ...props }: ComboBoxProps<T>) {\n return <RACComboBox<T> menuTrigger=\"focus\" {...props} />;\n}\n\nexport type ComboBoxItemProps = ListBoxItemProps;\nexport function ComboBoxItem({ children, className, ...props }: ComboBoxItemProps) {\n const classNames = clsx(className, \"combobox-item\");\n const textValue = typeof children === \"string\" ? children : \"\";\n return (\n <ListBoxItem textValue={textValue} className={classNames} {...props}>\n <>\n <IconCheck className=\"combobox-item-check\" />\n {children}\n </>\n </ListBoxItem>\n );\n}\n"],"names":["activeElementOf","element","root","useKeepFocusOnInput","triggerRef","useEffect","trigger","preventFocus","event","ComboBoxField","className","label","description","errorMessage","placeholder","children","items","props","classNames","clsx","useRef","portalContainer","useOverlayPortalContainer","ComboBox","Field","jsx","Label","jsxs","RACGroup","Input","_a","RACButton","IconChevronDown","RACPopover","ListBox","Description","FieldError","RACComboBox","ComboBoxItem","textValue","ListBoxItem","Fragment","IconCheck"],"mappings":"2eAiCA,SAASA,EAAgBC,EAAkC,CACzD,MAAMC,EAAOD,EAAQ,YAAA,EACrB,OAAOC,aAAgB,YAAcA,aAAgB,SACjDA,EAAK,cACL,IACN,CAUA,SAASC,EAAoBC,EAA6D,CACxFC,EAAAA,UAAU,IAAM,CACd,MAAMC,EAAoCF,EAAW,QACrD,GAAI,CAACE,EAAS,OAEd,SAASC,EAAaC,EAAyB,CAC7CA,EAAM,eAAA,CACR,CAEA,OAAAF,EAAQ,iBAAiB,YAAaC,CAAY,EAC3C,IAAMD,EAAQ,oBAAoB,YAAaC,CAAY,CACpE,EAAG,CAACH,CAAU,CAAC,CACjB,CAEO,SAASK,EAAgC,CAC9C,UAAAC,EACA,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,YAAAC,EACA,SAAAC,EACA,MAAAC,EACA,GAAGC,CACL,EAA0B,CACxB,MAAMC,EAAaC,EAAAA,KAAKT,EAAW,oBAAoB,EACjDN,EAAagB,EAAAA,OAAiC,IAAI,EACxDjB,EAAoBC,CAAU,EAG9B,MAAMiB,EAAkBC,EAAAA,0BAAA,EACxB,aACGC,EAAA,CAAS,UAAWL,EAAa,GAAGD,EACnC,gBAACO,EAAAA,MAAA,CACE,SAAA,CAAAb,GAASc,EAAAA,IAACC,EAAAA,OAAO,SAAAf,CAAA,CAAM,EACxBgB,EAAAA,KAACC,EAAAA,MAAA,CAAS,UAAU,WAClB,SAAA,CAAAH,EAAAA,IAACI,EAAAA,MAAA,CACC,UAAU,iBACV,YAAAf,EACA,cAAgBN,GAAU,OACpBR,EAAgBQ,EAAM,aAAa,IAAMA,EAAM,iBACjDsB,EAAA1B,EAAW,UAAX,MAAA0B,EAAoB,QAExB,CAAA,CAAA,EAEFL,EAAAA,IAACM,EAAAA,OAAA,CAAU,IAAK3B,EAAY,UAAU,mBACpC,SAAAqB,EAAAA,IAACO,EAAAA,gBAAA,CAAgB,cAAY,MAAA,CAAO,CAAA,CACtC,CAAA,EACF,EACAP,EAAAA,IAACQ,EAAAA,QAAA,CACC,UAAU,mBACV,yBAA0BZ,EAE1B,SAAAI,EAAAA,IAACS,EAAAA,QAAA,CAAQ,MAAAlB,EAAe,SAAAD,CAAA,CAAS,CAAA,CAAA,EAElCH,GAAea,EAAAA,IAACU,EAAAA,YAAA,CAAa,SAAAvB,CAAA,CAAY,EAC1Ca,EAAAA,IAACW,EAAAA,YAAY,SAAAvB,CAAA,CAAa,CAAA,CAAA,CAC5B,CAAA,CACF,CAEJ,CAGO,SAASU,EAA2B,CAAE,GAAGN,GAA2B,CACzE,OAAOQ,EAAAA,IAACY,EAAAA,SAAA,CAAe,YAAY,QAAS,GAAGpB,EAAO,CACxD,CAGO,SAASqB,EAAa,CAAE,SAAAvB,EAAU,UAAAL,EAAW,GAAGO,GAA4B,CACjF,MAAMC,EAAaC,EAAAA,KAAKT,EAAW,eAAe,EAC5C6B,EAAY,OAAOxB,GAAa,SAAWA,EAAW,GAC5D,aACGyB,EAAAA,YAAA,CAAY,UAAAD,EAAsB,UAAWrB,EAAa,GAAGD,EAC5D,SAAAU,EAAAA,KAAAc,EAAAA,SAAA,CACE,SAAA,CAAAhB,EAAAA,IAACiB,EAAAA,UAAA,CAAU,UAAU,qBAAA,CAAsB,EAC1C3B,CAAA,CAAA,CACH,CAAA,CACF,CAEJ"}
@@ -1,59 +1,82 @@
1
- import { jsx as o, jsxs as m, Fragment as d } from "react/jsx-runtime";
2
- import { clsx as a } from "../../../vendor/clsx/dist/clsx.js";
3
- import { useRef as h } from "react";
4
- import { Group as C, Button as g, Popover as B, ComboBox as N } from "react-aria-components";
1
+ import { jsx as r, jsxs as i, Fragment as d } from "react/jsx-runtime";
2
+ import { clsx as u } from "../../../vendor/clsx/dist/clsx.js";
3
+ import { useRef as h, useEffect as g } from "react";
4
+ import { Group as v, Button as N, Popover as C, ComboBox as B } from "react-aria-components";
5
5
  /* empty css */
6
- import { useOverlayPortalContainer as I } from "../../hooks/useOverlayPortal.js";
7
- import { Field as v, Label as F, Description as L, FieldError as k } from "../Fieldset/Fieldset.js";
6
+ import { useOverlayPortalContainer as E } from "../../hooks/useOverlayPortal.js";
7
+ import { Field as F, Label as I, Description as L, FieldError as w } from "../Fieldset/Fieldset.js";
8
8
  import { Input as D } from "../Input/Input.js";
9
- import { IconChevronDown as E } from "../../icons/IconChevronDown.js";
10
- import { ListBox as P, ListBoxItem as T } from "../ListBox/ListBox.js";
11
- import { IconCheck as j } from "../../icons/IconCheck.js";
12
- function z({
13
- className: r,
9
+ import { IconChevronDown as T } from "../../icons/IconChevronDown.js";
10
+ import { ListBox as k, ListBoxItem as O } from "../ListBox/ListBox.js";
11
+ import { IconCheck as P } from "../../icons/IconCheck.js";
12
+ function R(o) {
13
+ const e = o.getRootNode();
14
+ return e instanceof ShadowRoot || e instanceof Document ? e.activeElement : null;
15
+ }
16
+ function j(o) {
17
+ g(() => {
18
+ const e = o.current;
19
+ if (!e) return;
20
+ function t(n) {
21
+ n.preventDefault();
22
+ }
23
+ return e.addEventListener("mousedown", t), () => e.removeEventListener("mousedown", t);
24
+ }, [o]);
25
+ }
26
+ function J({
27
+ className: o,
14
28
  label: e,
15
29
  description: t,
16
30
  errorMessage: n,
17
- placeholder: c,
31
+ placeholder: m,
18
32
  children: l,
19
- items: u,
20
- ...f
33
+ items: f,
34
+ ...p
21
35
  }) {
22
- const p = a(r, "combobox-container"), i = h(null), x = I();
23
- return /* @__PURE__ */ o(w, { className: p, ...f, children: /* @__PURE__ */ m(v, { children: [
24
- e && /* @__PURE__ */ o(F, { children: e }),
25
- /* @__PURE__ */ m(C, { className: "combobox", children: [
26
- /* @__PURE__ */ o(
36
+ const x = u(o, "combobox-container"), c = h(null);
37
+ j(c);
38
+ const b = E();
39
+ return /* @__PURE__ */ r(y, { className: x, ...p, children: /* @__PURE__ */ i(F, { children: [
40
+ e && /* @__PURE__ */ r(I, { children: e }),
41
+ /* @__PURE__ */ i(v, { className: "combobox", children: [
42
+ /* @__PURE__ */ r(
27
43
  D,
28
44
  {
29
45
  className: "combobox-input",
30
- placeholder: c,
31
- onPointerDown: (b) => {
32
- var s;
33
- document.activeElement === b.currentTarget && ((s = i.current) == null || s.click());
46
+ placeholder: m,
47
+ onPointerDown: (s) => {
48
+ var a;
49
+ R(s.currentTarget) === s.currentTarget && ((a = c.current) == null || a.click());
34
50
  }
35
51
  }
36
52
  ),
37
- /* @__PURE__ */ o(g, { ref: i, className: "combobox-trigger", children: /* @__PURE__ */ o(E, { "aria-hidden": "true" }) })
53
+ /* @__PURE__ */ r(N, { ref: c, className: "combobox-trigger", children: /* @__PURE__ */ r(T, { "aria-hidden": "true" }) })
38
54
  ] }),
39
- /* @__PURE__ */ o(B, { UNSTABLE_portalContainer: x, children: /* @__PURE__ */ o(P, { items: u, children: l }) }),
40
- t && /* @__PURE__ */ o(L, { children: t }),
41
- /* @__PURE__ */ o(k, { children: n })
55
+ /* @__PURE__ */ r(
56
+ C,
57
+ {
58
+ className: "combobox-popover",
59
+ UNSTABLE_portalContainer: b,
60
+ children: /* @__PURE__ */ r(k, { items: f, children: l })
61
+ }
62
+ ),
63
+ t && /* @__PURE__ */ r(L, { children: t }),
64
+ /* @__PURE__ */ r(w, { children: n })
42
65
  ] }) });
43
66
  }
44
- function w({ ...r }) {
45
- return /* @__PURE__ */ o(N, { menuTrigger: "focus", ...r });
67
+ function y({ ...o }) {
68
+ return /* @__PURE__ */ r(B, { menuTrigger: "focus", ...o });
46
69
  }
47
- function H({ children: r, className: e, ...t }) {
48
- const n = a(e, "combobox-item");
49
- return /* @__PURE__ */ o(T, { textValue: typeof r == "string" ? r : "", className: n, ...t, children: /* @__PURE__ */ m(d, { children: [
50
- /* @__PURE__ */ o(j, { className: "combobox-item-check" }),
51
- r
70
+ function M({ children: o, className: e, ...t }) {
71
+ const n = u(e, "combobox-item");
72
+ return /* @__PURE__ */ r(O, { textValue: typeof o == "string" ? o : "", className: n, ...t, children: /* @__PURE__ */ i(d, { children: [
73
+ /* @__PURE__ */ r(P, { className: "combobox-item-check" }),
74
+ o
52
75
  ] }) });
53
76
  }
54
77
  export {
55
- w as ComboBox,
56
- z as ComboBoxField,
57
- H as ComboBoxItem
78
+ y as ComboBox,
79
+ J as ComboBoxField,
80
+ M as ComboBoxItem
58
81
  };
59
82
  //# sourceMappingURL=ComboBox.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.js","sources":["../../../../../src/ui/primitives/ComboBox/ComboBox.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconCheck, IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Input,\n ListBox,\n ListBoxItem,\n Label,\n SharedFieldProps,\n type ListBoxItemProps,\n} from \"primitives\";\nimport { useRef } from \"react\";\nimport {\n Button as RACButton,\n ComboBox as RACComboBox,\n Group as RACGroup,\n Popover as RACPopover,\n type ComboBoxProps as RACComboBoxProps,\n} from \"react-aria-components\";\nimport \"./combobox.css\";\n\nexport interface ComboBoxFieldProps<T extends object>\n extends Omit<ComboBoxProps<T>, \"children\">,\n SharedFieldProps {\n items?: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\nexport function ComboBoxField<T extends object>({\n className,\n label,\n description,\n errorMessage,\n placeholder,\n children,\n items,\n ...props\n}: ComboBoxFieldProps<T>) {\n const classNames = clsx(className, \"combobox-container\");\n const triggerRef = useRef<HTMLButtonElement | null>(null);\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <ComboBox className={classNames} {...props}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACGroup className=\"combobox\">\n <Input\n className=\"combobox-input\"\n placeholder={placeholder}\n onPointerDown={(event) => {\n if (document.activeElement === event.currentTarget) {\n triggerRef.current?.click();\n }\n }}\n />\n <RACButton ref={triggerRef} className=\"combobox-trigger\">\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n </RACGroup>\n <RACPopover UNSTABLE_portalContainer={portalContainer}>\n <ListBox items={items}>{children}</ListBox>\n </RACPopover>\n {description && <Description>{description}</Description>}\n <FieldError>{errorMessage}</FieldError>\n </Field>\n </ComboBox>\n );\n}\n\nexport type ComboBoxProps<T extends object> = RACComboBoxProps<T>;\nexport function ComboBox<T extends object>({ ...props }: ComboBoxProps<T>) {\n return <RACComboBox<T> menuTrigger=\"focus\" {...props} />;\n}\n\nexport type ComboBoxItemProps = ListBoxItemProps;\nexport function ComboBoxItem({ children, className, ...props }: ComboBoxItemProps) {\n const classNames = clsx(className, \"combobox-item\");\n const textValue = typeof children === \"string\" ? children : \"\";\n return (\n <ListBoxItem textValue={textValue} className={classNames} {...props}>\n <>\n <IconCheck className=\"combobox-item-check\" />\n {children}\n </>\n </ListBoxItem>\n );\n}\n"],"names":["ComboBoxField","className","label","description","errorMessage","placeholder","children","items","props","classNames","clsx","triggerRef","useRef","portalContainer","useOverlayPortalContainer","ComboBox","Field","jsx","Label","jsxs","RACGroup","Input","event","_a","RACButton","IconChevronDown","RACPopover","ListBox","Description","FieldError","RACComboBox","ComboBoxItem","ListBoxItem","Fragment","IconCheck"],"mappings":";;;;;;;;;;;AA8BO,SAASA,EAAgC;AAAA,EAC9C,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,GAA0B;AACxB,QAAMC,IAAaC,EAAKT,GAAW,oBAAoB,GACjDU,IAAaC,EAAiC,IAAI,GAGlDC,IAAkBC,EAAA;AACxB,2BACGC,GAAA,EAAS,WAAWN,GAAa,GAAGD,GACnC,4BAACQ,GAAA,EACE,UAAA;AAAA,IAAAd,KAAS,gBAAAe,EAACC,KAAO,UAAAhB,EAAA,CAAM;AAAA,IACxB,gBAAAiB,EAACC,GAAA,EAAS,WAAU,YAClB,UAAA;AAAA,MAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,aAAAhB;AAAA,UACA,eAAe,CAACiB,MAAU;;AACxB,YAAI,SAAS,kBAAkBA,EAAM,mBACnCC,IAAAZ,EAAW,YAAX,QAAAY,EAAoB;AAAA,UAExB;AAAA,QAAA;AAAA,MAAA;AAAA,MAEF,gBAAAN,EAACO,GAAA,EAAU,KAAKb,GAAY,WAAU,oBACpC,UAAA,gBAAAM,EAACQ,GAAA,EAAgB,eAAY,OAAA,CAAO,EAAA,CACtC;AAAA,IAAA,GACF;AAAA,IACA,gBAAAR,EAACS,KAAW,0BAA0Bb,GACpC,4BAACc,GAAA,EAAQ,OAAApB,GAAe,UAAAD,GAAS,EAAA,CACnC;AAAA,IACCH,KAAe,gBAAAc,EAACW,GAAA,EAAa,UAAAzB,EAAA,CAAY;AAAA,IAC1C,gBAAAc,EAACY,KAAY,UAAAzB,EAAA,CAAa;AAAA,EAAA,EAAA,CAC5B,EAAA,CACF;AAEJ;AAGO,SAASW,EAA2B,EAAE,GAAGP,KAA2B;AACzE,SAAO,gBAAAS,EAACa,GAAA,EAAe,aAAY,SAAS,GAAGtB,GAAO;AACxD;AAGO,SAASuB,EAAa,EAAE,UAAAzB,GAAU,WAAAL,GAAW,GAAGO,KAA4B;AACjF,QAAMC,IAAaC,EAAKT,GAAW,eAAe;AAElD,2BACG+B,GAAA,EAAY,WAFG,OAAO1B,KAAa,WAAWA,IAAW,IAEvB,WAAWG,GAAa,GAAGD,GAC5D,UAAA,gBAAAW,EAAAc,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAhB,EAACiB,GAAA,EAAU,WAAU,sBAAA,CAAsB;AAAA,IAC1C5B;AAAA,EAAA,EAAA,CACH,EAAA,CACF;AAEJ;"}
1
+ {"version":3,"file":"ComboBox.js","sources":["../../../../../src/ui/primitives/ComboBox/ComboBox.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconCheck, IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Input,\n ListBox,\n ListBoxItem,\n Label,\n SharedFieldProps,\n type ListBoxItemProps,\n} from \"primitives\";\nimport { useEffect, useRef } from \"react\";\nimport {\n Button as RACButton,\n ComboBox as RACComboBox,\n Group as RACGroup,\n Popover as RACPopover,\n type ComboBoxProps as RACComboBoxProps,\n} from \"react-aria-components\";\nimport \"./combobox.css\";\n\nexport interface ComboBoxFieldProps<T extends object>\n extends Omit<ComboBoxProps<T>, \"children\">,\n SharedFieldProps {\n items?: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\n\n// `document.activeElement` para no host da shadow root: quem sabe o que está focado\n// dentro dela é a própria raiz. Ver ui/hooks/useOverlayPortal.\nfunction activeElementOf(element: Element): Element | null {\n const root = element.getRootNode();\n return root instanceof ShadowRoot || root instanceof Document\n ? root.activeElement\n : null;\n}\n\n// O react-aria pede `preventFocusOnPress` para o botão do dropdown, mas a implementação\n// dele guarda `document.activeElement` — que dentro de uma shadow root devolve o host, e\n// não o input. O botão fica com o foco de verdade, o input nunca mais recebe blur, e a\n// partir daí só escolher um item fecha o dropdown: clicar fora não fecha nada. Impedir o\n// padrão do mousedown é o que mantém o foco no input, dentro e fora da shadow root.\n//\n// Via listener nativo, e não por prop: o `useButton` do react-aria só repassa ao <button>\n// os handlers que ele mesmo declara, e descarta um `onMouseDown` vindo de fora.\nfunction useKeepFocusOnInput(triggerRef: React.RefObject<HTMLButtonElement | null>): void {\n useEffect(() => {\n const trigger: HTMLButtonElement | null = triggerRef.current;\n if (!trigger) return undefined;\n\n function preventFocus(event: MouseEvent): void {\n event.preventDefault();\n }\n\n trigger.addEventListener(\"mousedown\", preventFocus);\n return () => trigger.removeEventListener(\"mousedown\", preventFocus);\n }, [triggerRef]);\n}\n\nexport function ComboBoxField<T extends object>({\n className,\n label,\n description,\n errorMessage,\n placeholder,\n children,\n items,\n ...props\n}: ComboBoxFieldProps<T>) {\n const classNames = clsx(className, \"combobox-container\");\n const triggerRef = useRef<HTMLButtonElement | null>(null);\n useKeepFocusOnInput(triggerRef);\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <ComboBox className={classNames} {...props}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACGroup className=\"combobox\">\n <Input\n className=\"combobox-input\"\n placeholder={placeholder}\n onPointerDown={(event) => {\n if (activeElementOf(event.currentTarget) === event.currentTarget) {\n triggerRef.current?.click();\n }\n }}\n />\n <RACButton ref={triggerRef} className=\"combobox-trigger\">\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n </RACGroup>\n <RACPopover\n className=\"combobox-popover\"\n UNSTABLE_portalContainer={portalContainer}\n >\n <ListBox items={items}>{children}</ListBox>\n </RACPopover>\n {description && <Description>{description}</Description>}\n <FieldError>{errorMessage}</FieldError>\n </Field>\n </ComboBox>\n );\n}\n\nexport type ComboBoxProps<T extends object> = RACComboBoxProps<T>;\nexport function ComboBox<T extends object>({ ...props }: ComboBoxProps<T>) {\n return <RACComboBox<T> menuTrigger=\"focus\" {...props} />;\n}\n\nexport type ComboBoxItemProps = ListBoxItemProps;\nexport function ComboBoxItem({ children, className, ...props }: ComboBoxItemProps) {\n const classNames = clsx(className, \"combobox-item\");\n const textValue = typeof children === \"string\" ? children : \"\";\n return (\n <ListBoxItem textValue={textValue} className={classNames} {...props}>\n <>\n <IconCheck className=\"combobox-item-check\" />\n {children}\n </>\n </ListBoxItem>\n );\n}\n"],"names":["activeElementOf","element","root","useKeepFocusOnInput","triggerRef","useEffect","trigger","preventFocus","event","ComboBoxField","className","label","description","errorMessage","placeholder","children","items","props","classNames","clsx","useRef","portalContainer","useOverlayPortalContainer","ComboBox","Field","jsx","Label","jsxs","RACGroup","Input","_a","RACButton","IconChevronDown","RACPopover","ListBox","Description","FieldError","RACComboBox","ComboBoxItem","ListBoxItem","Fragment","IconCheck"],"mappings":";;;;;;;;;;;AAiCA,SAASA,EAAgBC,GAAkC;AACzD,QAAMC,IAAOD,EAAQ,YAAA;AACrB,SAAOC,aAAgB,cAAcA,aAAgB,WACjDA,EAAK,gBACL;AACN;AAUA,SAASC,EAAoBC,GAA6D;AACxF,EAAAC,EAAU,MAAM;AACd,UAAMC,IAAoCF,EAAW;AACrD,QAAI,CAACE,EAAS;AAEd,aAASC,EAAaC,GAAyB;AAC7C,MAAAA,EAAM,eAAA;AAAA,IACR;AAEA,WAAAF,EAAQ,iBAAiB,aAAaC,CAAY,GAC3C,MAAMD,EAAQ,oBAAoB,aAAaC,CAAY;AAAA,EACpE,GAAG,CAACH,CAAU,CAAC;AACjB;AAEO,SAASK,EAAgC;AAAA,EAC9C,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,GAA0B;AACxB,QAAMC,IAAaC,EAAKT,GAAW,oBAAoB,GACjDN,IAAagB,EAAiC,IAAI;AACxD,EAAAjB,EAAoBC,CAAU;AAG9B,QAAMiB,IAAkBC,EAAA;AACxB,2BACGC,GAAA,EAAS,WAAWL,GAAa,GAAGD,GACnC,4BAACO,GAAA,EACE,UAAA;AAAA,IAAAb,KAAS,gBAAAc,EAACC,KAAO,UAAAf,EAAA,CAAM;AAAA,IACxB,gBAAAgB,EAACC,GAAA,EAAS,WAAU,YAClB,UAAA;AAAA,MAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,aAAAf;AAAA,UACA,eAAe,CAACN,MAAU;;AACxB,YAAIR,EAAgBQ,EAAM,aAAa,MAAMA,EAAM,mBACjDsB,IAAA1B,EAAW,YAAX,QAAA0B,EAAoB;AAAA,UAExB;AAAA,QAAA;AAAA,MAAA;AAAA,MAEF,gBAAAL,EAACM,GAAA,EAAU,KAAK3B,GAAY,WAAU,oBACpC,UAAA,gBAAAqB,EAACO,GAAA,EAAgB,eAAY,OAAA,CAAO,EAAA,CACtC;AAAA,IAAA,GACF;AAAA,IACA,gBAAAP;AAAA,MAACQ;AAAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,0BAA0BZ;AAAA,QAE1B,UAAA,gBAAAI,EAACS,GAAA,EAAQ,OAAAlB,GAAe,UAAAD,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,IAElCH,KAAe,gBAAAa,EAACU,GAAA,EAAa,UAAAvB,EAAA,CAAY;AAAA,IAC1C,gBAAAa,EAACW,KAAY,UAAAvB,EAAA,CAAa;AAAA,EAAA,EAAA,CAC5B,EAAA,CACF;AAEJ;AAGO,SAASU,EAA2B,EAAE,GAAGN,KAA2B;AACzE,SAAO,gBAAAQ,EAACY,GAAA,EAAe,aAAY,SAAS,GAAGpB,GAAO;AACxD;AAGO,SAASqB,EAAa,EAAE,UAAAvB,GAAU,WAAAL,GAAW,GAAGO,KAA4B;AACjF,QAAMC,IAAaC,EAAKT,GAAW,eAAe;AAElD,2BACG6B,GAAA,EAAY,WAFG,OAAOxB,KAAa,WAAWA,IAAW,IAEvB,WAAWG,GAAa,GAAGD,GAC5D,UAAA,gBAAAU,EAAAa,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAf,EAACgB,GAAA,EAAU,WAAU,sBAAA,CAAsB;AAAA,IAC1C1B;AAAA,EAAA,EAAA,CACH,EAAA,CACF;AAEJ;"}