From 9a43857f6b2f5f90039e82af9aeacf7f5ed1070b Mon Sep 17 00:00:00 2001 From: github-actions-bot Date: Mon, 15 Jan 2024 16:23:18 +0000 Subject: [PATCH] Updates --- iframe.html | 4 ++-- ...ame.bundle.js => main.c0d1d466.iframe.bundle.js | 14 +++++++++----- main.c0d1d466.iframe.bundle.js.map | 1 + main.cd7a79f3.iframe.bundle.js.map | 1 - project.json | 2 +- ...le.js => runtime~main.a7e14342.iframe.bundle.js | 2 +- ...electableRows-stories.e67b855c.iframe.bundle.js | 6 +++--- ...tableRows-stories.e67b855c.iframe.bundle.js.map | 2 +- 8 files changed, 18 insertions(+), 14 deletions(-) rename main.cd7a79f3.iframe.bundle.js => main.c0d1d466.iframe.bundle.js (99%) create mode 100644 main.c0d1d466.iframe.bundle.js.map delete mode 100644 main.cd7a79f3.iframe.bundle.js.map rename runtime~main.8171fbee.iframe.bundle.js => runtime~main.a7e14342.iframe.bundle.js (99%) rename tables-TableWithSelectableRows-stories.0d7cda85.iframe.bundle.js => tables-TableWithSelectableRows-stories.e67b855c.iframe.bundle.js (89%) rename tables-TableWithSelectableRows-stories.0d7cda85.iframe.bundle.js.map => tables-TableWithSelectableRows-stories.e67b855c.iframe.bundle.js.map (96%) diff --git a/iframe.html b/iframe.html index 7f27135de..c1ae82043 100644 --- a/iframe.html +++ b/iframe.html @@ -348,8 +348,8 @@ window['DOCS_OPTIONS'] = {"defaultName":"Docs","autodocs":true}; \ No newline at end of file + import './main.c0d1d466.iframe.bundle.js'; \ No newline at end of file diff --git a/main.cd7a79f3.iframe.bundle.js b/main.c0d1d466.iframe.bundle.js similarity index 99% rename from main.cd7a79f3.iframe.bundle.js rename to main.c0d1d466.iframe.bundle.js index 6e9c5fa7a..eba4b90b5 100644 --- a/main.cd7a79f3.iframe.bundle.js +++ b/main.c0d1d466.iframe.bundle.js @@ -1832,17 +1832,21 @@ border-top: 1px solid ${p=>p.theme.color.lightGray}; border-bottom: 1px solid ${p=>p.theme.color.lightGray}; border-right: none; - padding: 2px 10px; + padding: 2px 16px; `,TableWithSelectableRows={BodyTr:(0,styled_components_browser_esm.ZP)(SimpleTable.BodyTr)` + td:first-child { + border-left: ${p=>p.$isHighlighted?`2px solid ${p.theme.color.blueGray}`:`1px solid ${p.theme.color.lightGray}`}; + } td:last-child { - border-right: 1px solid ${p=>p.theme.color.lightGray}; + border-right: ${p=>p.$isHighlighted?`2px solid ${p.theme.color.blueGray}`:`1px solid ${p.theme.color.lightGray}`}; overflow: visible; } `,Head:TableWithSelectableRows_Head,RowCheckbox:RowCheckbox_RowCheckbox,SortContainer:TableWithSelectableRows_SortContainer,Table:TableWithSelectableRows_Table,Td:(0,styled_components_browser_esm.ZP)(SimpleTable.Td)` background-color: ${p=>p.theme.color.cultured}; - border-top: 1px solid ${p=>p.theme.color.lightGray}; + border-top: ${p=>p.$isHighlighted?`2px solid ${p.theme.color.blueGray}`:`1px solid ${p.theme.color.lightGray}`}; + border-bottom: ${p=>p.$isHighlighted?`2px solid ${p.theme.color.blueGray}`:`1px solid ${p.theme.color.lightGray}`}; border-right: none; - padding: 4px 10px; + padding: 4px 16px; border-right: ${p=>p.$hasRightBorder?`1px solid ${p.theme.color.lightGray}`:""}; `,Th:TableWithSelectableRows_Th};try{RowCheckbox.displayName="RowCheckbox",RowCheckbox.__docgenInfo={description:"",displayName:"RowCheckbox",props:{className:{defaultValue:{value:""},description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:{value:"false"},description:"",name:"disabled",required:!1,type:{name:"boolean"}},isChecked:{defaultValue:{value:"false"},description:"",name:"isChecked",required:!1,type:{name:"boolean"}},isIndeterminate:{defaultValue:{value:"false"},description:"",name:"isIndeterminate",required:!1,type:{name:"boolean"}},onChange:{defaultValue:{value:"() => undefined"},description:"",name:"onChange",required:!1,type:{name:"((event: ChangeEvent) => void) & FormEventHandler"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/tables/TableWithSelectableRows/index.tsx#RowCheckbox"]={docgenInfo:RowCheckbox.__docgenInfo,name:"RowCheckbox",path:"src/tables/TableWithSelectableRows/index.tsx#RowCheckbox"})}catch(__react_docgen_typescript_loader_error){}var esm_exports=__webpack_require__("./node_modules/@sentry/core/esm/exports.js");function logSoftError({context={},isSideWindowError=!1,message,originalError,userMessage}){console.group(`Soft Error: ${message}`),console.debug("context",context),console.debug("originalError",originalError),console.groupEnd();const extra=originalError?{...context,originalError}:{...context};(0,esm_exports.uT)(message,{extra,level:"warning"}),userMessage&&window.document.dispatchEvent(new NotificationEvent(userMessage,"error",isSideWindowError))}},"./src/utils/stopMouseEventPropagation.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";function stopMouseEventPropagation(event){event.stopPropagation()}__webpack_require__.d(__webpack_exports__,{k:()=>stopMouseEventPropagation})},"./node_modules/@storybook/builder-webpack5/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!./src/assets/stylesheets/rsuite-override.css":(module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{Z:()=>__WEBPACK_DEFAULT_EXPORT__});var _node_modules_storybook_builder_webpack5_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@storybook/builder-webpack5/node_modules/css-loader/dist/runtime/sourceMaps.js"),_node_modules_storybook_builder_webpack5_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_node_modules_storybook_builder_webpack5_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__),_node_modules_storybook_builder_webpack5_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@storybook/builder-webpack5/node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_node_modules_storybook_builder_webpack5_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_node_modules_storybook_builder_webpack5_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,"/* variables */\n:root {\n /* colors */\n --gunMetal: #282f3e;\n --charcoal: #3b4559;\n --slateGray: #707785;\n --lightGray: #cccfd6;\n --gainsboro: #e5e5eb;\n --cultured: #f7f7fa;\n --white: #ffffff;\n\n --blue-yonder: #567a9e;\n --blue-yonder-25: #d4dde7;\n --blue-gray: #5697d2;\n --blue-gray-25: #d4e5f4;\n\n --mediumSeaGreen: #29b361;\n --golden-poppy: #fac11a;\n --maximum-red: #e1000f;\n\n --cadet-grey: #8e9a9f;\n --grullo: #b89b8c;\n --copper-red: #cf6a4e;\n --chinese-red: #a13112;\n\n --powder-blue: #9ed7d9;\n --wheat: #edd6a4;\n --opal: #a5bcc0;\n\n /* text */\n --rs-text-primary: var(--gunMetal);\n\n /* btn vars */\n --rs-btn-primary-text: var(--white);\n --rs-btn-primary-bg: var(--charcoal);\n --rs-btn-default-bg: transparent;\n --rs-btn-primary-hover-bg: var(--blue-yonder);\n --rs-btn-link-text: var(--slateGray);\n --rs-btn-link-hover-text: var(--blue-yonder);\n --rs-btn-link-active-text: var(--blue-gray);\n --rs-btn-ghost-text: var(--charcoal);\n --rs-btn-ghost-border: var(--charcoal);\n --rs-btn-ghost-hover-border: var(--blue-yonder);\n --rs-btn-ghost-hover-text: var(--blue-yonder);\n --rs-iconbtn-addon: transparent;\n\n --rs-iconbtn-primary-addon: var(--charcoal);\n --rs-btn-default-hover-bg: var(--blue-yonder);\n --rs-iconbtn-activated-addon: var(--blue-yonder);\n --rs-btn-default-hover-text: var(--white);\n --rs-iconbtn-primary-activated-addon: var(--blue-yonder);\n --rs-btn-primary-active-bg: var(--blue-gray);\n --rs-iconbtn-primary-pressed-addon: var(--blue-gray);\n --rs-btn-ghost-active-text: var(--blue-gray);\n --rs-btn-subtle-text: var(--gunMetal);\n --rs-btn-subtle-hover-bg: transparent;\n --rs-btn-subtle-hover-text: var(--blue-yonder);\n --rs-btn-subtle-active-bg: transparent;\n --rs-btn-subtle-active-text: var(--blue-gray);\n\n /* Checkbox vars */\n --rs-checkbox-disabled-bg: var(--white);\n\n --rs-menuitem-active-text: var(--blue-gray);\n --rs-listbox-option-hover-bg: var(--blue-yonder-25);\n --rs-listbox-option-selected-bg: var(--blue-gray-25);\n /* tags */\n --rs-tag-bg: var(--gainsboro);\n\n /* toggle */\n --rs-toggle-checked-bg: var(--charcoal);\n --rs-toggle-checked-hover-bg: var(--gunMetal);\n}\n\nlabel {\n color: var(--slateGray);\n font-size: 13px;\n line-height: 18px;\n}\n\n.rs-picker-toggle-active,\n.rs-picker.rs-picker-focused {\n box-shadow: none;\n border: 1px solid var(--blue-gray) !important;\n border-radius: 0;\n}\n\n/* button */\n.rs-ripple-pond {\n height: 30px;\n}\n\n.rs-btn {\n line-height: 18px;\n padding-top: 6px;\n padding-bottom: 6px;\n border-radius: 0;\n}\n\n.rs-btn-sm {\n padding-top: 3px;\n padding-bottom: 3px;\n font-size: 15px;\n}\n\n.rs-btn-md {\n height: 30px;\n}\n\n.rs-btn-icon-with-text.rs-btn-md.rs-btn-icon-placement-left,\n.rs-btn-icon-with-text.rs-btn.rs-btn-icon-placement-left {\n padding-left: 32px;\n padding-top: 6px;\n padding-bottom: 6px;\n}\n\n.rs-btn-icon-with-text.rs-btn-sm.rs-btn-icon-placement-left {\n padding-top: 3px;\n padding-bottom: 3px;\n}\n\n.rs-btn-ghost:hover {\n background-color: transparent;\n}\n\n.rs-btn-ghost.rs-btn-active,\n.rs-btn-ghost:active {\n background-color: var(--blue-gray-25);\n border-color: var(--blue-gray);\n}\n\n.rs-btn-ghost.rs-btn-icon-with-text:hover > .rs-icon {\n background-color: transparent;\n}\n\n.rs-btn-icon-with-text:focus > .rs-icon,\n.rs-btn-icon-with-text:hover > .rs-icon {\n background-color: transparent;\n}\n\n.rs-btn-ghost.rs-btn,\n.rs-btn-ghost.rs-btn-md,\n.rs-btn-icon-with-text.rs-btn-md.rs-btn-icon-placement-left.rs-btn-ghost,\n.rs-btn-icon-with-text.rs-btn.rs-btn-icon-placement-left.rs-btn-ghost {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n\n.rs-btn-ghost.rs-btn-sm,\n.rs-btn-icon-with-text.rs-btn-sm.rs-btn-icon-placement-left.rs-btn-ghost {\n padding-top: 2px;\n padding-bottom: 2px;\n}\n\n.rs-btn-icon.rs-btn,\n.rs-btn-icon.rs-btn-md {\n padding: 5px;\n}\n\n.rs-btn-subtle.rs-btn-icon.rs-btn-md {\n padding: 0;\n}\n\n.rs-btn-icon.rs-btn-sm {\n padding: 0px;\n}\n\n.rs-btn-icon.rs-btn-lg {\n padding: 7px;\n height: 40px;\n}\n\n.rs-btn-icon.rs-btn-ghost {\n padding: 4px;\n}\n\n.rs-btn-icon.rs-btn-lg.rs-btn-ghost {\n padding: 6px;\n}\n\n.rs-btn-icon-with-text.rs-btn-sm {\n padding-top: 5px;\n padding-bottom: 4px;\n line-height: 15px;\n font-size: 11px;\n}\n\n.rs-btn-icon.rs-btn > .rs-icon,\n.rs-btn-icon.rs-btn-md > .rs-icon {\n width: 20px;\n height: 20px;\n}\n\n.rs-btn-icon.rs-btn-lg > .rs-icon {\n width: 26px;\n height: 26px;\n}\n\n.rs-btn-icon.rs-btn-sm > .rs-icon {\n width: 14px;\n height: 14px;\n font-size: 14px;\n}\n\n.rs-btn-icon-with-text.rs-btn {\n line-height: 18px;\n}\n\n.rs-btn-icon-with-text.rs-btn > .rs-icon {\n width: 30px;\n height: 30px;\n padding: 5px;\n}\n\n.rs-btn-icon-with-text.rs-btn-sm > .rs-icon {\n width: 24px;\n height: 24px;\n padding: 4px;\n}\n\n.rs-btn-link,\n.rs-btn-link.rs-btn-md {\n font-size: 13px;\n text-decoration: underline;\n}\n\n.rs-btn-link.rs-btn-disabled,\n.rs-btn-link:disabled {\n text-decoration: underline;\n}\n\n.rs-btn-link.rs-btn-sm {\n font-size: 11px;\n}\n\n/* checkbox */\n.rs-checkbox-wrapper {\n top: 8px !important;\n}\n\n.rs-checkbox-checker {\n padding-bottom: 0;\n padding-left: 36px;\n}\n\n.rs-checkbox label {\n font-weight: 500;\n}\n\n.rs-checkbox-checker > label {\n font-size: 13px;\n color: var(--gunMetal);\n}\n\n.rs-checkbox-wrapper .rs-checkbox-inner::before {\n border: 2px solid var(--lightGray);\n background: var(--gainsboro) 0% 0% no-repeat padding-box;\n border-radius: 0px;\n}\n\n.rs-checkbox-wrapper .rs-checkbox-inner::after {\n border-color: var(--lightGray);\n border-width: 0 0 2px;\n -webkit-transform: rotate(0deg) scale(1);\n transform: rotate(0deg) scale(1);\n margin-top: -1px;\n}\n\n.rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::before {\n background-color: var(--charcoal);\n border-color: var(--charcoal);\n}\n\n.rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::after {\n border-color: var(--white);\n border-width: 0 0 2px;\n -webkit-transform: rotate(0deg) scale(1);\n transform: rotate(0deg) scale(1);\n margin-top: 0px;\n}\n\n.rs-checkbox-disabled:not(.rs-checkbox-checked):not(.rs-checkbox-indeterminate)\n .rs-checkbox-wrapper\n .rs-checkbox-inner:before {\n border-color: var(--lightGray);\n}\n\n.rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::before {\n border-color: var(--charcoal);\n background-color: var(--charcoal);\n}\n\nlabel:hover .rs-checkbox-wrapper .rs-checkbox-inner:before {\n border-color: var(--blue-yonder);\n background: var(--blue-yonder-25) 0% 0% no-repeat padding-box;\n}\n\n.rs-checkbox-checked label:hover .rs-checkbox-wrapper .rs-checkbox-inner:before {\n border-color: var(--blue-yonder);\n background: var(--blue-yonder) 0% 0% no-repeat padding-box;\n}\n\n.rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::after {\n border: solid var(--white);\n border-width: 0 2px 2px 0;\n}\n\n.checkbox-hidden > div > label > .rs-checkbox-wrapper {\n opacity: 0 !important;\n margin-left: -40px;\n position: inherit;\n}\n\n/* radio */\n\n.rs-radio-wrapper::before,\n.rs-radio-wrapper .rs-radio-inner::before,\n.rs-radio-wrapper {\n width: 14px;\n height: 14px;\n}\n\n.rs-radio-wrapper .rs-radio-inner::before {\n background: var(--gainsboro);\n border-width: 2px;\n}\n\n.rs-radio-checked .rs-radio-wrapper .rs-radio-inner::before {\n background: var(--gainsboro);\n border-color: var(--charcoal);\n}\n\n/* center of radio button when checked */\n.rs-radio-wrapper .rs-radio-inner::after {\n background: var(--charcoal);\n width: 6px;\n height: 6px;\n margin-top: 4px;\n margin-left: 4px;\n}\n\n.rs-radio.rs-radio-disabled .rs-radio-wrapper .rs-radio-inner::after {\n background: var(--lightGray);\n}\n\n.rs-radio.rs-radio-disabled .rs-radio-inner:before {\n background: var(--white);\n border-color: var(--lightGray);\n}\n\n.rs-radio-checker > label {\n color: var(--charcoal);\n font-weight: 500;\n line-height: 17px;\n}\n\n.rs-radio:hover .rs-radio-inner:before {\n border-color: var(--charcoal);\n}\n\n/* form */\n.rs-form:not(.rs-form-inline) .rs-form-group:not(:last-child) {\n margin-bottom: 32px;\n}\n\n/* Tags */\n\n.rs-tag-default {\n font-weight: 500;\n}\n\n.rs-tag-closable.rs-tag-md {\n padding-right: 32px;\n}\n\n.rs-tag-md {\n font-size: 13px;\n line-height: 18px;\n border-radius: 0px;\n padding-top: 1px;\n padding-bottom: 3px;\n}\n\n/* TagPicker */\n.rs-picker-tag .rs-tag {\n max-width: calc(100% - 30px) !important;\n background-color: var(--white);\n}\n\n.rs-tag-md .rs-tag-icon-close {\n padding: 6px 6px;\n}\n\n.rs-tag-icon-close.rs-btn-close {\n border-left: 1px solid var(--lightGray);\n}\n\n.rs-picker-tag .rs-picker-toggle.rs-btn-sm ~ .rs-picker-tag-wrapper .rs-tag {\n margin-top: 3px;\n}\n\n/* */\n.rs-modal-lg {\n width: 1300px;\n}\n\n.rs-slider-mark {\n font-size: 13px;\n color: var(--slateGray);\n}\n\n.rs-slider {\n position: absolute;\n width: 341px;\n margin-top: -19px;\n}\n\n.rs-slider-bar {\n height: 0;\n}\n\n.rs-slider-progress-bar {\n height: 2px;\n background: none;\n}\n\n.rs-slider-graduator > ul > li::before {\n visibility: hidden;\n}\n\n.rs-slider-graduator > ul > li:last-child::after,\n.rs-slider-graduator > ul > li::before {\n top: -3px;\n border: none;\n}\n\n.rs-slider-handle::before {\n background: var(--lightGray);\n border: unset;\n top: -6px;\n margin-left: -5px;\n width: 16px;\n height: 16px;\n}\n\n.rs-slider-graduator {\n margin-left: -5px;\n margin-top: -10px;\n}\n\n.rs-slider-graduated > div:nth-child(2)::before {\n background: #9095a2;\n z-index: 99;\n}\n\n.rs-slider-graduated > div:nth-child(2) {\n z-index: 9999;\n}\n\n.rs-slider-graduated > div:nth-child(3)::before {\n background: var(--charcoal);\n z-index: 99;\n}\n\n.rs-picker-menu {\n border-radius: 0;\n z-index: 9999 !important;\n}\n\n.rs-picker-default:not(.rs-picker-disabled) .rs-btn:hover,\n.rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:hover,\n.rs-picker-default:not(.rs-picker-disabled) .rs-btn.active,\n.rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle.active {\n border-color: var(--slateGray) !important;\n}\n\n.rs-table:not(.rs-table-column-resizing) .rs-table-cell-header .rs-table-cell:hover ~ .rs-table-column-resize-spanner,\n.rs-table:not(.rs-table-column-resizing) .rs-table-column-resize-spanner:hover {\n background-color: var(--slateGray);\n}\n\n.rs-table-column-resize-spanner::before {\n border-color: transparent var(--slateGray) transparent transparent;\n}\n\n.rs-picker-toolbar-right-btn-ok {\n padding: 5px 10px;\n font-size: 13px;\n line-height: 1.42857143;\n border-radius: 2px;\n color: #fff;\n background-color: var(--charcoal);\n}\n\n.rs-picker-toolbar-right-btn-ok.rs-picker-toolbar-btn-disabled,\n.rs-picker-toolbar-right-btn-ok.rs-picker-toolbar-btn-disabled:hover,\n.rs-picker-toolbar-right-btn-ok.rs-picker-toolbar-btn-disabled:hover:active {\n background-color: var(--charcoal);\n}\n\n.rs-picker-toolbar-right-btn-ok:not(.rs-btn-disabled):hover {\n background-color: var(--charcoal);\n}\n\n.rs-modal-body {\n padding: 20px 25px 0 25px !important;\n}\n\n.rs-table-body-info {\n font-size: 13px;\n color: var(--slateGray);\n}\n\n.rs-modal-full .rs-modal-dialog {\n width: 100%;\n margin-left: 0;\n}\n\n.rs-modal-content {\n padding: 0;\n border-radius: 2px;\n}\n\n.rs-modal-body {\n padding: 20px 25px 20px 25px;\n margin-top: 0;\n max-height: 800px !important;\n min-height: 210px !important;\n}\n\n.rs-modal-header {\n border-top-left-radius: 2px;\n border-top-right-radius: 2px;\n padding: 5px 14px 8px 14px;\n background: var(--charcoal);\n}\n\n.rs-modal-header .rs-modal-title {\n color: #f0f0f0;\n font-size: 22px;\n font-weight: normal;\n}\n\n.rs-table-cell-header,\n.rs-table-cell[role='columnheader'],\n.rs-table-cell-header:focus,\n.rs-table-cell[role='columnheader']:focus,\n.rs-table-cell-header:hover,\n.rs-table-cell[role='columnheader']:hover {\n background: var(--gainsboro);\n color: white;\n}\n\n.ghost .rs-picker-toggle.rs-btn.rs-btn-default {\n background-color: var(--white) !important;\n}\n\n.rs-table-hover .rs-table-row-header:hover .rs-table-cell-group,\n.rs-table-hover .rs-table-row-header:hover .rs-table-cell {\n background: var(--gainsboro);\n}\n\n.rs-table-cell[role='columnheader'] > .rs-table-cell-content {\n color: var(--slateGray);\n}\n\n.rs-table-cell {\n border: 1px solid #e0e0e0;\n}\n\n.rs-table-cell-content {\n font-size: 13px;\n font-weight: 500;\n color: var(--gunMetal);\n text-align: left;\n}\n\n.rs-table-cell-content > input {\n border: none;\n width: inherit;\n background: none;\n padding-left: 15px;\n font-size: 13px;\n font-weight: normal;\n color: var(--gunMetal);\n}\n\n.rs-table-scrollbar-handle,\n.rs-table-scrollbar-handle:hover,\n.rs-table-scrollbar-handle:focus {\n position: absolute;\n background-color: #575757;\n border-radius: 4px;\n}\n\n.rs-table-cell-content > .rs-checkbox {\n margin-top: -10px;\n margin-left: -10px;\n}\n\n.rs-modal-header-close {\n background: unset;\n right: 10px !important;\n top: 9px !important;\n font-size: 15px !important;\n color: var(--gainsboro) !important;\n}\n\n.rs-picker-tag-wrapper {\n padding-bottom: 0;\n}\n\n.rs-picker-input {\n border-radius: 0;\n vertical-align: top;\n}\n\n.rs-picker-toggle-placeholder {\n font-size: 11px;\n color: var(--slateGray) !important;\n}\n\n.rs-picker-has-value .rs-btn .rs-picker-toggle-value,\n.rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value {\n color: var(--gunMetal);\n font-size: 13px;\n font-weight: normal;\n}\n\n.rs-picker-select-menu-item.rs-picker-select-menu-item-active,\n.rs-picker-select-menu-item.rs-picker-select-menu-item-active:hover,\n.rs-picker-select-menu-item:not(.rs-picker-select-menu-item-disabled):hover,\n.rs-picker-select-menu-item.rs-picker-select-menu-item-focus,\n.rs-picker-select-menu-item {\n color: var(--slateGray);\n font-size: 13px;\n font-weight: normal;\n}\n\n.rs-picker-select-menu-item {\n padding: 4px 12px;\n}\n\n.grouped .rs-picker-select-menu-item {\n padding-left: 0px;\n}\n\n.rs-picker-select-menu-items {\n margin-bottom: 0;\n}\n\n.rs-picker-select-menu-items.rs-picker-select-menu-group.rs-picker-select-menu-group-title {\n font-size: 13px;\n color: var(--slateGray);\n}\n\n.rs-picker-toggle-clean,\n.rs-picker-toggle-caret {\n color: var(--slateGray);\n}\n\n.rs-picker-check-menu-group[role='listitem'] {\n height: 48px !important;\n}\n\n.rs-picker-check-menu-items .rs-picker-check-menu-group:not(:first-child) {\n padding-top: 0px !important;\n}\n\n.rs-picker-check-menu.rs-picker-check-menu-items {\n max-height: 200px !important;\n}\n\n.rs-table-cell-header .rs-table-cell-content {\n padding: 10px 7px;\n}\n\n.rs-table-cell-header-icon-sort {\n color: var(--slateGray);\n line-height: 1.66666667;\n position: absolute;\n right: 9px;\n top: 10px;\n}\n\n.rs-table-cell-header-icon-sort-asc::after {\n color: var(--slateGray);\n}\n\n.rs-table-cell-header-icon-sort-desc::after {\n color: var(--slateGray);\n}\n\n.rs-table-hover .rs-table-row:not(.rs-table-row-header):hover,\n.rs-table-hover .rs-table-row:hover .rs-table-cell-group,\n.rs-table-hover .rs-table-row:hover .rs-table-cell {\n background: var(--blue-yonder-25) !important;\n}\n\n.rs-table-cell,\n.rs-table-cell-group,\n.rs-table-row {\n -webkit-transition: background-color 0.1s linear !important;\n transition: background-color 0.1s linear !important;\n}\n\n.rs-table-row-expanded {\n height: 100px !important;\n background: white !important;\n}\n\n.rs-plaintext {\n font-size: 13px !important;\n}\n","",{version:3,sources:["webpack://./src/assets/stylesheets/rsuite-override.css"],names:[],mappings:"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",sourcesContent:["/* variables */\n:root {\n /* colors */\n --gunMetal: #282f3e;\n --charcoal: #3b4559;\n --slateGray: #707785;\n --lightGray: #cccfd6;\n --gainsboro: #e5e5eb;\n --cultured: #f7f7fa;\n --white: #ffffff;\n\n --blue-yonder: #567a9e;\n --blue-yonder-25: #d4dde7;\n --blue-gray: #5697d2;\n --blue-gray-25: #d4e5f4;\n\n --mediumSeaGreen: #29b361;\n --golden-poppy: #fac11a;\n --maximum-red: #e1000f;\n\n --cadet-grey: #8e9a9f;\n --grullo: #b89b8c;\n --copper-red: #cf6a4e;\n --chinese-red: #a13112;\n\n --powder-blue: #9ed7d9;\n --wheat: #edd6a4;\n --opal: #a5bcc0;\n\n /* text */\n --rs-text-primary: var(--gunMetal);\n\n /* btn vars */\n --rs-btn-primary-text: var(--white);\n --rs-btn-primary-bg: var(--charcoal);\n --rs-btn-default-bg: transparent;\n --rs-btn-primary-hover-bg: var(--blue-yonder);\n --rs-btn-link-text: var(--slateGray);\n --rs-btn-link-hover-text: var(--blue-yonder);\n --rs-btn-link-active-text: var(--blue-gray);\n --rs-btn-ghost-text: var(--charcoal);\n --rs-btn-ghost-border: var(--charcoal);\n --rs-btn-ghost-hover-border: var(--blue-yonder);\n --rs-btn-ghost-hover-text: var(--blue-yonder);\n --rs-iconbtn-addon: transparent;\n\n --rs-iconbtn-primary-addon: var(--charcoal);\n --rs-btn-default-hover-bg: var(--blue-yonder);\n --rs-iconbtn-activated-addon: var(--blue-yonder);\n --rs-btn-default-hover-text: var(--white);\n --rs-iconbtn-primary-activated-addon: var(--blue-yonder);\n --rs-btn-primary-active-bg: var(--blue-gray);\n --rs-iconbtn-primary-pressed-addon: var(--blue-gray);\n --rs-btn-ghost-active-text: var(--blue-gray);\n --rs-btn-subtle-text: var(--gunMetal);\n --rs-btn-subtle-hover-bg: transparent;\n --rs-btn-subtle-hover-text: var(--blue-yonder);\n --rs-btn-subtle-active-bg: transparent;\n --rs-btn-subtle-active-text: var(--blue-gray);\n\n /* Checkbox vars */\n --rs-checkbox-disabled-bg: var(--white);\n\n --rs-menuitem-active-text: var(--blue-gray);\n --rs-listbox-option-hover-bg: var(--blue-yonder-25);\n --rs-listbox-option-selected-bg: var(--blue-gray-25);\n /* tags */\n --rs-tag-bg: var(--gainsboro);\n\n /* toggle */\n --rs-toggle-checked-bg: var(--charcoal);\n --rs-toggle-checked-hover-bg: var(--gunMetal);\n}\n\nlabel {\n color: var(--slateGray);\n font-size: 13px;\n line-height: 18px;\n}\n\n.rs-picker-toggle-active,\n.rs-picker.rs-picker-focused {\n box-shadow: none;\n border: 1px solid var(--blue-gray) !important;\n border-radius: 0;\n}\n\n/* button */\n.rs-ripple-pond {\n height: 30px;\n}\n\n.rs-btn {\n line-height: 18px;\n padding-top: 6px;\n padding-bottom: 6px;\n border-radius: 0;\n}\n\n.rs-btn-sm {\n padding-top: 3px;\n padding-bottom: 3px;\n font-size: 15px;\n}\n\n.rs-btn-md {\n height: 30px;\n}\n\n.rs-btn-icon-with-text.rs-btn-md.rs-btn-icon-placement-left,\n.rs-btn-icon-with-text.rs-btn.rs-btn-icon-placement-left {\n padding-left: 32px;\n padding-top: 6px;\n padding-bottom: 6px;\n}\n\n.rs-btn-icon-with-text.rs-btn-sm.rs-btn-icon-placement-left {\n padding-top: 3px;\n padding-bottom: 3px;\n}\n\n.rs-btn-ghost:hover {\n background-color: transparent;\n}\n\n.rs-btn-ghost.rs-btn-active,\n.rs-btn-ghost:active {\n background-color: var(--blue-gray-25);\n border-color: var(--blue-gray);\n}\n\n.rs-btn-ghost.rs-btn-icon-with-text:hover > .rs-icon {\n background-color: transparent;\n}\n\n.rs-btn-icon-with-text:focus > .rs-icon,\n.rs-btn-icon-with-text:hover > .rs-icon {\n background-color: transparent;\n}\n\n.rs-btn-ghost.rs-btn,\n.rs-btn-ghost.rs-btn-md,\n.rs-btn-icon-with-text.rs-btn-md.rs-btn-icon-placement-left.rs-btn-ghost,\n.rs-btn-icon-with-text.rs-btn.rs-btn-icon-placement-left.rs-btn-ghost {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n\n.rs-btn-ghost.rs-btn-sm,\n.rs-btn-icon-with-text.rs-btn-sm.rs-btn-icon-placement-left.rs-btn-ghost {\n padding-top: 2px;\n padding-bottom: 2px;\n}\n\n.rs-btn-icon.rs-btn,\n.rs-btn-icon.rs-btn-md {\n padding: 5px;\n}\n\n.rs-btn-subtle.rs-btn-icon.rs-btn-md {\n padding: 0;\n}\n\n.rs-btn-icon.rs-btn-sm {\n padding: 0px;\n}\n\n.rs-btn-icon.rs-btn-lg {\n padding: 7px;\n height: 40px;\n}\n\n.rs-btn-icon.rs-btn-ghost {\n padding: 4px;\n}\n\n.rs-btn-icon.rs-btn-lg.rs-btn-ghost {\n padding: 6px;\n}\n\n.rs-btn-icon-with-text.rs-btn-sm {\n padding-top: 5px;\n padding-bottom: 4px;\n line-height: 15px;\n font-size: 11px;\n}\n\n.rs-btn-icon.rs-btn > .rs-icon,\n.rs-btn-icon.rs-btn-md > .rs-icon {\n width: 20px;\n height: 20px;\n}\n\n.rs-btn-icon.rs-btn-lg > .rs-icon {\n width: 26px;\n height: 26px;\n}\n\n.rs-btn-icon.rs-btn-sm > .rs-icon {\n width: 14px;\n height: 14px;\n font-size: 14px;\n}\n\n.rs-btn-icon-with-text.rs-btn {\n line-height: 18px;\n}\n\n.rs-btn-icon-with-text.rs-btn > .rs-icon {\n width: 30px;\n height: 30px;\n padding: 5px;\n}\n\n.rs-btn-icon-with-text.rs-btn-sm > .rs-icon {\n width: 24px;\n height: 24px;\n padding: 4px;\n}\n\n.rs-btn-link,\n.rs-btn-link.rs-btn-md {\n font-size: 13px;\n text-decoration: underline;\n}\n\n.rs-btn-link.rs-btn-disabled,\n.rs-btn-link:disabled {\n text-decoration: underline;\n}\n\n.rs-btn-link.rs-btn-sm {\n font-size: 11px;\n}\n\n/* checkbox */\n.rs-checkbox-wrapper {\n top: 8px !important;\n}\n\n.rs-checkbox-checker {\n padding-bottom: 0;\n padding-left: 36px;\n}\n\n.rs-checkbox label {\n font-weight: 500;\n}\n\n.rs-checkbox-checker > label {\n font-size: 13px;\n color: var(--gunMetal);\n}\n\n.rs-checkbox-wrapper .rs-checkbox-inner::before {\n border: 2px solid var(--lightGray);\n background: var(--gainsboro) 0% 0% no-repeat padding-box;\n border-radius: 0px;\n}\n\n.rs-checkbox-wrapper .rs-checkbox-inner::after {\n border-color: var(--lightGray);\n border-width: 0 0 2px;\n -webkit-transform: rotate(0deg) scale(1);\n transform: rotate(0deg) scale(1);\n margin-top: -1px;\n}\n\n.rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::before {\n background-color: var(--charcoal);\n border-color: var(--charcoal);\n}\n\n.rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::after {\n border-color: var(--white);\n border-width: 0 0 2px;\n -webkit-transform: rotate(0deg) scale(1);\n transform: rotate(0deg) scale(1);\n margin-top: 0px;\n}\n\n.rs-checkbox-disabled:not(.rs-checkbox-checked):not(.rs-checkbox-indeterminate)\n .rs-checkbox-wrapper\n .rs-checkbox-inner:before {\n border-color: var(--lightGray);\n}\n\n.rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::before {\n border-color: var(--charcoal);\n background-color: var(--charcoal);\n}\n\nlabel:hover .rs-checkbox-wrapper .rs-checkbox-inner:before {\n border-color: var(--blue-yonder);\n background: var(--blue-yonder-25) 0% 0% no-repeat padding-box;\n}\n\n.rs-checkbox-checked label:hover .rs-checkbox-wrapper .rs-checkbox-inner:before {\n border-color: var(--blue-yonder);\n background: var(--blue-yonder) 0% 0% no-repeat padding-box;\n}\n\n.rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::after {\n border: solid var(--white);\n border-width: 0 2px 2px 0;\n}\n\n.checkbox-hidden > div > label > .rs-checkbox-wrapper {\n opacity: 0 !important;\n margin-left: -40px;\n position: inherit;\n}\n\n/* radio */\n\n.rs-radio-wrapper::before,\n.rs-radio-wrapper .rs-radio-inner::before,\n.rs-radio-wrapper {\n width: 14px;\n height: 14px;\n}\n\n.rs-radio-wrapper .rs-radio-inner::before {\n background: var(--gainsboro);\n border-width: 2px;\n}\n\n.rs-radio-checked .rs-radio-wrapper .rs-radio-inner::before {\n background: var(--gainsboro);\n border-color: var(--charcoal);\n}\n\n/* center of radio button when checked */\n.rs-radio-wrapper .rs-radio-inner::after {\n background: var(--charcoal);\n width: 6px;\n height: 6px;\n margin-top: 4px;\n margin-left: 4px;\n}\n\n.rs-radio.rs-radio-disabled .rs-radio-wrapper .rs-radio-inner::after {\n background: var(--lightGray);\n}\n\n.rs-radio.rs-radio-disabled .rs-radio-inner:before {\n background: var(--white);\n border-color: var(--lightGray);\n}\n\n.rs-radio-checker > label {\n color: var(--charcoal);\n font-weight: 500;\n line-height: 17px;\n}\n\n.rs-radio:hover .rs-radio-inner:before {\n border-color: var(--charcoal);\n}\n\n/* form */\n.rs-form:not(.rs-form-inline) .rs-form-group:not(:last-child) {\n margin-bottom: 32px;\n}\n\n/* Tags */\n\n.rs-tag-default {\n font-weight: 500;\n}\n\n.rs-tag-closable.rs-tag-md {\n padding-right: 32px;\n}\n\n.rs-tag-md {\n font-size: 13px;\n line-height: 18px;\n border-radius: 0px;\n padding-top: 1px;\n padding-bottom: 3px;\n}\n\n/* TagPicker */\n.rs-picker-tag .rs-tag {\n max-width: calc(100% - 30px) !important;\n background-color: var(--white);\n}\n\n.rs-tag-md .rs-tag-icon-close {\n padding: 6px 6px;\n}\n\n.rs-tag-icon-close.rs-btn-close {\n border-left: 1px solid var(--lightGray);\n}\n\n.rs-picker-tag .rs-picker-toggle.rs-btn-sm ~ .rs-picker-tag-wrapper .rs-tag {\n margin-top: 3px;\n}\n\n/* */\n.rs-modal-lg {\n width: 1300px;\n}\n\n.rs-slider-mark {\n font-size: 13px;\n color: var(--slateGray);\n}\n\n.rs-slider {\n position: absolute;\n width: 341px;\n margin-top: -19px;\n}\n\n.rs-slider-bar {\n height: 0;\n}\n\n.rs-slider-progress-bar {\n height: 2px;\n background: none;\n}\n\n.rs-slider-graduator > ul > li::before {\n visibility: hidden;\n}\n\n.rs-slider-graduator > ul > li:last-child::after,\n.rs-slider-graduator > ul > li::before {\n top: -3px;\n border: none;\n}\n\n.rs-slider-handle::before {\n background: var(--lightGray);\n border: unset;\n top: -6px;\n margin-left: -5px;\n width: 16px;\n height: 16px;\n}\n\n.rs-slider-graduator {\n margin-left: -5px;\n margin-top: -10px;\n}\n\n.rs-slider-graduated > div:nth-child(2)::before {\n background: #9095a2;\n z-index: 99;\n}\n\n.rs-slider-graduated > div:nth-child(2) {\n z-index: 9999;\n}\n\n.rs-slider-graduated > div:nth-child(3)::before {\n background: var(--charcoal);\n z-index: 99;\n}\n\n.rs-picker-menu {\n border-radius: 0;\n z-index: 9999 !important;\n}\n\n.rs-picker-default:not(.rs-picker-disabled) .rs-btn:hover,\n.rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:hover,\n.rs-picker-default:not(.rs-picker-disabled) .rs-btn.active,\n.rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle.active {\n border-color: var(--slateGray) !important;\n}\n\n.rs-table:not(.rs-table-column-resizing) .rs-table-cell-header .rs-table-cell:hover ~ .rs-table-column-resize-spanner,\n.rs-table:not(.rs-table-column-resizing) .rs-table-column-resize-spanner:hover {\n background-color: var(--slateGray);\n}\n\n.rs-table-column-resize-spanner::before {\n border-color: transparent var(--slateGray) transparent transparent;\n}\n\n.rs-picker-toolbar-right-btn-ok {\n padding: 5px 10px;\n font-size: 13px;\n line-height: 1.42857143;\n border-radius: 2px;\n color: #fff;\n background-color: var(--charcoal);\n}\n\n.rs-picker-toolbar-right-btn-ok.rs-picker-toolbar-btn-disabled,\n.rs-picker-toolbar-right-btn-ok.rs-picker-toolbar-btn-disabled:hover,\n.rs-picker-toolbar-right-btn-ok.rs-picker-toolbar-btn-disabled:hover:active {\n background-color: var(--charcoal);\n}\n\n.rs-picker-toolbar-right-btn-ok:not(.rs-btn-disabled):hover {\n background-color: var(--charcoal);\n}\n\n.rs-modal-body {\n padding: 20px 25px 0 25px !important;\n}\n\n.rs-table-body-info {\n font-size: 13px;\n color: var(--slateGray);\n}\n\n.rs-modal-full .rs-modal-dialog {\n width: 100%;\n margin-left: 0;\n}\n\n.rs-modal-content {\n padding: 0;\n border-radius: 2px;\n}\n\n.rs-modal-body {\n padding: 20px 25px 20px 25px;\n margin-top: 0;\n max-height: 800px !important;\n min-height: 210px !important;\n}\n\n.rs-modal-header {\n border-top-left-radius: 2px;\n border-top-right-radius: 2px;\n padding: 5px 14px 8px 14px;\n background: var(--charcoal);\n}\n\n.rs-modal-header .rs-modal-title {\n color: #f0f0f0;\n font-size: 22px;\n font-weight: normal;\n}\n\n.rs-table-cell-header,\n.rs-table-cell[role='columnheader'],\n.rs-table-cell-header:focus,\n.rs-table-cell[role='columnheader']:focus,\n.rs-table-cell-header:hover,\n.rs-table-cell[role='columnheader']:hover {\n background: var(--gainsboro);\n color: white;\n}\n\n.ghost .rs-picker-toggle.rs-btn.rs-btn-default {\n background-color: var(--white) !important;\n}\n\n.rs-table-hover .rs-table-row-header:hover .rs-table-cell-group,\n.rs-table-hover .rs-table-row-header:hover .rs-table-cell {\n background: var(--gainsboro);\n}\n\n.rs-table-cell[role='columnheader'] > .rs-table-cell-content {\n color: var(--slateGray);\n}\n\n.rs-table-cell {\n border: 1px solid #e0e0e0;\n}\n\n.rs-table-cell-content {\n font-size: 13px;\n font-weight: 500;\n color: var(--gunMetal);\n text-align: left;\n}\n\n.rs-table-cell-content > input {\n border: none;\n width: inherit;\n background: none;\n padding-left: 15px;\n font-size: 13px;\n font-weight: normal;\n color: var(--gunMetal);\n}\n\n.rs-table-scrollbar-handle,\n.rs-table-scrollbar-handle:hover,\n.rs-table-scrollbar-handle:focus {\n position: absolute;\n background-color: #575757;\n border-radius: 4px;\n}\n\n.rs-table-cell-content > .rs-checkbox {\n margin-top: -10px;\n margin-left: -10px;\n}\n\n.rs-modal-header-close {\n background: unset;\n right: 10px !important;\n top: 9px !important;\n font-size: 15px !important;\n color: var(--gainsboro) !important;\n}\n\n.rs-picker-tag-wrapper {\n padding-bottom: 0;\n}\n\n.rs-picker-input {\n border-radius: 0;\n vertical-align: top;\n}\n\n.rs-picker-toggle-placeholder {\n font-size: 11px;\n color: var(--slateGray) !important;\n}\n\n.rs-picker-has-value .rs-btn .rs-picker-toggle-value,\n.rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value {\n color: var(--gunMetal);\n font-size: 13px;\n font-weight: normal;\n}\n\n.rs-picker-select-menu-item.rs-picker-select-menu-item-active,\n.rs-picker-select-menu-item.rs-picker-select-menu-item-active:hover,\n.rs-picker-select-menu-item:not(.rs-picker-select-menu-item-disabled):hover,\n.rs-picker-select-menu-item.rs-picker-select-menu-item-focus,\n.rs-picker-select-menu-item {\n color: var(--slateGray);\n font-size: 13px;\n font-weight: normal;\n}\n\n.rs-picker-select-menu-item {\n padding: 4px 12px;\n}\n\n.grouped .rs-picker-select-menu-item {\n padding-left: 0px;\n}\n\n.rs-picker-select-menu-items {\n margin-bottom: 0;\n}\n\n.rs-picker-select-menu-items.rs-picker-select-menu-group.rs-picker-select-menu-group-title {\n font-size: 13px;\n color: var(--slateGray);\n}\n\n.rs-picker-toggle-clean,\n.rs-picker-toggle-caret {\n color: var(--slateGray);\n}\n\n.rs-picker-check-menu-group[role='listitem'] {\n height: 48px !important;\n}\n\n.rs-picker-check-menu-items .rs-picker-check-menu-group:not(:first-child) {\n padding-top: 0px !important;\n}\n\n.rs-picker-check-menu.rs-picker-check-menu-items {\n max-height: 200px !important;\n}\n\n.rs-table-cell-header .rs-table-cell-content {\n padding: 10px 7px;\n}\n\n.rs-table-cell-header-icon-sort {\n color: var(--slateGray);\n line-height: 1.66666667;\n position: absolute;\n right: 9px;\n top: 10px;\n}\n\n.rs-table-cell-header-icon-sort-asc::after {\n color: var(--slateGray);\n}\n\n.rs-table-cell-header-icon-sort-desc::after {\n color: var(--slateGray);\n}\n\n.rs-table-hover .rs-table-row:not(.rs-table-row-header):hover,\n.rs-table-hover .rs-table-row:hover .rs-table-cell-group,\n.rs-table-hover .rs-table-row:hover .rs-table-cell {\n background: var(--blue-yonder-25) !important;\n}\n\n.rs-table-cell,\n.rs-table-cell-group,\n.rs-table-row {\n -webkit-transition: background-color 0.1s linear !important;\n transition: background-color 0.1s linear !important;\n}\n\n.rs-table-row-expanded {\n height: 100px !important;\n background: white !important;\n}\n\n.rs-plaintext {\n font-size: 13px !important;\n}\n"],sourceRoot:""}]);const __WEBPACK_DEFAULT_EXPORT__=___CSS_LOADER_EXPORT___},"./stories lazy recursive ^\\.\\/.*$ include: (?:\\/stories(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cts%7Ctsx))$":(module,__unused_webpack_exports,__webpack_require__)=>{var map={"./Colors.stories":["./stories/Colors.stories.tsx",506],"./Colors.stories.tsx":["./stories/Colors.stories.tsx",506],"./Icon.stories":["./stories/Icon.stories.tsx",3674],"./Icon.stories.tsx":["./stories/Icon.stories.tsx",3674],"./components/Dialog.stories":["./stories/components/Dialog.stories.tsx",3709],"./components/Dialog.stories.tsx":["./stories/components/Dialog.stories.tsx",3709],"./components/Dropdown.stories":["./stories/components/Dropdown.stories.tsx",2139],"./components/Dropdown.stories.tsx":["./stories/components/Dropdown.stories.tsx",2139],"./components/MapMenuModal.stories":["./stories/components/MapMenuModal.stories.tsx",8696],"./components/MapMenuModal.stories.tsx":["./stories/components/MapMenuModal.stories.tsx",8696],"./components/Message.stories":["./stories/components/Message.stories.tsx",4672],"./components/Message.stories.tsx":["./stories/components/Message.stories.tsx",4672],"./components/Notifier.stories":["./stories/components/Notifier.stories.tsx",489],"./components/Notifier.stories.tsx":["./stories/components/Notifier.stories.tsx",489],"./components/SideMenu.stories":["./stories/components/SideMenu.stories.tsx",920],"./components/SideMenu.stories.tsx":["./stories/components/SideMenu.stories.tsx",920],"./elements/Button.stories":["./stories/elements/Button.stories.tsx",9929],"./elements/Button.stories.tsx":["./stories/elements/Button.stories.tsx",9929],"./elements/Field.stories":["./stories/elements/Field.stories.tsx",8392],"./elements/Field.stories.tsx":["./stories/elements/Field.stories.tsx",8392],"./elements/Fieldset.stories":["./stories/elements/Fieldset.stories.tsx",6330],"./elements/Fieldset.stories.tsx":["./stories/elements/Fieldset.stories.tsx",6330],"./elements/IconButton.stories":["./stories/elements/IconButton.stories.tsx",3856],"./elements/IconButton.stories.tsx":["./stories/elements/IconButton.stories.tsx",3856],"./elements/Label.stories":["./stories/elements/Label.stories.tsx",868],"./elements/Label.stories.tsx":["./stories/elements/Label.stories.tsx",868],"./elements/Legend.stories":["./stories/elements/Legend.stories.tsx",1627],"./elements/Legend.stories.tsx":["./stories/elements/Legend.stories.tsx",1627],"./elements/SingleTag.stories":["./stories/elements/SingleTag.stories.tsx",5138],"./elements/SingleTag.stories.tsx":["./stories/elements/SingleTag.stories.tsx",5138],"./elements/Tag.stories":["./stories/elements/Tag.stories.tsx",2377],"./elements/Tag.stories.tsx":["./stories/elements/Tag.stories.tsx",2377],"./elements/TagGroup.stories":["./stories/elements/TagGroup.stories.tsx",2245],"./elements/TagGroup.stories.tsx":["./stories/elements/TagGroup.stories.tsx",2245],"./fields/CheckPicker/CheckPicker.stories":["./stories/fields/CheckPicker/CheckPicker.stories.tsx",748],"./fields/CheckPicker/CheckPicker.stories.tsx":["./stories/fields/CheckPicker/CheckPicker.stories.tsx",748],"./fields/CheckPicker/CheckPickerWithCustomSearch.stories":["./stories/fields/CheckPicker/CheckPickerWithCustomSearch.stories.tsx",4680,4337],"./fields/CheckPicker/CheckPickerWithCustomSearch.stories.tsx":["./stories/fields/CheckPicker/CheckPickerWithCustomSearch.stories.tsx",4680,4337],"./fields/Checkbox.stories":["./stories/fields/Checkbox.stories.tsx",4482],"./fields/Checkbox.stories.tsx":["./stories/fields/Checkbox.stories.tsx",4482],"./fields/CoordinatesInput.stories":["./stories/fields/CoordinatesInput.stories.tsx",7249],"./fields/CoordinatesInput.stories.tsx":["./stories/fields/CoordinatesInput.stories.tsx",7249],"./fields/DatePicker.stories":["./stories/fields/DatePicker.stories.tsx",4012],"./fields/DatePicker.stories.tsx":["./stories/fields/DatePicker.stories.tsx",4012],"./fields/DateRangePicker.stories":["./stories/fields/DateRangePicker.stories.tsx",1765],"./fields/DateRangePicker.stories.tsx":["./stories/fields/DateRangePicker.stories.tsx",1765],"./fields/MultiCheckbox.stories":["./stories/fields/MultiCheckbox.stories.tsx",355],"./fields/MultiCheckbox.stories.tsx":["./stories/fields/MultiCheckbox.stories.tsx",355],"./fields/MultiRadio.stories":["./stories/fields/MultiRadio.stories.tsx",1049],"./fields/MultiRadio.stories.tsx":["./stories/fields/MultiRadio.stories.tsx",1049],"./fields/MultiSelect/MultiSelect.stories":["./stories/fields/MultiSelect/MultiSelect.stories.tsx",6506],"./fields/MultiSelect/MultiSelect.stories.tsx":["./stories/fields/MultiSelect/MultiSelect.stories.tsx",6506],"./fields/MultiSelect/MultiSelectWithCustomSearch.stories":["./stories/fields/MultiSelect/MultiSelectWithCustomSearch.stories.tsx",4680,231],"./fields/MultiSelect/MultiSelectWithCustomSearch.stories.tsx":["./stories/fields/MultiSelect/MultiSelectWithCustomSearch.stories.tsx",4680,231],"./fields/MultiZoneEditor.stories":["./stories/fields/MultiZoneEditor.stories.tsx",1356],"./fields/MultiZoneEditor.stories.tsx":["./stories/fields/MultiZoneEditor.stories.tsx",1356],"./fields/NumberInput.stories":["./stories/fields/NumberInput.stories.tsx",8851],"./fields/NumberInput.stories.tsx":["./stories/fields/NumberInput.stories.tsx",8851],"./fields/Search/WithCustomSearch.stories":["./stories/fields/Search/WithCustomSearch.stories.tsx",4680,5453],"./fields/Search/WithCustomSearch.stories.tsx":["./stories/fields/Search/WithCustomSearch.stories.tsx",4680,5453],"./fields/Search/WithOptions.stories":["./stories/fields/Search/WithOptions.stories.tsx",5590],"./fields/Search/WithOptions.stories.tsx":["./stories/fields/Search/WithOptions.stories.tsx",5590],"./fields/Search/WithOptionsAndCustomMenuItem.stories":["./stories/fields/Search/WithOptionsAndCustomMenuItem.stories.tsx",2205],"./fields/Search/WithOptionsAndCustomMenuItem.stories.tsx":["./stories/fields/Search/WithOptionsAndCustomMenuItem.stories.tsx",2205],"./fields/Search/WithQuery.stories":["./stories/fields/Search/WithQuery.stories.tsx",7151,3618],"./fields/Search/WithQuery.stories.tsx":["./stories/fields/Search/WithQuery.stories.tsx",7151,3618],"./fields/Select/Select.stories":["./stories/fields/Select/Select.stories.tsx",9540],"./fields/Select/Select.stories.tsx":["./stories/fields/Select/Select.stories.tsx",9540],"./fields/Select/SelectWithCustomSearch.stories":["./stories/fields/Select/SelectWithCustomSearch.stories.tsx",4680,9651],"./fields/Select/SelectWithCustomSearch.stories.tsx":["./stories/fields/Select/SelectWithCustomSearch.stories.tsx",4680,9651],"./fields/TextInput.stories":["./stories/fields/TextInput.stories.tsx",6600],"./fields/TextInput.stories.tsx":["./stories/fields/TextInput.stories.tsx",6600],"./fields/Textarea.stories":["./stories/fields/Textarea.stories.tsx",7754],"./fields/Textarea.stories.tsx":["./stories/fields/Textarea.stories.tsx",7754],"./formiks/AutoComplete/WithOptions.stories":["./stories/formiks/AutoComplete/WithOptions.stories.tsx",3340],"./formiks/AutoComplete/WithOptions.stories.tsx":["./stories/formiks/AutoComplete/WithOptions.stories.tsx",3340],"./formiks/AutoComplete/WithQuery.stories":["./stories/formiks/AutoComplete/WithQuery.stories.tsx",7151,4693],"./formiks/AutoComplete/WithQuery.stories.tsx":["./stories/formiks/AutoComplete/WithQuery.stories.tsx",7151,4693],"./formiks/FormikCheckbox.stories":["./stories/formiks/FormikCheckbox.stories.tsx",270],"./formiks/FormikCheckbox.stories.tsx":["./stories/formiks/FormikCheckbox.stories.tsx",270],"./formiks/FormikCoordinatesInput.stories":["./stories/formiks/FormikCoordinatesInput.stories.tsx",7386],"./formiks/FormikCoordinatesInput.stories.tsx":["./stories/formiks/FormikCoordinatesInput.stories.tsx",7386],"./formiks/FormikDatePicker.stories":["./stories/formiks/FormikDatePicker.stories.tsx",4442],"./formiks/FormikDatePicker.stories.tsx":["./stories/formiks/FormikDatePicker.stories.tsx",4442],"./formiks/FormikDateRangePicker.stories":["./stories/formiks/FormikDateRangePicker.stories.tsx",1936],"./formiks/FormikDateRangePicker.stories.tsx":["./stories/formiks/FormikDateRangePicker.stories.tsx",1936],"./formiks/FormikEffect.stories":["./stories/formiks/FormikEffect.stories.tsx",3397],"./formiks/FormikEffect.stories.tsx":["./stories/formiks/FormikEffect.stories.tsx",3397],"./formiks/FormikMultiCheckbox.stories":["./stories/formiks/FormikMultiCheckbox.stories.tsx",534],"./formiks/FormikMultiCheckbox.stories.tsx":["./stories/formiks/FormikMultiCheckbox.stories.tsx",534],"./formiks/FormikMultiRadio.stories":["./stories/formiks/FormikMultiRadio.stories.tsx",6337],"./formiks/FormikMultiRadio.stories.tsx":["./stories/formiks/FormikMultiRadio.stories.tsx",6337],"./formiks/FormikMultiSelect.stories":["./stories/formiks/FormikMultiSelect.stories.tsx",301],"./formiks/FormikMultiSelect.stories.tsx":["./stories/formiks/FormikMultiSelect.stories.tsx",301],"./formiks/FormikNumberInput.stories":["./stories/formiks/FormikNumberInput.stories.tsx",6589],"./formiks/FormikNumberInput.stories.tsx":["./stories/formiks/FormikNumberInput.stories.tsx",6589],"./formiks/FormikSelect.stories":["./stories/formiks/FormikSelect.stories.tsx",1581],"./formiks/FormikSelect.stories.tsx":["./stories/formiks/FormikSelect.stories.tsx",1581],"./formiks/FormikTextInput.stories":["./stories/formiks/FormikTextInput.stories.tsx",6159],"./formiks/FormikTextInput.stories.tsx":["./stories/formiks/FormikTextInput.stories.tsx",6159],"./formiks/FormikTextarea.stories":["./stories/formiks/FormikTextarea.stories.tsx",6310,4167],"./formiks/FormikTextarea.stories.tsx":["./stories/formiks/FormikTextarea.stories.tsx",6310,4167],"./symbols/ExclamationPoint.stories":["./stories/symbols/ExclamationPoint.stories.tsx",4539],"./symbols/ExclamationPoint.stories.tsx":["./stories/symbols/ExclamationPoint.stories.tsx",4539],"./tables/DataTable.stories":["./stories/tables/DataTable.stories.tsx",3897],"./tables/DataTable.stories.tsx":["./stories/tables/DataTable.stories.tsx",3897],"./tables/SimpleTable.stories":["./stories/tables/SimpleTable.stories.tsx",6750,5016],"./tables/SimpleTable.stories.tsx":["./stories/tables/SimpleTable.stories.tsx",6750,5016],"./tables/TableWithSelectableRows.stories":["./stories/tables/TableWithSelectableRows.stories.tsx",6750,2293],"./tables/TableWithSelectableRows.stories.tsx":["./stories/tables/TableWithSelectableRows.stories.tsx",6750,2293],"./tests/button.stories":["./stories/tests/button.stories.tsx",5189],"./tests/button.stories.tsx":["./stories/tests/button.stories.tsx",5189]};function webpackAsyncContext(req){if(!__webpack_require__.o(map,req))return Promise.resolve().then((()=>{var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}));var ids=map[req],id=ids[0];return Promise.all(ids.slice(1).map(__webpack_require__.e)).then((()=>__webpack_require__(id)))}webpackAsyncContext.keys=()=>Object.keys(map),webpackAsyncContext.id="./stories lazy recursive ^\\.\\/.*$ include: (?:\\/stories(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cts%7Ctsx))$",module.exports=webpackAsyncContext},"./stories lazy recursive ^\\.\\/.*$ include: (?:\\/stories(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.mdx)$":module=>{function webpackEmptyAsyncContext(req){return Promise.resolve().then((()=>{var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}))}webpackEmptyAsyncContext.keys=()=>[],webpackEmptyAsyncContext.resolve=webpackEmptyAsyncContext,webpackEmptyAsyncContext.id="./stories lazy recursive ^\\.\\/.*$ include: (?:\\/stories(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.mdx)$",module.exports=webpackEmptyAsyncContext},"./storybook-config-entry.js":(__unused_webpack_module,__unused_webpack___webpack_exports__,__webpack_require__)=>{"use strict";var dist=__webpack_require__("./node_modules/@storybook/global/dist/index.mjs"),external_STORYBOOK_MODULE_PREVIEW_API_=__webpack_require__("@storybook/preview-api");const external_STORYBOOK_MODULE_CHANNEL_POSTMESSAGE_namespaceObject=__STORYBOOK_MODULE_CHANNEL_POSTMESSAGE__,external_STORYBOOK_MODULE_CHANNEL_WEBSOCKET_namespaceObject=__STORYBOOK_MODULE_CHANNEL_WEBSOCKET__,importers=[async path=>{if(!/^\.[\\/](?:stories(?:\/(?!\.)(?:(?:(?!(?:^|\/)\.).)*?)\/|\/|$)(?!\.)(?=.)[^/]*?\.stories\.mdx)$/.exec(path))return;const pathRemainder=path.substring(10);return __webpack_require__("./stories lazy recursive ^\\.\\/.*$ include: (?:\\/stories(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.mdx)$")("./"+pathRemainder)},async path=>{if(!/^\.[\\/](?:stories(?:\/(?!\.)(?:(?:(?!(?:^|\/)\.).)*?)\/|\/|$)(?!\.)(?=.)[^/]*?\.stories\.(js|jsx|ts|tsx))$/.exec(path))return;const pathRemainder=path.substring(10);return __webpack_require__("./stories lazy recursive ^\\.\\/.*$ include: (?:\\/stories(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cts%7Ctsx))$")("./"+pathRemainder)}];const channel=(0,external_STORYBOOK_MODULE_CHANNEL_POSTMESSAGE_namespaceObject.createChannel)({page:"preview"});if(external_STORYBOOK_MODULE_PREVIEW_API_.addons.setChannel(channel),"DEVELOPMENT"===dist.global.CONFIG_TYPE){const serverChannel=(0,external_STORYBOOK_MODULE_CHANNEL_WEBSOCKET_namespaceObject.createChannel)({});external_STORYBOOK_MODULE_PREVIEW_API_.addons.setServerChannel(serverChannel),window.__STORYBOOK_SERVER_CHANNEL__=serverChannel}const preview=new external_STORYBOOK_MODULE_PREVIEW_API_.PreviewWeb;window.__STORYBOOK_PREVIEW__=preview,window.__STORYBOOK_STORY_STORE__=preview.storyStore,window.__STORYBOOK_ADDONS_CHANNEL__=channel,window.__STORYBOOK_CLIENT_API__=new external_STORYBOOK_MODULE_PREVIEW_API_.ClientApi({storyStore:preview.storyStore}),preview.initialize({importFn:async function importFn(path){for(let i=0;iimporters[i](path),x());if(moduleExports)return moduleExports}var x},getProjectAnnotations:()=>(0,external_STORYBOOK_MODULE_PREVIEW_API_.composeConfigs)([__webpack_require__("./node_modules/@storybook/react-webpack5/node_modules/@storybook/react/preview.js"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/docs/preview.mjs"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/actions/preview.mjs"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/backgrounds/preview.mjs"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/measure/preview.mjs"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/outline/preview.mjs"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/highlight/preview.mjs"),__webpack_require__("./node_modules/@storybook/addon-a11y/dist/preview.mjs"),__webpack_require__("./.storybook/preview.tsx")])})},"@storybook/channels":module=>{"use strict";module.exports=__STORYBOOK_MODULE_CHANNELS__},"@storybook/client-logger":module=>{"use strict";module.exports=__STORYBOOK_MODULE_CLIENT_LOGGER__},"@storybook/core-events":module=>{"use strict";module.exports=__STORYBOOK_MODULE_CORE_EVENTS__},"@storybook/preview-api":module=>{"use strict";module.exports=__STORYBOOK_MODULE_PREVIEW_API__}},__webpack_require__=>{__webpack_require__.O(0,[7268],(()=>{return moduleId="./storybook-config-entry.js",__webpack_require__(__webpack_require__.s=moduleId);var moduleId}));__webpack_require__.O()}]); -//# sourceMappingURL=main.cd7a79f3.iframe.bundle.js.map \ No newline at end of file +//# sourceMappingURL=main.c0d1d466.iframe.bundle.js.map \ No newline at end of file diff --git a/main.c0d1d466.iframe.bundle.js.map b/main.c0d1d466.iframe.bundle.js.map new file mode 100644 index 000000000..1572bde92 --- /dev/null +++ b/main.c0d1d466.iframe.bundle.js.map @@ -0,0 +1 @@ +{"version":3,"file":"main.c0d1d466.iframe.bundle.js","mappings":"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","sources":["webpack://@mtes-mct/monitor-ui__root/./.storybook/components/GlobalDecorator.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/MapMenuDialog/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Button.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/IconButton.tsx","webpack://@mtes-mct/monitor-ui__root/./src/GlobalStyle.ts","webpack://@mtes-mct/monitor-ui__root/./src/theme.ts","webpack://@mtes-mct/monitor-ui__root/./src/OnlyFontGlobalStyle.ts","webpack://@mtes-mct/monitor-ui__root/./src/components/Dialog/Action.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dialog/Body.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dialog/Title.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dialog/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dropdown/Item.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dropdown/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/SideMenu/Button.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/SideMenu/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/IconBox.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/SingleTag.tsx","webpack://@mtes-mct/monitor-ui__root/./src/symbols/ExclamationPoint.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Message.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Legend.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Fieldset.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/FieldError.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Label.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Tag/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/Search.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/Checkbox.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CheckPicker.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DatePicker/CalendarPicker.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/NumberInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/DateInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/RangedTimePicker.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/TimeInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DatePicker/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/RangeCalendarPicker.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/MultiCheckbox.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/MultiSelect.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/MultiRadio.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/MultiZoneEditor/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/NumberInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CoordinatesInput/DDCoordinatesInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CoordinatesInput/DMDCoordinatesInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CoordinatesInput/DMSCoordinatesInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CoordinatesInput/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/Select.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/Textarea.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/TextInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/tables/SimpleTable.tsx","webpack://@mtes-mct/monitor-ui__root/./src/tables/DataTable/SortingIcon.ts","webpack://@mtes-mct/monitor-ui__root/./src/tables/DataTable/Th.tsx","webpack://@mtes-mct/monitor-ui__root/./src/tables/TableWithSelectableRows/index.tsx"],"sourcesContent":["import { StrictMode } from 'react'\nimport { CustomProvider as RsuiteCustomProvider } from 'rsuite'\nimport rsuiteFrFr from 'rsuite/locales/fr_FR'\nimport { createGlobalStyle, ThemeProvider } from 'styled-components'\n\nimport { GlobalStyle, THEME } from '../../src'\n\nimport type { StoryFn } from '@storybook/react'\n\nconst UntypedGlobalStyle = GlobalStyle as any\nconst UntypedThemeProvider = ThemeProvider as any\n\nconst CustomGlobalStyle: any = createGlobalStyle`\n html,\n body.sb-show-main.sb-main-padded {\n height: 100%;\n padding: 0;\n width: 640px;\n }\n\n code {\n background-color: #1e1e1e;\n color: #ffffff;\n font-size: 12px;\n padding: 2px 6px;\n vertical-align: 1px;\n }\n\n #root {\n height: 100%;\n width: 100%;\n }\n`\n\nexport function GlobalDecorator(Story: StoryFn) {\n return (\n \n \n \n )\n}\n\nexport function GlobalDecoratorWrapper({ children }) {\n return (\n \n \n \n \n\n {children}\n \n \n )\n}\n","import styled from 'styled-components'\n\nimport { IconButton } from '../../elements/IconButton'\n\nconst Container = styled.div`\n background-color: ${p => p.theme.color.white};\n box-shadow: 0px 3px 6px ${p => p.theme.color.slateGray};\n display: flex;\n flex-direction: column;\n margin-right: 6px;\n max-height: 520px;\n width: 320px;\n`\n\nconst Header = styled.div`\n align-items: center;\n background-color: ${p => p.theme.color.charcoal};\n display: flex;\n height: 40px;\n justify-content: space-between;\n padding: 9px 4px 9px 10px;\n`\n\nconst Title = styled.span.attrs(props => ({\n title: String(props.children)\n}))`\n color: ${p => p.theme.color.white};\n font-size: 16px;\n line-height: 22px;\n margin-right: 6px;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n`\n\nconst Body = styled.div`\n height: calc(100% - 40px);\n overflow-y: auto;\n padding: 12px;\n`\n\nconst VisibilityButton = styled(IconButton as any)`\n background-color: ${p => p.theme.color.gainsboro};\n`\n\nconst CloseButton = styled(IconButton as any)`\n color: white;\n`\n\nconst Footer = styled.div`\n background: ${p => p.theme.color.white};\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 12px;\n width: 100%;\n z-index: 10;\n`\n\nexport const MapMenuDialog = {\n Body,\n CloseButton,\n Container,\n Footer,\n Header,\n Title,\n VisibilityButton\n}\n","import classnames from 'classnames'\nimport { useCallback, useMemo, type MouseEvent, type ButtonHTMLAttributes, type FunctionComponent } from 'react'\nimport styled from 'styled-components'\n\nimport { Accent, Size } from '../constants'\nimport { type IconProps } from '../types'\nimport { stopMouseEventPropagation } from '../utils/stopMouseEventPropagation'\n\nconst ICON_SIZE: Record = {\n [Size.LARGE]: 20,\n [Size.NORMAL]: 20,\n [Size.SMALL]: 12\n}\n\nexport type ButtonProps = Omit, 'children'> & {\n Icon?: FunctionComponent | undefined\n accent?: Accent | undefined\n children?: string | undefined\n isFullWidth?: boolean | undefined\n size?: Size | undefined\n /** Prevent onClick event propagation. */\n withUnpropagatedClick?: boolean | undefined\n}\nexport function Button({\n accent = Accent.PRIMARY,\n children,\n className,\n Icon,\n isFullWidth = false,\n onClick,\n size = Size.NORMAL,\n type = 'button',\n withUnpropagatedClick = false,\n ...nativeProps\n}: ButtonProps) {\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (withUnpropagatedClick) {\n stopMouseEventPropagation(event)\n }\n\n if (onClick) {\n onClick(event)\n }\n },\n [onClick, withUnpropagatedClick]\n )\n\n const commonChildren = useMemo(\n () => (\n <>\n {Icon && }\n {children && {children}}\n \n ),\n [children, Icon, size]\n )\n\n const commonProps = useMemo(\n () => ({\n as: StyledButton,\n children: commonChildren,\n className: classnames('Element-Button', className),\n isFullWidth,\n onClick: handleClick,\n size,\n type,\n ...nativeProps\n }),\n [className, commonChildren, handleClick, isFullWidth, nativeProps, size, type]\n )\n\n switch (accent) {\n case Accent.SECONDARY:\n return \n\n case Accent.TERTIARY:\n return \n\n default:\n return \n }\n}\n\nconst FONT_SIZE: Record = {\n [Size.LARGE]: '13px',\n [Size.NORMAL]: '13px',\n [Size.SMALL]: '11px'\n}\nconst PADDING: Record = {\n [Size.LARGE]: '12px',\n [Size.NORMAL]: '6px 12px',\n [Size.SMALL]: '5px 8px 4px'\n}\nconst StyledButton = styled.button<{\n isFullWidth: boolean\n size: Size\n}>`\n align-items: center;\n display: inline-flex;\n font-size: ${p => FONT_SIZE[p.size]};\n justify-content: center;\n max-width: 100%;\n padding: ${p => PADDING[p.size]};\n width: ${p => (p.isFullWidth ? '100%' : 'auto')};\n\n /* SVG Icon Components are wrapped within a
*/\n > div {\n margin-right: 5px;\n }\n`\n\nconst ButtonLabel = styled.span`\n line-height: 1.3846;\n margin-top: -3px;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`\n\nexport const PrimaryButton = styled.button`\n background-color: ${p => p.theme.color.charcoal};\n border: 1px solid ${p => p.theme.color.charcoal};\n color: ${p => p.theme.color.gainsboro};\n\n :hover,\n &._hover {\n background-color: ${p => p.theme.color.blueYonder};\n border: 1px solid ${p => p.theme.color.blueYonder};\n color: ${p => p.theme.color.white};\n }\n\n :active,\n &._active {\n background-color: ${p => p.theme.color.blueGray};\n border: 1px solid ${p => p.theme.color.blueGray};\n color: ${p => p.theme.color.white};\n }\n\n :disabled,\n &._disabled {\n background-color: ${p => p.theme.color.lightGray};\n border: 1px solid ${p => p.theme.color.lightGray};\n color: ${p => p.theme.color.cultured};\n }\n`\n\nexport const SecondaryButton = styled.button`\n background-color: transparent;\n border: 1px solid ${p => p.theme.color.charcoal};\n color: ${p => p.theme.color.charcoal};\n\n :hover,\n &._hover {\n background-color: ${p => p.theme.color.blueYonder25};\n border: 1px solid ${p => p.theme.color.blueYonder};\n color: ${p => p.theme.color.blueYonder};\n }\n\n :active,\n &._active {\n background-color: ${p => p.theme.color.blueGray25};\n border: 1px solid ${p => p.theme.color.blueGray};\n color: ${p => p.theme.color.blueGray};\n }\n\n :disabled,\n &._disabled {\n background-color: transparent;\n border: 1px solid ${p => p.theme.color.lightGray};\n color: ${p => p.theme.color.lightGray};\n }\n`\n\nexport const TertiaryButton = styled.button`\n background-color: ${p => p.theme.color.white};\n border: 1px solid ${p => p.theme.color.white};\n color: ${p => p.theme.color.charcoal};\n\n :hover,\n &._hover {\n background-color: ${p => p.theme.color.blueYonder25};\n border: 1px solid ${p => p.theme.color.blueYonder25};\n color: ${p => p.theme.color.blueYonder};\n }\n\n :active,\n &._active {\n background-color: ${p => p.theme.color.blueGray25};\n border: 1px solid ${p => p.theme.color.blueGray};\n color: ${p => p.theme.color.blueGray};\n }\n\n :disabled,\n &._disabled {\n background-color: ${p => p.theme.color.white};\n border: 1px solid ${p => p.theme.color.lightGray};\n color: ${p => p.theme.color.lightGray};\n }\n`\n","import classnames from 'classnames'\nimport { useMemo, type MouseEvent, type ButtonHTMLAttributes, type FunctionComponent, useCallback } from 'react'\nimport styled, { css } from 'styled-components'\n\nimport { PrimaryButton, SecondaryButton } from './Button'\nimport { Accent, Size } from '../constants'\nimport { type IconProps } from '../types'\nimport { stopMouseEventPropagation } from '../utils/stopMouseEventPropagation'\n\nconst ICON_SIZE_IN_PX: Record = {\n [Size.LARGE]: 26,\n [Size.NORMAL]: 20,\n [Size.SMALL]: 14\n}\n\nexport type IconButtonProps = Omit, 'children'> & {\n Icon: FunctionComponent\n accent?: Accent | undefined\n color?: string | undefined\n /** In pixels, override `size` prop default values. */\n iconSize?: number | undefined\n /** Remove button border and padding. */\n isCompact?: boolean | undefined\n size?: Size | undefined\n /** Prevent onClick event propagation. */\n withUnpropagatedClick?: boolean | undefined\n}\nexport function IconButton({\n accent = Accent.PRIMARY,\n className,\n color,\n Icon,\n iconSize,\n isCompact,\n onClick,\n size = Size.NORMAL,\n type = 'button',\n withUnpropagatedClick = false,\n ...nativeProps\n}: IconButtonProps) {\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (withUnpropagatedClick) {\n stopMouseEventPropagation(event)\n }\n\n if (onClick) {\n onClick(event)\n }\n },\n [onClick, withUnpropagatedClick]\n )\n\n const commonChildren = useMemo(\n () => ,\n [color, Icon, iconSize, size]\n )\n\n const commonProps = useMemo(\n () => ({\n children: commonChildren,\n className: classnames('Element-IconButton', className),\n isCompact,\n onClick: handleClick,\n size,\n type,\n ...nativeProps\n }),\n [className, commonChildren, handleClick, isCompact, nativeProps, size, type]\n )\n\n switch (accent) {\n case Accent.SECONDARY:\n return \n\n case Accent.TERTIARY:\n return \n\n default:\n return \n }\n}\n\nconst PADDING: Record = {\n [Size.LARGE]: '7px',\n [Size.NORMAL]: '5px',\n [Size.SMALL]: '3px'\n}\n\n// We can't use $-prefixed props here for some reason (maybe because the `as` prop exclude them?).\nconst StyledButton = styled.button<{\n isCompact: boolean | undefined\n size: Size\n}>`\n align-items: center;\n display: flex;\n justify-content: center;\n padding: ${p => (p.isCompact ? 0 : PADDING[p.size])};\n\n ${p =>\n p.isCompact &&\n css`\n border: 0;\n\n :hover,\n &._hover {\n border: 0;\n }\n border: 0;\n\n :active,\n &._active {\n border: 0;\n }\n border: 0;\n\n :disabled,\n &._disabled {\n border: 0;\n }\n `}\n`\n\nconst TertiaryButton = styled.button<{\n isCompact: boolean | undefined\n}>`\n background-color: transparent;\n border: ${p => (p.isCompact ? 0 : '1px solid transparent')};\n color: ${p => p.theme.color.charcoal};\n\n :hover,\n &._hover {\n background-color: transparent;\n border: ${p => (p.isCompact ? 0 : '1px solid transparent')};\n color: ${p => p.theme.color.blueYonder};\n }\n\n :active,\n &._active {\n background-color: transparent;\n border: ${p => (p.isCompact ? 0 : '1px solid transparent')};\n color: ${p => p.theme.color.blueGray};\n }\n\n :disabled,\n &._disabled {\n background-color: transparent;\n border: ${p => (p.isCompact ? 0 : '1px solid transparent')};\n color: ${p => p.theme.color.lightGray};\n }\n`\n","import { createGlobalStyle } from 'styled-components'\n\n// @ts-ignore\nimport MarianneBold from './assets/fonts/Marianne-Bold.woff2'\n// @ts-ignore\nimport MarianneBoldItalic from './assets/fonts/Marianne-Bold_Italic.woff2'\n// @ts-ignore\nimport MarianneLight from './assets/fonts/Marianne-Light.woff2'\n// @ts-ignore\nimport MarianneLightItalic from './assets/fonts/Marianne-Light_Italic.woff2'\n// @ts-ignore\nimport MarianneMedium from './assets/fonts/Marianne-Medium.woff2'\n// @ts-ignore\nimport MarianneMediumItalic from './assets/fonts/Marianne-Medium_Italic.woff2'\n// @ts-ignore\nimport MarianneRegular from './assets/fonts/Marianne-Regular.woff2'\n// @ts-ignore\nimport MarianneItalic from './assets/fonts/Marianne-Regular_Italic.woff2'\n\nexport const GlobalStyle = createGlobalStyle`\n @font-face {\n font-family: Marianne;\n src: local('Marianne'), local('Marianne-Regular'), url(${MarianneRegular}) format('woff2');\n font-weight: normal;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Thin'), url(${MarianneLight}) format('woff2');\n font-weight: 300;\n }\n\n @font-face {\n font-family: Marianne;\n src:local('Marianne-Medium'), url(${MarianneMedium}) format('woff2');\n font-weight: 500;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Medium_Italic'), url(${MarianneMediumItalic}) format('woff2');\n font-weight: 500;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Thin_Italic'), url(${MarianneLightItalic}) format('woff2');\n font-weight: lighter;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src:local('Marianne-Regular_Italic'), url(${MarianneItalic}) format('woff2');\n font-weight: normal;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Bold'), url(${MarianneBold}) format('woff2');\n font-weight: 700;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Bold_Italic'), url(${MarianneBoldItalic}) format('woff2');\n font-style: italic;\n font-weight: 700;\n }\n\n body {\n font-family: Marianne, sans-serif;\n font-size: 16px;\n line-height: 1.3846;\n }\n`\n","/* eslint-disable sort-keys-fix/sort-keys-fix, typescript-sort-keys/interface */\n\nimport type { PartialDeep } from 'type-fest'\n\nexport type Theme = typeof THEME\nexport type PartialTheme = PartialDeep\n\nexport const THEME = {\n // https://xd.adobe.com/view/b6d4c472-3fbe-4dec-9f14-38fe03872a3e-e387/screen/b9bdc1ba-5f07-4c4f-bd44-2d38b2c6f663/specs/\n color: {\n /** INTERFACE COLORS */\n\n // Neutral Colors\n gunMetal: '#282F3E',\n // TODO Make that charcoal object 100 & 50\n charcoal: '#3B4559',\n charcoalShadow: 'rgba(59, 69, 89, 0.5)',\n slateGray: '#707785',\n lightGray: '#CCCFD6',\n gainsboro: '#E5E5EB',\n cultured: '#F7F7FA',\n white: '#FFFFFF',\n\n // Accentuation Colors\n blueYonder: '#567A9E',\n blueYonder25: '#D4DDE7',\n blueGray: '#5697D2',\n blueGray25: '#D4E5F4',\n maximumRed: '#E1000F',\n maximumRed15: '#FBD9DB',\n babyBlueEyes: '#99C9FF',\n\n // Notification Colors\n mediumSeaGreen: '#29B361',\n mediumSeaGreen25: '#c9ecd7',\n goldenPoppy: '#FAC11A',\n goldenPoppy25: '#FDF3C3',\n\n /** CONTEXTUAL COLORS */\n\n // Mission status\n yellowGreen: '#8CC800',\n\n // Risk Factor\n cadetGray: '#8E9A9F',\n grullo: '#B89B8C',\n copperRed: '#CF6A4E',\n chineseRed: '#A13112',\n\n // Vessel Track\n darkCornflowerBlue: '#2A4670',\n jungleGreen: '#1C9B7B',\n\n // Beacon Malfunction\n powderBlue: '#9ED7D9',\n wheat: '#EDD6A4',\n opal: '#A5BCC0',\n\n // Regulation Areas\n yaleBlue: '#295375',\n queenBlue: '#367096',\n glaucous: '#6284A6',\n blueNcs: '#3690C0',\n iceberg: '#67A9CF',\n lightSteelBlue: '#9AB4D6',\n lightPeriwinkle: '#CDCFEA',\n aliceBlue: '#EBF0F4',\n lightBlue: '#B9DDE5',\n lightCyan: '#C7EAE5', // deprecated ?\n middleBlueGreen: '#91CFC9', // deprecated ?\n verdigris: '#56B3AB', // deprecated ?\n viridianGreen: '#01A29D', // deprecated ?\n paoloVeroneseGreen: '#21977F', // deprecated ?\n skobeloff: '#01686B', // deprecated ?\n blueSapphire: '#01536A', // deprecated ?\n indigoDye: '#033E54', // deprecated ?\n skyBlue: '#77C1DE',\n frenchBlue: '#2E75AB',\n prussianBlue: '#003E54',\n lightCoral: '#FA8282',\n\n // AMP Zones\n brownSugar: '#B26A53',\n rust: '#B1502F',\n burntSienna: '#D46E49',\n persianOrange: '#D6814F',\n jasper: '#DB503D',\n bittersweet: '#F0755C',\n coral: '#F78A69',\n peach: '#FCB394',\n apricot: '#F0C1A1',\n melon: '#E7A58D',\n paleDogwood: '#F8D7CE',\n seashell: '#FCECE4',\n\n // Custom Zones\n darkGoldenrod: '#A98A0F',\n pear: '#DBE33E',\n jonquil: '#F0CB38',\n earthYellow: '#E6B771',\n ecru: '#BAAB68',\n goldMetallic: '#C5A730',\n mindaro: '#F2F58E'\n }\n}\n","import { createGlobalStyle } from 'styled-components'\n\n// @ts-ignore\nimport MarianneBold from './assets/fonts/Marianne-Bold.woff2'\n// @ts-ignore\nimport MarianneBoldItalic from './assets/fonts/Marianne-Bold_Italic.woff2'\n// @ts-ignore\nimport MarianneLight from './assets/fonts/Marianne-Light.woff2'\n// @ts-ignore\nimport MarianneLightItalic from './assets/fonts/Marianne-Light_Italic.woff2'\n// @ts-ignore\nimport MarianneMedium from './assets/fonts/Marianne-Medium.woff2'\n// @ts-ignore\nimport MarianneMediumItalic from './assets/fonts/Marianne-Medium_Italic.woff2'\n// @ts-ignore\nimport MarianneRegular from './assets/fonts/Marianne-Regular.woff2'\n// @ts-ignore\nimport MarianneItalic from './assets/fonts/Marianne-Regular_Italic.woff2'\n\nexport const OnlyFontGlobalStyle = createGlobalStyle`\n @font-face {\n font-family: Marianne;\n src: local('Marianne'), local('Marianne-Regular'), url(${MarianneRegular}) format('woff2');\n font-weight: normal;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Thin'), url(${MarianneLight}) format('woff2');\n font-weight: 300;\n }\n\n @font-face {\n font-family: Marianne;\n src:local('Marianne-Medium'), url(${MarianneMedium}) format('woff2');\n font-weight: 500;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Medium_Italic'), url(${MarianneMediumItalic}) format('woff2');\n font-weight: 500;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Thin_Italic'), url(${MarianneLightItalic}) format('woff2');\n font-weight: lighter;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src:local('Marianne-Regular_Italic'), url(${MarianneItalic}) format('woff2');\n font-weight: normal;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Bold'), url(${MarianneBold}) format('woff2');\n font-weight: 700;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Bold_Italic'), url(${MarianneBoldItalic}) format('woff2');\n font-style: italic;\n font-weight: 700;\n }\n\n body {\n font-family: Marianne, sans-serif;\n }\n`\n","import styled from 'styled-components'\n\nexport const Action = styled.div`\n background-color: ${p => p.theme.color.white};\n border-bottom-left-radius: 2px;\n border-bottom-right-radius: 2px;\n display: flex;\n flex-direction: column-reverse;\n padding: 8px 8px 8px 8px;\n @media (min-width: 740px) {\n align-items: center;\n flex-direction: row;\n justify-content: center;\n padding: 48px 8px 48px 8px;\n }\n\n > button {\n margin-bottom: 2px;\n }\n @media (min-width: 740px) {\n > button {\n margin-bottom: 0;\n margin-right: 2px;\n }\n }\n`\n","import styled from 'styled-components'\n\nexport const Body = styled.div`\n background-color: ${p => p.theme.color.white};\n border-top-left-radius: 2px;\n border-top-right-radius: 2px;\n display: flex;\n flex-direction: column;\n padding: 8px 8px 8px 8px;\n text-align: center;\n @media (min-width: 740px) {\n padding: 48px 8px 8px 8px;\n text-align: center;\n }\n\n > p {\n color: ${p => p.theme.color.slateGray};\n padding-top: 2px;\n }\n`\n","import styled from 'styled-components'\n\nexport const Title = styled.h4`\n font-size: 125%;\n font-weight: 500;\n line-height: 48px;\n padding-bottom: 2px;\n height: 48px;\n color: ${p => p.theme.color.white};\n background-color: ${p => p.theme.color.charcoal};\n text-align: center;\n`\n","import classnames from 'classnames'\nimport styled from 'styled-components'\n\nimport { Action } from './Action'\nimport { Body } from './Body'\nimport { Title } from './Title'\nimport { stopMouseEventPropagation } from '../../utils/stopMouseEventPropagation'\n\nimport type { HTMLAttributes } from 'react'\n\nexport type DialogProps = HTMLAttributes & {\n isAbsolute?: boolean\n}\nexport function RawDialog({ children, className, isAbsolute = false, ...nativeProps }: DialogProps) {\n const controlledClassName = classnames('Component-Dialog', className)\n\n return (\n \n \n\n {children}\n \n )\n}\n\nexport const Box = styled.div<{\n $isAbsolute: boolean\n}>`\n position: ${p => (p.$isAbsolute ? 'absolute' : 'fixed')};\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow-y: auto;\n z-index: 9000;\n`\n\nconst Overlay = styled.div<{\n $isAbsolute: boolean\n}>`\n background-color: ${p => p.theme.color.charcoal};\n bottom: 0;\n left: 0;\n opacity: 0.53;\n position: ${p => (p.$isAbsolute ? 'absolute' : 'fixed')};\n right: 0;\n top: 0;\n z-index: 1;\n`\n\nconst Window = styled.div<{\n $isAbsolute: boolean\n}>`\n border-radius: 2px;\n bottom: 100px;\n box-shadow: 4px;\n max-width: 32rem;\n position: ${p => (p.$isAbsolute ? 'absolute' : 'fixed')};\n width: calc(100% - 2 * 8px);\n z-index: 1;\n @media (min-width: 740px) {\n bottom: auto;\n min-width: 586px;\n }\n`\n\nRawDialog.displayName = 'Dialog'\n\nexport const Dialog = Object.assign(RawDialog, {\n Action,\n Body,\n Title\n})\n","import { useMemo } from 'react'\nimport { Dropdown as RsuiteDropdown } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Accent } from '../../constants'\n\nimport type { IconProps } from '../../types'\nimport type { FunctionComponent } from 'react'\nimport type { DropdownMenuItemProps as RsuiteDropdownMenuItemProps } from 'rsuite'\n\nexport type DropdownItemProps = Omit & {\n Icon?: FunctionComponent\n accent?: Accent | undefined\n}\nexport function Item({ accent, Icon, ...originalProps }: DropdownItemProps) {\n const icon = useMemo(() => (Icon ? : undefined), [Icon])\n const hasIcon = useMemo(() => Boolean(Icon), [Icon])\n\n switch (accent) {\n case Accent.SECONDARY:\n return \n\n default:\n return \n }\n}\n\n// TODO We need to split that into multiple styled components as done in `\n\n <>\n {zones.map((zone, index) => (\n // eslint-disable-next-line react/no-array-index-key\n \n \n {zone[labelPropName]}\n\n {/* TODO Add `Accent.LINK` accent in @mtes-mct/monitor-ui and use it here. */}\n {/* eslint-disable-next-line jsx-a11y/anchor-is-valid, jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}\n centerZone(zone)}>\n \n Centrer sur la carte\n \n \n\n editZone(index, zone)} />\n deleteZone(index)}\n />\n \n ))}\n \n\n {hasError && {controlledError}}\n \n )\n}\n\nconst Row = styled.div`\n align-items: center;\n display: flex;\n margin: 8px 0 0;\n\n > button {\n margin: 0 0 0 8px;\n }\n`\n\nconst ZoneBox = styled.div<{\n $isLight: boolean\n}>`\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n display: flex;\n flex-grow: 1;\n font-size: 13px;\n line-height: 1.3077; // = 17px\n justify-content: space-between;\n padding: 6px 12px 6px;\n`\n\nconst Link = styled.a`\n align-items: center;\n cursor: pointer;\n display: inline-flex;\n\n > span {\n line-height: 1;\n margin: -2px 0 0 8px;\n }\n`\n","import classnames from 'classnames'\nimport { useCallback, useMemo, useRef, type FocusEvent } from 'react'\nimport { Input, type InputProps } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Field } from '../elements/Field'\nimport { FieldError } from '../elements/FieldError'\nimport { Label } from '../elements/Label'\nimport { useFieldUndefineEffect } from '../hooks/useFieldUndefineEffect'\nimport { useKey } from '../hooks/useKey'\nimport { usePreventWheelEvent } from '../hooks/usePreventWheelEvent'\nimport { normalizeString } from '../utils/normalizeString'\n\nimport type { Promisable } from 'type-fest'\n\nexport type NumberInputProps = Omit & {\n error?: string | undefined\n isErrorMessageHidden?: boolean | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n isUndefinedWhenDisabled?: boolean | undefined\n label: string\n name: string\n onChange?: ((nextValue: number | undefined) => Promisable) | undefined\n value?: number | undefined\n}\nexport function NumberInput({\n className,\n error,\n isErrorMessageHidden = false,\n isLabelHidden = false,\n isLight = false,\n isUndefinedWhenDisabled = false,\n label,\n onBlur,\n onChange,\n onFocus,\n style,\n value,\n ...originalProps\n}: NumberInputProps) {\n // eslint-disable-next-line no-null/no-null\n const inputRef = useRef(null)\n\n const controlledClassname = useMemo(() => classnames('Field-NumberInput', className), [className])\n const controlledError = useMemo(() => normalizeString(error), [error])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n const key = useKey([originalProps.disabled, originalProps.name])\n\n const preventWheelEvent = usePreventWheelEvent(inputRef)\n\n const handleChange = useCallback(\n (nextValue: string) => {\n if (!onChange) {\n return\n }\n\n const normalizedNextValueAsString = nextValue && nextValue.length ? nextValue : undefined\n const nextValueAsNumber = Number(normalizedNextValueAsString)\n const normalizedNextValue = !Number.isNaN(nextValueAsNumber) ? nextValueAsNumber : undefined\n\n onChange(normalizedNextValue)\n },\n [onChange]\n )\n\n const handleBlur = useCallback(\n (event: FocusEvent) => {\n event.target.removeEventListener('wheel', preventWheelEvent)\n\n if (onBlur) {\n onBlur(event)\n }\n },\n [onBlur, preventWheelEvent]\n )\n\n const handleFocus = useCallback(\n (event: FocusEvent) => {\n event.target.addEventListener('wheel', preventWheelEvent)\n\n if (onFocus) {\n onFocus(event)\n }\n },\n [onFocus, preventWheelEvent]\n )\n\n useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange)\n\n return (\n \n \n {label}\n \n\n \n\n {!isErrorMessageHidden && hasError && {controlledError}}\n \n )\n}\n\nconst StyledInput = styled(Input as any)<{\n $hasError: boolean\n $isLight: boolean\n}>`\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro)};\n border-radius: 0;\n font-size: 13px;\n /* TODO It should be 18px but computed line-height is stuck to min. 18.5px. Investigate that. */\n line-height: 19px;\n padding: 3px 8px 6px;\n vertical-align: center;\n width: 100%;\n\n :hover {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueYonder)} !important;\n }\n\n :active,\n :focus {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray)} !important;\n outline: 0;\n }\n`\n","import { useMemo, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport { useDebouncedCallback } from 'use-debounce'\n\nimport { THEME } from '../../theme'\nimport { isNumeric } from '../../utils/isNumeric'\n\nimport type { Coordinates } from '../../types'\n\ntype DDCoordinatesInputProps = {\n coordinates: Coordinates | undefined\n disabled: boolean | undefined\n isLight: boolean | undefined\n onChange: (nextCoordinates: Coordinates, coordinates: Coordinates | undefined) => void\n}\n// TODO This field should return undefined when cleared (i.e.: Select all & Backspace/Delete)\nexport function DDCoordinatesInput({\n coordinates,\n disabled = false,\n isLight = false,\n onChange\n}: DDCoordinatesInputProps) {\n const latitudeInputRef = useRef()\n const longitudeInputRef = useRef()\n\n const [latitudeError, setLatitudeError] = useState('')\n const [longitudeError, setLongitudeError] = useState('')\n\n const defaultValue = useMemo(() => {\n if (!coordinates) {\n return undefined\n }\n\n const [latitude, longitude] = coordinates\n\n if (isNumeric(latitude) && isNumeric(longitude)) {\n return {\n latitude: Number(latitude),\n longitude: Number(longitude)\n }\n }\n\n return {\n latitude: undefined,\n longitude: undefined\n }\n }, [coordinates])\n\n const handleChange = useDebouncedCallback((nextCoordinates: [number, number] | undefined) => {\n if (!latitudeInputRef.current || !longitudeInputRef.current) {\n return\n }\n\n const latitudeAsString = latitudeInputRef.current.value\n const longitudeAsString = longitudeInputRef.current.value\n\n setLongitudeError('')\n setLatitudeError('')\n\n if (!isNumeric(latitudeAsString)) {\n setLatitudeError('Champ Latitude incorrect')\n\n return\n }\n\n if (!isNumeric(longitudeAsString)) {\n setLongitudeError('Champ Longitude incorrect')\n\n return\n }\n\n const latitude = Number(latitudeAsString)\n const longitude = Number(longitudeAsString)\n\n onChange([latitude, longitude], nextCoordinates)\n }, 500)\n\n return (\n \n handleChange(coordinates)}\n placeholder=\"Latitude\"\n style={{\n backgroundColor: isLight ? THEME.color.white : THEME.color.gainsboro,\n border: latitudeError ? '1px solid red' : undefined\n }}\n />\n handleChange(coordinates)}\n placeholder=\"Longitude\"\n style={{\n backgroundColor: isLight ? THEME.color.white : THEME.color.gainsboro,\n border: longitudeError ? '1px solid red' : undefined\n }}\n />\n (DD)\n {latitudeError}\n {longitudeError}\n \n )\n}\n\nconst DDInput = styled.input`\n margin-right: 5px !important;\n width: 100px;\n`\n\nconst CoordinatesType = styled.span`\n margin-left: 7px;\n color: ${p => p.theme.color.slateGray};\n`\n\nconst Error = styled.span`\n color: red;\n display: block;\n`\n\nconst Box = styled.div`\n font-size: 13px;\n text-align: left;\n`\n","import { useEffect, useState } from 'react'\nimport { dmsToDecimal } from 'react-coordinate-input'\nimport { IMaskInput } from 'react-imask'\nimport styled from 'styled-components'\n\nimport { CoordinatesFormat, WSG84_PROJECTION } from '../../constants'\nimport { THEME } from '../../theme'\nimport { getCoordinates } from '../../utils/coordinates'\nimport { isNumeric } from '../../utils/isNumeric'\n\nimport type { Coordinates } from '../../types'\n\n// TODO Remove that once the fix is added and released.\n// Open issue: https://github.com/uNmAnNeR/imaskjs/issues/761\nconst UntypedIMaskInput: any = IMaskInput\n\ntype DMDCoordinatesInputProps = {\n coordinates: Coordinates | undefined\n coordinatesFormat: CoordinatesFormat\n disabled: boolean | undefined\n isLight: boolean | undefined\n onChange: (nextCoordinates: Coordinates, coordinates: Coordinates | undefined) => void\n}\n// TODO This field should return undefined when cleared (i.e.: Select all & Backspace/Delete)\nexport function DMDCoordinatesInput({\n coordinates,\n coordinatesFormat,\n disabled = false,\n isLight,\n onChange\n}: DMDCoordinatesInputProps) {\n const [error, setError] = useState('')\n const [value, setValue] = useState('')\n\n useEffect(() => {\n if (coordinates?.length && coordinatesFormat) {\n const nextValue = getCoordinates(\n [coordinates[1], coordinates[0]],\n WSG84_PROJECTION,\n CoordinatesFormat.DEGREES_MINUTES_DECIMALS\n )\n .map(coordinate => coordinate.replace(/[°′. ]/g, ''))\n .join('')\n\n setValue(nextValue)\n } else {\n setValue('')\n }\n }, [coordinates, coordinatesFormat])\n\n function completeCoordinates(mask) {\n setError('')\n\n // eslint-disable-next-line no-underscore-dangle\n const latitude = mask._unmaskedValue.substring(0, 7)\n // eslint-disable-next-line no-underscore-dangle\n const longitude = mask._unmaskedValue.substring(7, mask._unmaskedValue.length)\n const NS = latitude[latitude.length - 1].toUpperCase()\n if (!['N', 'S'].includes(NS)) {\n setError('La latitude doit être N ou S')\n\n return\n }\n const latitudeDegrees = parseInt(latitude.substring(0, 2), 10)\n if (latitudeDegrees < 0 || latitudeDegrees > 90) {\n setError('La latitude doit être comprise entre 0 et 90°')\n\n return\n }\n const latitudeMinutes = parseInt(latitude.substring(2, 4), 10)\n const latitudeSeconds = parseInt(latitude.substring(4, 6), 10)\n\n const EW = longitude[longitude.length - 1].toUpperCase()\n if (!['E', 'W'].includes(EW)) {\n setError('La longitude doit être E ou W')\n\n return\n }\n const longitudeDegrees = parseInt(longitude.substring(0, 3), 10)\n if (longitudeDegrees < 0 || longitudeDegrees > 180) {\n setError('La longitude doit être comprise entre 0 et 180°')\n\n return\n }\n const longitudeMinutes = parseInt(longitude.substring(3, 5), 10)\n const longitudeSeconds = parseInt(longitude.substring(5, 7), 10)\n\n const dLatitude = dmsToDecimal(latitudeDegrees, latitudeMinutes + 10 ** -2 * latitudeSeconds, 0, NS, 6)\n const dLongitude = dmsToDecimal(longitudeDegrees, longitudeMinutes + 10 ** -2 * longitudeSeconds, 0, EW, 6)\n\n if (isNumeric(dLatitude) && isNumeric(dLongitude)) {\n onChange([dLatitude as number, dLongitude as number], coordinates)\n } else {\n setError('Format lat/long invalide')\n }\n }\n\n return (\n \n setValue(mask.value)}\n onComplete={(_, mask) => completeCoordinates(mask)}\n placeholder=\"__° __.___′ _ ___° __.___′\"\n radix=\".\"\n style={{\n backgroundColor: isLight ? THEME.color.white : THEME.color.gainsboro,\n border: error ? '1px solid red' : undefined\n }}\n // TODO Use `defaultValue` here.\n value={value}\n />\n (DMD)\n {error}\n \n )\n}\n\nconst CoordinatesType = styled.span`\n margin-left: 7px;\n color: ${p => p.theme.color.slateGray};\n`\n\nconst Error = styled.span`\n color: ${p => p.theme.color.maximumRed};\n display: inline-block;\n`\n\nconst Box = styled.div`\n font-size: 13px;\n text-align: left;\n`\n","import { isEmpty } from 'ramda'\nimport { useCallback, useMemo } from 'react'\nimport CoordinateInput from 'react-coordinate-input'\nimport styled from 'styled-components'\n\nimport { THEME } from '../../theme'\n\nimport type { CoordinatesFormat } from '../../constants'\nimport type { Coordinates } from '../../types'\n\ntype DMSCoordinatesInputProps = {\n coordinates: Coordinates | undefined\n coordinatesFormat: CoordinatesFormat\n disabled: boolean | undefined\n isLight: boolean | undefined\n onChange: (nextCoordinates: Coordinates | undefined, coordinates: Coordinates | undefined) => void\n}\nexport function DMSCoordinatesInput({\n coordinates,\n coordinatesFormat,\n disabled = false,\n isLight,\n onChange\n}: DMSCoordinatesInputProps) {\n /** Convert the coordinates to the [latitude, longitude] string format */\n const defaultValue = useMemo(() => {\n if (!coordinates?.length || !coordinatesFormat) {\n return ''\n }\n\n return coordinates?.join(', ') || ''\n }, [coordinates, coordinatesFormat])\n\n const update = useCallback(\n nextCoordinates => {\n const normalizedNextCoordinates = !isEmpty(nextCoordinates) ? nextCoordinates : undefined\n\n onChange(normalizedNextCoordinates, coordinates)\n },\n [coordinates, onChange]\n )\n\n return (\n \n update(dd)}\n style={{\n backgroundColor: isLight ? THEME.color.white : THEME.color.gainsboro\n }}\n // TODO Use `defaultValue` here.\n value={defaultValue}\n />\n (DMS)\n \n )\n}\n\nconst CoordinatesType = styled.span`\n margin-left: 7px;\n color: ${p => p.theme.color.slateGray};\n`\n\nconst Box = styled.div`\n font-size: 13px;\n text-align: left;\n`\n","import classnames from 'classnames'\nimport { noop } from 'lodash/fp'\nimport { useCallback, useMemo } from 'react'\nimport styled from 'styled-components'\n\nimport { DDCoordinatesInput } from './DDCoordinatesInput'\nimport { DMDCoordinatesInput } from './DMDCoordinatesInput'\nimport { DMSCoordinatesInput } from './DMSCoordinatesInput'\nimport { CoordinatesFormat } from '../../constants'\nimport { FieldError } from '../../elements/FieldError'\nimport { Fieldset } from '../../elements/Fieldset'\nimport { useFieldUndefineEffect } from '../../hooks/useFieldUndefineEffect'\nimport { normalizeString } from '../../utils/normalizeString'\n\nimport type { FieldsetProps } from '../../elements/Fieldset'\nimport type { Coordinates } from '../../types'\nimport type { Promisable } from 'type-fest'\n\nexport type CoordinatesInputProps = FieldsetProps & {\n coordinatesFormat: CoordinatesFormat\n defaultValue?: Coordinates | undefined\n disabled?: boolean | undefined\n error?: string | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n label: string\n onChange?:\n | ((nextCoordinates: Coordinates | undefined, coordinates: Coordinates | undefined) => Promisable)\n | undefined\n}\nexport function CoordinatesInput({\n className,\n coordinatesFormat,\n defaultValue,\n error,\n isLabelHidden = false,\n isLight = false,\n label,\n onChange = noop,\n ...nativeProps\n}: CoordinatesInputProps) {\n const controlledClassName = classnames('Field-CoordinatesInput', className)\n const controlledError = useMemo(() => normalizeString(error), [error])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n\n const getCoordinatesInput = useCallback(() => {\n switch (coordinatesFormat) {\n case CoordinatesFormat.DEGREES_MINUTES_SECONDS:\n return (\n \n )\n\n case CoordinatesFormat.DEGREES_MINUTES_DECIMALS:\n return (\n \n )\n\n case CoordinatesFormat.DECIMAL_DEGREES:\n return (\n \n )\n\n default:\n return undefined\n }\n }, [defaultValue, nativeProps.disabled, onChange, coordinatesFormat, isLight])\n\n // TODO We must add a `handleDisable()` callback here to effectively empty the inputs when disabling this field.\n useFieldUndefineEffect(nativeProps.disabled, onChange /* , handleDisable */)\n\n return (\n \n {getCoordinatesInput()}\n\n {hasError && {controlledError}}\n \n )\n}\n\nconst StyledFieldset = styled(Fieldset as any)`\n input {\n background-color: ${p => (p.isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n border: ${p => (p.isLight ? `1px solid ${p.theme.color.lightGray}` : 'none')};\n color: ${p => p.theme.color.gunMetal};\n height: 33px;\n padding: 7px 11px;\n }\n`\n","import classnames from 'classnames'\nimport { useCallback, useEffect, useMemo, useRef, useState, type MouseEvent, type ReactNode } from 'react'\nimport { SelectPicker, type SelectPickerProps } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Field } from '../elements/Field'\nimport { FieldError } from '../elements/FieldError'\nimport { Label } from '../elements/Label'\nimport { useClickOutsideEffect } from '../hooks/useClickOutsideEffect'\nimport { useFieldUndefineEffect } from '../hooks/useFieldUndefineEffect'\nimport { useForceUpdate } from '../hooks/useForceUpdate'\nimport { useKey } from '../hooks/useKey'\nimport { type CustomSearch } from '../libs/CustomSearch'\nimport { type Option, type OptionAsRsuiteItemDataType, type OptionValueType } from '../types'\nimport { getRsuiteDataFromOptions } from '../utils/getRsuiteDataFromOptions'\nimport { getRsuiteValueFromOptionValue } from '../utils/getRsuiteValueFromOptionValue'\nimport { normalizeString } from '../utils/normalizeString'\n\nimport type { Promisable } from 'type-fest'\n\nexport type SelectProps = Omit<\n SelectPickerProps,\n | 'as'\n | 'container'\n | 'data'\n | 'defaultValue'\n | 'id'\n | 'onChange'\n | 'open'\n | 'renderMenuItem'\n | 'renderValue'\n | 'value'\n | 'valueKey'\n> & {\n /** Used to pass something else than `window.document` as a base container to attach global events listeners. */\n baseContainer?: Document | HTMLDivElement | null | undefined\n customSearch?: CustomSearch> | undefined\n /** Minimum search query length required to trigger custom search filtering. */\n customSearchMinQueryLength?: number | undefined\n error?: string | undefined\n isCleanable?: boolean | undefined\n isErrorMessageHidden?: boolean | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n isUndefinedWhenDisabled?: boolean | undefined\n label: string\n name: string\n onChange?: ((nextValue: OptionValue | undefined) => Promisable) | undefined\n optionValueKey?: keyof OptionValue | undefined\n options: Option[]\n value?: OptionValue | undefined\n}\nexport function Select({\n baseContainer,\n className,\n customSearch,\n customSearchMinQueryLength = 1,\n disabled = false,\n error,\n isCleanable = true,\n isErrorMessageHidden = false,\n isLabelHidden = false,\n isLight = false,\n isUndefinedWhenDisabled = false,\n label,\n onChange,\n options,\n optionValueKey,\n searchable = false,\n style,\n value,\n ...originalProps\n}: SelectProps) {\n // eslint-disable-next-line no-null/no-null\n const boxRef = useRef(null)\n /** Instance of `CustomSearch` */\n const customSearchRef = useRef(customSearch)\n\n const { forceUpdate } = useForceUpdate()\n\n const controlledClassname = useMemo(() => classnames('Field-Select', className), [className])\n const controlledError = useMemo(() => normalizeString(error), [error])\n const rsuiteData = useMemo(() => getRsuiteDataFromOptions(options, optionValueKey), [options, optionValueKey])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n const key = useKey([disabled, originalProps.name, value])\n const selectedRsuiteValue = useMemo(\n () => getRsuiteValueFromOptionValue(value, optionValueKey),\n [value, optionValueKey]\n )\n\n // Only used when `customSearch` prop is set\n const [controlledRsuiteData, setControlledRsuiteData] = useState(customSearch ? rsuiteData : undefined)\n const [isOpen, setIsOpen] = useState(false)\n\n const close = useCallback(() => {\n setIsOpen(false)\n }, [])\n\n const handleClean = useCallback(() => {\n if (!onChange) {\n return\n }\n\n onChange(undefined)\n }, [onChange])\n\n const handleSearch = useCallback(\n (nextQuery: string) => {\n if (!customSearchRef.current || nextQuery.trim().length < customSearchMinQueryLength) {\n setControlledRsuiteData(rsuiteData)\n\n return\n }\n\n const nextControlledRsuiteData =\n nextQuery.trim().length >= customSearchMinQueryLength\n ? getRsuiteDataFromOptions(customSearchRef.current.find(nextQuery), optionValueKey)\n : rsuiteData\n\n setControlledRsuiteData(nextControlledRsuiteData)\n },\n [customSearchMinQueryLength, optionValueKey, rsuiteData]\n )\n\n const handleSelect = useCallback(\n (_: string, selectedItem: OptionAsRsuiteItemDataType) => {\n close()\n\n if (onChange) {\n onChange(selectedItem.optionValue)\n }\n },\n [close, onChange]\n )\n\n const renderMenuItem = useCallback((node: ReactNode) => {String(node)}, [])\n\n const toggle = useCallback(\n (event: MouseEvent) => {\n if (disabled) {\n return\n }\n let targetElement = event.target as HTMLElement\n\n if (targetElement.tagName === 'path') {\n if (targetElement.parentElement) {\n targetElement = targetElement.parentElement\n }\n }\n\n if (\n targetElement.classList.contains('rs-picker-toggle') ||\n targetElement.classList.contains('rs-picker-toggle-value') ||\n targetElement.classList.contains('rs-stack-item') ||\n targetElement.classList.contains('rs-picker-toggle-caret') ||\n targetElement.classList.contains('rs-picker-toggle-placeholder')\n ) {\n setIsOpen(!isOpen)\n }\n },\n [isOpen, disabled]\n )\n\n const disabledItemValues = useMemo(\n () => (controlledRsuiteData || rsuiteData).filter(option => option.isDisabled).map(option => option.value),\n [controlledRsuiteData, rsuiteData]\n )\n\n useFieldUndefineEffect(isUndefinedWhenDisabled && disabled, onChange)\n\n useClickOutsideEffect(boxRef, close, baseContainer)\n\n useEffect(() => {\n forceUpdate()\n }, [forceUpdate])\n\n return (\n \n \n\n \n {boxRef.current && (\n true : undefined) as any}\n value={selectedRsuiteValue}\n {...originalProps}\n />\n )}\n \n\n {!isErrorMessageHidden && hasError && {controlledError}}\n \n )\n}\n\nconst StyledSelectPicker = styled(SelectPicker as any)<{\n $isLight: boolean\n}>`\n > .rs-picker-toggle {\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)} !important;\n border: 0;\n }\n`\n\nconst Box = styled.div<{\n $hasError: boolean\n}>`\n position: relative;\n user-select: none;\n width: 100%;\n\n > .rs-picker-select {\n width: 100%;\n\n > .rs-picker-toggle {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro)} !important;\n font-size: 13px;\n line-height: 1.3846;\n padding: 4px 40px 6px 8px;\n\n :hover {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueYonder)} !important;\n }\n\n :active,\n :focus {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray)} !important;\n }\n\n > .rs-stack {\n > .rs-stack-item {\n > .rs-picker-toggle-placeholder {\n font-size: 13px;\n line-height: 1.3846;\n }\n\n > .rs-picker-toggle-clean.rs-btn-close {\n top: 4px !important;\n }\n\n > svg {\n height: 18px;\n margin-top: -2px;\n }\n }\n }\n }\n }\n\n > .rs-picker-menu {\n max-width: 100%;\n\n > .rs-picker-search-bar {\n > .rs-picker-search-bar-input {\n background-color: ${p => p.theme.color.white};\n border: solid 1px ${p => p.theme.color.lightGray};\n border-radius: 0;\n font-size: 13px;\n padding: 4px 8px 6px 8px;\n }\n\n > svg {\n color: ${p => p.theme.color.lightGray};\n top: 11px;\n }\n }\n\n > .rs-picker-select-menu {\n > div[role='option'] {\n > .rs-picker-select-menu-item {\n font-size: 13px;\n line-height: 1.3846;\n overflow: hidden;\n padding: 6px 12px 10px 12px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n }\n }\n }\n`\n","import classnames from 'classnames'\nimport { useCallback, useMemo, useRef } from 'react'\nimport { Input } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Field } from '../elements/Field'\nimport { FieldError } from '../elements/FieldError'\nimport { Label } from '../elements/Label'\nimport { useFieldUndefineEffect } from '../hooks/useFieldUndefineEffect'\nimport { useKey } from '../hooks/useKey'\nimport { normalizeString } from '../utils/normalizeString'\n\nimport type { MutableRefObject, TextareaHTMLAttributes } from 'react'\nimport type { Promisable } from 'type-fest'\n\nexport type TextareaProps = Omit<\n TextareaHTMLAttributes,\n 'defaultValue' | 'id' | 'onChange' | 'value'\n> & {\n error?: string | undefined\n isErrorMessageHidden?: boolean | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n isUndefinedWhenDisabled?: boolean | undefined\n label: string\n name: string\n onChange?: ((nextValue: string | undefined) => Promisable) | undefined\n value?: string | undefined\n}\nexport function Textarea({\n className,\n error,\n isErrorMessageHidden = false,\n isLabelHidden = false,\n isLight = false,\n isUndefinedWhenDisabled = false,\n label,\n onChange,\n rows = 3,\n style,\n value,\n ...originalProps\n}: TextareaProps) {\n const inputRef = useRef() as MutableRefObject\n\n const controlledClassname = useMemo(() => classnames('Field-Textarea', className), [className])\n const controlledError = useMemo(() => normalizeString(error), [error])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n const key = useKey([originalProps.disabled, originalProps.name])\n\n const handleChange = useCallback(() => {\n if (!onChange) {\n return\n }\n\n const nextValue = inputRef.current.value\n const normalizedNextValue = nextValue.trim().length ? nextValue : undefined\n\n onChange(normalizedNextValue)\n }, [onChange])\n\n useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange)\n\n return (\n \n \n {label}\n \n\n \n\n {!isErrorMessageHidden && hasError && {controlledError}}\n \n )\n}\n\nconst StyledInput = styled(Input as any)<{\n $hasError: boolean\n $isLight: boolean\n}>`\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro)};\n font-size: 13px;\n padding: 7px 11px;\n width: 100%;\n\n ::placeholder {\n color: ${p => (p.$isLight ? p.theme.color.slateGray : p.theme.color.slateGray)};\n }\n\n :hover {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueYonder)} !important;\n }\n\n :active,\n :focus {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray)} !important;\n outline: 0;\n }\n`\n","import classnames from 'classnames'\nimport { type FunctionComponent, useCallback, useMemo } from 'react'\nimport { Input } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Accent, Size } from '../constants'\nimport { Field } from '../elements/Field'\nimport { FieldError } from '../elements/FieldError'\nimport { IconButton } from '../elements/IconButton'\nimport { Label } from '../elements/Label'\nimport { useFieldUndefineEffect } from '../hooks/useFieldUndefineEffect'\nimport { useKey } from '../hooks/useKey'\nimport { Close, Search } from '../icons'\nimport { THEME } from '../theme'\nimport { normalizeString } from '../utils/normalizeString'\n\nimport type { IconProps } from '../types'\nimport type { InputProps } from 'rsuite'\nimport type { Promisable } from 'type-fest'\n\nexport type TextInputProps = Omit & {\n Icon?: FunctionComponent | undefined\n error?: string | undefined\n isErrorMessageHidden?: boolean | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n isSearchInput?: boolean\n isUndefinedWhenDisabled?: boolean | undefined\n label: string\n name: string\n onChange?: ((nextValue: string | undefined) => Promisable) | undefined\n size?: Size | undefined\n value?: string | undefined\n}\nexport function TextInput({\n className,\n error,\n Icon,\n isErrorMessageHidden = false,\n isLabelHidden = false,\n isLight = false,\n isSearchInput = false,\n isUndefinedWhenDisabled = false,\n label,\n onChange,\n size = Size.NORMAL,\n style,\n type = 'text',\n value,\n ...originalProps\n}: TextInputProps) {\n const controlledClassname = useMemo(() => classnames('Field-TextInput', className), [className])\n const controlledError = useMemo(() => normalizeString(error), [error])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n const key = useKey([originalProps.disabled, originalProps.name])\n\n const clean = useCallback(() => {\n if (!onChange) {\n return\n }\n onChange(undefined)\n }, [onChange])\n\n const handleChange = useCallback(\n (nextValue: string | null) => {\n if (!onChange) {\n return\n }\n\n const normalizedNextValue = nextValue && nextValue.trim().length ? nextValue : undefined\n\n onChange(normalizedNextValue)\n },\n [onChange]\n )\n\n useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange)\n\n return (\n \n \n {label}\n \n\n \n \n {isSearchInput && !Icon && (\n \n {value && (\n <>\n \n \n \n )}\n\n \n \n )}\n\n {Icon && }\n \n\n {!isErrorMessageHidden && hasError && {controlledError}}\n \n )\n}\n\nconst PADDING: Record = {\n [Size.LARGE]: '8px 16px 11px',\n [Size.NORMAL]: '3px 8px 6px',\n [Size.SMALL]: '3px 8px 6px'\n}\nconst PADDING_WITH_ICON: Record = {\n [Size.LARGE]: '8px 40px 11px 16px',\n [Size.NORMAL]: '3px 38px 6px 8px',\n [Size.SMALL]: '3px 38px 6px 8px'\n}\n\nconst IconsContainer = styled.div<{\n $size: Size\n}>`\n align-items: center;\n display: flex;\n position: absolute;\n right: 5px;\n top: ${p => (p.$size === Size.LARGE ? '10px' : '5px')};\n`\n\nconst Separator = styled.div`\n border-right: 1px solid ${p => p.theme.color.lightGray};\n height: 20px;\n margin-left: 4px;\n margin-right: 6px;\n padding-top: 3px;\n`\n\nconst StyledInput = styled(Input as any)<{\n $hasError: boolean\n $hasIcon: boolean\n $isLight: boolean\n $size: Size\n}>`\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro)};\n border-radius: 0;\n font-size: 13px;\n /* TODO It should be 18px but computed line-height is stuck to min. 18.5px. Investigate that. */\n line-height: 19px;\n padding: ${p => (p.$hasIcon ? PADDING_WITH_ICON[p.$size] : PADDING[p.$size])};\n vertical-align: center;\n width: 100%;\n\n ::placeholder {\n color: ${p => (p.$isLight ? p.theme.color.slateGray : p.theme.color.slateGray)};\n }\n\n :hover {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueYonder)} !important;\n }\n\n :active,\n :focus {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray)} !important;\n outline: 0;\n }\n`\n\nconst InputBox = styled.div<{\n $size: Size\n}>`\n position: relative;\n width: 100%;\n > .Element-IconBox {\n position: absolute;\n right: 10px;\n top: ${p => (p.$size === Size.LARGE ? '10px' : '5px')};\n }\n`\n","import classnames from 'classnames'\nimport styled from 'styled-components'\n\nimport type { TableHTMLAttributes } from 'react'\n\nconst Table = styled.table.attrs>(props => ({\n className: classnames('Table-SimpleTable', props.className)\n}))`\n width: 100%;\n table-layout: auto;\n overflow: auto;\n border-collapse: separate;\n`\nconst Head = styled.thead`\n position: sticky;\n top: 0;\n z-index: 1;\n\n th:first-child {\n border-left: 1px solid ${p => p.theme.color.lightGray};\n }\n`\n\nconst SortContainer = styled.div`\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: default;\n\n &.cursor-pointer {\n cursor: pointer;\n }\n`\nconst Th = styled.th`\n background-color: ${p => p.theme.color.gainsboro};\n border-top: 1px solid ${p => p.theme.color.lightGray};\n border-bottom: 1px solid ${p => p.theme.color.lightGray};\n border-right: 1px solid ${p => p.theme.color.lightGray};\n color: ${p => p.theme.color.slateGray};\n font-size: 13px;\n font-weight: 500;\n padding: 10px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`\n\nconst BodyTr = styled.tr`\n :hover {\n > td {\n background-color: ${p => p.theme.color.blueYonder25};\n }\n }\n td:first-child {\n border-left: 1px solid ${p => p.theme.color.lightGray};\n }\n`\n\nconst Td = styled.td<{ $isCenter?: boolean }>`\n font-size: 13px;\n font-weight: 500;\n color: ${p => p.theme.color.gunMetal};\n text-align: ${p => (p.$isCenter ? 'center' : 'left')};\n border-bottom: 1px solid ${p => p.theme.color.lightGray};\n border-right: 1px solid ${p => p.theme.color.lightGray};\n overflow: hidden;\n padding: 10px;\n text-overflow: ellipsis;\n white-space: nowrap;\n`\n\nexport const SimpleTable = {\n BodyTr,\n Head,\n SortContainer,\n Table,\n Td,\n Th\n}\n","import styled from 'styled-components'\n\nimport { Chevron } from '../../icons'\n\nexport const SortingIcon = styled(Chevron as any)<{\n $isDescending?: boolean\n}>`\n cursor: pointer;\n height: 16px;\n margin-right: 8px;\n margin-top: 0px;\n transform: ${props => (!props.$isDescending ? 'rotate(0deg)' : 'rotate(-180deg)')};\n transition: all 0.5s;\n width: 16px;\n`\n","import { flexRender, type Header } from '@tanstack/react-table'\n\nimport { SortingIcon } from './SortingIcon'\nimport { SortingArrows } from '../../icons'\nimport { SimpleTable } from '../SimpleTable'\n\nimport type { ReactNode } from 'react'\n\nexport type ThProps = {\n children?: ReactNode\n header: Header\n}\nexport function Th({ children, header }: ThProps) {\n const controlledChildren =\n children || !header.isPlaceholder ? (\n \n {flexRender(header.column.columnDef.header, header.getContext())}\n\n {header.column.getCanSort() &&\n ({\n asc: ,\n desc: \n }[header.column.getIsSorted() as string] ?? )}\n \n ) : undefined\n\n return (\n \n {controlledChildren}\n \n )\n}\n","import styled from 'styled-components'\n\nimport { RowCheckbox } from './RowCheckbox'\nimport { SimpleTable } from '../SimpleTable'\n\nexport { RowCheckbox }\n\nconst Table = styled(SimpleTable.Table)`\n border-collapse: separate;\n border-spacing: 0 5px;\n`\nconst Head = styled(SimpleTable.Head)`\n th:last-child {\n border-right: 1px solid ${p => p.theme.color.lightGray};\n }\n`\n\nconst SortContainer = styled(SimpleTable.SortContainer)`\n justify-content: start;\n gap: 8px;\n`\nconst Th = styled(SimpleTable.Th)`\n background-color: ${p => p.theme.color.white};\n border-top: 1px solid ${p => p.theme.color.lightGray};\n border-bottom: 1px solid ${p => p.theme.color.lightGray};\n border-right: none;\n padding: 2px 16px;\n`\n\nconst BodyTr = styled(SimpleTable.BodyTr)<{ $isHighlighted?: boolean }>`\n td:first-child {\n border-left: ${p =>\n p.$isHighlighted ? `2px solid ${p.theme.color.blueGray}` : `1px solid ${p.theme.color.lightGray}`};\n }\n td:last-child {\n border-right: ${p =>\n p.$isHighlighted ? `2px solid ${p.theme.color.blueGray}` : `1px solid ${p.theme.color.lightGray}`};\n overflow: visible;\n }\n`\n\nconst Td = styled(SimpleTable.Td)<{ $hasRightBorder: boolean; $isHighlighted?: boolean }>`\n background-color: ${p => p.theme.color.cultured};\n border-top: ${p =>\n p.$isHighlighted ? `2px solid ${p.theme.color.blueGray}` : `1px solid ${p.theme.color.lightGray}`};\n border-bottom: ${p =>\n p.$isHighlighted ? `2px solid ${p.theme.color.blueGray}` : `1px solid ${p.theme.color.lightGray}`};\n border-right: none;\n padding: 4px 16px;\n border-right: ${p => (p.$hasRightBorder ? `1px solid ${p.theme.color.lightGray}` : '')};\n`\n\nexport const TableWithSelectableRows = {\n BodyTr,\n Head,\n RowCheckbox,\n SortContainer,\n Table,\n Td,\n Th\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/main.cd7a79f3.iframe.bundle.js.map b/main.cd7a79f3.iframe.bundle.js.map deleted file mode 100644 index 5e6a8b7cc..000000000 --- a/main.cd7a79f3.iframe.bundle.js.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"file":"main.cd7a79f3.iframe.bundle.js","mappings":";;;;;;;;;;;;;;;;;;;;AAkCA;AC7BA;AACA;;;;;;AAQA;;AAEA;;;;;AAOA;AAGA;;;;;;;AASA;;;;AAMA;AACA;AAiBA;;AAGA;AAZA;;;;;;;AAcA;;;ACoCA;;;AAGA;AACA;;;;;;AAQA;;;;;;;AASA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;;;;;AAKA;AACA;AACA;;;;;AAKA;AACA;AACA;;AAIA;;AAEA;AACA;;;;AAIA;AACA;AACA;;;;;AAKA;AACA;AACA;;;;;;AAMA;AACA;;AAIA;AACA;AACA;AACA;;;;AAIA;AACA;AACA;;;;;AAKA;AACA;AACA;;;;;AAKA;AACA;AACA;;;;;;ACrGA;;AAEA;;;;;;;;;;;;;;;;;;;;AAwBA;;AAIA;AACA;;;;;AAKA;AACA;;;;;;AAMA;AACA;;;;;;AAMA;AACA;;;;;AC9HA;;;;;;AAMA;;;;;;AAMA;;;;;;AAMA;;;;;;;AAOA;;;;;;;AAOA;;;;;;;AAOA;;;;;;AAMA;;;;;;;;;;AC5DA;;;ACeA;;;;;;AAMA;;;;;;AAMA;;;;;;AAMA;;;;;;;AAOA;;;;;;;AAOA;;;;;;;AAOA;;;;;;AAMA;;;;;;;;AD5DA;AEJA;;;;;;;;;;;;;;;;;;;;;;;ACAA;;;;;;;;;;;;;AAaA;;;;;;;;;ACRA;AACA;;;ACmBA;;;;;;;;;;AAYA;AAGA;;;;AAIA;;;;AAMA;;;;;AAOA;;;;;;;AASA;ACtCA;AACA;;;;;AAKA;AACA;AACA;;;;;AAMA;;;;;AAOA;;;;;;;;;;;;ACfA;AACA;AACA;;;AAGA;;;AAGA;AACA;AACA;;;;AAIA;AACA;AACA;;;;AAIA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;AAwBA;;;;AAMA;;;;;;AAMA;;;;;;;;;;;;;AAeA;;ACzFA;;AAEA;AACA;;;;;;AAMA;;;AAGA;;;;AAIA;;;;;;;ACvBA;;;;;;;;;;;AAaA;;ACXA;;;;AAIA;AACA;;;;;;AC4BA;AACA;AACA;;;;;;;AASA;AACA;;;;;;AAMA;;;;;AAKA;;;;;AAKA;;AAIA;AACA;AACA;AAGA;AACA;AACA;;;;AAIA;AACA;;;;;AAKA;AACA;;;;;AAKA;AACA;;;AChGA;;AAEA;;;;;;;;;;;;;;;ACwBA;AAIA;AACA;;;;;AAOA;;;;;;;AClCA;AAGA;;;;;;;;;;;;ACiCA;AAKA;AACA;;;AAGA;AAGA;;;AClDA;AACA;;;;;;ACCA;AAGA;;;;;ACkFA;;AAEA;AAOA;;AAEA;;;AAGA;;;;;;;;;;;AAWA;;AAIA;AAGA;AACA;AAIA;AAGA;AACA;AAGA;AAGA;AACA;;;;;;;;;ACqEA;;;AAKA;;AAIA;;;AAGA;;;AAKA;;;;;AAOA;;AAEA;;;;;;;;;;;;;;;;AAkBA;AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjLA;;;;;;;ACwFA;;;;;;AAMA;AACA;;;;;;;;;AASA;;;;;AAKA;;;;;;;;;;;AAWA;;;;;;;;;;;;;;;;;;;AAmBA;AACA;;;;;;AAMA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChIA;;;;;;;;;;;;;;;;;;AAkBA;;;;;AAKA;;;;;AAKA;;;;AAIA;;;;;;;AAOA;;;AAGA;;;;;;AAMA;;;;;;;;;;;;;AAaA;;;;;;;;;;;;;;;AAeA;AACA;;;;;AAKA;;;;AAIA;;;AAGA;;;;;;;;;;AAUA;;;AAGA;;;;;;;AAOA;;;;;;;;;AASA;AACA;;;AAGA;AACA;;;;;;;;;ACdA;;;;;;AAMA;;;AAGA;;;;AC0BA;AACA;AAIA;;;;AAIA;;;;AAIA;AAKA;;;;;;;ACxJA;AACA;;;;;;;;AAQA;;;;;;;;;;;;;;AAcA;;;AAGA;;AAIA;AAGA;AACA;;;;;;AAMA;;;;;;;;;ACkGA;AACA;AAIA;;;AAGA;;;;;AAKA;AAKA;;AAIA;;;;;;;;;;;;;;AC4GA;;;AAGA;;;AAGA;;AAIA;AACA;;;;AAMA;;AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;AC1QA;;;;;;;;;;;;;;;;;;;;;;;AAuBA;;;;AAIA;;;;;AAKA;;;;;AAKA;;;;AAIA;;;;;;;AAOA;;;AAGA;;;;;;AAMA;;;;;;;;;;;;;AAaA;;;;;;;;;;;;;;;AAeA;AACA;;;;;AAKA;;;;AAIA;;;AAGA;;;;;;;;;;AAUA;;;AAGA;;;;;;;AAOA;;;;;;;;;AASA;AACA;;;AAGA;AACA;;;;;;;;;;;;;ACiSA;;;AAGA;;;AAGA;;AAIA;AACA;;;;AAMA;;AAKA;;AC5dA;;AAEA;;;;;;;AAOA;;AAIA;;;;AAIA;;;;;;;;AAUA;;;;;;;;;;;;;ACkFA;;AAEA;;;;;AAcA;;;;;AAKA;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxKA;;AAEA;;AAEA;;;;;;;;;;;;;;;;;;;AAmBA;;;;;;AAQA;;;;;;AAQA;;;;;;;;;;;;AAcA;;;AAGA;;;;;AAKA;;;;;;;;;;;;;ACaA;AAGA;;;;;;;AASA;;;;;;;;;;AClEA;AACA;;;;;;;;;;AAUA;;;;;AAKA;;;;;;ACzBA;;AAEA;AAGA;;;AAKA;;;;;ACDA;AAGA;AACA;;AAIA;;;;;ACtEA;AAGA;;;;;ACiCA;AACA;AACA;;;;;;ACyHA;;;AAKA;;;;;;;;;AAWA;;;;;;AAMA;;;;;AAKA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA;AACA;;;;;;;AAOA;;;;;;;;;;;;;;;;;;;AC5LA;AACA;;;;;;AAMA;;;;AAIA;;;;;AAKA;;;;;;;;ACmCA;AAGA;AACA;;;;;AAOA;AAMA;AACA;;;;;AAKA;;;;;AAKA;;;;AAIA;;;;;AAKA;;;AAKA;;;;;;AAQA;;;;;;;ACxLA;;;;;;AAMA;;AAIA;;;;;;;;;AAUA;AACA;AACA;AACA;AACA;AACA;;;;;;;AAiCA;;;AArBA;;;;AAIA;;AAmBA;;;AAZA;AACA;AACA;AACA;;;;;AAaA;;;;;AClEA;;;ACCA;;;ACDA;;AAEA;;AAIA;;;AAIA;AACA;AACA;AACA;;;AAoBA;;AAbA;;;AAeA;AATA;AACA;;;AAGA;AAUA","sources":["webpack://@mtes-mct/monitor-ui__root/./.storybook/components/GlobalDecorator.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/MapMenuDialog/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Button.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/IconButton.tsx","webpack://@mtes-mct/monitor-ui__root/./src/GlobalStyle.ts","webpack://@mtes-mct/monitor-ui__root/./src/theme.ts","webpack://@mtes-mct/monitor-ui__root/./src/OnlyFontGlobalStyle.ts","webpack://@mtes-mct/monitor-ui__root/./src/components/Dialog/Action.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dialog/Body.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dialog/Title.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dialog/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dropdown/Item.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Dropdown/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/SideMenu/Button.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/SideMenu/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/IconBox.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/SingleTag.tsx","webpack://@mtes-mct/monitor-ui__root/./src/symbols/ExclamationPoint.tsx","webpack://@mtes-mct/monitor-ui__root/./src/components/Message.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Legend.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Fieldset.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/FieldError.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Label.tsx","webpack://@mtes-mct/monitor-ui__root/./src/elements/Tag/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/Search.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/Checkbox.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CheckPicker.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DatePicker/CalendarPicker.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/NumberInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/DateInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/RangedTimePicker.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/TimeInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DatePicker/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/RangeCalendarPicker.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/DateRangePicker/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/MultiCheckbox.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/MultiSelect.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/MultiRadio.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/MultiZoneEditor/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/NumberInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CoordinatesInput/DDCoordinatesInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CoordinatesInput/DMDCoordinatesInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CoordinatesInput/DMSCoordinatesInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/CoordinatesInput/index.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/Select.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/Textarea.tsx","webpack://@mtes-mct/monitor-ui__root/./src/fields/TextInput.tsx","webpack://@mtes-mct/monitor-ui__root/./src/tables/SimpleTable.tsx","webpack://@mtes-mct/monitor-ui__root/./src/tables/DataTable/SortingIcon.ts","webpack://@mtes-mct/monitor-ui__root/./src/tables/DataTable/Th.tsx","webpack://@mtes-mct/monitor-ui__root/./src/tables/TableWithSelectableRows/index.tsx"],"sourcesContent":["import { StrictMode } from 'react'\nimport { CustomProvider as RsuiteCustomProvider } from 'rsuite'\nimport rsuiteFrFr from 'rsuite/locales/fr_FR'\nimport { createGlobalStyle, ThemeProvider } from 'styled-components'\n\nimport { GlobalStyle, THEME } from '../../src'\n\nimport type { StoryFn } from '@storybook/react'\n\nconst UntypedGlobalStyle = GlobalStyle as any\nconst UntypedThemeProvider = ThemeProvider as any\n\nconst CustomGlobalStyle: any = createGlobalStyle`\n html,\n body.sb-show-main.sb-main-padded {\n height: 100%;\n padding: 0;\n width: 640px;\n }\n\n code {\n background-color: #1e1e1e;\n color: #ffffff;\n font-size: 12px;\n padding: 2px 6px;\n vertical-align: 1px;\n }\n\n #root {\n height: 100%;\n width: 100%;\n }\n`\n\nexport function GlobalDecorator(Story: StoryFn) {\n return (\n \n \n \n )\n}\n\nexport function GlobalDecoratorWrapper({ children }) {\n return (\n \n \n \n \n\n {children}\n \n \n )\n}\n","import styled from 'styled-components'\n\nimport { IconButton } from '../../elements/IconButton'\n\nconst Container = styled.div`\n background-color: ${p => p.theme.color.white};\n box-shadow: 0px 3px 6px ${p => p.theme.color.slateGray};\n display: flex;\n flex-direction: column;\n margin-right: 6px;\n max-height: 520px;\n width: 320px;\n`\n\nconst Header = styled.div`\n align-items: center;\n background-color: ${p => p.theme.color.charcoal};\n display: flex;\n height: 40px;\n justify-content: space-between;\n padding: 9px 4px 9px 10px;\n`\n\nconst Title = styled.span.attrs(props => ({\n title: String(props.children)\n}))`\n color: ${p => p.theme.color.white};\n font-size: 16px;\n line-height: 22px;\n margin-right: 6px;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n`\n\nconst Body = styled.div`\n height: calc(100% - 40px);\n overflow-y: auto;\n padding: 12px;\n`\n\nconst VisibilityButton = styled(IconButton as any)`\n background-color: ${p => p.theme.color.gainsboro};\n`\n\nconst CloseButton = styled(IconButton as any)`\n color: white;\n`\n\nconst Footer = styled.div`\n background: ${p => p.theme.color.white};\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 12px;\n width: 100%;\n z-index: 10;\n`\n\nexport const MapMenuDialog = {\n Body,\n CloseButton,\n Container,\n Footer,\n Header,\n Title,\n VisibilityButton\n}\n","import classnames from 'classnames'\nimport { useCallback, useMemo, type MouseEvent, type ButtonHTMLAttributes, type FunctionComponent } from 'react'\nimport styled from 'styled-components'\n\nimport { Accent, Size } from '../constants'\nimport { type IconProps } from '../types'\nimport { stopMouseEventPropagation } from '../utils/stopMouseEventPropagation'\n\nconst ICON_SIZE: Record = {\n [Size.LARGE]: 20,\n [Size.NORMAL]: 20,\n [Size.SMALL]: 12\n}\n\nexport type ButtonProps = Omit, 'children'> & {\n Icon?: FunctionComponent | undefined\n accent?: Accent | undefined\n children?: string | undefined\n isFullWidth?: boolean | undefined\n size?: Size | undefined\n /** Prevent onClick event propagation. */\n withUnpropagatedClick?: boolean | undefined\n}\nexport function Button({\n accent = Accent.PRIMARY,\n children,\n className,\n Icon,\n isFullWidth = false,\n onClick,\n size = Size.NORMAL,\n type = 'button',\n withUnpropagatedClick = false,\n ...nativeProps\n}: ButtonProps) {\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (withUnpropagatedClick) {\n stopMouseEventPropagation(event)\n }\n\n if (onClick) {\n onClick(event)\n }\n },\n [onClick, withUnpropagatedClick]\n )\n\n const commonChildren = useMemo(\n () => (\n <>\n {Icon && }\n {children && {children}}\n \n ),\n [children, Icon, size]\n )\n\n const commonProps = useMemo(\n () => ({\n as: StyledButton,\n children: commonChildren,\n className: classnames('Element-Button', className),\n isFullWidth,\n onClick: handleClick,\n size,\n type,\n ...nativeProps\n }),\n [className, commonChildren, handleClick, isFullWidth, nativeProps, size, type]\n )\n\n switch (accent) {\n case Accent.SECONDARY:\n return \n\n case Accent.TERTIARY:\n return \n\n default:\n return \n }\n}\n\nconst FONT_SIZE: Record = {\n [Size.LARGE]: '13px',\n [Size.NORMAL]: '13px',\n [Size.SMALL]: '11px'\n}\nconst PADDING: Record = {\n [Size.LARGE]: '12px',\n [Size.NORMAL]: '6px 12px',\n [Size.SMALL]: '5px 8px 4px'\n}\nconst StyledButton = styled.button<{\n isFullWidth: boolean\n size: Size\n}>`\n align-items: center;\n display: inline-flex;\n font-size: ${p => FONT_SIZE[p.size]};\n justify-content: center;\n max-width: 100%;\n padding: ${p => PADDING[p.size]};\n width: ${p => (p.isFullWidth ? '100%' : 'auto')};\n\n /* SVG Icon Components are wrapped within a
*/\n > div {\n margin-right: 5px;\n }\n`\n\nconst ButtonLabel = styled.span`\n line-height: 1.3846;\n margin-top: -3px;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`\n\nexport const PrimaryButton = styled.button`\n background-color: ${p => p.theme.color.charcoal};\n border: 1px solid ${p => p.theme.color.charcoal};\n color: ${p => p.theme.color.gainsboro};\n\n :hover,\n &._hover {\n background-color: ${p => p.theme.color.blueYonder};\n border: 1px solid ${p => p.theme.color.blueYonder};\n color: ${p => p.theme.color.white};\n }\n\n :active,\n &._active {\n background-color: ${p => p.theme.color.blueGray};\n border: 1px solid ${p => p.theme.color.blueGray};\n color: ${p => p.theme.color.white};\n }\n\n :disabled,\n &._disabled {\n background-color: ${p => p.theme.color.lightGray};\n border: 1px solid ${p => p.theme.color.lightGray};\n color: ${p => p.theme.color.cultured};\n }\n`\n\nexport const SecondaryButton = styled.button`\n background-color: transparent;\n border: 1px solid ${p => p.theme.color.charcoal};\n color: ${p => p.theme.color.charcoal};\n\n :hover,\n &._hover {\n background-color: ${p => p.theme.color.blueYonder25};\n border: 1px solid ${p => p.theme.color.blueYonder};\n color: ${p => p.theme.color.blueYonder};\n }\n\n :active,\n &._active {\n background-color: ${p => p.theme.color.blueGray25};\n border: 1px solid ${p => p.theme.color.blueGray};\n color: ${p => p.theme.color.blueGray};\n }\n\n :disabled,\n &._disabled {\n background-color: transparent;\n border: 1px solid ${p => p.theme.color.lightGray};\n color: ${p => p.theme.color.lightGray};\n }\n`\n\nexport const TertiaryButton = styled.button`\n background-color: ${p => p.theme.color.white};\n border: 1px solid ${p => p.theme.color.white};\n color: ${p => p.theme.color.charcoal};\n\n :hover,\n &._hover {\n background-color: ${p => p.theme.color.blueYonder25};\n border: 1px solid ${p => p.theme.color.blueYonder25};\n color: ${p => p.theme.color.blueYonder};\n }\n\n :active,\n &._active {\n background-color: ${p => p.theme.color.blueGray25};\n border: 1px solid ${p => p.theme.color.blueGray};\n color: ${p => p.theme.color.blueGray};\n }\n\n :disabled,\n &._disabled {\n background-color: ${p => p.theme.color.white};\n border: 1px solid ${p => p.theme.color.lightGray};\n color: ${p => p.theme.color.lightGray};\n }\n`\n","import classnames from 'classnames'\nimport { useMemo, type MouseEvent, type ButtonHTMLAttributes, type FunctionComponent, useCallback } from 'react'\nimport styled, { css } from 'styled-components'\n\nimport { PrimaryButton, SecondaryButton } from './Button'\nimport { Accent, Size } from '../constants'\nimport { type IconProps } from '../types'\nimport { stopMouseEventPropagation } from '../utils/stopMouseEventPropagation'\n\nconst ICON_SIZE_IN_PX: Record = {\n [Size.LARGE]: 26,\n [Size.NORMAL]: 20,\n [Size.SMALL]: 14\n}\n\nexport type IconButtonProps = Omit, 'children'> & {\n Icon: FunctionComponent\n accent?: Accent | undefined\n color?: string | undefined\n /** In pixels, override `size` prop default values. */\n iconSize?: number | undefined\n /** Remove button border and padding. */\n isCompact?: boolean | undefined\n size?: Size | undefined\n /** Prevent onClick event propagation. */\n withUnpropagatedClick?: boolean | undefined\n}\nexport function IconButton({\n accent = Accent.PRIMARY,\n className,\n color,\n Icon,\n iconSize,\n isCompact,\n onClick,\n size = Size.NORMAL,\n type = 'button',\n withUnpropagatedClick = false,\n ...nativeProps\n}: IconButtonProps) {\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (withUnpropagatedClick) {\n stopMouseEventPropagation(event)\n }\n\n if (onClick) {\n onClick(event)\n }\n },\n [onClick, withUnpropagatedClick]\n )\n\n const commonChildren = useMemo(\n () => ,\n [color, Icon, iconSize, size]\n )\n\n const commonProps = useMemo(\n () => ({\n children: commonChildren,\n className: classnames('Element-IconButton', className),\n isCompact,\n onClick: handleClick,\n size,\n type,\n ...nativeProps\n }),\n [className, commonChildren, handleClick, isCompact, nativeProps, size, type]\n )\n\n switch (accent) {\n case Accent.SECONDARY:\n return \n\n case Accent.TERTIARY:\n return \n\n default:\n return \n }\n}\n\nconst PADDING: Record = {\n [Size.LARGE]: '7px',\n [Size.NORMAL]: '5px',\n [Size.SMALL]: '3px'\n}\n\n// We can't use $-prefixed props here for some reason (maybe because the `as` prop exclude them?).\nconst StyledButton = styled.button<{\n isCompact: boolean | undefined\n size: Size\n}>`\n align-items: center;\n display: flex;\n justify-content: center;\n padding: ${p => (p.isCompact ? 0 : PADDING[p.size])};\n\n ${p =>\n p.isCompact &&\n css`\n border: 0;\n\n :hover,\n &._hover {\n border: 0;\n }\n border: 0;\n\n :active,\n &._active {\n border: 0;\n }\n border: 0;\n\n :disabled,\n &._disabled {\n border: 0;\n }\n `}\n`\n\nconst TertiaryButton = styled.button<{\n isCompact: boolean | undefined\n}>`\n background-color: transparent;\n border: ${p => (p.isCompact ? 0 : '1px solid transparent')};\n color: ${p => p.theme.color.charcoal};\n\n :hover,\n &._hover {\n background-color: transparent;\n border: ${p => (p.isCompact ? 0 : '1px solid transparent')};\n color: ${p => p.theme.color.blueYonder};\n }\n\n :active,\n &._active {\n background-color: transparent;\n border: ${p => (p.isCompact ? 0 : '1px solid transparent')};\n color: ${p => p.theme.color.blueGray};\n }\n\n :disabled,\n &._disabled {\n background-color: transparent;\n border: ${p => (p.isCompact ? 0 : '1px solid transparent')};\n color: ${p => p.theme.color.lightGray};\n }\n`\n","import { createGlobalStyle } from 'styled-components'\n\n// @ts-ignore\nimport MarianneBold from './assets/fonts/Marianne-Bold.woff2'\n// @ts-ignore\nimport MarianneBoldItalic from './assets/fonts/Marianne-Bold_Italic.woff2'\n// @ts-ignore\nimport MarianneLight from './assets/fonts/Marianne-Light.woff2'\n// @ts-ignore\nimport MarianneLightItalic from './assets/fonts/Marianne-Light_Italic.woff2'\n// @ts-ignore\nimport MarianneMedium from './assets/fonts/Marianne-Medium.woff2'\n// @ts-ignore\nimport MarianneMediumItalic from './assets/fonts/Marianne-Medium_Italic.woff2'\n// @ts-ignore\nimport MarianneRegular from './assets/fonts/Marianne-Regular.woff2'\n// @ts-ignore\nimport MarianneItalic from './assets/fonts/Marianne-Regular_Italic.woff2'\n\nexport const GlobalStyle = createGlobalStyle`\n @font-face {\n font-family: Marianne;\n src: local('Marianne'), local('Marianne-Regular'), url(${MarianneRegular}) format('woff2');\n font-weight: normal;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Thin'), url(${MarianneLight}) format('woff2');\n font-weight: 300;\n }\n\n @font-face {\n font-family: Marianne;\n src:local('Marianne-Medium'), url(${MarianneMedium}) format('woff2');\n font-weight: 500;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Medium_Italic'), url(${MarianneMediumItalic}) format('woff2');\n font-weight: 500;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Thin_Italic'), url(${MarianneLightItalic}) format('woff2');\n font-weight: lighter;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src:local('Marianne-Regular_Italic'), url(${MarianneItalic}) format('woff2');\n font-weight: normal;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Bold'), url(${MarianneBold}) format('woff2');\n font-weight: 700;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Bold_Italic'), url(${MarianneBoldItalic}) format('woff2');\n font-style: italic;\n font-weight: 700;\n }\n\n body {\n font-family: Marianne, sans-serif;\n font-size: 16px;\n line-height: 1.3846;\n }\n`\n","/* eslint-disable sort-keys-fix/sort-keys-fix, typescript-sort-keys/interface */\n\nimport type { PartialDeep } from 'type-fest'\n\nexport type Theme = typeof THEME\nexport type PartialTheme = PartialDeep\n\nexport const THEME = {\n // https://xd.adobe.com/view/b6d4c472-3fbe-4dec-9f14-38fe03872a3e-e387/screen/b9bdc1ba-5f07-4c4f-bd44-2d38b2c6f663/specs/\n color: {\n /** INTERFACE COLORS */\n\n // Neutral Colors\n gunMetal: '#282F3E',\n // TODO Make that charcoal object 100 & 50\n charcoal: '#3B4559',\n charcoalShadow: 'rgba(59, 69, 89, 0.5)',\n slateGray: '#707785',\n lightGray: '#CCCFD6',\n gainsboro: '#E5E5EB',\n cultured: '#F7F7FA',\n white: '#FFFFFF',\n\n // Accentuation Colors\n blueYonder: '#567A9E',\n blueYonder25: '#D4DDE7',\n blueGray: '#5697D2',\n blueGray25: '#D4E5F4',\n maximumRed: '#E1000F',\n maximumRed15: '#FBD9DB',\n babyBlueEyes: '#99C9FF',\n\n // Notification Colors\n mediumSeaGreen: '#29B361',\n mediumSeaGreen25: '#c9ecd7',\n goldenPoppy: '#FAC11A',\n goldenPoppy25: '#FDF3C3',\n\n /** CONTEXTUAL COLORS */\n\n // Mission status\n yellowGreen: '#8CC800',\n\n // Risk Factor\n cadetGray: '#8E9A9F',\n grullo: '#B89B8C',\n copperRed: '#CF6A4E',\n chineseRed: '#A13112',\n\n // Vessel Track\n darkCornflowerBlue: '#2A4670',\n jungleGreen: '#1C9B7B',\n\n // Beacon Malfunction\n powderBlue: '#9ED7D9',\n wheat: '#EDD6A4',\n opal: '#A5BCC0',\n\n // Regulation Areas\n yaleBlue: '#295375',\n queenBlue: '#367096',\n glaucous: '#6284A6',\n blueNcs: '#3690C0',\n iceberg: '#67A9CF',\n lightSteelBlue: '#9AB4D6',\n lightPeriwinkle: '#CDCFEA',\n aliceBlue: '#EBF0F4',\n lightBlue: '#B9DDE5',\n lightCyan: '#C7EAE5', // deprecated ?\n middleBlueGreen: '#91CFC9', // deprecated ?\n verdigris: '#56B3AB', // deprecated ?\n viridianGreen: '#01A29D', // deprecated ?\n paoloVeroneseGreen: '#21977F', // deprecated ?\n skobeloff: '#01686B', // deprecated ?\n blueSapphire: '#01536A', // deprecated ?\n indigoDye: '#033E54', // deprecated ?\n skyBlue: '#77C1DE',\n frenchBlue: '#2E75AB',\n prussianBlue: '#003E54',\n lightCoral: '#FA8282',\n\n // AMP Zones\n brownSugar: '#B26A53',\n rust: '#B1502F',\n burntSienna: '#D46E49',\n persianOrange: '#D6814F',\n jasper: '#DB503D',\n bittersweet: '#F0755C',\n coral: '#F78A69',\n peach: '#FCB394',\n apricot: '#F0C1A1',\n melon: '#E7A58D',\n paleDogwood: '#F8D7CE',\n seashell: '#FCECE4',\n\n // Custom Zones\n darkGoldenrod: '#A98A0F',\n pear: '#DBE33E',\n jonquil: '#F0CB38',\n earthYellow: '#E6B771',\n ecru: '#BAAB68',\n goldMetallic: '#C5A730',\n mindaro: '#F2F58E'\n }\n}\n","import { createGlobalStyle } from 'styled-components'\n\n// @ts-ignore\nimport MarianneBold from './assets/fonts/Marianne-Bold.woff2'\n// @ts-ignore\nimport MarianneBoldItalic from './assets/fonts/Marianne-Bold_Italic.woff2'\n// @ts-ignore\nimport MarianneLight from './assets/fonts/Marianne-Light.woff2'\n// @ts-ignore\nimport MarianneLightItalic from './assets/fonts/Marianne-Light_Italic.woff2'\n// @ts-ignore\nimport MarianneMedium from './assets/fonts/Marianne-Medium.woff2'\n// @ts-ignore\nimport MarianneMediumItalic from './assets/fonts/Marianne-Medium_Italic.woff2'\n// @ts-ignore\nimport MarianneRegular from './assets/fonts/Marianne-Regular.woff2'\n// @ts-ignore\nimport MarianneItalic from './assets/fonts/Marianne-Regular_Italic.woff2'\n\nexport const OnlyFontGlobalStyle = createGlobalStyle`\n @font-face {\n font-family: Marianne;\n src: local('Marianne'), local('Marianne-Regular'), url(${MarianneRegular}) format('woff2');\n font-weight: normal;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Thin'), url(${MarianneLight}) format('woff2');\n font-weight: 300;\n }\n\n @font-face {\n font-family: Marianne;\n src:local('Marianne-Medium'), url(${MarianneMedium}) format('woff2');\n font-weight: 500;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Medium_Italic'), url(${MarianneMediumItalic}) format('woff2');\n font-weight: 500;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Thin_Italic'), url(${MarianneLightItalic}) format('woff2');\n font-weight: lighter;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src:local('Marianne-Regular_Italic'), url(${MarianneItalic}) format('woff2');\n font-weight: normal;\n font-style: italic;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Bold'), url(${MarianneBold}) format('woff2');\n font-weight: 700;\n }\n\n @font-face {\n font-family: Marianne;\n src: local('Marianne-Bold_Italic'), url(${MarianneBoldItalic}) format('woff2');\n font-style: italic;\n font-weight: 700;\n }\n\n body {\n font-family: Marianne, sans-serif;\n }\n`\n","import styled from 'styled-components'\n\nexport const Action = styled.div`\n background-color: ${p => p.theme.color.white};\n border-bottom-left-radius: 2px;\n border-bottom-right-radius: 2px;\n display: flex;\n flex-direction: column-reverse;\n padding: 8px 8px 8px 8px;\n @media (min-width: 740px) {\n align-items: center;\n flex-direction: row;\n justify-content: center;\n padding: 48px 8px 48px 8px;\n }\n\n > button {\n margin-bottom: 2px;\n }\n @media (min-width: 740px) {\n > button {\n margin-bottom: 0;\n margin-right: 2px;\n }\n }\n`\n","import styled from 'styled-components'\n\nexport const Body = styled.div`\n background-color: ${p => p.theme.color.white};\n border-top-left-radius: 2px;\n border-top-right-radius: 2px;\n display: flex;\n flex-direction: column;\n padding: 8px 8px 8px 8px;\n text-align: center;\n @media (min-width: 740px) {\n padding: 48px 8px 8px 8px;\n text-align: center;\n }\n\n > p {\n color: ${p => p.theme.color.slateGray};\n padding-top: 2px;\n }\n`\n","import styled from 'styled-components'\n\nexport const Title = styled.h4`\n font-size: 125%;\n font-weight: 500;\n line-height: 48px;\n padding-bottom: 2px;\n height: 48px;\n color: ${p => p.theme.color.white};\n background-color: ${p => p.theme.color.charcoal};\n text-align: center;\n`\n","import classnames from 'classnames'\nimport styled from 'styled-components'\n\nimport { Action } from './Action'\nimport { Body } from './Body'\nimport { Title } from './Title'\nimport { stopMouseEventPropagation } from '../../utils/stopMouseEventPropagation'\n\nimport type { HTMLAttributes } from 'react'\n\nexport type DialogProps = HTMLAttributes & {\n isAbsolute?: boolean\n}\nexport function RawDialog({ children, className, isAbsolute = false, ...nativeProps }: DialogProps) {\n const controlledClassName = classnames('Component-Dialog', className)\n\n return (\n \n \n\n {children}\n \n )\n}\n\nexport const Box = styled.div<{\n $isAbsolute: boolean\n}>`\n position: ${p => (p.$isAbsolute ? 'absolute' : 'fixed')};\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow-y: auto;\n z-index: 9000;\n`\n\nconst Overlay = styled.div<{\n $isAbsolute: boolean\n}>`\n background-color: ${p => p.theme.color.charcoal};\n bottom: 0;\n left: 0;\n opacity: 0.53;\n position: ${p => (p.$isAbsolute ? 'absolute' : 'fixed')};\n right: 0;\n top: 0;\n z-index: 1;\n`\n\nconst Window = styled.div<{\n $isAbsolute: boolean\n}>`\n border-radius: 2px;\n bottom: 100px;\n box-shadow: 4px;\n max-width: 32rem;\n position: ${p => (p.$isAbsolute ? 'absolute' : 'fixed')};\n width: calc(100% - 2 * 8px);\n z-index: 1;\n @media (min-width: 740px) {\n bottom: auto;\n min-width: 586px;\n }\n`\n\nRawDialog.displayName = 'Dialog'\n\nexport const Dialog = Object.assign(RawDialog, {\n Action,\n Body,\n Title\n})\n","import { useMemo } from 'react'\nimport { Dropdown as RsuiteDropdown } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Accent } from '../../constants'\n\nimport type { IconProps } from '../../types'\nimport type { FunctionComponent } from 'react'\nimport type { DropdownMenuItemProps as RsuiteDropdownMenuItemProps } from 'rsuite'\n\nexport type DropdownItemProps = Omit & {\n Icon?: FunctionComponent\n accent?: Accent | undefined\n}\nexport function Item({ accent, Icon, ...originalProps }: DropdownItemProps) {\n const icon = useMemo(() => (Icon ? : undefined), [Icon])\n const hasIcon = useMemo(() => Boolean(Icon), [Icon])\n\n switch (accent) {\n case Accent.SECONDARY:\n return \n\n default:\n return \n }\n}\n\n// TODO We need to split that into multiple styled components as done in `\n\n <>\n {zones.map((zone, index) => (\n // eslint-disable-next-line react/no-array-index-key\n \n \n {zone[labelPropName]}\n\n {/* TODO Add `Accent.LINK` accent in @mtes-mct/monitor-ui and use it here. */}\n {/* eslint-disable-next-line jsx-a11y/anchor-is-valid, jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}\n centerZone(zone)}>\n \n Centrer sur la carte\n \n \n\n editZone(index, zone)} />\n deleteZone(index)}\n />\n \n ))}\n \n\n {hasError && {controlledError}}\n \n )\n}\n\nconst Row = styled.div`\n align-items: center;\n display: flex;\n margin: 8px 0 0;\n\n > button {\n margin: 0 0 0 8px;\n }\n`\n\nconst ZoneBox = styled.div<{\n $isLight: boolean\n}>`\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n display: flex;\n flex-grow: 1;\n font-size: 13px;\n line-height: 1.3077; // = 17px\n justify-content: space-between;\n padding: 6px 12px 6px;\n`\n\nconst Link = styled.a`\n align-items: center;\n cursor: pointer;\n display: inline-flex;\n\n > span {\n line-height: 1;\n margin: -2px 0 0 8px;\n }\n`\n","import classnames from 'classnames'\nimport { useCallback, useMemo, useRef, type FocusEvent } from 'react'\nimport { Input, type InputProps } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Field } from '../elements/Field'\nimport { FieldError } from '../elements/FieldError'\nimport { Label } from '../elements/Label'\nimport { useFieldUndefineEffect } from '../hooks/useFieldUndefineEffect'\nimport { useKey } from '../hooks/useKey'\nimport { usePreventWheelEvent } from '../hooks/usePreventWheelEvent'\nimport { normalizeString } from '../utils/normalizeString'\n\nimport type { Promisable } from 'type-fest'\n\nexport type NumberInputProps = Omit & {\n error?: string | undefined\n isErrorMessageHidden?: boolean | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n isUndefinedWhenDisabled?: boolean | undefined\n label: string\n name: string\n onChange?: ((nextValue: number | undefined) => Promisable) | undefined\n value?: number | undefined\n}\nexport function NumberInput({\n className,\n error,\n isErrorMessageHidden = false,\n isLabelHidden = false,\n isLight = false,\n isUndefinedWhenDisabled = false,\n label,\n onBlur,\n onChange,\n onFocus,\n style,\n value,\n ...originalProps\n}: NumberInputProps) {\n // eslint-disable-next-line no-null/no-null\n const inputRef = useRef(null)\n\n const controlledClassname = useMemo(() => classnames('Field-NumberInput', className), [className])\n const controlledError = useMemo(() => normalizeString(error), [error])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n const key = useKey([originalProps.disabled, originalProps.name])\n\n const preventWheelEvent = usePreventWheelEvent(inputRef)\n\n const handleChange = useCallback(\n (nextValue: string) => {\n if (!onChange) {\n return\n }\n\n const normalizedNextValueAsString = nextValue && nextValue.length ? nextValue : undefined\n const nextValueAsNumber = Number(normalizedNextValueAsString)\n const normalizedNextValue = !Number.isNaN(nextValueAsNumber) ? nextValueAsNumber : undefined\n\n onChange(normalizedNextValue)\n },\n [onChange]\n )\n\n const handleBlur = useCallback(\n (event: FocusEvent) => {\n event.target.removeEventListener('wheel', preventWheelEvent)\n\n if (onBlur) {\n onBlur(event)\n }\n },\n [onBlur, preventWheelEvent]\n )\n\n const handleFocus = useCallback(\n (event: FocusEvent) => {\n event.target.addEventListener('wheel', preventWheelEvent)\n\n if (onFocus) {\n onFocus(event)\n }\n },\n [onFocus, preventWheelEvent]\n )\n\n useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange)\n\n return (\n \n \n {label}\n \n\n \n\n {!isErrorMessageHidden && hasError && {controlledError}}\n \n )\n}\n\nconst StyledInput = styled(Input as any)<{\n $hasError: boolean\n $isLight: boolean\n}>`\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro)};\n border-radius: 0;\n font-size: 13px;\n /* TODO It should be 18px but computed line-height is stuck to min. 18.5px. Investigate that. */\n line-height: 19px;\n padding: 3px 8px 6px;\n vertical-align: center;\n width: 100%;\n\n :hover {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueYonder)} !important;\n }\n\n :active,\n :focus {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray)} !important;\n outline: 0;\n }\n`\n","import { useMemo, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport { useDebouncedCallback } from 'use-debounce'\n\nimport { THEME } from '../../theme'\nimport { isNumeric } from '../../utils/isNumeric'\n\nimport type { Coordinates } from '../../types'\n\ntype DDCoordinatesInputProps = {\n coordinates: Coordinates | undefined\n disabled: boolean | undefined\n isLight: boolean | undefined\n onChange: (nextCoordinates: Coordinates, coordinates: Coordinates | undefined) => void\n}\n// TODO This field should return undefined when cleared (i.e.: Select all & Backspace/Delete)\nexport function DDCoordinatesInput({\n coordinates,\n disabled = false,\n isLight = false,\n onChange\n}: DDCoordinatesInputProps) {\n const latitudeInputRef = useRef()\n const longitudeInputRef = useRef()\n\n const [latitudeError, setLatitudeError] = useState('')\n const [longitudeError, setLongitudeError] = useState('')\n\n const defaultValue = useMemo(() => {\n if (!coordinates) {\n return undefined\n }\n\n const [latitude, longitude] = coordinates\n\n if (isNumeric(latitude) && isNumeric(longitude)) {\n return {\n latitude: Number(latitude),\n longitude: Number(longitude)\n }\n }\n\n return {\n latitude: undefined,\n longitude: undefined\n }\n }, [coordinates])\n\n const handleChange = useDebouncedCallback((nextCoordinates: [number, number] | undefined) => {\n if (!latitudeInputRef.current || !longitudeInputRef.current) {\n return\n }\n\n const latitudeAsString = latitudeInputRef.current.value\n const longitudeAsString = longitudeInputRef.current.value\n\n setLongitudeError('')\n setLatitudeError('')\n\n if (!isNumeric(latitudeAsString)) {\n setLatitudeError('Champ Latitude incorrect')\n\n return\n }\n\n if (!isNumeric(longitudeAsString)) {\n setLongitudeError('Champ Longitude incorrect')\n\n return\n }\n\n const latitude = Number(latitudeAsString)\n const longitude = Number(longitudeAsString)\n\n onChange([latitude, longitude], nextCoordinates)\n }, 500)\n\n return (\n \n handleChange(coordinates)}\n placeholder=\"Latitude\"\n style={{\n backgroundColor: isLight ? THEME.color.white : THEME.color.gainsboro,\n border: latitudeError ? '1px solid red' : undefined\n }}\n />\n handleChange(coordinates)}\n placeholder=\"Longitude\"\n style={{\n backgroundColor: isLight ? THEME.color.white : THEME.color.gainsboro,\n border: longitudeError ? '1px solid red' : undefined\n }}\n />\n (DD)\n {latitudeError}\n {longitudeError}\n \n )\n}\n\nconst DDInput = styled.input`\n margin-right: 5px !important;\n width: 100px;\n`\n\nconst CoordinatesType = styled.span`\n margin-left: 7px;\n color: ${p => p.theme.color.slateGray};\n`\n\nconst Error = styled.span`\n color: red;\n display: block;\n`\n\nconst Box = styled.div`\n font-size: 13px;\n text-align: left;\n`\n","import { useEffect, useState } from 'react'\nimport { dmsToDecimal } from 'react-coordinate-input'\nimport { IMaskInput } from 'react-imask'\nimport styled from 'styled-components'\n\nimport { CoordinatesFormat, WSG84_PROJECTION } from '../../constants'\nimport { THEME } from '../../theme'\nimport { getCoordinates } from '../../utils/coordinates'\nimport { isNumeric } from '../../utils/isNumeric'\n\nimport type { Coordinates } from '../../types'\n\n// TODO Remove that once the fix is added and released.\n// Open issue: https://github.com/uNmAnNeR/imaskjs/issues/761\nconst UntypedIMaskInput: any = IMaskInput\n\ntype DMDCoordinatesInputProps = {\n coordinates: Coordinates | undefined\n coordinatesFormat: CoordinatesFormat\n disabled: boolean | undefined\n isLight: boolean | undefined\n onChange: (nextCoordinates: Coordinates, coordinates: Coordinates | undefined) => void\n}\n// TODO This field should return undefined when cleared (i.e.: Select all & Backspace/Delete)\nexport function DMDCoordinatesInput({\n coordinates,\n coordinatesFormat,\n disabled = false,\n isLight,\n onChange\n}: DMDCoordinatesInputProps) {\n const [error, setError] = useState('')\n const [value, setValue] = useState('')\n\n useEffect(() => {\n if (coordinates?.length && coordinatesFormat) {\n const nextValue = getCoordinates(\n [coordinates[1], coordinates[0]],\n WSG84_PROJECTION,\n CoordinatesFormat.DEGREES_MINUTES_DECIMALS\n )\n .map(coordinate => coordinate.replace(/[°′. ]/g, ''))\n .join('')\n\n setValue(nextValue)\n } else {\n setValue('')\n }\n }, [coordinates, coordinatesFormat])\n\n function completeCoordinates(mask) {\n setError('')\n\n // eslint-disable-next-line no-underscore-dangle\n const latitude = mask._unmaskedValue.substring(0, 7)\n // eslint-disable-next-line no-underscore-dangle\n const longitude = mask._unmaskedValue.substring(7, mask._unmaskedValue.length)\n const NS = latitude[latitude.length - 1].toUpperCase()\n if (!['N', 'S'].includes(NS)) {\n setError('La latitude doit être N ou S')\n\n return\n }\n const latitudeDegrees = parseInt(latitude.substring(0, 2), 10)\n if (latitudeDegrees < 0 || latitudeDegrees > 90) {\n setError('La latitude doit être comprise entre 0 et 90°')\n\n return\n }\n const latitudeMinutes = parseInt(latitude.substring(2, 4), 10)\n const latitudeSeconds = parseInt(latitude.substring(4, 6), 10)\n\n const EW = longitude[longitude.length - 1].toUpperCase()\n if (!['E', 'W'].includes(EW)) {\n setError('La longitude doit être E ou W')\n\n return\n }\n const longitudeDegrees = parseInt(longitude.substring(0, 3), 10)\n if (longitudeDegrees < 0 || longitudeDegrees > 180) {\n setError('La longitude doit être comprise entre 0 et 180°')\n\n return\n }\n const longitudeMinutes = parseInt(longitude.substring(3, 5), 10)\n const longitudeSeconds = parseInt(longitude.substring(5, 7), 10)\n\n const dLatitude = dmsToDecimal(latitudeDegrees, latitudeMinutes + 10 ** -2 * latitudeSeconds, 0, NS, 6)\n const dLongitude = dmsToDecimal(longitudeDegrees, longitudeMinutes + 10 ** -2 * longitudeSeconds, 0, EW, 6)\n\n if (isNumeric(dLatitude) && isNumeric(dLongitude)) {\n onChange([dLatitude as number, dLongitude as number], coordinates)\n } else {\n setError('Format lat/long invalide')\n }\n }\n\n return (\n \n setValue(mask.value)}\n onComplete={(_, mask) => completeCoordinates(mask)}\n placeholder=\"__° __.___′ _ ___° __.___′\"\n radix=\".\"\n style={{\n backgroundColor: isLight ? THEME.color.white : THEME.color.gainsboro,\n border: error ? '1px solid red' : undefined\n }}\n // TODO Use `defaultValue` here.\n value={value}\n />\n (DMD)\n {error}\n \n )\n}\n\nconst CoordinatesType = styled.span`\n margin-left: 7px;\n color: ${p => p.theme.color.slateGray};\n`\n\nconst Error = styled.span`\n color: ${p => p.theme.color.maximumRed};\n display: inline-block;\n`\n\nconst Box = styled.div`\n font-size: 13px;\n text-align: left;\n`\n","import { isEmpty } from 'ramda'\nimport { useCallback, useMemo } from 'react'\nimport CoordinateInput from 'react-coordinate-input'\nimport styled from 'styled-components'\n\nimport { THEME } from '../../theme'\n\nimport type { CoordinatesFormat } from '../../constants'\nimport type { Coordinates } from '../../types'\n\ntype DMSCoordinatesInputProps = {\n coordinates: Coordinates | undefined\n coordinatesFormat: CoordinatesFormat\n disabled: boolean | undefined\n isLight: boolean | undefined\n onChange: (nextCoordinates: Coordinates | undefined, coordinates: Coordinates | undefined) => void\n}\nexport function DMSCoordinatesInput({\n coordinates,\n coordinatesFormat,\n disabled = false,\n isLight,\n onChange\n}: DMSCoordinatesInputProps) {\n /** Convert the coordinates to the [latitude, longitude] string format */\n const defaultValue = useMemo(() => {\n if (!coordinates?.length || !coordinatesFormat) {\n return ''\n }\n\n return coordinates?.join(', ') || ''\n }, [coordinates, coordinatesFormat])\n\n const update = useCallback(\n nextCoordinates => {\n const normalizedNextCoordinates = !isEmpty(nextCoordinates) ? nextCoordinates : undefined\n\n onChange(normalizedNextCoordinates, coordinates)\n },\n [coordinates, onChange]\n )\n\n return (\n \n update(dd)}\n style={{\n backgroundColor: isLight ? THEME.color.white : THEME.color.gainsboro\n }}\n // TODO Use `defaultValue` here.\n value={defaultValue}\n />\n (DMS)\n \n )\n}\n\nconst CoordinatesType = styled.span`\n margin-left: 7px;\n color: ${p => p.theme.color.slateGray};\n`\n\nconst Box = styled.div`\n font-size: 13px;\n text-align: left;\n`\n","import classnames from 'classnames'\nimport { noop } from 'lodash/fp'\nimport { useCallback, useMemo } from 'react'\nimport styled from 'styled-components'\n\nimport { DDCoordinatesInput } from './DDCoordinatesInput'\nimport { DMDCoordinatesInput } from './DMDCoordinatesInput'\nimport { DMSCoordinatesInput } from './DMSCoordinatesInput'\nimport { CoordinatesFormat } from '../../constants'\nimport { FieldError } from '../../elements/FieldError'\nimport { Fieldset } from '../../elements/Fieldset'\nimport { useFieldUndefineEffect } from '../../hooks/useFieldUndefineEffect'\nimport { normalizeString } from '../../utils/normalizeString'\n\nimport type { FieldsetProps } from '../../elements/Fieldset'\nimport type { Coordinates } from '../../types'\nimport type { Promisable } from 'type-fest'\n\nexport type CoordinatesInputProps = FieldsetProps & {\n coordinatesFormat: CoordinatesFormat\n defaultValue?: Coordinates | undefined\n disabled?: boolean | undefined\n error?: string | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n label: string\n onChange?:\n | ((nextCoordinates: Coordinates | undefined, coordinates: Coordinates | undefined) => Promisable)\n | undefined\n}\nexport function CoordinatesInput({\n className,\n coordinatesFormat,\n defaultValue,\n error,\n isLabelHidden = false,\n isLight = false,\n label,\n onChange = noop,\n ...nativeProps\n}: CoordinatesInputProps) {\n const controlledClassName = classnames('Field-CoordinatesInput', className)\n const controlledError = useMemo(() => normalizeString(error), [error])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n\n const getCoordinatesInput = useCallback(() => {\n switch (coordinatesFormat) {\n case CoordinatesFormat.DEGREES_MINUTES_SECONDS:\n return (\n \n )\n\n case CoordinatesFormat.DEGREES_MINUTES_DECIMALS:\n return (\n \n )\n\n case CoordinatesFormat.DECIMAL_DEGREES:\n return (\n \n )\n\n default:\n return undefined\n }\n }, [defaultValue, nativeProps.disabled, onChange, coordinatesFormat, isLight])\n\n // TODO We must add a `handleDisable()` callback here to effectively empty the inputs when disabling this field.\n useFieldUndefineEffect(nativeProps.disabled, onChange /* , handleDisable */)\n\n return (\n \n {getCoordinatesInput()}\n\n {hasError && {controlledError}}\n \n )\n}\n\nconst StyledFieldset = styled(Fieldset as any)`\n input {\n background-color: ${p => (p.isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n border: ${p => (p.isLight ? `1px solid ${p.theme.color.lightGray}` : 'none')};\n color: ${p => p.theme.color.gunMetal};\n height: 33px;\n padding: 7px 11px;\n }\n`\n","import classnames from 'classnames'\nimport { useCallback, useEffect, useMemo, useRef, useState, type MouseEvent, type ReactNode } from 'react'\nimport { SelectPicker, type SelectPickerProps } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Field } from '../elements/Field'\nimport { FieldError } from '../elements/FieldError'\nimport { Label } from '../elements/Label'\nimport { useClickOutsideEffect } from '../hooks/useClickOutsideEffect'\nimport { useFieldUndefineEffect } from '../hooks/useFieldUndefineEffect'\nimport { useForceUpdate } from '../hooks/useForceUpdate'\nimport { useKey } from '../hooks/useKey'\nimport { type CustomSearch } from '../libs/CustomSearch'\nimport { type Option, type OptionAsRsuiteItemDataType, type OptionValueType } from '../types'\nimport { getRsuiteDataFromOptions } from '../utils/getRsuiteDataFromOptions'\nimport { getRsuiteValueFromOptionValue } from '../utils/getRsuiteValueFromOptionValue'\nimport { normalizeString } from '../utils/normalizeString'\n\nimport type { Promisable } from 'type-fest'\n\nexport type SelectProps = Omit<\n SelectPickerProps,\n | 'as'\n | 'container'\n | 'data'\n | 'defaultValue'\n | 'id'\n | 'onChange'\n | 'open'\n | 'renderMenuItem'\n | 'renderValue'\n | 'value'\n | 'valueKey'\n> & {\n /** Used to pass something else than `window.document` as a base container to attach global events listeners. */\n baseContainer?: Document | HTMLDivElement | null | undefined\n customSearch?: CustomSearch> | undefined\n /** Minimum search query length required to trigger custom search filtering. */\n customSearchMinQueryLength?: number | undefined\n error?: string | undefined\n isCleanable?: boolean | undefined\n isErrorMessageHidden?: boolean | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n isUndefinedWhenDisabled?: boolean | undefined\n label: string\n name: string\n onChange?: ((nextValue: OptionValue | undefined) => Promisable) | undefined\n optionValueKey?: keyof OptionValue | undefined\n options: Option[]\n value?: OptionValue | undefined\n}\nexport function Select({\n baseContainer,\n className,\n customSearch,\n customSearchMinQueryLength = 1,\n disabled = false,\n error,\n isCleanable = true,\n isErrorMessageHidden = false,\n isLabelHidden = false,\n isLight = false,\n isUndefinedWhenDisabled = false,\n label,\n onChange,\n options,\n optionValueKey,\n searchable = false,\n style,\n value,\n ...originalProps\n}: SelectProps) {\n // eslint-disable-next-line no-null/no-null\n const boxRef = useRef(null)\n /** Instance of `CustomSearch` */\n const customSearchRef = useRef(customSearch)\n\n const { forceUpdate } = useForceUpdate()\n\n const controlledClassname = useMemo(() => classnames('Field-Select', className), [className])\n const controlledError = useMemo(() => normalizeString(error), [error])\n const rsuiteData = useMemo(() => getRsuiteDataFromOptions(options, optionValueKey), [options, optionValueKey])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n const key = useKey([disabled, originalProps.name, value])\n const selectedRsuiteValue = useMemo(\n () => getRsuiteValueFromOptionValue(value, optionValueKey),\n [value, optionValueKey]\n )\n\n // Only used when `customSearch` prop is set\n const [controlledRsuiteData, setControlledRsuiteData] = useState(customSearch ? rsuiteData : undefined)\n const [isOpen, setIsOpen] = useState(false)\n\n const close = useCallback(() => {\n setIsOpen(false)\n }, [])\n\n const handleClean = useCallback(() => {\n if (!onChange) {\n return\n }\n\n onChange(undefined)\n }, [onChange])\n\n const handleSearch = useCallback(\n (nextQuery: string) => {\n if (!customSearchRef.current || nextQuery.trim().length < customSearchMinQueryLength) {\n setControlledRsuiteData(rsuiteData)\n\n return\n }\n\n const nextControlledRsuiteData =\n nextQuery.trim().length >= customSearchMinQueryLength\n ? getRsuiteDataFromOptions(customSearchRef.current.find(nextQuery), optionValueKey)\n : rsuiteData\n\n setControlledRsuiteData(nextControlledRsuiteData)\n },\n [customSearchMinQueryLength, optionValueKey, rsuiteData]\n )\n\n const handleSelect = useCallback(\n (_: string, selectedItem: OptionAsRsuiteItemDataType) => {\n close()\n\n if (onChange) {\n onChange(selectedItem.optionValue)\n }\n },\n [close, onChange]\n )\n\n const renderMenuItem = useCallback((node: ReactNode) => {String(node)}, [])\n\n const toggle = useCallback(\n (event: MouseEvent) => {\n if (disabled) {\n return\n }\n let targetElement = event.target as HTMLElement\n\n if (targetElement.tagName === 'path') {\n if (targetElement.parentElement) {\n targetElement = targetElement.parentElement\n }\n }\n\n if (\n targetElement.classList.contains('rs-picker-toggle') ||\n targetElement.classList.contains('rs-picker-toggle-value') ||\n targetElement.classList.contains('rs-stack-item') ||\n targetElement.classList.contains('rs-picker-toggle-caret') ||\n targetElement.classList.contains('rs-picker-toggle-placeholder')\n ) {\n setIsOpen(!isOpen)\n }\n },\n [isOpen, disabled]\n )\n\n const disabledItemValues = useMemo(\n () => (controlledRsuiteData || rsuiteData).filter(option => option.isDisabled).map(option => option.value),\n [controlledRsuiteData, rsuiteData]\n )\n\n useFieldUndefineEffect(isUndefinedWhenDisabled && disabled, onChange)\n\n useClickOutsideEffect(boxRef, close, baseContainer)\n\n useEffect(() => {\n forceUpdate()\n }, [forceUpdate])\n\n return (\n \n \n\n \n {boxRef.current && (\n true : undefined) as any}\n value={selectedRsuiteValue}\n {...originalProps}\n />\n )}\n \n\n {!isErrorMessageHidden && hasError && {controlledError}}\n \n )\n}\n\nconst StyledSelectPicker = styled(SelectPicker as any)<{\n $isLight: boolean\n}>`\n > .rs-picker-toggle {\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)} !important;\n border: 0;\n }\n`\n\nconst Box = styled.div<{\n $hasError: boolean\n}>`\n position: relative;\n user-select: none;\n width: 100%;\n\n > .rs-picker-select {\n width: 100%;\n\n > .rs-picker-toggle {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro)} !important;\n font-size: 13px;\n line-height: 1.3846;\n padding: 4px 40px 6px 8px;\n\n :hover {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueYonder)} !important;\n }\n\n :active,\n :focus {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray)} !important;\n }\n\n > .rs-stack {\n > .rs-stack-item {\n > .rs-picker-toggle-placeholder {\n font-size: 13px;\n line-height: 1.3846;\n }\n\n > .rs-picker-toggle-clean.rs-btn-close {\n top: 4px !important;\n }\n\n > svg {\n height: 18px;\n margin-top: -2px;\n }\n }\n }\n }\n }\n\n > .rs-picker-menu {\n max-width: 100%;\n\n > .rs-picker-search-bar {\n > .rs-picker-search-bar-input {\n background-color: ${p => p.theme.color.white};\n border: solid 1px ${p => p.theme.color.lightGray};\n border-radius: 0;\n font-size: 13px;\n padding: 4px 8px 6px 8px;\n }\n\n > svg {\n color: ${p => p.theme.color.lightGray};\n top: 11px;\n }\n }\n\n > .rs-picker-select-menu {\n > div[role='option'] {\n > .rs-picker-select-menu-item {\n font-size: 13px;\n line-height: 1.3846;\n overflow: hidden;\n padding: 6px 12px 10px 12px;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n }\n }\n }\n`\n","import classnames from 'classnames'\nimport { useCallback, useMemo, useRef } from 'react'\nimport { Input } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Field } from '../elements/Field'\nimport { FieldError } from '../elements/FieldError'\nimport { Label } from '../elements/Label'\nimport { useFieldUndefineEffect } from '../hooks/useFieldUndefineEffect'\nimport { useKey } from '../hooks/useKey'\nimport { normalizeString } from '../utils/normalizeString'\n\nimport type { MutableRefObject, TextareaHTMLAttributes } from 'react'\nimport type { Promisable } from 'type-fest'\n\nexport type TextareaProps = Omit<\n TextareaHTMLAttributes,\n 'defaultValue' | 'id' | 'onChange' | 'value'\n> & {\n error?: string | undefined\n isErrorMessageHidden?: boolean | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n isUndefinedWhenDisabled?: boolean | undefined\n label: string\n name: string\n onChange?: ((nextValue: string | undefined) => Promisable) | undefined\n value?: string | undefined\n}\nexport function Textarea({\n className,\n error,\n isErrorMessageHidden = false,\n isLabelHidden = false,\n isLight = false,\n isUndefinedWhenDisabled = false,\n label,\n onChange,\n rows = 3,\n style,\n value,\n ...originalProps\n}: TextareaProps) {\n const inputRef = useRef() as MutableRefObject\n\n const controlledClassname = useMemo(() => classnames('Field-Textarea', className), [className])\n const controlledError = useMemo(() => normalizeString(error), [error])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n const key = useKey([originalProps.disabled, originalProps.name])\n\n const handleChange = useCallback(() => {\n if (!onChange) {\n return\n }\n\n const nextValue = inputRef.current.value\n const normalizedNextValue = nextValue.trim().length ? nextValue : undefined\n\n onChange(normalizedNextValue)\n }, [onChange])\n\n useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange)\n\n return (\n \n \n {label}\n \n\n \n\n {!isErrorMessageHidden && hasError && {controlledError}}\n \n )\n}\n\nconst StyledInput = styled(Input as any)<{\n $hasError: boolean\n $isLight: boolean\n}>`\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro)};\n font-size: 13px;\n padding: 7px 11px;\n width: 100%;\n\n ::placeholder {\n color: ${p => (p.$isLight ? p.theme.color.slateGray : p.theme.color.slateGray)};\n }\n\n :hover {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueYonder)} !important;\n }\n\n :active,\n :focus {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray)} !important;\n outline: 0;\n }\n`\n","import classnames from 'classnames'\nimport { type FunctionComponent, useCallback, useMemo } from 'react'\nimport { Input } from 'rsuite'\nimport styled from 'styled-components'\n\nimport { Accent, Size } from '../constants'\nimport { Field } from '../elements/Field'\nimport { FieldError } from '../elements/FieldError'\nimport { IconButton } from '../elements/IconButton'\nimport { Label } from '../elements/Label'\nimport { useFieldUndefineEffect } from '../hooks/useFieldUndefineEffect'\nimport { useKey } from '../hooks/useKey'\nimport { Close, Search } from '../icons'\nimport { THEME } from '../theme'\nimport { normalizeString } from '../utils/normalizeString'\n\nimport type { IconProps } from '../types'\nimport type { InputProps } from 'rsuite'\nimport type { Promisable } from 'type-fest'\n\nexport type TextInputProps = Omit & {\n Icon?: FunctionComponent | undefined\n error?: string | undefined\n isErrorMessageHidden?: boolean | undefined\n isLabelHidden?: boolean | undefined\n isLight?: boolean | undefined\n isSearchInput?: boolean\n isUndefinedWhenDisabled?: boolean | undefined\n label: string\n name: string\n onChange?: ((nextValue: string | undefined) => Promisable) | undefined\n size?: Size | undefined\n value?: string | undefined\n}\nexport function TextInput({\n className,\n error,\n Icon,\n isErrorMessageHidden = false,\n isLabelHidden = false,\n isLight = false,\n isSearchInput = false,\n isUndefinedWhenDisabled = false,\n label,\n onChange,\n size = Size.NORMAL,\n style,\n type = 'text',\n value,\n ...originalProps\n}: TextInputProps) {\n const controlledClassname = useMemo(() => classnames('Field-TextInput', className), [className])\n const controlledError = useMemo(() => normalizeString(error), [error])\n const hasError = useMemo(() => Boolean(controlledError), [controlledError])\n const key = useKey([originalProps.disabled, originalProps.name])\n\n const clean = useCallback(() => {\n if (!onChange) {\n return\n }\n onChange(undefined)\n }, [onChange])\n\n const handleChange = useCallback(\n (nextValue: string | null) => {\n if (!onChange) {\n return\n }\n\n const normalizedNextValue = nextValue && nextValue.trim().length ? nextValue : undefined\n\n onChange(normalizedNextValue)\n },\n [onChange]\n )\n\n useFieldUndefineEffect(isUndefinedWhenDisabled && originalProps.disabled, onChange)\n\n return (\n \n \n {label}\n \n\n \n \n {isSearchInput && !Icon && (\n \n {value && (\n <>\n \n \n \n )}\n\n \n \n )}\n\n {Icon && }\n \n\n {!isErrorMessageHidden && hasError && {controlledError}}\n \n )\n}\n\nconst PADDING: Record = {\n [Size.LARGE]: '8px 16px 11px',\n [Size.NORMAL]: '3px 8px 6px',\n [Size.SMALL]: '3px 8px 6px'\n}\nconst PADDING_WITH_ICON: Record = {\n [Size.LARGE]: '8px 40px 11px 16px',\n [Size.NORMAL]: '3px 38px 6px 8px',\n [Size.SMALL]: '3px 38px 6px 8px'\n}\n\nconst IconsContainer = styled.div<{\n $size: Size\n}>`\n align-items: center;\n display: flex;\n position: absolute;\n right: 5px;\n top: ${p => (p.$size === Size.LARGE ? '10px' : '5px')};\n`\n\nconst Separator = styled.div`\n border-right: 1px solid ${p => p.theme.color.lightGray};\n height: 20px;\n margin-left: 4px;\n margin-right: 6px;\n padding-top: 3px;\n`\n\nconst StyledInput = styled(Input as any)<{\n $hasError: boolean\n $hasIcon: boolean\n $isLight: boolean\n $size: Size\n}>`\n background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)};\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro)};\n border-radius: 0;\n font-size: 13px;\n /* TODO It should be 18px but computed line-height is stuck to min. 18.5px. Investigate that. */\n line-height: 19px;\n padding: ${p => (p.$hasIcon ? PADDING_WITH_ICON[p.$size] : PADDING[p.$size])};\n vertical-align: center;\n width: 100%;\n\n ::placeholder {\n color: ${p => (p.$isLight ? p.theme.color.slateGray : p.theme.color.slateGray)};\n }\n\n :hover {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueYonder)} !important;\n }\n\n :active,\n :focus {\n border: solid 1px ${p => (p.$hasError ? p.theme.color.maximumRed : p.theme.color.blueGray)} !important;\n outline: 0;\n }\n`\n\nconst InputBox = styled.div<{\n $size: Size\n}>`\n position: relative;\n width: 100%;\n > .Element-IconBox {\n position: absolute;\n right: 10px;\n top: ${p => (p.$size === Size.LARGE ? '10px' : '5px')};\n }\n`\n","import classnames from 'classnames'\nimport styled from 'styled-components'\n\nimport type { TableHTMLAttributes } from 'react'\n\nconst Table = styled.table.attrs>(props => ({\n className: classnames('Table-SimpleTable', props.className)\n}))`\n width: 100%;\n table-layout: auto;\n overflow: auto;\n border-collapse: separate;\n`\nconst Head = styled.thead`\n position: sticky;\n top: 0;\n z-index: 1;\n\n th:first-child {\n border-left: 1px solid ${p => p.theme.color.lightGray};\n }\n`\n\nconst SortContainer = styled.div`\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: default;\n\n &.cursor-pointer {\n cursor: pointer;\n }\n`\nconst Th = styled.th`\n background-color: ${p => p.theme.color.gainsboro};\n border-top: 1px solid ${p => p.theme.color.lightGray};\n border-bottom: 1px solid ${p => p.theme.color.lightGray};\n border-right: 1px solid ${p => p.theme.color.lightGray};\n color: ${p => p.theme.color.slateGray};\n font-size: 13px;\n font-weight: 500;\n padding: 10px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`\n\nconst BodyTr = styled.tr`\n :hover {\n > td {\n background-color: ${p => p.theme.color.blueYonder25};\n }\n }\n td:first-child {\n border-left: 1px solid ${p => p.theme.color.lightGray};\n }\n`\n\nconst Td = styled.td<{ $isCenter?: boolean }>`\n font-size: 13px;\n font-weight: 500;\n color: ${p => p.theme.color.gunMetal};\n text-align: ${p => (p.$isCenter ? 'center' : 'left')};\n border-bottom: 1px solid ${p => p.theme.color.lightGray};\n border-right: 1px solid ${p => p.theme.color.lightGray};\n overflow: hidden;\n padding: 10px;\n text-overflow: ellipsis;\n white-space: nowrap;\n`\n\nexport const SimpleTable = {\n BodyTr,\n Head,\n SortContainer,\n Table,\n Td,\n Th\n}\n","import styled from 'styled-components'\n\nimport { Chevron } from '../../icons'\n\nexport const SortingIcon = styled(Chevron as any)<{\n $isDescending?: boolean\n}>`\n cursor: pointer;\n height: 16px;\n margin-right: 8px;\n margin-top: 0px;\n transform: ${props => (!props.$isDescending ? 'rotate(0deg)' : 'rotate(-180deg)')};\n transition: all 0.5s;\n width: 16px;\n`\n","import { flexRender, type Header } from '@tanstack/react-table'\n\nimport { SortingIcon } from './SortingIcon'\nimport { SortingArrows } from '../../icons'\nimport { SimpleTable } from '../SimpleTable'\n\nimport type { ReactNode } from 'react'\n\nexport type ThProps = {\n children?: ReactNode\n header: Header\n}\nexport function Th({ children, header }: ThProps) {\n const controlledChildren =\n children || !header.isPlaceholder ? (\n \n {flexRender(header.column.columnDef.header, header.getContext())}\n\n {header.column.getCanSort() &&\n ({\n asc: ,\n desc: \n }[header.column.getIsSorted() as string] ?? )}\n \n ) : undefined\n\n return (\n \n {controlledChildren}\n \n )\n}\n","import styled from 'styled-components'\n\nimport { RowCheckbox } from './RowCheckbox'\nimport { SimpleTable } from '../SimpleTable'\n\nexport { RowCheckbox }\n\nconst Table = styled(SimpleTable.Table)`\n border-collapse: separate;\n border-spacing: 0 5px;\n`\nconst Head = styled(SimpleTable.Head)`\n th:last-child {\n border-right: 1px solid ${p => p.theme.color.lightGray};\n }\n`\n\nconst SortContainer = styled(SimpleTable.SortContainer)`\n justify-content: start;\n gap: 8px;\n`\nconst Th = styled(SimpleTable.Th)`\n background-color: ${p => p.theme.color.white};\n border-top: 1px solid ${p => p.theme.color.lightGray};\n border-bottom: 1px solid ${p => p.theme.color.lightGray};\n border-right: none;\n padding: 2px 10px;\n`\n\nconst BodyTr = styled(SimpleTable.BodyTr)`\n td:last-child {\n border-right: 1px solid ${p => p.theme.color.lightGray};\n overflow: visible;\n }\n`\n\nconst Td = styled(SimpleTable.Td)<{ $hasRightBorder: boolean }>`\n background-color: ${p => p.theme.color.cultured};\n border-top: 1px solid ${p => p.theme.color.lightGray};\n border-right: none;\n padding: 4px 10px;\n border-right: ${p => (p.$hasRightBorder ? `1px solid ${p.theme.color.lightGray}` : '')};\n`\n\nexport const TableWithSelectableRows = {\n BodyTr,\n Head,\n RowCheckbox,\n SortContainer,\n Table,\n Td,\n Th\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/project.json b/project.json index 6fa5b8be1..947dc8ece 100644 --- a/project.json +++ b/project.json @@ -1 +1 @@ -{"generatedAt":1704900535401,"hasCustomBabel":false,"hasCustomWebpack":true,"hasStaticDirs":false,"hasStorybookEslint":false,"refCount":0,"packageManager":{"type":"yarn","version":"4.0.2"},"preview":{"usesGlobals":false},"framework":{"name":"@storybook/react-webpack5","options":{}},"builder":"@storybook/builder-webpack5","renderer":"@storybook/react","storybookVersion":"7.3.2","storybookVersionSpecifier":"7.3.2","language":"typescript","storybookPackages":{"@storybook/react":{"version":"7.3.2"},"@storybook/react-webpack5":{"version":"7.0.27"},"@storybook/test-runner":{"version":"0.13.0"},"@storybook/testing-react":{"version":"2.0.1"},"storybook":{"version":"7.5.3"}},"addons":{"@storybook/addon-essentials":{"version":"7.5.3"},"storybook-addon-performance":{"version":null},"@storybook/addon-a11y":{"version":"7.0.27"},"chromatic":{"version":null,"versionSpecifier":"6.19.9"}}} +{"generatedAt":1705335758863,"hasCustomBabel":false,"hasCustomWebpack":true,"hasStaticDirs":false,"hasStorybookEslint":false,"refCount":0,"packageManager":{"type":"yarn","version":"4.0.2"},"preview":{"usesGlobals":false},"framework":{"name":"@storybook/react-webpack5","options":{}},"builder":"@storybook/builder-webpack5","renderer":"@storybook/react","storybookVersion":"7.3.2","storybookVersionSpecifier":"7.3.2","language":"typescript","storybookPackages":{"@storybook/react":{"version":"7.3.2"},"@storybook/react-webpack5":{"version":"7.0.27"},"@storybook/test-runner":{"version":"0.13.0"},"@storybook/testing-react":{"version":"2.0.1"},"storybook":{"version":"7.5.3"}},"addons":{"@storybook/addon-essentials":{"version":"7.5.3"},"storybook-addon-performance":{"version":null},"@storybook/addon-a11y":{"version":"7.0.27"},"chromatic":{"version":null,"versionSpecifier":"6.19.9"}}} diff --git a/runtime~main.8171fbee.iframe.bundle.js b/runtime~main.a7e14342.iframe.bundle.js similarity index 99% rename from runtime~main.8171fbee.iframe.bundle.js rename to runtime~main.a7e14342.iframe.bundle.js index 0ebccb1c7..b109c2c38 100644 --- a/runtime~main.8171fbee.iframe.bundle.js +++ b/runtime~main.a7e14342.iframe.bundle.js @@ -1 +1 @@ -(()=>{"use strict";var deferred,leafPrototypes,getProto,inProgress,__webpack_modules__={},__webpack_module_cache__={};function __webpack_require__(moduleId){var cachedModule=__webpack_module_cache__[moduleId];if(void 0!==cachedModule)return cachedModule.exports;var module=__webpack_module_cache__[moduleId]={id:moduleId,loaded:!1,exports:{}};return __webpack_modules__[moduleId].call(module.exports,module,module.exports,__webpack_require__),module.loaded=!0,module.exports}__webpack_require__.m=__webpack_modules__,__webpack_require__.amdO={},deferred=[],__webpack_require__.O=(result,chunkIds,fn,priority)=>{if(!chunkIds){var notFulfilled=1/0;for(i=0;i=priority)&&Object.keys(__webpack_require__.O).every((key=>__webpack_require__.O[key](chunkIds[j])))?chunkIds.splice(j--,1):(fulfilled=!1,priority0&&deferred[i-1][2]>priority;i--)deferred[i]=deferred[i-1];deferred[i]=[chunkIds,fn,priority]},__webpack_require__.n=module=>{var getter=module&&module.__esModule?()=>module.default:()=>module;return __webpack_require__.d(getter,{a:getter}),getter},getProto=Object.getPrototypeOf?obj=>Object.getPrototypeOf(obj):obj=>obj.__proto__,__webpack_require__.t=function(value,mode){if(1&mode&&(value=this(value)),8&mode)return value;if("object"==typeof value&&value){if(4&mode&&value.__esModule)return value;if(16&mode&&"function"==typeof value.then)return value}var ns=Object.create(null);__webpack_require__.r(ns);var def={};leafPrototypes=leafPrototypes||[null,getProto({}),getProto([]),getProto(getProto)];for(var current=2&mode&&value;"object"==typeof current&&!~leafPrototypes.indexOf(current);current=getProto(current))Object.getOwnPropertyNames(current).forEach((key=>def[key]=()=>value[key]));return def.default=()=>value,__webpack_require__.d(ns,def),ns},__webpack_require__.d=(exports,definition)=>{for(var key in definition)__webpack_require__.o(definition,key)&&!__webpack_require__.o(exports,key)&&Object.defineProperty(exports,key,{enumerable:!0,get:definition[key]})},__webpack_require__.f={},__webpack_require__.e=chunkId=>Promise.all(Object.keys(__webpack_require__.f).reduce(((promises,key)=>(__webpack_require__.f[key](chunkId,promises),promises)),[])),__webpack_require__.u=chunkId=>(({231:"fields-MultiSelect-MultiSelectWithCustomSearch-stories",270:"formiks-FormikCheckbox-stories",301:"formiks-FormikMultiSelect-stories",355:"fields-MultiCheckbox-stories",489:"components-Notifier-stories",506:"Colors-stories",534:"formiks-FormikMultiCheckbox-stories",748:"fields-CheckPicker-CheckPicker-stories",868:"elements-Label-stories",920:"components-SideMenu-stories",1049:"fields-MultiRadio-stories",1356:"fields-MultiZoneEditor-stories",1581:"formiks-FormikSelect-stories",1627:"elements-Legend-stories",1765:"fields-DateRangePicker-stories",1936:"formiks-FormikDateRangePicker-stories",2139:"components-Dropdown-stories",2205:"fields-Search-WithOptionsAndCustomMenuItem-stories",2245:"elements-TagGroup-stories",2293:"tables-TableWithSelectableRows-stories",2377:"elements-Tag-stories",3340:"formiks-AutoComplete-WithOptions-stories",3397:"formiks-FormikEffect-stories",3618:"fields-Search-WithQuery-stories",3674:"Icon-stories",3709:"components-Dialog-stories",3856:"elements-IconButton-stories",3897:"tables-DataTable-stories",4012:"fields-DatePicker-stories",4167:"formiks-FormikTextarea-stories",4337:"fields-CheckPicker-CheckPickerWithCustomSearch-stories",4442:"formiks-FormikDatePicker-stories",4482:"fields-Checkbox-stories",4539:"symbols-ExclamationPoint-stories",4672:"components-Message-stories",4693:"formiks-AutoComplete-WithQuery-stories",5016:"tables-SimpleTable-stories",5138:"elements-SingleTag-stories",5189:"tests-button-stories",5453:"fields-Search-WithCustomSearch-stories",5590:"fields-Search-WithOptions-stories",6159:"formiks-FormikTextInput-stories",6330:"elements-Fieldset-stories",6337:"formiks-FormikMultiRadio-stories",6506:"fields-MultiSelect-MultiSelect-stories",6589:"formiks-FormikNumberInput-stories",6600:"fields-TextInput-stories",7249:"fields-CoordinatesInput-stories",7386:"formiks-FormikCoordinatesInput-stories",7754:"fields-Textarea-stories",8392:"elements-Field-stories",8696:"components-MapMenuModal-stories",8851:"fields-NumberInput-stories",9540:"fields-Select-Select-stories",9651:"fields-Select-SelectWithCustomSearch-stories",9929:"elements-Button-stories"}[chunkId]||chunkId)+"."+{231:"65119c99",270:"84fa0400",301:"59683467",355:"d89db4a0",489:"2fe5652e",506:"3c97f7a5",534:"887f12c6",748:"90dee4b5",868:"1a7c5ca9",920:"2e53d2e3",954:"66e028b3",1049:"ed66b820",1341:"68268516",1356:"cce9788b",1581:"820c1141",1627:"f1a9c93d",1729:"94edca2b",1765:"2e7f83f8",1936:"53a5634e",2139:"1ec7c803",2205:"eafe45b8",2245:"29931d67",2293:"0d7cda85",2377:"0a997894",3019:"3f3f5feb",3340:"259ac632",3397:"54b43c69",3618:"65703b56",3674:"cf8c17cf",3709:"74523d95",3856:"1f4970aa",3897:"1a2831fd",4012:"7e2a9353",4167:"b70282f0",4337:"2aba5a24",4442:"22733159",4482:"8964eb8c",4539:"9a405a6e",4672:"5c05f828",4680:"9a8ac98d",4693:"2b5e6333",5016:"a97ccecb",5039:"dd795507",5138:"8aadee04",5189:"37c6f61d",5453:"2319e436",5590:"13c0912f",6081:"6913fe7b",6159:"ca3ecaef",6310:"78f37bcf",6330:"1cd244d2",6337:"cfd6c809",6506:"11057149",6589:"2beeeba7",6600:"d14b1540",6750:"95095023",7098:"a6455bf9",7151:"cbface9a",7249:"dec3fd62",7386:"3a00d3aa",7754:"213796cd",8392:"73276aec",8696:"efddd6d1",8800:"f93586c9",8851:"0696761d",9115:"d73ed64e",9540:"91815772",9651:"9066e91d",9929:"af939c92"}[chunkId]+".iframe.bundle.js"),__webpack_require__.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),__webpack_require__.hmd=module=>((module=Object.create(module)).children||(module.children=[]),Object.defineProperty(module,"exports",{enumerable:!0,set:()=>{throw new Error("ES Modules may not assign module.exports or exports.*, Use ESM export syntax, instead: "+module.id)}}),module),__webpack_require__.o=(obj,prop)=>Object.prototype.hasOwnProperty.call(obj,prop),inProgress={},__webpack_require__.l=(url,done,key,chunkId)=>{if(inProgress[url])inProgress[url].push(done);else{var script,needAttach;if(void 0!==key)for(var scripts=document.getElementsByTagName("script"),i=0;i{script.onerror=script.onload=null,clearTimeout(timeout);var doneFns=inProgress[url];if(delete inProgress[url],script.parentNode&&script.parentNode.removeChild(script),doneFns&&doneFns.forEach((fn=>fn(event))),prev)return prev(event)},timeout=setTimeout(onScriptComplete.bind(null,void 0,{type:"timeout",target:script}),12e4);script.onerror=onScriptComplete.bind(null,script.onerror),script.onload=onScriptComplete.bind(null,script.onload),needAttach&&document.head.appendChild(script)}},__webpack_require__.r=exports=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(exports,"__esModule",{value:!0})},__webpack_require__.nmd=module=>(module.paths=[],module.children||(module.children=[]),module),__webpack_require__.p="",(()=>{var installedChunks={1303:0};__webpack_require__.f.j=(chunkId,promises)=>{var installedChunkData=__webpack_require__.o(installedChunks,chunkId)?installedChunks[chunkId]:void 0;if(0!==installedChunkData)if(installedChunkData)promises.push(installedChunkData[2]);else if(1303!=chunkId){var promise=new Promise(((resolve,reject)=>installedChunkData=installedChunks[chunkId]=[resolve,reject]));promises.push(installedChunkData[2]=promise);var url=__webpack_require__.p+__webpack_require__.u(chunkId),error=new Error;__webpack_require__.l(url,(event=>{if(__webpack_require__.o(installedChunks,chunkId)&&(0!==(installedChunkData=installedChunks[chunkId])&&(installedChunks[chunkId]=void 0),installedChunkData)){var errorType=event&&("load"===event.type?"missing":event.type),realSrc=event&&event.target&&event.target.src;error.message="Loading chunk "+chunkId+" failed.\n("+errorType+": "+realSrc+")",error.name="ChunkLoadError",error.type=errorType,error.request=realSrc,installedChunkData[1](error)}}),"chunk-"+chunkId,chunkId)}else installedChunks[chunkId]=0},__webpack_require__.O.j=chunkId=>0===installedChunks[chunkId];var webpackJsonpCallback=(parentChunkLoadingFunction,data)=>{var moduleId,chunkId,[chunkIds,moreModules,runtime]=data,i=0;if(chunkIds.some((id=>0!==installedChunks[id]))){for(moduleId in moreModules)__webpack_require__.o(moreModules,moduleId)&&(__webpack_require__.m[moduleId]=moreModules[moduleId]);if(runtime)var result=runtime(__webpack_require__)}for(parentChunkLoadingFunction&&parentChunkLoadingFunction(data);i{"use strict";var deferred,leafPrototypes,getProto,inProgress,__webpack_modules__={},__webpack_module_cache__={};function __webpack_require__(moduleId){var cachedModule=__webpack_module_cache__[moduleId];if(void 0!==cachedModule)return cachedModule.exports;var module=__webpack_module_cache__[moduleId]={id:moduleId,loaded:!1,exports:{}};return __webpack_modules__[moduleId].call(module.exports,module,module.exports,__webpack_require__),module.loaded=!0,module.exports}__webpack_require__.m=__webpack_modules__,__webpack_require__.amdO={},deferred=[],__webpack_require__.O=(result,chunkIds,fn,priority)=>{if(!chunkIds){var notFulfilled=1/0;for(i=0;i=priority)&&Object.keys(__webpack_require__.O).every((key=>__webpack_require__.O[key](chunkIds[j])))?chunkIds.splice(j--,1):(fulfilled=!1,priority0&&deferred[i-1][2]>priority;i--)deferred[i]=deferred[i-1];deferred[i]=[chunkIds,fn,priority]},__webpack_require__.n=module=>{var getter=module&&module.__esModule?()=>module.default:()=>module;return __webpack_require__.d(getter,{a:getter}),getter},getProto=Object.getPrototypeOf?obj=>Object.getPrototypeOf(obj):obj=>obj.__proto__,__webpack_require__.t=function(value,mode){if(1&mode&&(value=this(value)),8&mode)return value;if("object"==typeof value&&value){if(4&mode&&value.__esModule)return value;if(16&mode&&"function"==typeof value.then)return value}var ns=Object.create(null);__webpack_require__.r(ns);var def={};leafPrototypes=leafPrototypes||[null,getProto({}),getProto([]),getProto(getProto)];for(var current=2&mode&&value;"object"==typeof current&&!~leafPrototypes.indexOf(current);current=getProto(current))Object.getOwnPropertyNames(current).forEach((key=>def[key]=()=>value[key]));return def.default=()=>value,__webpack_require__.d(ns,def),ns},__webpack_require__.d=(exports,definition)=>{for(var key in definition)__webpack_require__.o(definition,key)&&!__webpack_require__.o(exports,key)&&Object.defineProperty(exports,key,{enumerable:!0,get:definition[key]})},__webpack_require__.f={},__webpack_require__.e=chunkId=>Promise.all(Object.keys(__webpack_require__.f).reduce(((promises,key)=>(__webpack_require__.f[key](chunkId,promises),promises)),[])),__webpack_require__.u=chunkId=>(({231:"fields-MultiSelect-MultiSelectWithCustomSearch-stories",270:"formiks-FormikCheckbox-stories",301:"formiks-FormikMultiSelect-stories",355:"fields-MultiCheckbox-stories",489:"components-Notifier-stories",506:"Colors-stories",534:"formiks-FormikMultiCheckbox-stories",748:"fields-CheckPicker-CheckPicker-stories",868:"elements-Label-stories",920:"components-SideMenu-stories",1049:"fields-MultiRadio-stories",1356:"fields-MultiZoneEditor-stories",1581:"formiks-FormikSelect-stories",1627:"elements-Legend-stories",1765:"fields-DateRangePicker-stories",1936:"formiks-FormikDateRangePicker-stories",2139:"components-Dropdown-stories",2205:"fields-Search-WithOptionsAndCustomMenuItem-stories",2245:"elements-TagGroup-stories",2293:"tables-TableWithSelectableRows-stories",2377:"elements-Tag-stories",3340:"formiks-AutoComplete-WithOptions-stories",3397:"formiks-FormikEffect-stories",3618:"fields-Search-WithQuery-stories",3674:"Icon-stories",3709:"components-Dialog-stories",3856:"elements-IconButton-stories",3897:"tables-DataTable-stories",4012:"fields-DatePicker-stories",4167:"formiks-FormikTextarea-stories",4337:"fields-CheckPicker-CheckPickerWithCustomSearch-stories",4442:"formiks-FormikDatePicker-stories",4482:"fields-Checkbox-stories",4539:"symbols-ExclamationPoint-stories",4672:"components-Message-stories",4693:"formiks-AutoComplete-WithQuery-stories",5016:"tables-SimpleTable-stories",5138:"elements-SingleTag-stories",5189:"tests-button-stories",5453:"fields-Search-WithCustomSearch-stories",5590:"fields-Search-WithOptions-stories",6159:"formiks-FormikTextInput-stories",6330:"elements-Fieldset-stories",6337:"formiks-FormikMultiRadio-stories",6506:"fields-MultiSelect-MultiSelect-stories",6589:"formiks-FormikNumberInput-stories",6600:"fields-TextInput-stories",7249:"fields-CoordinatesInput-stories",7386:"formiks-FormikCoordinatesInput-stories",7754:"fields-Textarea-stories",8392:"elements-Field-stories",8696:"components-MapMenuModal-stories",8851:"fields-NumberInput-stories",9540:"fields-Select-Select-stories",9651:"fields-Select-SelectWithCustomSearch-stories",9929:"elements-Button-stories"}[chunkId]||chunkId)+"."+{231:"65119c99",270:"84fa0400",301:"59683467",355:"d89db4a0",489:"2fe5652e",506:"3c97f7a5",534:"887f12c6",748:"90dee4b5",868:"1a7c5ca9",920:"2e53d2e3",954:"66e028b3",1049:"ed66b820",1341:"68268516",1356:"cce9788b",1581:"820c1141",1627:"f1a9c93d",1729:"94edca2b",1765:"2e7f83f8",1936:"53a5634e",2139:"1ec7c803",2205:"eafe45b8",2245:"29931d67",2293:"e67b855c",2377:"0a997894",3019:"3f3f5feb",3340:"259ac632",3397:"54b43c69",3618:"65703b56",3674:"cf8c17cf",3709:"74523d95",3856:"1f4970aa",3897:"1a2831fd",4012:"7e2a9353",4167:"b70282f0",4337:"2aba5a24",4442:"22733159",4482:"8964eb8c",4539:"9a405a6e",4672:"5c05f828",4680:"9a8ac98d",4693:"2b5e6333",5016:"a97ccecb",5039:"dd795507",5138:"8aadee04",5189:"37c6f61d",5453:"2319e436",5590:"13c0912f",6081:"6913fe7b",6159:"ca3ecaef",6310:"78f37bcf",6330:"1cd244d2",6337:"cfd6c809",6506:"11057149",6589:"2beeeba7",6600:"d14b1540",6750:"95095023",7098:"a6455bf9",7151:"cbface9a",7249:"dec3fd62",7386:"3a00d3aa",7754:"213796cd",8392:"73276aec",8696:"efddd6d1",8800:"f93586c9",8851:"0696761d",9115:"d73ed64e",9540:"91815772",9651:"9066e91d",9929:"af939c92"}[chunkId]+".iframe.bundle.js"),__webpack_require__.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),__webpack_require__.hmd=module=>((module=Object.create(module)).children||(module.children=[]),Object.defineProperty(module,"exports",{enumerable:!0,set:()=>{throw new Error("ES Modules may not assign module.exports or exports.*, Use ESM export syntax, instead: "+module.id)}}),module),__webpack_require__.o=(obj,prop)=>Object.prototype.hasOwnProperty.call(obj,prop),inProgress={},__webpack_require__.l=(url,done,key,chunkId)=>{if(inProgress[url])inProgress[url].push(done);else{var script,needAttach;if(void 0!==key)for(var scripts=document.getElementsByTagName("script"),i=0;i{script.onerror=script.onload=null,clearTimeout(timeout);var doneFns=inProgress[url];if(delete inProgress[url],script.parentNode&&script.parentNode.removeChild(script),doneFns&&doneFns.forEach((fn=>fn(event))),prev)return prev(event)},timeout=setTimeout(onScriptComplete.bind(null,void 0,{type:"timeout",target:script}),12e4);script.onerror=onScriptComplete.bind(null,script.onerror),script.onload=onScriptComplete.bind(null,script.onload),needAttach&&document.head.appendChild(script)}},__webpack_require__.r=exports=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(exports,"__esModule",{value:!0})},__webpack_require__.nmd=module=>(module.paths=[],module.children||(module.children=[]),module),__webpack_require__.p="",(()=>{var installedChunks={1303:0};__webpack_require__.f.j=(chunkId,promises)=>{var installedChunkData=__webpack_require__.o(installedChunks,chunkId)?installedChunks[chunkId]:void 0;if(0!==installedChunkData)if(installedChunkData)promises.push(installedChunkData[2]);else if(1303!=chunkId){var promise=new Promise(((resolve,reject)=>installedChunkData=installedChunks[chunkId]=[resolve,reject]));promises.push(installedChunkData[2]=promise);var url=__webpack_require__.p+__webpack_require__.u(chunkId),error=new Error;__webpack_require__.l(url,(event=>{if(__webpack_require__.o(installedChunks,chunkId)&&(0!==(installedChunkData=installedChunks[chunkId])&&(installedChunks[chunkId]=void 0),installedChunkData)){var errorType=event&&("load"===event.type?"missing":event.type),realSrc=event&&event.target&&event.target.src;error.message="Loading chunk "+chunkId+" failed.\n("+errorType+": "+realSrc+")",error.name="ChunkLoadError",error.type=errorType,error.request=realSrc,installedChunkData[1](error)}}),"chunk-"+chunkId,chunkId)}else installedChunks[chunkId]=0},__webpack_require__.O.j=chunkId=>0===installedChunks[chunkId];var webpackJsonpCallback=(parentChunkLoadingFunction,data)=>{var moduleId,chunkId,[chunkIds,moreModules,runtime]=data,i=0;if(chunkIds.some((id=>0!==installedChunks[id]))){for(moduleId in moreModules)__webpack_require__.o(moreModules,moduleId)&&(__webpack_require__.m[moduleId]=moreModules[moduleId]);if(runtime)var result=runtime(__webpack_require__)}for(parentChunkLoadingFunction&&parentChunkLoadingFunction(data);i{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{_TableWithSelectableRows:()=>_TableWithSelectableRows,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _tanstack_react_table__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@tanstack/react-table/build/lib/index.mjs"),_tanstack_react_table__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@tanstack/table-core/build/lib/index.mjs"),_tanstack_react_virtual__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@tanstack/react-virtual/build/lib/index.mjs"),react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),styled_components__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_storybook_components_StoryDecorator__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./.storybook/components/StoryDecorator.tsx"),_src__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/index.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/react/jsx-runtime.js");const data=[...Array(100).fill({id:4,reportingId:2300004,sourceType:"SEMAPHORE",semaphoreId:33,controlUnitId:null,sourceName:null,displayedSource:"Sémaphore de Boulogne sur mer",targetType:null,vehicleType:null,targetDetails:[],geom:{type:"MultiPolygon",coordinates:[[[[-19.00097037,49.57813235],[-14.5054498,50.48083701],[-14.25087621,49.53018118],[-19.00097037,49.57813235]]]]},seaFront:"MED",description:null,reportType:"INFRACTION_SUSPICION",theme:null,subThemes:[],actionTaken:null,isInfractionProven:!1,isControlRequired:!1,isUnitAvailable:null,createdAt:"2023-08-04T15:13:43.296Z",validityTime:1,isArchived:!1}),...Array(100).fill({id:1,reportingId:2300001,sourceType:"SEMAPHORE",semaphoreId:21,controlUnitId:null,sourceName:null,displayedSource:"SEMAPHORE LE TOULINGUET",targetType:"VEHICLE",vehicleType:"VESSEL",targetDetails:[{mmsi:"012314231343",imo:null,externalReferenceNumber:null,vesselName:"Vessel 1",operatorName:null,size:null}],geom:{type:"MultiPoint",coordinates:[[-4.93888188,48.41495669]]},seaFront:"NAMO",description:"Description 1",reportType:"OBSERVATION",theme:"Rejets illicites",subThemes:["Jet de déchet","Carénage sauvage"],actionTaken:"ACTION TAKEN",isInfractionProven:!0,isControlRequired:!0,isUnitAvailable:!0,createdAt:"2023-08-01T15:13:01.073587Z",validityTime:24,isArchived:!0})],__WEBPACK_DEFAULT_EXPORT__={title:"Tables/TableWithSelectableRows",decorators:[(0,_storybook_components_StoryDecorator__WEBPACK_IMPORTED_MODULE_1__.N)()]},ButtonsGroupRow=({id,onSelect})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(ButtonsGroup,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.hU,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.TERTIARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Duplicate,onClick:()=>console.log(id)}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.hU,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.TERTIARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Edit,onClick:()=>console.log(id)}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(_src__WEBPACK_IMPORTED_MODULE_2__.Lt,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.SECONDARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.More,onSelect,children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.Lt.Item,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.SECONDARY,eventKey:"ARCHIVE",Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Archive}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.Lt.Item,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.SECONDARY,eventKey:"DELETE",Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Delete})]})]});function _TableWithSelectableRows(){const[rowSelection,setRowSelection]=(0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({}),[sorting,setSorting]=(0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([{id:"createdAt",desc:!1}]),columns=(0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)((()=>[{id:"select",size:50,enableSorting:!1,accessorFn:row=>row.reportingId,header:({table})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.RowCheckbox,{isChecked:table.getIsAllRowsSelected(),isIndeterminate:table.getIsSomeRowsSelected(),onChange:table.getToggleAllRowsSelectedHandler()}),cell:({row})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{className:"px-1",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.RowCheckbox,{isChecked:row.getIsSelected(),disabled:!row.getCanSelect(),onChange:row.getToggleSelectedHandler(row)})})},{accessorFn:row=>row.reportingId,cell:info=>info.getValue(),enableSorting:!1,header:()=>"",id:"reportingId",size:90},{accessorFn:row=>row.createdAt,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Ouverture",id:"createdAt",size:150},{accessorFn:row=>row.validityTime,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Fin dans",id:"validityTime",size:90},{accessorFn:row=>row.displayedSource,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Source",id:"displayedSource",maxSize:280,minSize:230},{accessorFn:row=>row.reportType,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Type",id:"reportType",size:150},{accessorFn:row=>row,cell:({row})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("span",{children:[row.original.theme,": ",row.original.subThemes?row.original.subThemes.join(", "):""]}),enableSorting:!0,header:()=>"Thématique",id:"theme",maxSize:280,minSize:230},{accessorFn:row=>row.seaFront,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Façade",id:"seaFront",size:100},{accessorFn:row=>row.status,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Statut",id:"isArchived",size:110},{accessorFn:row=>row.geom,cell:info=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.hU,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.TERTIARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.FocusZones,onClick:()=>console.log(info.getValue())}),enableSorting:!1,header:()=>"",id:"geom",maxSize:50,minSize:50,size:50},{accessorFn:row=>row.id,cell:info=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(ButtonsGroupRow,{id:info.getValue(),onSelect:key=>((key,id)=>{"ARCHIVE"===key?console.log("we want to archive the reporting with id: ",id):console.log("we want to delete the reporting with id: ",id)})(key,info.getValue())}),enableSorting:!1,header:()=>"",id:"id",size:120}]),[]),table=(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_4__.b7)({columns,data,state:{sorting,rowSelection},enableRowSelection:!0,enableSortingRemoval:!1,onRowSelectionChange:rowId=>{setRowSelection(rowId)},onSortingChange:setSorting,getCoreRowModel:(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_5__.sC)(),getSortedRowModel:(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_5__.tj)()}),selectedIds=(0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)((()=>table.getSelectedRowModel().rows.map((({original})=>original.id))),[rowSelection]),tableContainerRef=(0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null),{rows}=table.getRowModel(),rowVirtualizer=(0,_tanstack_react_virtual__WEBPACK_IMPORTED_MODULE_6__.MG)({count:rows.length,getScrollElement:()=>tableContainerRef.current,estimateSize:()=>10,overscan:10,getItemKey:(0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)((index=>`${rows[index]?.id}`),[rows])}),virtualRows=rowVirtualizer.getVirtualItems(),[paddingTop,paddingBottom]=virtualRows.length>0?[Math.max(0,virtualRows[0]?.start||0),Math.max(0,rowVirtualizer.getTotalSize()-(virtualRows[virtualRows.length-1]?.end||0))]:[0,0];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.hU,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.SECONDARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Archive,onClick:()=>{console.log("this reportings will be archived: ",selectedIds)}})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{ref:tableContainerRef,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.Table,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.Head,{children:table.getHeaderGroups().map((headerGroup=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("tr",{children:headerGroup.headers.map((header=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.Th,{style:{maxWidth:header.column.getSize(),minWidth:header.column.getSize(),width:header.column.getSize()},children:header.isPlaceholder?void 0:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.SortContainer,{className:header.column.getCanSort()?"cursor-pointer":"",onClick:header.column.getToggleSortingHandler(),children:[(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_4__.ie)(header.column.columnDef.header,header.getContext()),header.column.getCanSort()&&({asc:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{children:"▲"}),desc:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{children:"▼"})}[header.column.getIsSorted()]??(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.JO.SortingArrows,{size:14}))]})},header.id)))},headerGroup.id)))}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("tbody",{children:[paddingTop>0&&(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("tr",{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("td",{style:{height:`${paddingTop}px`}})}),virtualRows.map((virtualRow=>{const row=rows[virtualRow.index];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.BodyTr,{children:row?.getVisibleCells().map((cell=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.Td,{key:cell.id,style:{maxWidth:cell.column.getSize(),minWidth:cell.column.getSize(),width:cell.column.getSize()},$isCenter:!("geom"!==cell.column.id&&"id"!==cell.column.id),$hasRightBorder:!("geom"!==cell.column.id),children:(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_4__.ie)(cell.column.columnDef.cell,cell.getContext())})))},virtualRow.key)})),paddingBottom>0&&(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("tr",{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("td",{style:{height:`${paddingBottom}px`}})})]})]})})]})}ButtonsGroupRow.displayName="ButtonsGroupRow";const ButtonsGroup=styled_components__WEBPACK_IMPORTED_MODULE_7__.ZP.div` +`;try{generateStoryDecorator.displayName="generateStoryDecorator",generateStoryDecorator.__docgenInfo={description:"",displayName:"generateStoryDecorator",props:{fixedWidth:{defaultValue:null,description:"",name:"fixedWidth",required:!1,type:{name:"number"}},hasDarkMode:{defaultValue:{value:"false"},description:"",name:"hasDarkMode",required:!1,type:{name:"boolean"}},withNewWindowButton:{defaultValue:{value:"false"},description:"",name:"withNewWindowButton",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES[".storybook/components/StoryDecorator.tsx#generateStoryDecorator"]={docgenInfo:generateStoryDecorator.__docgenInfo,name:"generateStoryDecorator",path:".storybook/components/StoryDecorator.tsx#generateStoryDecorator"})}catch(__react_docgen_typescript_loader_error){}},"./stories/tables/TableWithSelectableRows.stories.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{_TableWithSelectableRows:()=>_TableWithSelectableRows,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _tanstack_react_table__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@tanstack/react-table/build/lib/index.mjs"),_tanstack_react_table__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@tanstack/table-core/build/lib/index.mjs"),_tanstack_react_virtual__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@tanstack/react-virtual/build/lib/index.mjs"),react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),styled_components__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_storybook_components_StoryDecorator__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./.storybook/components/StoryDecorator.tsx"),_src__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/index.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/react/jsx-runtime.js");const data=[...Array(100).fill({id:4,reportingId:2300004,sourceType:"SEMAPHORE",semaphoreId:33,controlUnitId:null,sourceName:null,displayedSource:"Sémaphore de Boulogne sur mer",targetType:null,vehicleType:null,targetDetails:[],geom:{type:"MultiPolygon",coordinates:[[[[-19.00097037,49.57813235],[-14.5054498,50.48083701],[-14.25087621,49.53018118],[-19.00097037,49.57813235]]]]},seaFront:"MED",description:null,reportType:"INFRACTION_SUSPICION",theme:null,subThemes:[],actionTaken:null,isInfractionProven:!1,isControlRequired:!1,isUnitAvailable:null,createdAt:"2023-08-04T15:13:43.296Z",validityTime:1,isArchived:!1}),...Array(100).fill({id:1,reportingId:2300001,sourceType:"SEMAPHORE",semaphoreId:21,controlUnitId:null,sourceName:null,displayedSource:"SEMAPHORE LE TOULINGUET",targetType:"VEHICLE",vehicleType:"VESSEL",targetDetails:[{mmsi:"012314231343",imo:null,externalReferenceNumber:null,vesselName:"Vessel 1",operatorName:null,size:null}],geom:{type:"MultiPoint",coordinates:[[-4.93888188,48.41495669]]},seaFront:"NAMO",description:"Description 1",reportType:"OBSERVATION",theme:"Rejets illicites",subThemes:["Jet de déchet","Carénage sauvage"],actionTaken:"ACTION TAKEN",isInfractionProven:!0,isControlRequired:!0,isUnitAvailable:!0,createdAt:"2023-08-01T15:13:01.073587Z",validityTime:24,isArchived:!0})],__WEBPACK_DEFAULT_EXPORT__={title:"Tables/TableWithSelectableRows",decorators:[(0,_storybook_components_StoryDecorator__WEBPACK_IMPORTED_MODULE_1__.N)()]},ButtonsGroupRow=({id,onSelect})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(ButtonsGroup,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.hU,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.TERTIARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Duplicate,onClick:()=>console.log(id)}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.hU,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.TERTIARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Edit,onClick:()=>console.log(id)}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(_src__WEBPACK_IMPORTED_MODULE_2__.Lt,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.SECONDARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.More,onSelect,children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.Lt.Item,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.SECONDARY,eventKey:"ARCHIVE",Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Archive}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.Lt.Item,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.SECONDARY,eventKey:"DELETE",Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Delete})]})]});function _TableWithSelectableRows(){const[rowSelection,setRowSelection]=(0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({}),[sorting,setSorting]=(0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([{id:"createdAt",desc:!1}]),columns=(0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)((()=>[{id:"select",size:50,enableSorting:!1,accessorFn:row=>row.reportingId,header:({table})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.RowCheckbox,{isChecked:table.getIsAllRowsSelected(),isIndeterminate:table.getIsSomeRowsSelected(),onChange:table.getToggleAllRowsSelectedHandler()}),cell:({row})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{className:"px-1",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.RowCheckbox,{isChecked:row.getIsSelected(),disabled:!row.getCanSelect(),onChange:row.getToggleSelectedHandler(row)})})},{accessorFn:row=>row.reportingId,cell:info=>info.getValue(),enableSorting:!1,header:()=>"",id:"reportingId",size:90},{accessorFn:row=>row.createdAt,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Ouverture",id:"createdAt",size:150},{accessorFn:row=>row.validityTime,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Fin dans",id:"validityTime",size:90},{accessorFn:row=>row.displayedSource,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Source",id:"displayedSource",maxSize:280,minSize:230},{accessorFn:row=>row.reportType,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Type",id:"reportType",size:150},{accessorFn:row=>row,cell:({row})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("span",{children:[row.original.theme,": ",row.original.subThemes?row.original.subThemes.join(", "):""]}),enableSorting:!0,header:()=>"Thématique",id:"theme",maxSize:280,minSize:230},{accessorFn:row=>row.seaFront,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Façade",id:"seaFront",size:100},{accessorFn:row=>row.status,cell:info=>info.getValue(),enableSorting:!0,header:()=>"Statut",id:"isArchived",size:110},{accessorFn:row=>row.geom,cell:info=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.hU,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.TERTIARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.FocusZones,onClick:()=>console.log(info.getValue())}),enableSorting:!1,header:()=>"",id:"geom",maxSize:50,minSize:50,size:50},{accessorFn:row=>row.id,cell:info=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(ButtonsGroupRow,{id:info.getValue(),onSelect:key=>((key,id)=>{"ARCHIVE"===key?console.log("we want to archive the reporting with id: ",id):console.log("we want to delete the reporting with id: ",id)})(key,info.getValue())}),enableSorting:!1,header:()=>"",id:"id",size:120}]),[]),table=(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_4__.b7)({columns,data,state:{sorting,rowSelection},enableRowSelection:!0,enableSortingRemoval:!1,onRowSelectionChange:rowId=>{setRowSelection(rowId)},onSortingChange:setSorting,getCoreRowModel:(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_5__.sC)(),getSortedRowModel:(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_5__.tj)()}),selectedIds=(0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)((()=>table.getSelectedRowModel().rows.map((({original})=>original.id))),[rowSelection]),tableContainerRef=(0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null),{rows}=table.getRowModel(),rowVirtualizer=(0,_tanstack_react_virtual__WEBPACK_IMPORTED_MODULE_6__.MG)({count:rows.length,getScrollElement:()=>tableContainerRef.current,estimateSize:()=>10,overscan:10,getItemKey:(0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)((index=>`${rows[index]?.id}`),[rows])}),virtualRows=rowVirtualizer.getVirtualItems(),[paddingTop,paddingBottom]=virtualRows.length>0?[Math.max(0,virtualRows[0]?.start||0),Math.max(0,rowVirtualizer.getTotalSize()-(virtualRows[virtualRows.length-1]?.end||0))]:[0,0];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.hU,{accent:_src__WEBPACK_IMPORTED_MODULE_2__.Le.SECONDARY,Icon:_src__WEBPACK_IMPORTED_MODULE_2__.JO.Archive,onClick:()=>{console.log("this reportings will be archived: ",selectedIds)}})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{ref:tableContainerRef,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.Table,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.Head,{children:table.getHeaderGroups().map((headerGroup=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("tr",{children:headerGroup.headers.map((header=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.Th,{style:{maxWidth:header.column.getSize(),minWidth:header.column.getSize(),width:header.column.getSize()},children:header.isPlaceholder?void 0:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.SortContainer,{className:header.column.getCanSort()?"cursor-pointer":"",onClick:header.column.getToggleSortingHandler(),children:[(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_4__.ie)(header.column.columnDef.header,header.getContext()),header.column.getCanSort()&&({asc:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{children:"▲"}),desc:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div",{children:"▼"})}[header.column.getIsSorted()]??(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.JO.SortingArrows,{size:14}))]})},header.id)))},headerGroup.id)))}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("tbody",{children:[paddingTop>0&&(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("tr",{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("td",{style:{height:`${paddingTop}px`}})}),virtualRows.map(((virtualRow,index)=>{const row=rows[virtualRow.index];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.BodyTr,{$isHighlighted:index%2==0,children:row?.getVisibleCells().map((cell=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_src__WEBPACK_IMPORTED_MODULE_2__.P$.Td,{key:cell.id,style:{maxWidth:cell.column.getSize(),minWidth:cell.column.getSize(),width:cell.column.getSize()},$isCenter:!("geom"!==cell.column.id&&"id"!==cell.column.id),$hasRightBorder:!("geom"!==cell.column.id),$isHighlighted:index%2==0,children:(0,_tanstack_react_table__WEBPACK_IMPORTED_MODULE_4__.ie)(cell.column.columnDef.cell,cell.getContext())})))},virtualRow.key)})),paddingBottom>0&&(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("tr",{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("td",{style:{height:`${paddingBottom}px`}})})]})]})})]})}ButtonsGroupRow.displayName="ButtonsGroupRow";const ButtonsGroup=styled_components__WEBPACK_IMPORTED_MODULE_7__.ZP.div` display: flex; flex-direction: row; gap: 8px; @@ -18,5 +18,5 @@ > button { padding: 0px; } -`;_TableWithSelectableRows.parameters={..._TableWithSelectableRows.parameters,docs:{..._TableWithSelectableRows.parameters?.docs,source:{originalSource:"function _TableWithSelectableRows() {\n const [rowSelection, setRowSelection] = useState({});\n const [sorting, setSorting] = useState([{\n id: 'createdAt',\n desc: false\n }]);\n const doAction = (key, id) => {\n if (key === 'ARCHIVE') {\n console.log('we want to archive the reporting with id: ', id);\n } else {\n console.log('we want to delete the reporting with id: ', id);\n }\n };\n const columns = useMemo(() => [{\n id: 'select',\n size: 50,\n enableSorting: false,\n accessorFn: row => row.reportingId,\n header: ({\n table\n }) => ,\n cell: ({\n row\n }) =>
\n \n
\n }, {\n accessorFn: row => row.reportingId,\n cell: info => info.getValue(),\n enableSorting: false,\n header: () => '',\n id: 'reportingId',\n size: 90\n }, {\n accessorFn: row => row.createdAt,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Ouverture',\n id: 'createdAt',\n size: 150\n }, {\n accessorFn: row => row.validityTime,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Fin dans',\n id: 'validityTime',\n size: 90\n }, {\n accessorFn: row => row.displayedSource,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Source',\n id: 'displayedSource',\n maxSize: 280,\n minSize: 230\n }, {\n accessorFn: row => row.reportType,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Type',\n id: 'reportType',\n size: 150\n }, {\n accessorFn: row => row,\n cell: ({\n row\n }) => \n {row.original.theme}: {row.original.subThemes ? row.original.subThemes.join(', ') : ''}\n ,\n enableSorting: true,\n header: () => 'Thématique',\n id: 'theme',\n maxSize: 280,\n minSize: 230\n }, {\n accessorFn: row => row.seaFront,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Façade',\n id: 'seaFront',\n size: 100\n }, {\n accessorFn: row => row.status,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Statut',\n id: 'isArchived',\n size: 110\n }, {\n accessorFn: row => row.geom,\n cell: info => console.log(info.getValue())} />,\n enableSorting: false,\n header: () => '',\n id: 'geom',\n maxSize: 50,\n minSize: 50,\n size: 50\n }, {\n accessorFn: row => row.id,\n cell: info => doAction(key, info.getValue())} />,\n enableSorting: false,\n header: () => '',\n id: 'id',\n size: 120\n }], []);\n const table = useReactTable({\n columns,\n data,\n state: {\n sorting,\n rowSelection\n },\n enableRowSelection: true,\n enableSortingRemoval: false,\n onRowSelectionChange: rowId => {\n setRowSelection(rowId);\n },\n onSortingChange: setSorting,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel()\n });\n const selectedIds = useMemo(() => table.getSelectedRowModel().rows.map(({\n original\n }) => original.id),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [rowSelection]);\n\n // eslint-disable-next-line no-null/no-null\n const tableContainerRef = useRef(null);\n const {\n rows\n } = table.getRowModel();\n const rowVirtualizer = useVirtualizer({\n count: rows.length,\n getScrollElement: () => tableContainerRef.current,\n estimateSize: () => 10,\n overscan: 10,\n // Pass correct keys to virtualizer it's important when rows change position\n getItemKey: useCallback((index: number) => `${rows[index]?.id}`, [rows])\n });\n const virtualRows = rowVirtualizer.getVirtualItems();\n const [paddingTop, paddingBottom] = virtualRows.length > 0 ? [Math.max(0, virtualRows[0]?.start || 0), Math.max(0, rowVirtualizer.getTotalSize() - (virtualRows[virtualRows.length - 1]?.end || 0))] : [0, 0];\n const archiveReportings = () => {\n // eslint-disable-next-line no-console\n console.log('this reportings will be archived: ', selectedIds);\n };\n return <>\n
\n \n
\n
\n \n \n {table.getHeaderGroups().map(headerGroup => \n {headerGroup.headers.map(header => \n {header.isPlaceholder ? undefined : \n {flexRender(header.column.columnDef.header, header.getContext())}\n {header.column.getCanSort() && ({\n asc:
▲
,\n desc:
▼
\n }[(header.column.getIsSorted() as string)] ?? )}\n }\n )}\n )}\n \n \n {paddingTop > 0 && \n \n }\n {virtualRows.map(virtualRow => {\n const row = rows[virtualRow.index];\n return \n {row?.getVisibleCells().map(cell => \n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n )}\n ;\n })}\n {paddingBottom > 0 && \n \n }\n \n \n
\n ;\n}",..._TableWithSelectableRows.parameters?.docs?.source}}};const __namedExportsOrder=["_TableWithSelectableRows"]}}]); -//# sourceMappingURL=tables-TableWithSelectableRows-stories.0d7cda85.iframe.bundle.js.map \ No newline at end of file +`;_TableWithSelectableRows.parameters={..._TableWithSelectableRows.parameters,docs:{..._TableWithSelectableRows.parameters?.docs,source:{originalSource:"function _TableWithSelectableRows() {\n const [rowSelection, setRowSelection] = useState({});\n const [sorting, setSorting] = useState([{\n id: 'createdAt',\n desc: false\n }]);\n const doAction = (key, id) => {\n if (key === 'ARCHIVE') {\n console.log('we want to archive the reporting with id: ', id);\n } else {\n console.log('we want to delete the reporting with id: ', id);\n }\n };\n const columns = useMemo(() => [{\n id: 'select',\n size: 50,\n enableSorting: false,\n accessorFn: row => row.reportingId,\n header: ({\n table\n }) => ,\n cell: ({\n row\n }) =>
\n \n
\n }, {\n accessorFn: row => row.reportingId,\n cell: info => info.getValue(),\n enableSorting: false,\n header: () => '',\n id: 'reportingId',\n size: 90\n }, {\n accessorFn: row => row.createdAt,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Ouverture',\n id: 'createdAt',\n size: 150\n }, {\n accessorFn: row => row.validityTime,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Fin dans',\n id: 'validityTime',\n size: 90\n }, {\n accessorFn: row => row.displayedSource,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Source',\n id: 'displayedSource',\n maxSize: 280,\n minSize: 230\n }, {\n accessorFn: row => row.reportType,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Type',\n id: 'reportType',\n size: 150\n }, {\n accessorFn: row => row,\n cell: ({\n row\n }) => \n {row.original.theme}: {row.original.subThemes ? row.original.subThemes.join(', ') : ''}\n ,\n enableSorting: true,\n header: () => 'Thématique',\n id: 'theme',\n maxSize: 280,\n minSize: 230\n }, {\n accessorFn: row => row.seaFront,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Façade',\n id: 'seaFront',\n size: 100\n }, {\n accessorFn: row => row.status,\n cell: info => info.getValue(),\n enableSorting: true,\n header: () => 'Statut',\n id: 'isArchived',\n size: 110\n }, {\n accessorFn: row => row.geom,\n cell: info => console.log(info.getValue())} />,\n enableSorting: false,\n header: () => '',\n id: 'geom',\n maxSize: 50,\n minSize: 50,\n size: 50\n }, {\n accessorFn: row => row.id,\n cell: info => doAction(key, info.getValue())} />,\n enableSorting: false,\n header: () => '',\n id: 'id',\n size: 120\n }], []);\n const table = useReactTable({\n columns,\n data,\n state: {\n sorting,\n rowSelection\n },\n enableRowSelection: true,\n enableSortingRemoval: false,\n onRowSelectionChange: rowId => {\n setRowSelection(rowId);\n },\n onSortingChange: setSorting,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel()\n });\n const selectedIds = useMemo(() => table.getSelectedRowModel().rows.map(({\n original\n }) => original.id),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [rowSelection]);\n\n // eslint-disable-next-line no-null/no-null\n const tableContainerRef = useRef(null);\n const {\n rows\n } = table.getRowModel();\n const rowVirtualizer = useVirtualizer({\n count: rows.length,\n getScrollElement: () => tableContainerRef.current,\n estimateSize: () => 10,\n overscan: 10,\n // Pass correct keys to virtualizer it's important when rows change position\n getItemKey: useCallback((index: number) => `${rows[index]?.id}`, [rows])\n });\n const virtualRows = rowVirtualizer.getVirtualItems();\n const [paddingTop, paddingBottom] = virtualRows.length > 0 ? [Math.max(0, virtualRows[0]?.start || 0), Math.max(0, rowVirtualizer.getTotalSize() - (virtualRows[virtualRows.length - 1]?.end || 0))] : [0, 0];\n const archiveReportings = () => {\n // eslint-disable-next-line no-console\n console.log('this reportings will be archived: ', selectedIds);\n };\n return <>\n
\n \n
\n
\n \n \n {table.getHeaderGroups().map(headerGroup => \n {headerGroup.headers.map(header => \n {header.isPlaceholder ? undefined : \n {flexRender(header.column.columnDef.header, header.getContext())}\n {header.column.getCanSort() && ({\n asc:
▲
,\n desc:
▼
\n }[(header.column.getIsSorted() as string)] ?? )}\n }\n )}\n )}\n \n \n {paddingTop > 0 && \n \n }\n {virtualRows.map((virtualRow, index) => {\n const row = rows[virtualRow.index];\n return \n {row?.getVisibleCells().map(cell => \n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n )}\n ;\n })}\n {paddingBottom > 0 && \n \n }\n \n \n
\n ;\n}",..._TableWithSelectableRows.parameters?.docs?.source}}};const __namedExportsOrder=["_TableWithSelectableRows"]}}]); +//# sourceMappingURL=tables-TableWithSelectableRows-stories.e67b855c.iframe.bundle.js.map \ No newline at end of file diff --git a/tables-TableWithSelectableRows-stories.0d7cda85.iframe.bundle.js.map b/tables-TableWithSelectableRows-stories.e67b855c.iframe.bundle.js.map similarity index 96% rename from tables-TableWithSelectableRows-stories.0d7cda85.iframe.bundle.js.map rename to tables-TableWithSelectableRows-stories.e67b855c.iframe.bundle.js.map index 450472548..b176be922 100644 --- a/tables-TableWithSelectableRows-stories.0d7cda85.iframe.bundle.js.map +++ b/tables-TableWithSelectableRows-stories.e67b855c.iframe.bundle.js.map @@ -1 +1 @@ -{"version":3,"file":"tables-TableWithSelectableRows-stories.0d7cda85.iframe.bundle.js","mappings":";;;;AA6HA;;;;AAKA","sources":["webpack://@mtes-mct/monitor-ui__root/./.storybook/components/StoryDecorator.tsx"],"sourcesContent":["import { forwardRef, useEffect, useImperativeHandle, useMemo, useState, useRef } from 'react'\nimport styled from 'styled-components'\n\nimport { GlobalDecoratorWrapper } from './GlobalDecorator'\nimport { Accent, Button, NewWindow, Size, THEME, useForceUpdate, useNewWindow, NewWindowContext } from '../../src'\n\nimport type { NewWindowContextValue } from '../../src'\nimport type { StoryContext, StoryFn, StrictArgs } from '@storybook/react'\nimport type { ForwardedRef, MutableRefObject } from 'react'\n\nexport function generateStoryDecorator({\n fixedWidth,\n hasDarkMode = false,\n withNewWindowButton = false\n}: {\n fixedWidth?: number\n hasDarkMode?: boolean\n withNewWindowButton?: boolean\n} = {}) {\n return function StoryDecorator(Story: StoryFn, { args }: StoryContext) {\n const newWindowRef = useRef() as MutableRefObject\n\n const [isNewWindowOpen, setIsNewWindowOpen] = useState(false)\n\n const style = useMemo(\n () => ({\n ...(fixedWidth\n ? {\n width: `${fixedWidth}px`\n }\n : {}),\n ...(hasDarkMode\n ? {\n backgroundColor: args.isLight ? THEME.color.gainsboro : THEME.color.white\n }\n : {})\n }),\n [args.isLight]\n )\n\n const { forceUpdate } = useForceUpdate()\n\n useEffect(() => {\n forceUpdate()\n }, [forceUpdate])\n\n return (\n <>\n {withNewWindowButton && (\n \n \n \n )}\n\n {!isNewWindowOpen && (\n \n \n \n )}\n\n {withNewWindowButton && isNewWindowOpen && (\n setIsNewWindowOpen(false)}>\n \n \n )}\n \n )\n }\n}\n\nfunction NewWindowStoryWrapperWithRef(\n { Story, storyArgs }: { Story: StoryFn; storyArgs: StrictArgs },\n ref: ForwardedRef\n) {\n // eslint-disable-next-line no-null/no-null\n const wrapperRef = useRef(null)\n\n const [isFirstRender, setIsFirstRender] = useState(true)\n\n useImperativeHandle(ref, () => wrapperRef.current)\n\n const newWindowContextProviderValue: NewWindowContextValue = useMemo(\n () => ({\n newWindowContainerRef: wrapperRef.current\n ? (wrapperRef as MutableRefObject)\n : { current: window.document.createElement('div') }\n }),\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [isFirstRender]\n )\n\n useEffect(() => {\n setIsFirstRender(false)\n }, [])\n\n return (\n \n {!isFirstRender && (\n \n \n \n \n \n )}\n \n )\n}\n\nconst NewWindowStoryWrapper = forwardRef(NewWindowStoryWrapperWithRef)\n\nfunction NewWindowStory({ Story, storyArgs }: { Story: StoryFn; storyArgs: StrictArgs }) {\n const { newWindowContainerRef } = useNewWindow()\n\n return \n}\n\nconst StoryBox = styled.div`\n height: 100%;\n padding: 16px;\n width: 100%;\n`\n\nconst NewWindowButtonBox = styled.div`\n position: fixed;\n right: 16px;\n top: 16px;\n`\nconst NewWindowStoryBox = styled.div`\n height: 100%;\n padding: 16px;\n width: 100%;\n`\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"tables-TableWithSelectableRows-stories.e67b855c.iframe.bundle.js","mappings":";;;;AA6HA;;;;AAKA","sources":["webpack://@mtes-mct/monitor-ui__root/./.storybook/components/StoryDecorator.tsx"],"sourcesContent":["import { forwardRef, useEffect, useImperativeHandle, useMemo, useState, useRef } from 'react'\nimport styled from 'styled-components'\n\nimport { GlobalDecoratorWrapper } from './GlobalDecorator'\nimport { Accent, Button, NewWindow, Size, THEME, useForceUpdate, useNewWindow, NewWindowContext } from '../../src'\n\nimport type { NewWindowContextValue } from '../../src'\nimport type { StoryContext, StoryFn, StrictArgs } from '@storybook/react'\nimport type { ForwardedRef, MutableRefObject } from 'react'\n\nexport function generateStoryDecorator({\n fixedWidth,\n hasDarkMode = false,\n withNewWindowButton = false\n}: {\n fixedWidth?: number\n hasDarkMode?: boolean\n withNewWindowButton?: boolean\n} = {}) {\n return function StoryDecorator(Story: StoryFn, { args }: StoryContext) {\n const newWindowRef = useRef() as MutableRefObject\n\n const [isNewWindowOpen, setIsNewWindowOpen] = useState(false)\n\n const style = useMemo(\n () => ({\n ...(fixedWidth\n ? {\n width: `${fixedWidth}px`\n }\n : {}),\n ...(hasDarkMode\n ? {\n backgroundColor: args.isLight ? THEME.color.gainsboro : THEME.color.white\n }\n : {})\n }),\n [args.isLight]\n )\n\n const { forceUpdate } = useForceUpdate()\n\n useEffect(() => {\n forceUpdate()\n }, [forceUpdate])\n\n return (\n <>\n {withNewWindowButton && (\n \n \n \n )}\n\n {!isNewWindowOpen && (\n \n \n \n )}\n\n {withNewWindowButton && isNewWindowOpen && (\n setIsNewWindowOpen(false)}>\n \n \n )}\n \n )\n }\n}\n\nfunction NewWindowStoryWrapperWithRef(\n { Story, storyArgs }: { Story: StoryFn; storyArgs: StrictArgs },\n ref: ForwardedRef\n) {\n // eslint-disable-next-line no-null/no-null\n const wrapperRef = useRef(null)\n\n const [isFirstRender, setIsFirstRender] = useState(true)\n\n useImperativeHandle(ref, () => wrapperRef.current)\n\n const newWindowContextProviderValue: NewWindowContextValue = useMemo(\n () => ({\n newWindowContainerRef: wrapperRef.current\n ? (wrapperRef as MutableRefObject)\n : { current: window.document.createElement('div') }\n }),\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [isFirstRender]\n )\n\n useEffect(() => {\n setIsFirstRender(false)\n }, [])\n\n return (\n \n {!isFirstRender && (\n \n \n \n \n \n )}\n \n )\n}\n\nconst NewWindowStoryWrapper = forwardRef(NewWindowStoryWrapperWithRef)\n\nfunction NewWindowStory({ Story, storyArgs }: { Story: StoryFn; storyArgs: StrictArgs }) {\n const { newWindowContainerRef } = useNewWindow()\n\n return \n}\n\nconst StoryBox = styled.div`\n height: 100%;\n padding: 16px;\n width: 100%;\n`\n\nconst NewWindowButtonBox = styled.div`\n position: fixed;\n right: 16px;\n top: 16px;\n`\nconst NewWindowStoryBox = styled.div`\n height: 100%;\n padding: 16px;\n width: 100%;\n`\n"],"names":[],"sourceRoot":""} \ No newline at end of file