@olenbetong/synergi-react 2.1.2 → 2.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/ob.react.css +1189 -27
- package/dist/esm/ob.react.js +45612 -708
- package/dist/esm/ob.react.min.css +24 -1
- package/dist/esm/ob.react.min.css.map +3 -3
- package/dist/esm/ob.react.min.js +253 -1
- package/dist/esm/ob.react.min.js.map +4 -4
- package/dist/iife/ob.react.css +1189 -27
- package/dist/iife/ob.react.js +45625 -720
- package/dist/iife/ob.react.min.css +24 -1
- package/dist/iife/ob.react.min.css.map +3 -3
- package/dist/iife/ob.react.min.js +253 -1
- package/dist/iife/ob.react.min.js.map +4 -4
- package/dist/styles/styles.css +1 -1
- package/dist/styles/styles.css.map +1 -1
- package/{src → es/components}/ColorCard/index.css +10 -6
- package/es/{DateNavigator → components/DateNavigator}/index.js +2 -0
- package/es/components/FilePond.d.ts +44 -0
- package/es/components/FilePond.js +205 -0
- package/es/{PageBanner → components/PageBanner}/index.js +0 -1
- package/es/{Sidebar → components/Sidebar}/index.d.ts +2 -2
- package/es/{SplitContainer → components/SplitContainer}/index.js +3 -3
- package/es/{ValueToggleGroup → components/ValueToggleGroup}/index.css +18 -16
- package/es/{ValueToggleGroup → components/ValueToggleGroup}/index.js +4 -2
- package/es/elements/ElementDamage/DamageFormButtons.d.ts +9 -0
- package/es/elements/ElementDamage/DamageFormButtons.js +7 -0
- package/es/elements/ElementDamage/DescriptionInput.d.ts +14 -0
- package/es/elements/ElementDamage/DescriptionInput.js +44 -0
- package/es/elements/ElementDamage/DuplicateDamage/DesktopView.d.ts +7 -0
- package/es/elements/ElementDamage/DuplicateDamage/DesktopView.js +16 -0
- package/es/elements/ElementDamage/DuplicateDamage/DublicateElementDamageDialog.d.ts +10 -0
- package/es/elements/ElementDamage/DuplicateDamage/DublicateElementDamageDialog.js +12 -0
- package/es/elements/ElementDamage/DuplicateDamage/PhoneView.d.ts +6 -0
- package/es/elements/ElementDamage/DuplicateDamage/PhoneView.js +8 -0
- package/es/elements/ElementDamage/DuplicateDamage/index.d.ts +36 -0
- package/es/elements/ElementDamage/DuplicateDamage/index.js +40 -0
- package/es/elements/ElementDamage/ElementNumberTextField.d.ts +10 -0
- package/es/elements/ElementDamage/ElementNumberTextField.js +18 -0
- package/es/elements/ElementDamage/HiddenDamageFields.d.ts +6 -0
- package/es/elements/ElementDamage/HiddenDamageFields.js +4 -0
- package/es/elements/ElementDamage/RegisterFix.d.ts +14 -0
- package/es/elements/ElementDamage/RegisterFix.js +45 -0
- package/es/elements/ElementDamage/SubmitButtons.d.ts +20 -0
- package/es/elements/ElementDamage/SubmitButtons.js +7 -0
- package/es/elements/ElementDamage/TransportElementSelect.d.ts +7 -0
- package/es/elements/ElementDamage/TransportElementSelect.js +16 -0
- package/es/elements/ElementDamage/index.css +3 -0
- package/es/elements/ElementLookup.d.ts +20 -0
- package/es/elements/ElementLookup.js +30 -0
- package/es/elements/ElementLookupDialog/BarcodeScanner/DeadIcon.d.ts +2 -0
- package/es/elements/ElementLookupDialog/BarcodeScanner/DeadIcon.js +5 -0
- package/es/elements/ElementLookupDialog/BarcodeScanner/Error.d.ts +4 -0
- package/es/elements/ElementLookupDialog/BarcodeScanner/Error.js +33 -0
- package/es/elements/ElementLookupDialog/BarcodeScanner/index.d.ts +10 -0
- package/es/elements/ElementLookupDialog/BarcodeScanner/index.js +37 -0
- package/es/elements/ElementLookupDialog/BarcodeScanner/useScanner.d.ts +16 -0
- package/es/elements/ElementLookupDialog/BarcodeScanner/useScanner.js +135 -0
- package/es/elements/ElementLookupDialog/HIDScanner/index.css +17 -0
- package/es/elements/ElementLookupDialog/HIDScanner/index.d.ts +4 -0
- package/es/elements/ElementLookupDialog/HIDScanner/index.js +36 -0
- package/es/elements/ElementLookupDialog/HIDScanner/useHIDScanner.d.ts +1 -0
- package/es/elements/ElementLookupDialog/HIDScanner/useHIDScanner.js +27 -0
- package/es/elements/ElementLookupDialog/Manual/ManualForm.d.ts +12 -0
- package/es/elements/ElementLookupDialog/Manual/ManualForm.js +48 -0
- package/es/elements/ElementLookupDialog/getElement.d.ts +23 -0
- package/es/elements/ElementLookupDialog/getElement.js +55 -0
- package/es/elements/ElementLookupDialog/index.d.ts +24 -0
- package/es/elements/ElementLookupDialog/index.js +97 -0
- package/es/elements/ElementLookupDialog/utils/Giai.d.ts +52 -0
- package/es/elements/ElementLookupDialog/utils/Giai.js +158 -0
- package/es/elements/ElementLookupDialog/utils/beep.d.ts +10 -0
- package/es/elements/ElementLookupDialog/utils/beep.js +20 -0
- package/es/elements/ProjectSelect.d.ts +23 -0
- package/es/elements/ProjectSelect.js +42 -0
- package/es/elements/data/dsAttachments.d.ts +15 -0
- package/es/elements/data/dsAttachments.js +85 -0
- package/es/elements/data/dsCurrentAttachment.d.ts +13 -0
- package/es/elements/data/dsCurrentAttachment.js +75 -0
- package/es/elements/data/dsDamages.d.ts +25 -0
- package/es/elements/data/dsDamages.js +127 -0
- package/es/elements/data/dsDamagesDuplicateCheck.d.ts +2 -0
- package/es/elements/data/dsDamagesDuplicateCheck.js +3 -0
- package/es/elements/data/dsElements.d.ts +8 -0
- package/es/elements/data/dsElements.js +47 -0
- package/es/elements/data/dsProjects.d.ts +8 -0
- package/es/elements/data/dsProjects.js +51 -0
- package/es/elements/data/dsReportProjects.d.ts +2 -0
- package/es/elements/data/dsReportProjects.js +3 -0
- package/es/elements/data/dsTransportElements.d.ts +10 -0
- package/es/elements/data/dsTransportElements.js +57 -0
- package/es/elements/data/index.d.ts +11 -0
- package/es/elements/data/index.js +11 -0
- package/es/elements/data/procApproveDamage.d.ts +2 -0
- package/es/elements/data/procApproveDamage.js +18 -0
- package/es/elements/data/procDeleteAttachment.d.ts +2 -0
- package/es/elements/data/procDeleteAttachment.js +18 -0
- package/es/elements/data/procDeleteDamage.d.ts +2 -0
- package/es/elements/data/procDeleteDamage.js +18 -0
- package/es/elements/data/procRemoveDamageFix.d.ts +2 -0
- package/es/elements/data/procRemoveDamageFix.js +18 -0
- package/es/elements/data/procRestoreAttachments.d.ts +2 -0
- package/es/elements/data/procRestoreAttachments.js +18 -0
- package/es/elements/index.d.ts +9 -0
- package/es/elements/index.js +9 -0
- package/es/index.css +1 -1
- package/es/index.d.ts +12 -11
- package/es/index.js +12 -11
- package/package.json +16 -40
- package/src/{Checkbox → components/Checkbox}/index.tsx +1 -1
- package/{es → src/components}/ColorCard/index.css +10 -6
- package/src/{DateNavigator → components/DateNavigator}/index.tsx +2 -0
- package/src/components/FilePond.tsx +312 -0
- package/src/{LinkedCardList → components/LinkedCardList}/index.scss +1 -1
- package/src/{PageBanner → components/PageBanner}/index.scss +1 -1
- package/src/{PageBanner → components/PageBanner}/index.tsx +0 -1
- package/src/{ProgressBar → components/ProgressBar}/index.scss +1 -1
- package/src/{Sidebar → components/Sidebar}/index.tsx +3 -2
- package/src/{SplitContainer → components/SplitContainer}/index.tsx +1 -1
- package/src/{ValueToggleGroup → components/ValueToggleGroup}/index.css +18 -16
- package/src/{ValueToggleGroup → components/ValueToggleGroup}/index.tsx +2 -1
- package/src/elements/ElementDamage/DamageFormButtons.tsx +35 -0
- package/src/elements/ElementDamage/DescriptionInput.tsx +111 -0
- package/src/elements/ElementDamage/DuplicateDamage/DesktopView.tsx +75 -0
- package/src/elements/ElementDamage/DuplicateDamage/DublicateElementDamageDialog.tsx +65 -0
- package/src/elements/ElementDamage/DuplicateDamage/PhoneView.tsx +42 -0
- package/src/elements/ElementDamage/DuplicateDamage/index.tsx +105 -0
- package/src/elements/ElementDamage/ElementNumberTextField.tsx +41 -0
- package/src/elements/ElementDamage/HiddenDamageFields.tsx +13 -0
- package/src/elements/ElementDamage/RegisterFix.tsx +100 -0
- package/src/elements/ElementDamage/SubmitButtons.tsx +40 -0
- package/src/elements/ElementDamage/TransportElementSelect.tsx +52 -0
- package/src/elements/ElementDamage/index.css +3 -0
- package/src/elements/ElementLookup.tsx +90 -0
- package/src/elements/ElementLookupDialog/BarcodeScanner/DeadIcon.tsx +12 -0
- package/src/elements/ElementLookupDialog/BarcodeScanner/Error.tsx +46 -0
- package/src/elements/ElementLookupDialog/BarcodeScanner/index.tsx +75 -0
- package/src/elements/ElementLookupDialog/BarcodeScanner/useScanner.ts +170 -0
- package/src/elements/ElementLookupDialog/HIDScanner/index.css +17 -0
- package/src/elements/ElementLookupDialog/HIDScanner/index.tsx +67 -0
- package/src/elements/ElementLookupDialog/HIDScanner/useHIDScanner.ts +30 -0
- package/src/elements/ElementLookupDialog/Manual/ManualForm.tsx +110 -0
- package/src/elements/ElementLookupDialog/getElement.ts +89 -0
- package/src/elements/ElementLookupDialog/index.tsx +211 -0
- package/src/elements/ElementLookupDialog/utils/Giai.ts +209 -0
- package/src/elements/ElementLookupDialog/utils/beep.ts +35 -0
- package/src/elements/ProjectSelect.tsx +128 -0
- package/src/elements/data/dsAttachments.ts +101 -0
- package/src/elements/data/dsCurrentAttachment.ts +89 -0
- package/src/elements/data/dsDamages.ts +166 -0
- package/src/elements/data/dsDamagesDuplicateCheck.ts +4 -0
- package/src/elements/data/dsElements.ts +56 -0
- package/src/elements/data/dsProjects.ts +60 -0
- package/src/elements/data/dsReportProjects.ts +4 -0
- package/src/elements/data/dsTransportElements.ts +68 -0
- package/src/elements/data/index.ts +11 -0
- package/src/elements/data/procApproveDamage.ts +19 -0
- package/src/elements/data/procDeleteAttachment.ts +19 -0
- package/src/elements/data/procDeleteDamage.ts +19 -0
- package/src/elements/data/procRemoveDamageFix.ts +19 -0
- package/src/elements/data/procRestoreAttachments.ts +19 -0
- package/src/elements/index.ts +9 -0
- package/src/index.scss +10 -10
- package/src/index.ts +13 -13
- /package/es/{Checkbox → components/Checkbox}/index.css +0 -0
- /package/es/{Checkbox → components/Checkbox}/index.d.ts +0 -0
- /package/es/{Checkbox → components/Checkbox}/index.js +0 -0
- /package/es/{ColorCard → components/ColorCard}/index.d.ts +0 -0
- /package/es/{ColorCard → components/ColorCard}/index.js +0 -0
- /package/es/{DateNavigator → components/DateNavigator}/index.css +0 -0
- /package/es/{DateNavigator → components/DateNavigator}/index.d.ts +0 -0
- /package/es/{LinkedCardList → components/LinkedCardList}/index.css +0 -0
- /package/es/{LinkedCardList → components/LinkedCardList}/index.d.ts +0 -0
- /package/es/{LinkedCardList → components/LinkedCardList}/index.js +0 -0
- /package/es/{PageBanner → components/PageBanner}/index.css +0 -0
- /package/es/{PageBanner → components/PageBanner}/index.d.ts +0 -0
- /package/es/{Portal → components/Portal}/index.d.ts +0 -0
- /package/es/{Portal → components/Portal}/index.js +0 -0
- /package/es/{ProgressBar → components/ProgressBar}/index.css +0 -0
- /package/es/{ProgressBar → components/ProgressBar}/index.d.ts +0 -0
- /package/es/{ProgressBar → components/ProgressBar}/index.js +0 -0
- /package/es/{Sidebar → components/Sidebar}/index.css +0 -0
- /package/es/{Sidebar → components/Sidebar}/index.js +0 -0
- /package/es/{Spinner → components/Spinner}/index.css +0 -0
- /package/es/{Spinner → components/Spinner}/index.d.ts +0 -0
- /package/es/{Spinner → components/Spinner}/index.js +0 -0
- /package/es/{SplitContainer → components/SplitContainer}/index.css +0 -0
- /package/es/{SplitContainer → components/SplitContainer}/index.d.ts +0 -0
- /package/es/{ValueToggleGroup → components/ValueToggleGroup}/index.d.ts +0 -0
- /package/src/{Checkbox → components/Checkbox}/index.scss +0 -0
- /package/src/{ColorCard → components/ColorCard}/index.tsx +0 -0
- /package/src/{DateNavigator → components/DateNavigator}/index.css +0 -0
- /package/src/{LinkedCardList → components/LinkedCardList}/index.tsx +0 -0
- /package/src/{Portal → components/Portal}/index.tsx +0 -0
- /package/src/{ProgressBar → components/ProgressBar}/index.tsx +0 -0
- /package/src/{Sidebar → components/Sidebar}/index.scss +0 -0
- /package/src/{Spinner → components/Spinner}/index.css +0 -0
- /package/src/{Spinner → components/Spinner}/index.tsx +0 -0
- /package/src/{SplitContainer → components/SplitContainer}/index.scss +0 -0
package/dist/styles/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ObCheckbox-root{--check-width: 2rem;--bg-color: var(--brand-dark, rgba(42, 65, 50, 0.5));--bg-color-hover: var(--brand-primary, rgba(42, 65, 50, 0.8));--bg-color-selected: var(--brand-light);display:inline-block;height:var(--check-width);margin-bottom:0}.ObCheckbox-root:focus-within .ObCheckbox-box{border:.1rem solid #000}.ObCheckbox-root.Ob-disabled{--bg-color: rgba(150, 150, 150, 0.5);--bg-color-hover: var(--bg-color)}.ObCheckbox-box{position:relative;background:var(--bg-color);transition:background 300ms ease;overflow:hidden;border-radius:calc(var(--check-width)/15);height:var(--check-width);width:var(--check-width)}.ObCheckbox-box:hover{background:var(--bg-color-hover)}.ObCheckbox-label{position:relative;margin-bottom:0;overflow:hidden}.ObCheckbox-label:focus{outline:none}.ObCheckbox-mark{color:#fff;display:inline-block;font-size:calc(var(--check-width)*.4);left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition:all 300ms ease-in-out;transition-delay:0ms;transform:translate(-50%, -50%) scale(6)}.ObCheckbox-input{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.ObCheckbox-input:focus{outline:none}.ObCheckbox-label{display:flex;gap:.5rem;align-items:center;overflow:visible}.ObCheckbox-root.Ob-reverse .ObCheckbox-label{flex-direction:row-reverse}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label .ObCheckbox-box{animation:animOn 600ms 1 forwards}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label .ObCheckbox-box{background:var(--bg-color-selected)}.ObCheckbox-input:checked+.ObCheckbox-label .ObCheckbox-box .ObCheckbox-mark{transform:translate(-50%, -50%) scale(1);transition-delay:200ms;opacity:1}.ObCheckbox-root.Ob-disabled .ObCheckbox-box{cursor:not-allowed}@keyframes animOn{40%{transform:scaleY(0.4) scaleX(2)}50%{transform:scaleY(1.2) scaleX(0.6)}60%{transform:scaleY(0.8) scaleX(1.4)}70%{transform:scaleY(1.1) scaleX(0.9)}100%{transform:scaleY(1) scaleX(1)}}.ObColorCard-root{--bg-color-border: black;--bg-color-main: white;--bg-size: 0.75rem;--card-color: rgb(0, 0, 0);display:flex;align-items:stretch;min-height:10rem;overflow:hidden;border-radius:.25rem;box-shadow:0 1px 12px rgba(0, 0, 0, 0.15),0 1px 6px rgba(0, 0, 0, 0.25);color:#666;background-image:linear-gradient(to right, var(--bg-color-border), var(--bg-color-border) var(--bg-size), var(--bg-color-main) var(--bg-size), var(--bg-color-main));font-family:"Variable Bahnschrift","Bahnschrift","Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;transition:all ease-in-out 300ms;cursor:pointer;&:nth-of-type(5n + 1){--bg-color-border: rgb(178, 108, 190)}&:nth-of-type(5n + 2){--bg-color-border: rgb(79, 164, 61)}&:nth-of-type(5n + 3){--bg-color-border: rgb(246, 170, 23)}&:nth-of-type(5n + 4){--bg-color-border: rgb(218, 93, 83)}&:nth-of-type(5n + 5){--bg-color-border: rgb(23, 162, 184)}&:hover,&:focus{--bg-color-main: #f5f5f5;box-shadow:0 3px 18px rgba(0, 0, 0, 0.15),0 3px 12px rgba(0, 0, 0, 0.25);text-decoration:none}}@media screen and (min-width: 48rem){.ObColorCard-root{font-size:1.2rem}}.ObColorCard-column{display:flex;flex:1 1 100%;flex-direction:column;justify-content:space-between;margin:1rem 0;padding:.5rem 1.5rem .5rem 1rem;overflow:hidden;text-overflow:ellipsis;&:first-child{margin-left:var(--bg-size, 0.75rem)}&.ObColorCard-minor{flex:0 0 4rem;border-right:1px solid #e3e3e3;transition:margin ease-in-out 300ms}}@media screen and (min-width: 48rem){&.ObColorCard-minor{flex:0 0 8rem}}.ObColorCard-detailLabel{color:dimgray;font-size:.8rem;text-transform:uppercase}.ObColorCard-detail{&:not(:last-child){margin-right:1.5rem}&.ObColorCard-primary,&.ObColorCard-primary .ObColorCard-detailValue{font-size:1.25rem;font-weight:300}&.ObColorCard-primary .ObColorCard-detailValue{color:unset}}@media screen and (min-width: 48rem){.ObColorCard-detail{font-size:1rem}}.ObColorCard-detailValue{color:#555}.ObColorCard-stepList{display:flex;flex-direction:column;gap:1rem}.ObColorCard-step{position:relative;text-box-trim:trim-both;display:flex;align-items:flex-start;gap:.5rem}.ObColorCard-step::before{flex:.6em 0 0;content:"";position:relative;top:.25em;width:.6em;height:.6em;background:white;border:2px solid var(--bg-color-border, #999);border-radius:50%;box-sizing:border-box;z-index:1}.ObColorCard-step:not(:last-child)::after{content:"";position:absolute;top:1em;left:calc(.3em - 1px);height:calc(100% - .95em + 1rem + .0625em);border-left:2px dotted #999;z-index:0}:root{--ob-datenavigator-height: 3rem}.ObDateNavigator-icon{display:inline-block;svg{width:.625em;position:relative;top:-1px}}.ObDateNavigator-root{background-color:hsl(220, 20%, 96%);background-color:var(--block-header-color-bg);display:flex;font-size:1rem;outline:none;&:focus-visible{outline:2px solid var(--brand-dark, #336699);outline-offset:2px}}.ObDateNavigator-arrow{display:flex;align-items:center;flex:0 0 var(--ob-datenavigator-height);justify-content:center;height:var(--ob-datenavigator-height);cursor:pointer;text-align:center;&:hover:not(:disabled){background-color:#e3e3e3;background-color:var(--block-header-button-hover)}&:disabled{cursor:not-allowed;color:rgba(0 0 0/0.2)}}.ObDateNavigator-arrowLeft{border-right:1px solid #ddd;order:1}.ObDateNavigator-arrowRight{border-left:1px solid #ddd;order:3}.ObDateNavigator-date{display:flex;flex:1 1 100%;flex-direction:column;justify-content:center;order:2;height:var(--ob-datenavigator-height);text-align:center}.ObDateNavigator-today{order:4;padding:0 1rem;height:var(--ob-datenavigator-height);display:flex;align-items:center;justify-content:center;font-size:.875rem;color:var(--brand-dark, #336699);text-transform:uppercase;cursor:pointer;text-wrap:nowrap;border-left:1px solid #ddd;&:hover:not(:disabled){background-color:var(--block-header-button-hover)}&:focus-visible{outline:2px solid var(--brand-dark, #336699);outline-offset:2px}}:root{--ob-linked-list-bullet-size: 0.7em;--ob-linked-list-line-width: 0.2em}.ObLinkedList-root{list-style-type:none;margin-left:0;padding-left:0}.ObLinkedList-item{display:flex;align-items:center;flex-direction:row}.ObLinkedList-leftColumn{flex:1 1 4em;font-size:.75em;padding:0 1em;text-align:center}.ObLinkedList-rightColumn{flex:1 1 100%;padding:1em 1em 1em 1.5em}.ObLinkedList-line{display:flex;align-self:stretch;flex:0 0 .2em;background:#fff;position:relative}.ObLinkedList-bullet{background:#fff;border:1px solid rgba(50,50,50,.25);border-radius:.55em;height:.7em;width:.7em;position:absolute;left:0;top:50%;transform:translate(calc(-1 * var(--ob-linked-list-bullet-size) / 2 + var(--ob-linked-list-line-width) / 2), -50%)}.ObLinkedList-card{display:block;background:#fff;border:1px solid;border-color:#e5e6e9 #dfe0e4 #d0d1d5;border-radius:.1875em;color:inherit;cursor:pointer;flex:100% 1 1;position:relative}.ObLinkedList-card::before{border-bottom:.5em solid rgba(0,0,0,0);border-right:1em solid #fff;border-top:.5em solid rgba(0,0,0,0);content:" ";filter:drop-shadow(-1px 0px 1px rgba(50, 50, 50, 0.2));height:1em;left:-1em;margin-top:-0.5em;position:absolute;top:50%;width:1em}.ObLinkedList-card:hover{background-color:hsl(220,20%,94%) !important;color:inherit;text-decoration:inherit}.ObLinkedList-card:hover::before{border-right-color:hsl(220,20%,94%) !important}.ObPageBanner-root{background-color:hsl(186,72%,24%);background-color:var(--brand-dark);box-shadow:0px 8px 8px rgba(0,0,0,.2);color:#fff}.ObPageBanner-root a{color:hsl(200,50%,80%)}.ObPageBanner-inner{display:flex;align-items:center;flex-direction:column}@media screen and (min-width: 768px){.ObPageBanner-inner{align-items:flex-start;flex-direction:row}}.ObPageBanner-plantTitle{font-size:2rem}@media screen and (min-width: 992px){.ObPageBanner-plantTitle{font-size:3rem}}.ObPageBanner-bannerImage{align-self:stretch;background-color:#ddd;display:inline-block;height:20vh;object-fit:cover;object-position:center center;width:100%}@media screen and (min-width: 576px){.ObPageBanner-bannerImage{align-self:center;margin:0;margin-right:1rem;border:.4rem solid #fff;border-radius:50%;height:150px;width:150px}}@media screen and (min-width: 992px){.ObPageBanner-bannerImage{height:250px;width:250px}}.ObPageBanner-bannerTitle{margin-bottom:1rem;margin-top:1rem;font-size:2rem}@media screen and (min-width: 768px){.ObPageBanner-bannerTitle{margin-top:0}}@media screen and (min-width: 992px){.ObPageBanner-bannerTitle{font-size:3rem}}.ObPageBanner-tabList.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1000}.ObPageBanner-tabListInner{overflow-x:auto;scrollbar-width:thin;white-space:nowrap}.ObPageBanner-tab{border-bottom:.25rem solid rgba(0,0,0,0);display:inline-block;margin-top:.5rem;min-width:8rem;padding:.5rem 1rem;text-align:center;text-transform:capitalize}.ObPageBanner-tab.active{border-color:#fff}.ObProgressBar-root{height:1.5em;width:100%;appearance:none;-webkit-appearance:none;background-color:#f5f5f5;border:none;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset;color:#4169e1;position:relative}.ObProgressBar-root::-webkit-progress-bar{background-color:#f5f5f5;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset}.ObProgressBar-root::-webkit-progress-value{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary), var(--brand-light));background-image:-webkit-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-webkit-linear-gradient(left, var(--brand-primary), var(--brand-light));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;position:relative;transition:width .5s ease-out}.ObProgressBar-root::-webkit-progress-value:after{background-color:#fff;content:"";border-radius:100%;height:5px;position:absolute;right:7px;top:7px;width:5px}.ObProgressBar-root::-moz-progress-bar{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary), var(--brand-light));background-image:-moz-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-moz-linear-gradient(left, var(--brand-primary), var(--brand-light));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;transition:width .5s ease-out}.ObSidebar-root{position:fixed;bottom:0;left:0;top:0;z-index:2;background-color:#fff;transform:translateX(-100%);transition:transform .2s ease-out;will-change:transform}.ObSidebar-root.Ob-right{left:unset;right:0;transform:translateX(100%)}.ObSidebar-root{overflow-y:auto}.ObSidebar-root.Ob-open{transform:translateX(0)}.ObSidebar-root.ObSidebar-shadow{box-shadow:2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-root.ObSidebar-shadow.Ob-right{box-shadow:-2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-overlay{position:fixed;bottom:0;left:0;right:0;top:0;z-index:1;opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility .3s ease-out;background-color:rgba(0,0,0,.3)}.ObSidebar-overlay.Ob-open{opacity:1;visibility:visible}.ObSpinner-wrapper,.ObSpinner-fullPage{--bullet-size: 0.5em}.ObSpinner-root{display:inline-block}.ObSpinner-fullPage{display:flex;align-items:center;justify-content:center;height:100vh;width:100vw}.ObSpinner-spinner{display:inline-block;height:calc(var(--bullet-size)*1.5);position:relative;width:calc(var(--bullet-size)*5)}.ObSpinner-bullet{animation-timing-function:cubic-bezier(0, 1, 1, 0);background:#666;border-radius:50%;height:var(--bullet-size);position:absolute;top:.2rem;width:var(--bullet-size);&:nth-child(1){animation:scaleAnimation .6s infinite ease-in-out;left:calc(var(--bullet-size)*.5)}&:nth-child(2){animation:translateAnimation .6s infinite ease-in-out;left:calc(var(--bullet-size)*.5)}&:nth-child(3){animation:translateAnimation .6s infinite ease-in-out;left:calc(var(--bullet-size)*2.4)}&:nth-child(4){animation:scaleAnimation .6s infinite ease-in-out reverse;left:calc(var(--bullet-size)*4)}}@keyframes scaleAnimation{from{transform:scale(0)}to{transform:scale(1)}}@keyframes translateAnimation{from{transform:translate(0, 0)}to{transform:translate(calc(var(--bullet-size) * 1.65), 0)}}.😖{display:initial}.ObSplitContainer-root{display:flex;flex-direction:column;height:100%;width:100%}.ObSplitContainer-root.horizontal{flex-direction:row}.ObSplitContainer-panel{overflow:hidden}.ObSplitContainer-divider{flex:0 0 .5rem;background-color:rgba(0,0,0,0);line-height:.75;cursor:ns-resize;display:flex;align-items:center;justify-content:center}.ObSplitContainer-divider:focus{background-color:rgba(0,0,0,.3)}.ObSplitContainer-root.horizontal>.ObSplitContainer-divider{cursor:ew-resize;writing-mode:vertical-lr}.ObSplitContainer-panel.dragging{pointer-events:none}.ObValueToggleGroup{padding:.25rem;border:2px solid rgb(0 0 0/0.2);border-radius:4px;display:flex;gap:.25rem;flex-wrap:wrap;&.vertical{flex-direction:column;align-items:center;& .ObValueToggleOption{width:100%;& .ObValueToggleLabel{width:100%;text-align:center}}}&:focus-within{border-color:rgb(0 0 0/0.8)}}.ObValueToggleOption{display:flex;align-items:center;margin:0;position:relative}.ObValueToggleOption input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.ObValueToggleLabel{font-size:.8em;margin:0 .2em;padding:.3em .5em;text-transform:uppercase;transition:background .2s ease,color .2s ease;border-radius:4px}.ObValueToggleOption:hover input:not(:disabled)+.ObValueToggleLabel{cursor:pointer;background:#ccc}.ObValueToggleOption input:checked+.ObValueToggleLabel{--color-bg: var(--brand-dark);background-color:var(--color-bg);color:white;cursor:default}.ObValueToggleOption input:disabled+.ObValueToggleLabel{color:rgb(0 0 0/0.5)}.ObValueToggleOption input:checked:focus-visible+.ObValueToggleLabel{--color-bg: var(--brand-light);outline:2px solid var(--brand-light)}.ObValueToggleOption input:checked:hover+.ObValueToggleLabel{background-color:var(--color-bg)}/*# sourceMappingURL=styles.css.map */
|
|
1
|
+
.ObCheckbox-root{--check-width: 2rem;--bg-color: var(--brand-dark, rgba(42, 65, 50, 0.5));--bg-color-hover: var(--brand-primary, rgba(42, 65, 50, 0.8));--bg-color-selected: var(--brand-light);display:inline-block;height:var(--check-width);margin-bottom:0}.ObCheckbox-root:focus-within .ObCheckbox-box{border:.1rem solid #000}.ObCheckbox-root.Ob-disabled{--bg-color: rgba(150, 150, 150, 0.5);--bg-color-hover: var(--bg-color)}.ObCheckbox-box{position:relative;background:var(--bg-color);transition:background 300ms ease;overflow:hidden;border-radius:calc(var(--check-width)/15);height:var(--check-width);width:var(--check-width)}.ObCheckbox-box:hover{background:var(--bg-color-hover)}.ObCheckbox-label{position:relative;margin-bottom:0;overflow:hidden}.ObCheckbox-label:focus{outline:none}.ObCheckbox-mark{color:#fff;display:inline-block;font-size:calc(var(--check-width)*.4);left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition:all 300ms ease-in-out;transition-delay:0ms;transform:translate(-50%, -50%) scale(6)}.ObCheckbox-input{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.ObCheckbox-input:focus{outline:none}.ObCheckbox-label{display:flex;gap:.5rem;align-items:center;overflow:visible}.ObCheckbox-root.Ob-reverse .ObCheckbox-label{flex-direction:row-reverse}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label .ObCheckbox-box{animation:animOn 600ms 1 forwards}.ObCheckbox-input:checked:not(:disabled)+.ObCheckbox-label .ObCheckbox-box{background:var(--bg-color-selected)}.ObCheckbox-input:checked+.ObCheckbox-label .ObCheckbox-box .ObCheckbox-mark{transform:translate(-50%, -50%) scale(1);transition-delay:200ms;opacity:1}.ObCheckbox-root.Ob-disabled .ObCheckbox-box{cursor:not-allowed}@keyframes animOn{40%{transform:scaleY(0.4) scaleX(2)}50%{transform:scaleY(1.2) scaleX(0.6)}60%{transform:scaleY(0.8) scaleX(1.4)}70%{transform:scaleY(1.1) scaleX(0.9)}100%{transform:scaleY(1) scaleX(1)}}.ObColorCard-root{--bg-color-border: black;--bg-color-main: white;--bg-size: 0.75rem;--card-color: rgb(0, 0, 0);display:flex;align-items:stretch;min-height:10rem;overflow:hidden;border-radius:.25rem;box-shadow:0 1px 12px rgba(0, 0, 0, 0.15),0 1px 6px rgba(0, 0, 0, 0.25);color:#666;background-image:linear-gradient(to right, var(--bg-color-border), var(--bg-color-border) var(--bg-size), var(--bg-color-main) var(--bg-size), var(--bg-color-main));font-family:"Variable Bahnschrift","Bahnschrift","Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;transition:all ease-in-out 300ms;cursor:pointer;&:nth-of-type(5n + 1){--bg-color-border: rgb(178, 108, 190)}&:nth-of-type(5n + 2){--bg-color-border: rgb(79, 164, 61)}&:nth-of-type(5n + 3){--bg-color-border: rgb(246, 170, 23)}&:nth-of-type(5n + 4){--bg-color-border: rgb(218, 93, 83)}&:nth-of-type(5n + 5){--bg-color-border: rgb(23, 162, 184)}&:hover,&:focus{--bg-color-main: #f5f5f5;box-shadow:0 3px 18px rgba(0, 0, 0, 0.15),0 3px 12px rgba(0, 0, 0, 0.25);text-decoration:none}}@media screen and (min-width: 48rem){.ObColorCard-root{font-size:1.2rem}}.ObColorCard-column{display:flex;flex:1 1 100%;flex-direction:column;justify-content:space-between;margin:1rem 0;padding:.5rem 1.5rem .5rem 1rem;overflow:hidden;text-overflow:ellipsis;&:first-child{margin-left:var(--bg-size, 0.75rem)}&.ObColorCard-minor{flex:0 0 4rem;border-right:1px solid #e3e3e3;transition:margin ease-in-out 300ms}}@media screen and (min-width: 48rem){&.ObColorCard-minor{flex:0 0 8rem}}.ObColorCard-detailValue{color:#555}.ObColorCard-detailLabel{color:dimgray;font-size:.8rem;text-transform:uppercase}.ObColorCard-detail{&:not(:last-child){margin-right:1.5rem}&.ObColorCard-primary,&.ObColorCard-primary .ObColorCard-detailValue{font-size:1.25rem;font-weight:300}&.ObColorCard-primary .ObColorCard-detailValue{color:unset}}@media screen and (min-width: 48rem){.ObColorCard-detail{font-size:1rem}}.ObColorCard-stepList{display:flex;flex-direction:column;gap:1rem}.ObColorCard-step{position:relative;text-box-trim:trim-both;display:flex;align-items:flex-start;gap:.5rem}.ObColorCard-step::before{flex:.6em 0 0;content:"";position:relative;top:.25em;width:.6em;height:.6em;background:white;border:2px solid var(--bg-color-border, #999);border-radius:50%;box-sizing:border-box;z-index:1}.ObColorCard-step:not(:last-child)::after{content:"";position:absolute;top:1em;left:calc(.3em - 1px);height:calc(100% - .95em + 1rem + .0625em);border-left:2px dotted #999;z-index:0}:root{--ob-datenavigator-height: 3rem}.ObDateNavigator-icon{display:inline-block;svg{width:.625em;position:relative;top:-1px}}.ObDateNavigator-root{background-color:hsl(220, 20%, 96%);background-color:var(--block-header-color-bg);display:flex;font-size:1rem;outline:none;&:focus-visible{outline:2px solid var(--brand-dark, #336699);outline-offset:2px}}.ObDateNavigator-arrow{display:flex;align-items:center;flex:0 0 var(--ob-datenavigator-height);justify-content:center;height:var(--ob-datenavigator-height);cursor:pointer;text-align:center;&:hover:not(:disabled){background-color:#e3e3e3;background-color:var(--block-header-button-hover)}&:disabled{cursor:not-allowed;color:rgba(0 0 0/0.2)}}.ObDateNavigator-arrowLeft{border-right:1px solid #ddd;order:1}.ObDateNavigator-arrowRight{border-left:1px solid #ddd;order:3}.ObDateNavigator-date{display:flex;flex:1 1 100%;flex-direction:column;justify-content:center;order:2;height:var(--ob-datenavigator-height);text-align:center}.ObDateNavigator-today{order:4;padding:0 1rem;height:var(--ob-datenavigator-height);display:flex;align-items:center;justify-content:center;font-size:.875rem;color:var(--brand-dark, #336699);text-transform:uppercase;cursor:pointer;text-wrap:nowrap;border-left:1px solid #ddd;&:hover:not(:disabled){background-color:var(--block-header-button-hover)}&:focus-visible{outline:2px solid var(--brand-dark, #336699);outline-offset:2px}}:root{--ob-linked-list-bullet-size: 0.7em;--ob-linked-list-line-width: 0.2em}.ObLinkedList-root{list-style-type:none;margin-left:0;padding-left:0}.ObLinkedList-item{display:flex;align-items:center;flex-direction:row}.ObLinkedList-leftColumn{flex:1 1 4em;font-size:.75em;padding:0 1em;text-align:center}.ObLinkedList-rightColumn{flex:1 1 100%;padding:1em 1em 1em 1.5em}.ObLinkedList-line{display:flex;align-self:stretch;flex:0 0 .2em;background:#fff;position:relative}.ObLinkedList-bullet{background:#fff;border:1px solid rgba(50,50,50,.25);border-radius:.55em;height:.7em;width:.7em;position:absolute;left:0;top:50%;transform:translate(calc(-1 * var(--ob-linked-list-bullet-size) / 2 + var(--ob-linked-list-line-width) / 2), -50%)}.ObLinkedList-card{display:block;background:#fff;border:1px solid;border-color:#e5e6e9 #dfe0e4 #d0d1d5;border-radius:.1875em;color:inherit;cursor:pointer;flex:100% 1 1;position:relative}.ObLinkedList-card::before{border-bottom:.5em solid rgba(0,0,0,0);border-right:1em solid #fff;border-top:.5em solid rgba(0,0,0,0);content:" ";filter:drop-shadow(-1px 0px 1px rgba(50, 50, 50, 0.2));height:1em;left:-1em;margin-top:-0.5em;position:absolute;top:50%;width:1em}.ObLinkedList-card:hover{background-color:hsl(220,20%,94%) !important;color:inherit;text-decoration:inherit}.ObLinkedList-card:hover::before{border-right-color:hsl(220,20%,94%) !important}.ObPageBanner-root{background-color:hsl(186,72%,24%);background-color:var(--brand-dark);box-shadow:0px 8px 8px rgba(0,0,0,.2);color:#fff}.ObPageBanner-root a{color:hsl(200,50%,80%)}.ObPageBanner-inner{display:flex;align-items:center;flex-direction:column}@media screen and (min-width: 768px){.ObPageBanner-inner{align-items:flex-start;flex-direction:row}}.ObPageBanner-plantTitle{font-size:2rem}@media screen and (min-width: 992px){.ObPageBanner-plantTitle{font-size:3rem}}.ObPageBanner-bannerImage{align-self:stretch;background-color:#ddd;display:inline-block;height:20vh;object-fit:cover;object-position:center center;width:100%}@media screen and (min-width: 576px){.ObPageBanner-bannerImage{align-self:center;margin:0;margin-right:1rem;border:.4rem solid #fff;border-radius:50%;height:150px;width:150px}}@media screen and (min-width: 992px){.ObPageBanner-bannerImage{height:250px;width:250px}}.ObPageBanner-bannerTitle{margin-bottom:1rem;margin-top:1rem;font-size:2rem}@media screen and (min-width: 768px){.ObPageBanner-bannerTitle{margin-top:0}}@media screen and (min-width: 992px){.ObPageBanner-bannerTitle{font-size:3rem}}.ObPageBanner-tabList.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1000}.ObPageBanner-tabListInner{overflow-x:auto;scrollbar-width:thin;white-space:nowrap}.ObPageBanner-tab{border-bottom:.25rem solid rgba(0,0,0,0);display:inline-block;margin-top:.5rem;min-width:8rem;padding:.5rem 1rem;text-align:center;text-transform:capitalize}.ObPageBanner-tab.active{border-color:#fff}.ObProgressBar-root{height:1.5em;width:100%;appearance:none;-webkit-appearance:none;background-color:#f5f5f5;border:none;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset;color:#4169e1;position:relative}.ObProgressBar-root::-webkit-progress-bar{background-color:#f5f5f5;border-radius:3px;box-shadow:0 2px 3px rgba(0,0,0,.2) inset}.ObProgressBar-root::-webkit-progress-value{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary), var(--brand-light));background-image:-webkit-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-webkit-linear-gradient(left, var(--brand-primary), var(--brand-light));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;position:relative;transition:width .5s ease-out}.ObProgressBar-root::-webkit-progress-value:after{background-color:#fff;content:"";border-radius:100%;height:5px;position:absolute;right:7px;top:7px;width:5px}.ObProgressBar-root::-moz-progress-bar{background-image:linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),linear-gradient(left, var(--brand-primary), var(--brand-light));background-image:-moz-linear-gradient(135deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%),-moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)),-moz-linear-gradient(left, var(--brand-primary), var(--brand-light));background-size:35px 20px,100% 100%,100% 100%;border-radius:3px;transition:width .5s ease-out}.ObSidebar-root{position:fixed;bottom:0;left:0;top:0;z-index:2;background-color:#fff;transform:translateX(-100%);transition:transform .2s ease-out;will-change:transform}.ObSidebar-root.Ob-right{left:unset;right:0;transform:translateX(100%)}.ObSidebar-root{overflow-y:auto}.ObSidebar-root.Ob-open{transform:translateX(0)}.ObSidebar-root.ObSidebar-shadow{box-shadow:2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-root.ObSidebar-shadow.Ob-right{box-shadow:-2px 2px 4px rgba(0,0,0,.15)}.ObSidebar-overlay{position:fixed;bottom:0;left:0;right:0;top:0;z-index:1;opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility .3s ease-out;background-color:rgba(0,0,0,.3)}.ObSidebar-overlay.Ob-open{opacity:1;visibility:visible}.ObSpinner-wrapper,.ObSpinner-fullPage{--bullet-size: 0.5em}.ObSpinner-root{display:inline-block}.ObSpinner-fullPage{display:flex;align-items:center;justify-content:center;height:100vh;width:100vw}.ObSpinner-spinner{display:inline-block;height:calc(var(--bullet-size)*1.5);position:relative;width:calc(var(--bullet-size)*5)}.ObSpinner-bullet{animation-timing-function:cubic-bezier(0, 1, 1, 0);background:#666;border-radius:50%;height:var(--bullet-size);position:absolute;top:.2rem;width:var(--bullet-size);&:nth-child(1){animation:scaleAnimation .6s infinite ease-in-out;left:calc(var(--bullet-size)*.5)}&:nth-child(2){animation:translateAnimation .6s infinite ease-in-out;left:calc(var(--bullet-size)*.5)}&:nth-child(3){animation:translateAnimation .6s infinite ease-in-out;left:calc(var(--bullet-size)*2.4)}&:nth-child(4){animation:scaleAnimation .6s infinite ease-in-out reverse;left:calc(var(--bullet-size)*4)}}@keyframes scaleAnimation{from{transform:scale(0)}to{transform:scale(1)}}@keyframes translateAnimation{from{transform:translate(0, 0)}to{transform:translate(calc(var(--bullet-size) * 1.65), 0)}}.😖{display:initial}.ObSplitContainer-root{display:flex;flex-direction:column;height:100%;width:100%}.ObSplitContainer-root.horizontal{flex-direction:row}.ObSplitContainer-panel{overflow:hidden}.ObSplitContainer-divider{flex:0 0 .5rem;background-color:rgba(0,0,0,0);line-height:.75;cursor:ns-resize;display:flex;align-items:center;justify-content:center}.ObSplitContainer-divider:focus{background-color:rgba(0,0,0,.3)}.ObSplitContainer-root.horizontal>.ObSplitContainer-divider{cursor:ew-resize;writing-mode:vertical-lr}.ObSplitContainer-panel.dragging{pointer-events:none}.ObValueToggleOption{display:flex;align-items:center;margin:0;position:relative}.ObValueToggleLabel{font-size:.8em;margin:0 .2em;padding:.3em .5em;text-transform:uppercase;transition:background .2s ease,color .2s ease;border-radius:4px}.ObValueToggleGroup{padding:.25rem;border:2px solid rgb(0 0 0/0.2);border-radius:4px;display:flex;gap:.25rem;flex-wrap:wrap;&.vertical{flex-direction:column;align-items:center;& .ObValueToggleOption{width:100%;& .ObValueToggleLabel{width:100%;text-align:center}}}&:focus-within{border-color:rgb(0 0 0/0.8)}}.ObValueToggleOption input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.ObValueToggleOption:hover input:not(:disabled)+.ObValueToggleLabel{cursor:pointer;background:#ccc}.ObValueToggleOption input:checked+.ObValueToggleLabel{--color-bg: var(--brand-dark);background-color:var(--color-bg);color:white;cursor:default}.ObValueToggleOption input:disabled+.ObValueToggleLabel{color:rgb(0 0 0/0.5)}.ObValueToggleOption input:checked:focus-visible+.ObValueToggleLabel{--color-bg: var(--brand-light);outline:2px solid var(--brand-light)}.ObValueToggleOption input:checked:hover+.ObValueToggleLabel{background-color:var(--color-bg)}/*# sourceMappingURL=styles.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../../src/Checkbox/index.scss","../../src/ColorCard/index.css","../../src/DateNavigator/index.css","../../src/LinkedCardList/index.scss","../../src/PageBanner/index.scss","../../src/styles/_variables.scss","../../src/ProgressBar/index.scss","../../src/Sidebar/index.scss","../../src/Spinner/index.css","../../src/SplitContainer/index.scss","../../src/ValueToggleGroup/index.css"],"names":[],"mappings":"CAAA,iBACC,oBACA,qDACA,8DACA,wCAEA,qBACA,0BACA,gBAEA,8CACC,wBAGD,6BACC,qCACA,kCAIF,gBACC,kBAEA,2BACA,iCAEA,gBAEA,0CACA,0BACA,yBAEA,sBACC,iCAIF,kBACC,kBACA,gBACA,gBAEA,wBACC,aAIF,iBACC,WACA,qBACA,sCACA,SACA,UACA,oBACA,kBACA,QACA,iCACA,qBACA,yCAGD,kBACC,mBACA,qBACA,WACA,gBACA,kBACA,mBACA,UAEA,wBACC,aAIF,kBACC,aACA,UACA,mBAEA,iBAGD,8CACC,2BAGD,2EACC,kCAGD,2EACC,oCAGD,6EACC,yCACA,uBACA,UAGD,6CACC,mBAGD,kBACC,IACC,gCAGD,IACC,kCAGD,IACC,kCAGD,IACC,kCAGD,KACC,+BC3HF,kBACC,yBACA,uBACA,mBACA,2BAEA,aACA,oBACA,iBACA,gBACA,qBACA,
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../../src/components/Checkbox/index.scss","../../src/components/ColorCard/index.css","../../src/components/DateNavigator/index.css","../../src/components/LinkedCardList/index.scss","../../src/components/PageBanner/index.scss","../../src/styles/_variables.scss","../../src/components/ProgressBar/index.scss","../../src/components/Sidebar/index.scss","../../src/components/Spinner/index.css","../../src/components/SplitContainer/index.scss","../../src/components/ValueToggleGroup/index.css"],"names":[],"mappings":"CAAA,iBACC,oBACA,qDACA,8DACA,wCAEA,qBACA,0BACA,gBAEA,8CACC,wBAGD,6BACC,qCACA,kCAIF,gBACC,kBAEA,2BACA,iCAEA,gBAEA,0CACA,0BACA,yBAEA,sBACC,iCAIF,kBACC,kBACA,gBACA,gBAEA,wBACC,aAIF,iBACC,WACA,qBACA,sCACA,SACA,UACA,oBACA,kBACA,QACA,iCACA,qBACA,yCAGD,kBACC,mBACA,qBACA,WACA,gBACA,kBACA,mBACA,UAEA,wBACC,aAIF,kBACC,aACA,UACA,mBAEA,iBAGD,8CACC,2BAGD,2EACC,kCAGD,2EACC,oCAGD,6EACC,yCACA,uBACA,UAGD,6CACC,mBAGD,kBACC,IACC,gCAGD,IACC,kCAGD,IACC,kCAGD,IACC,kCAGD,KACC,+BC3HF,kBACC,yBACA,uBACA,mBACA,2BAEA,aACA,oBACA,iBACA,gBACA,qBACA,WACC,6DAED,WACA,qKAOA,YACC,6LAaD,eACA,iCACA,eAEA,sBACC,sCAED,sBACC,oCAED,sBACC,qCAED,sBACC,oCAED,sBACC,qCAGD,gBAEC,yBACA,WACC,8DAED,sBAGD,qCAjED,kBAkEE,kBAIF,oBACC,aACA,cACA,sBACA,8BACA,cACA,gCACA,gBACA,uBAEA,cACC,oCAGD,oBACC,cACA,+BACA,qCAEA,qCALD,oBAME,eAKH,yBACC,WAGD,yBACC,cACA,gBACA,yBAGD,oBACC,mBACC,oBAGD,qEAEC,kBACA,gBAGD,+CACC,aAGD,qCAfD,oBAgBE,gBAIF,sBACC,aACA,sBACA,SAGD,kBACC,kBACA,wBAEA,aACA,uBACA,UAGD,0BACC,cACA,WAEA,kBACA,UAEA,WACA,YACA,iBACA,8CACA,kBACA,sBACA,UAGD,0CACC,WACA,kBACA,QACA,sBACA,2CACA,4BACA,UCnKD,MACC,gCAGD,sBACC,qBAEA,IACC,aACA,kBACA,UAIF,sBACC,oCACA,8CACA,aACA,eACA,aAEA,gBACC,6CACA,oBAIF,uBACC,aACA,mBACA,wCACA,uBAEA,sCAEA,eACA,kBAEA,uBACC,yBACA,kDAGD,WACC,mBACA,uBAIF,2BACC,4BACA,QAGD,4BACC,2BACA,QAGD,sBACC,aACA,cACA,sBACA,uBACA,QAEA,sCAEA,kBAGD,uBACC,QACA,eACA,sCACA,aACA,mBACA,uBACA,kBACA,iCACA,yBACA,eAEA,iBAEA,2BAEA,uBACC,kDAGD,gBACC,6CACA,oBCxFF,MACC,oCACA,mCAGD,mBAEC,qBACA,cACA,eAGD,mBACC,aACA,mBACA,mBAGD,yBACC,aACA,gBACA,cACA,kBAGD,0BACC,cACA,0BAGD,mBACC,aACA,mBACA,cACA,gBACA,kBAGD,qBACC,gBAEA,oCACA,oBACA,OA9Ca,KA+Cb,MA/Ca,KAiDb,kBACA,OACA,QAEA,mHAGD,mBACC,cACA,gBACA,iBACA,qCACA,sBACA,cACA,eACA,cACA,kBAGD,2BACC,uCACA,4BACA,oCACA,YACA,uDACA,WACA,UACA,kBACA,kBACA,QACA,UAGD,yBACC,6CACA,cACA,wBAGD,iCACC,+CCzFD,mBACC,iBCHe,iBDIf,mCACA,sCACA,WAEA,qBACC,uBAIF,oBACC,aACA,mBACA,sBAEA,qCALD,oBAME,uBACA,oBAIF,yBACC,eAEA,qCAHD,yBAIE,gBAIF,0BACC,mBACA,sBACA,qBACA,YACA,iBACA,8BACA,WAEA,qCATD,0BAUE,kBACA,SACA,kBACA,wBACA,kBACA,aACA,aAGD,qCAnBD,0BAoBE,aACA,aAIF,0BACC,mBACA,gBACA,eAEA,qCALD,0BAME,cAGD,qCATD,0BAUE,gBAKD,6BACC,wBACA,gBACA,MACA,aAIF,2BACC,gBACA,qBACA,mBAGD,kBACC,yCACA,qBACA,iBACA,eACA,mBACA,kBACA,0BAEA,yBACC,kBE9FF,oBACC,aACA,WACA,gBACA,wBACA,yBACA,YACA,kBACA,0CACA,cACA,kBAEA,0CACC,yBACA,kBACA,0CAGD,4CACC,4QAUA,iBACC,mRAUD,gBACC,8BAGD,kBACA,kBACA,8BAGD,kDACC,sBACA,WAEA,mBACA,WAEA,kBACA,UACA,QACA,UAGD,uCACC,4QAUA,iBACC,0QAUD,gBACC,8BAGD,kBACA,8BC3FF,gBACC,eACA,SACA,OACA,MACA,UAEA,sBAEA,4BACA,kCACA,sBAEA,yBACC,WACA,QACA,2BAhBF,gBAmBC,gBAEA,wBACC,wBAGD,iCACC,uCAEA,0CACC,wCAKH,mBACC,eACA,SACA,OACA,QACA,MACA,UAEA,UACA,kBAEA,WACC,6CAED,gCAEA,2BACC,UACA,mBCpDF,uCAEC,qBAGD,gBACC,qBAGD,oBACC,aACA,mBACA,uBAEA,aACA,YAGD,mBACC,qBACA,oCACA,kBACA,iCAGD,kBACC,mDACA,gBACA,kBACA,0BACA,kBACA,UACA,yBAEA,eACC,kDACA,iCAGD,eACC,sDACA,iCAGD,eACC,sDACA,kCAGD,eACC,0DACA,iCAIF,0BACC,KACC,mBAGD,GACC,oBAIF,8BACC,KACC,0BAGD,GACC,yDCpEF,IACC,gBAGD,uBACC,aACA,sBACA,YACA,WAEA,kCACC,mBAIF,wBACC,gBAGD,0BACC,eACA,+BACA,gBACA,iBAEA,aACA,mBACA,uBAEA,gCACC,gCAGD,4DACC,iBACA,yBAIF,iCACC,oBC3CD,qBACC,aACA,mBACA,SACA,kBAGD,oBACC,eACA,cACA,kBACA,yBACA,WACC,mCAED,kBAGD,oBACC,eACA,gCACA,kBAEA,aACA,WACA,eAEA,WACC,sBACA,mBAEA,uBACC,WAEA,sBACC,WACA,oBAKH,eACC,6BAIF,2BACC,kBACA,UACA,WACA,UACA,YACA,gBACA,sBACA,SAGD,oEACC,eACA,gBAGD,uDACC,8BACA,iCACA,YACA,eAGD,wDACC,qBAGD,qEACC,+BACA,qCAGD,6DACC","file":"styles.css"}
|
|
@@ -9,7 +9,9 @@
|
|
|
9
9
|
min-height: 10rem;
|
|
10
10
|
overflow: hidden;
|
|
11
11
|
border-radius: 0.25rem;
|
|
12
|
-
box-shadow:
|
|
12
|
+
box-shadow:
|
|
13
|
+
0 1px 12px rgba(0, 0, 0, 0.15),
|
|
14
|
+
0 1px 6px rgba(0, 0, 0, 0.25);
|
|
13
15
|
color: #666;
|
|
14
16
|
background-image: linear-gradient(
|
|
15
17
|
to right,
|
|
@@ -55,7 +57,9 @@
|
|
|
55
57
|
&:hover,
|
|
56
58
|
&:focus {
|
|
57
59
|
--bg-color-main: #f5f5f5;
|
|
58
|
-
box-shadow:
|
|
60
|
+
box-shadow:
|
|
61
|
+
0 3px 18px rgba(0, 0, 0, 0.15),
|
|
62
|
+
0 3px 12px rgba(0, 0, 0, 0.25);
|
|
59
63
|
text-decoration: none;
|
|
60
64
|
}
|
|
61
65
|
|
|
@@ -89,6 +93,10 @@
|
|
|
89
93
|
}
|
|
90
94
|
}
|
|
91
95
|
|
|
96
|
+
.ObColorCard-detailValue {
|
|
97
|
+
color: #555555;
|
|
98
|
+
}
|
|
99
|
+
|
|
92
100
|
.ObColorCard-detailLabel {
|
|
93
101
|
color: #696969;
|
|
94
102
|
font-size: 0.8rem;
|
|
@@ -115,10 +123,6 @@
|
|
|
115
123
|
}
|
|
116
124
|
}
|
|
117
125
|
|
|
118
|
-
.ObColorCard-detailValue {
|
|
119
|
-
color: #555555;
|
|
120
|
-
}
|
|
121
|
-
|
|
122
126
|
.ObColorCard-stepList {
|
|
123
127
|
display: flex;
|
|
124
128
|
flex-direction: column;
|
|
@@ -119,5 +119,7 @@ export function DateNavigator({ date: dateProp, defaultDate, disableTodayButton,
|
|
|
119
119
|
}
|
|
120
120
|
return (
|
|
121
121
|
// biome-ignore lint/a11y/noNoninteractiveTabindex: I hate this component
|
|
122
|
+
// biome-ignore lint/a11y/noStaticElementInteractions: legacy component
|
|
123
|
+
// biome-ignore lint/a11y/useAriaPropsSupportedByRole: legacy component
|
|
122
124
|
_jsxs("div", { className: "ObDateNavigator-root", onKeyDown: handleKeyDown, tabIndex: 0, "aria-label": "Date navigator", children: [_jsx(Arrow, { direction: "left", onClick: () => updateDate(new Date(dateUtc - oneDay)), disabled: disablePrev }), _jsx("div", { className: "ObDateNavigator-date", children: text }), _jsx(Arrow, { direction: "right", onClick: () => updateDate(new Date(dateUtc + oneDay)), disabled: disableNext }), !disableTodayButton && (_jsx("button", { type: "button", className: "ObDateNavigator-today btn-reset", onClick: jumpToToday, children: getLocalizedString("Today") })), _jsx("div", { "aria-live": "polite", ref: liveRef, style: { position: "absolute", left: "-9999px" } })] }));
|
|
123
125
|
}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import "filepond-plugin-file-poster/dist/filepond-plugin-file-poster.css";
|
|
2
|
+
import "filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css";
|
|
3
|
+
import "filepond/dist/filepond.css";
|
|
4
|
+
import type { DataObject } from "@olenbetong/appframe-data";
|
|
5
|
+
import { type FilePondErrorDescription, type FilePondFile, type FilePondOptions, FileStatus, registerPlugin } from "filepond";
|
|
6
|
+
import { type RefObject } from "react";
|
|
7
|
+
export { registerPlugin, FileStatus };
|
|
8
|
+
type FilePondProps<T extends Record<string, unknown>> = React.HTMLProps<HTMLInputElement> & {
|
|
9
|
+
dataObject: DataObject<T>;
|
|
10
|
+
fields: Partial<T>;
|
|
11
|
+
onUploadStart: () => void;
|
|
12
|
+
onFileUploaded: (error: FilePondErrorDescription | null, file: FilePondFile) => void;
|
|
13
|
+
onFinishedUploads: () => void;
|
|
14
|
+
onError: (error: string) => void;
|
|
15
|
+
onFileRemoved?: (primKey: string) => void;
|
|
16
|
+
/**
|
|
17
|
+
* If the file should be uploaded to a blob field, set the field name here
|
|
18
|
+
*/
|
|
19
|
+
fieldName?: string;
|
|
20
|
+
/**
|
|
21
|
+
* If the file should be added to an existing record, set the prim key here
|
|
22
|
+
*/
|
|
23
|
+
primKey?: string;
|
|
24
|
+
/**
|
|
25
|
+
* If a reference to the file input element is needed, pass a ref here.
|
|
26
|
+
*/
|
|
27
|
+
inputRef?: RefObject<HTMLInputElement>;
|
|
28
|
+
/**
|
|
29
|
+
* Options to pass to FilePond
|
|
30
|
+
*/
|
|
31
|
+
filePondOptions?: Partial<FilePondOptions>;
|
|
32
|
+
attachmentPrimKeys?: string[];
|
|
33
|
+
whereClause?: string;
|
|
34
|
+
};
|
|
35
|
+
type FileStoreDataObjectRecord = {
|
|
36
|
+
PrimKey: string;
|
|
37
|
+
FileName: string | null;
|
|
38
|
+
FileSize: number | null;
|
|
39
|
+
FileRef: string | null;
|
|
40
|
+
ElementRef: string | null;
|
|
41
|
+
Damage: boolean;
|
|
42
|
+
DamageID: number | null;
|
|
43
|
+
};
|
|
44
|
+
export declare function FilePond<T extends FileStoreDataObjectRecord>({ dataObject, fields, onUploadStart, onFileUploaded, onFinishedUploads, onFileRemoved, onError, fieldName, filePondOptions, primKey, attachmentPrimKeys, whereClause, inputRef: inputRefProp, ...props }: FilePondProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,205 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import "filepond-plugin-file-poster/dist/filepond-plugin-file-poster.css";
|
|
3
|
+
import "filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css";
|
|
4
|
+
import "filepond/dist/filepond.css";
|
|
5
|
+
import { getLocalizedString } from "@olenbetong/appframe-core";
|
|
6
|
+
import { useData, useFetchData } from "@olenbetong/appframe-react";
|
|
7
|
+
import { create, FileStatus, registerPlugin, } from "filepond";
|
|
8
|
+
import FilePondPluginImageExifOrientation from "filepond-plugin-image-exif-orientation";
|
|
9
|
+
import FilePondPluginImagePreview from "filepond-plugin-image-preview";
|
|
10
|
+
import FilePondPluginImageResize from "filepond-plugin-image-resize";
|
|
11
|
+
import FilePondPluginImageTransform from "filepond-plugin-image-transform";
|
|
12
|
+
import { useEffect, useMemo, useRef } from "react";
|
|
13
|
+
export { registerPlugin, FileStatus };
|
|
14
|
+
registerPlugin(FilePondPluginImageExifOrientation, FilePondPluginImageResize, FilePondPluginImagePreview, FilePondPluginImageTransform);
|
|
15
|
+
let isMostLikelyMobile = navigator.userAgent.match(/Android/i) ||
|
|
16
|
+
navigator.userAgent.match(/iPhone/i) ||
|
|
17
|
+
navigator.userAgent.match(/iPad/i) ||
|
|
18
|
+
navigator.userAgent.match(/iPod/i);
|
|
19
|
+
const labels = {
|
|
20
|
+
labelIdle: isMostLikelyMobile
|
|
21
|
+
? getLocalizedString("Take a photo, or upload an existing image/file")
|
|
22
|
+
: getLocalizedString('Drag & Drop your files or <span class="filepond--label-action"> Browse </span>'),
|
|
23
|
+
labelInvalidField: getLocalizedString("Field contains invalid files"),
|
|
24
|
+
labelFileWaitingForSize: getLocalizedString("Waiting for size"),
|
|
25
|
+
labelFileSizeNotAvailable: getLocalizedString("Size not available"),
|
|
26
|
+
labelFileLoading: getLocalizedString("Loading"),
|
|
27
|
+
labelFileLoadError: getLocalizedString("Error during load"),
|
|
28
|
+
labelFileProcessing: getLocalizedString("Uploading"),
|
|
29
|
+
labelFileProcessingComplete: getLocalizedString("Upload complete"),
|
|
30
|
+
labelFileProcessingAborted: getLocalizedString("Upload cancelled"),
|
|
31
|
+
labelFileProcessingError: getLocalizedString("Error during upload"),
|
|
32
|
+
labelFileProcessingRevertError: getLocalizedString("Error during revert"),
|
|
33
|
+
labelFileRemoveError: getLocalizedString("Error during remove"),
|
|
34
|
+
labelTapToCancel: getLocalizedString("tap to cancel"),
|
|
35
|
+
labelTapToRetry: getLocalizedString("tap to retry"),
|
|
36
|
+
labelTapToUndo: getLocalizedString("tap to undo"),
|
|
37
|
+
labelButtonRemoveItem: getLocalizedString("Remove"),
|
|
38
|
+
labelButtonAbortItemLoad: getLocalizedString("Abort"),
|
|
39
|
+
labelButtonRetryItemLoad: getLocalizedString("Retry"),
|
|
40
|
+
labelButtonAbortItemProcessing: getLocalizedString("Cancel"),
|
|
41
|
+
labelButtonUndoItemProcessing: getLocalizedString("Undo"),
|
|
42
|
+
labelButtonRetryItemProcessing: getLocalizedString("Retry"),
|
|
43
|
+
labelButtonProcessItem: getLocalizedString("Upload"),
|
|
44
|
+
labelMaxFileSizeExceeded: getLocalizedString("File is too large"),
|
|
45
|
+
labelMaxFileSize: getLocalizedString("Maximum file size is {filesize}"),
|
|
46
|
+
labelMaxTotalFileSizeExceeded: getLocalizedString("Maximum total size exceeded"),
|
|
47
|
+
labelMaxTotalFileSize: getLocalizedString("Maximum total file size is {filesize}"),
|
|
48
|
+
labelFileTypeNotAllowed: getLocalizedString("File of invalid type"),
|
|
49
|
+
fileValidateTypeLabelExpectedTypes: getLocalizedString("Expects {allButLastType} or {lastType}"),
|
|
50
|
+
imageValidateSizeLabelFormatError: getLocalizedString("Image type not supported"),
|
|
51
|
+
imageValidateSizeLabelImageSizeTooSmall: getLocalizedString("Image is too small"),
|
|
52
|
+
imageValidateSizeLabelImageSizeTooBig: getLocalizedString("Image is too big"),
|
|
53
|
+
imageValidateSizeLabelExpectedMinSize: getLocalizedString("Minimum size is {minWidth} × {minHeight}"),
|
|
54
|
+
imageValidateSizeLabelExpectedMaxSize: getLocalizedString("Maximum size is {maxWidth} × {maxHeight}"),
|
|
55
|
+
imageValidateSizeLabelImageResolutionTooLow: getLocalizedString("Resolution is too low"),
|
|
56
|
+
imageValidateSizeLabelImageResolutionTooHigh: getLocalizedString("Resolution is too high"),
|
|
57
|
+
imageValidateSizeLabelExpectedMinResolution: getLocalizedString("Minimum resolution is {minResolution}"),
|
|
58
|
+
imageValidateSizeLabelExpectedMaxResolution: getLocalizedString("Maximum resolution is {maxResolution}"),
|
|
59
|
+
};
|
|
60
|
+
function getFileUrl(dataObject, fieldName, primKey, action = "upload") {
|
|
61
|
+
let url = action === "upload"
|
|
62
|
+
? dataObject.dataHandler.getUploadUrl()
|
|
63
|
+
: dataObject.dataHandler.getFileStoreURL(primKey ?? "", fieldName ?? "");
|
|
64
|
+
if (action === "upload") {
|
|
65
|
+
url += "/";
|
|
66
|
+
}
|
|
67
|
+
return url?.replaceAll("//", "/") ?? "";
|
|
68
|
+
}
|
|
69
|
+
export function FilePond({ dataObject, fields, onUploadStart, onFileUploaded, onFinishedUploads, onFileRemoved, onError, fieldName, filePondOptions, primKey, attachmentPrimKeys, whereClause, inputRef: inputRefProp, ...props }) {
|
|
70
|
+
let inputRef = useRef(null);
|
|
71
|
+
let pondRef = useRef(null);
|
|
72
|
+
let filesData = useData(dataObject);
|
|
73
|
+
let { data: filesFetched } = useFetchData(dataObject, whereClause ?? "1=2");
|
|
74
|
+
let files = useMemo(() => {
|
|
75
|
+
if (whereClause) {
|
|
76
|
+
return filesFetched;
|
|
77
|
+
}
|
|
78
|
+
return filesData;
|
|
79
|
+
}, [whereClause, filesFetched, filesData]);
|
|
80
|
+
let clearFilesRef = useRef(false);
|
|
81
|
+
useEffect(() => {
|
|
82
|
+
return () => {
|
|
83
|
+
pondRef.current?.destroy();
|
|
84
|
+
pondRef.current = null;
|
|
85
|
+
};
|
|
86
|
+
}, []);
|
|
87
|
+
useEffect(() => {
|
|
88
|
+
async function removeUploadedFile(source, load, error) {
|
|
89
|
+
// this method is also called when we clear the files on data object
|
|
90
|
+
// refresh. Haven't found any elegant way to work around that, so instead
|
|
91
|
+
// we set this ref to true when we remove the files to have a way
|
|
92
|
+
// to discover why the files are being removed
|
|
93
|
+
if (clearFilesRef.current)
|
|
94
|
+
return;
|
|
95
|
+
let { dataHandler } = dataObject;
|
|
96
|
+
try {
|
|
97
|
+
let result = await dataHandler.destroy({
|
|
98
|
+
PrimKey: source,
|
|
99
|
+
});
|
|
100
|
+
if (result) {
|
|
101
|
+
onFileRemoved?.(source);
|
|
102
|
+
load();
|
|
103
|
+
}
|
|
104
|
+
else {
|
|
105
|
+
error("Failed to delete file on server. Delete request returned false");
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
catch (err) {
|
|
109
|
+
error(err.responseText ??
|
|
110
|
+
err.statusText ??
|
|
111
|
+
err.message ??
|
|
112
|
+
"Failed to delete file on server but no error was returned.");
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
let options = {
|
|
116
|
+
allowMultiple: Boolean(props.multiple),
|
|
117
|
+
allowImageResize: true,
|
|
118
|
+
imageResizeMode: "contain",
|
|
119
|
+
imageResizeTargetWidth: 2400,
|
|
120
|
+
imageResizeTargetHeight: 2400,
|
|
121
|
+
imageResizeUpscale: false,
|
|
122
|
+
...labels,
|
|
123
|
+
onaddfilestart: (file) => {
|
|
124
|
+
if (file.status !== 5 && file.status !== 6 && file.status !== 10) {
|
|
125
|
+
onUploadStart();
|
|
126
|
+
}
|
|
127
|
+
},
|
|
128
|
+
onprocessfile: (error, file) => {
|
|
129
|
+
onFileUploaded(error, file);
|
|
130
|
+
let refFiles = pondRef.current?.getFiles();
|
|
131
|
+
let found = refFiles?.find((file) => file.status !== 2 && file.status !== 5 && file.status !== 6 && file.status !== 10);
|
|
132
|
+
if (found === undefined) {
|
|
133
|
+
onFinishedUploads();
|
|
134
|
+
}
|
|
135
|
+
},
|
|
136
|
+
onprocessfiles: () => onFinishedUploads(),
|
|
137
|
+
onerror: (error) => onError(error.body),
|
|
138
|
+
beforeRemoveFile: () => {
|
|
139
|
+
if (confirm(getLocalizedString("Are you sure you want to remove this file?"))) {
|
|
140
|
+
return true;
|
|
141
|
+
}
|
|
142
|
+
return false;
|
|
143
|
+
},
|
|
144
|
+
server: {
|
|
145
|
+
load: getFileUrl(dataObject, fieldName, primKey, "view"),
|
|
146
|
+
restore: getFileUrl(dataObject, fieldName, primKey, "view"),
|
|
147
|
+
revert: removeUploadedFile,
|
|
148
|
+
remove: removeUploadedFile,
|
|
149
|
+
process: {
|
|
150
|
+
url: getFileUrl(dataObject, fieldName),
|
|
151
|
+
ondata: (formData) => {
|
|
152
|
+
let masterChildCriteria = dataObject.getParameter("masterChildCriteria");
|
|
153
|
+
let allFields = { ...masterChildCriteria, ...fields };
|
|
154
|
+
for (let [field, value] of Object.entries(allFields)) {
|
|
155
|
+
if (value !== undefined) {
|
|
156
|
+
formData.append(field, String(value));
|
|
157
|
+
}
|
|
158
|
+
}
|
|
159
|
+
return formData;
|
|
160
|
+
},
|
|
161
|
+
onload: (response) => JSON.parse(response),
|
|
162
|
+
},
|
|
163
|
+
},
|
|
164
|
+
...filePondOptions,
|
|
165
|
+
};
|
|
166
|
+
if (pondRef.current) {
|
|
167
|
+
pondRef.current.setOptions(options);
|
|
168
|
+
}
|
|
169
|
+
else {
|
|
170
|
+
pondRef.current = create(inputRefProp?.current ?? inputRef.current ?? undefined, options);
|
|
171
|
+
}
|
|
172
|
+
}, [
|
|
173
|
+
dataObject,
|
|
174
|
+
props.multiple,
|
|
175
|
+
fields,
|
|
176
|
+
fieldName,
|
|
177
|
+
primKey,
|
|
178
|
+
inputRefProp,
|
|
179
|
+
filePondOptions,
|
|
180
|
+
onError,
|
|
181
|
+
onFileUploaded,
|
|
182
|
+
onUploadStart,
|
|
183
|
+
onFinishedUploads,
|
|
184
|
+
onFileRemoved,
|
|
185
|
+
]);
|
|
186
|
+
useEffect(() => {
|
|
187
|
+
if (pondRef.current) {
|
|
188
|
+
files.forEach((file, index) => {
|
|
189
|
+
let options = {
|
|
190
|
+
index,
|
|
191
|
+
type: "local",
|
|
192
|
+
};
|
|
193
|
+
pondRef.current?.addFile(file.PrimKey, options);
|
|
194
|
+
});
|
|
195
|
+
}
|
|
196
|
+
return () => {
|
|
197
|
+
// Indicate that we are clearing the files because data has changed,
|
|
198
|
+
// to prevent the remove callback from deleting the files
|
|
199
|
+
clearFilesRef.current = true;
|
|
200
|
+
pondRef.current?.removeFiles();
|
|
201
|
+
clearFilesRef.current = false;
|
|
202
|
+
};
|
|
203
|
+
}, [files]);
|
|
204
|
+
return (_jsxs("div", { className: "filepond--wrapper", children: [attachmentPrimKeys && _jsx("input", { type: "hidden", name: "AttachmentPrimkeys", value: attachmentPrimKeys }), _jsx("input", { type: "file", ...props, name: "File", ref: inputRefProp ?? inputRef })] }));
|
|
205
|
+
}
|
|
@@ -8,7 +8,6 @@ export function PageBanner({ as, className, children, ...other }) {
|
|
|
8
8
|
}
|
|
9
9
|
export const BannerImage = React.forwardRef(function BannerImage(props, ref) {
|
|
10
10
|
const { className, ...other } = props;
|
|
11
|
-
// biome-ignore lint/a11y/useAltText: should be provided by the user
|
|
12
11
|
return _jsx("img", { ref: ref, className: clsx("ObPageBanner-bannerImage", className), alt: "", ...other });
|
|
13
12
|
});
|
|
14
13
|
export function TabList({ as, className, children, sticky, ...other }) {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import "./index.css";
|
|
2
|
-
export type SidebarProps = React.
|
|
2
|
+
export type SidebarProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
3
3
|
open?: boolean;
|
|
4
4
|
onClose?: () => void;
|
|
5
|
-
overlayProps
|
|
5
|
+
overlayProps?: React.HTMLAttributes<HTMLDivElement>;
|
|
6
6
|
pullRight?: boolean;
|
|
7
7
|
shadow?: boolean;
|
|
8
8
|
};
|
|
@@ -36,9 +36,9 @@ settingsStore.keys().then((keys) => Promise.allSettled(keys
|
|
|
36
36
|
}
|
|
37
37
|
}))));
|
|
38
38
|
const Divider = forwardRef(function Divider(props, ref) {
|
|
39
|
-
return (
|
|
40
|
-
|
|
41
|
-
|
|
39
|
+
return (
|
|
40
|
+
// biome-ignore lint/a11y/useSemanticElements: NO!
|
|
41
|
+
_jsx("div", { className: clsx("ObSplitContainer-divider", props.className), tabIndex: 0, ref: ref, role: "separator", "aria-orientation": props.direction, "aria-valuemin": props.min, "aria-valuemax": props.max, "aria-valuenow": props.size, children: _jsx("span", { children: "\u2022\u2022\u2022" }) }));
|
|
42
42
|
});
|
|
43
43
|
function SplitRoot({ className, direction, ...props }) {
|
|
44
44
|
return _jsx("div", { className: clsx(className, "ObSplitContainer-root", direction), ...props });
|
|
@@ -1,3 +1,21 @@
|
|
|
1
|
+
.ObValueToggleOption {
|
|
2
|
+
display: flex;
|
|
3
|
+
align-items: center;
|
|
4
|
+
margin: 0;
|
|
5
|
+
position: relative;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
.ObValueToggleLabel {
|
|
9
|
+
font-size: 0.8em;
|
|
10
|
+
margin: 0 0.2em;
|
|
11
|
+
padding: 0.3em 0.5em;
|
|
12
|
+
text-transform: uppercase;
|
|
13
|
+
transition:
|
|
14
|
+
background 0.2s ease,
|
|
15
|
+
color 0.2s ease;
|
|
16
|
+
border-radius: 4px;
|
|
17
|
+
}
|
|
18
|
+
|
|
1
19
|
.ObValueToggleGroup {
|
|
2
20
|
padding: 0.25rem;
|
|
3
21
|
border: 2px solid rgb(0 0 0 / 0.2);
|
|
@@ -26,13 +44,6 @@
|
|
|
26
44
|
}
|
|
27
45
|
}
|
|
28
46
|
|
|
29
|
-
.ObValueToggleOption {
|
|
30
|
-
display: flex;
|
|
31
|
-
align-items: center;
|
|
32
|
-
margin: 0;
|
|
33
|
-
position: relative;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
47
|
.ObValueToggleOption input {
|
|
37
48
|
position: absolute;
|
|
38
49
|
width: 1px;
|
|
@@ -44,15 +55,6 @@
|
|
|
44
55
|
border: 0;
|
|
45
56
|
}
|
|
46
57
|
|
|
47
|
-
.ObValueToggleLabel {
|
|
48
|
-
font-size: 0.8em;
|
|
49
|
-
margin: 0 0.2em;
|
|
50
|
-
padding: 0.3em 0.5em;
|
|
51
|
-
text-transform: uppercase;
|
|
52
|
-
transition: background 0.2s ease, color 0.2s ease;
|
|
53
|
-
border-radius: 4px;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
58
|
.ObValueToggleOption:hover input:not(:disabled) + .ObValueToggleLabel {
|
|
57
59
|
cursor: pointer;
|
|
58
60
|
background: #ccc;
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import "./index.css";
|
|
3
|
-
import { forwardRef, useId } from "react";
|
|
4
3
|
import clsx from "clsx";
|
|
4
|
+
import { forwardRef, useId } from "react";
|
|
5
5
|
export const ValueToggleGroup = forwardRef(function ValueToggleGroup({ options, value, defaultValue, onChange, className, name, id, style, orientation = "horizontal" }, ref) {
|
|
6
6
|
let randomId = useId();
|
|
7
7
|
let groupName = name || `toggle-${id ?? randomId}`;
|
|
8
8
|
let isControlled = value !== undefined;
|
|
9
|
-
return (
|
|
9
|
+
return (
|
|
10
|
+
// biome-ignore lint/a11y/noNoninteractiveElementToInteractiveRole: legacy component
|
|
11
|
+
_jsx("fieldset", { className: clsx("ObValueToggleGroup", orientation, className), role: "radiogroup", ref: ref, style: style, children: options.map((opt) => {
|
|
10
12
|
return (_jsxs("label", { className: clsx("ObValueToggleOption", { disabled: opt.disabled }), children: [_jsx("input", { type: "radio", name: groupName, value: opt.value, checked: isControlled ? value === opt.value : undefined, defaultChecked: !isControlled ? defaultValue === opt.value : undefined, onChange: () => onChange?.(opt.value), disabled: opt.disabled }), _jsx("span", { className: "ObValueToggleLabel", children: opt.label ?? opt.value })] }, opt.value));
|
|
11
13
|
}) }));
|
|
12
14
|
});
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
type DamageFormButtonsProps = {
|
|
2
|
+
isEdit: boolean;
|
|
3
|
+
loading: boolean;
|
|
4
|
+
uploadingFile: boolean;
|
|
5
|
+
handleDelete: () => void;
|
|
6
|
+
handleCancel: () => void;
|
|
7
|
+
};
|
|
8
|
+
export declare function DamageFormButtonsProps({ isEdit, loading, uploadingFile, handleDelete, handleCancel, }: DamageFormButtonsProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import Add from "@mui/icons-material/Add";
|
|
3
|
+
import { Button } from "@mui/material";
|
|
4
|
+
import { getLocalizedString } from "@olenbetong/appframe-core";
|
|
5
|
+
export function DamageFormButtonsProps({ isEdit, loading, uploadingFile, handleDelete, handleCancel, }) {
|
|
6
|
+
return (_jsxs(_Fragment, { children: [isEdit && _jsx(Button, { onClick: handleDelete, children: getLocalizedString("Delete") }), _jsx(Button, { onClick: handleCancel, children: getLocalizedString("Cancel") }), _jsx(Button, { loading: loading || uploadingFile, loadingPosition: "start", startIcon: _jsx(Add, {}), type: "submit", variant: "contained", children: isEdit ? getLocalizedString("Save changes") : getLocalizedString("Register damage") })] }));
|
|
7
|
+
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export type DescriptionInputType = {
|
|
2
|
+
Description?: string | null;
|
|
3
|
+
Cause?: string | null;
|
|
4
|
+
Action?: string | null;
|
|
5
|
+
Date?: Date;
|
|
6
|
+
};
|
|
7
|
+
type DescriptionInputProps = {
|
|
8
|
+
value?: DescriptionInputType | null;
|
|
9
|
+
defaultValue?: DescriptionInputType | null;
|
|
10
|
+
onCopyPrevDamage?: (value: DescriptionInputType) => void;
|
|
11
|
+
onChange?: (value: DescriptionInputType) => void;
|
|
12
|
+
};
|
|
13
|
+
export declare function DescriptionInput({ value, defaultValue, onCopyPrevDamage, onChange }: DescriptionInputProps): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Autocomplete, Button, TextField } from "@mui/material";
|
|
3
|
+
import { getLocalizedString } from "@olenbetong/appframe-core";
|
|
4
|
+
import { useEffect, useRef, useState } from "react";
|
|
5
|
+
export function DescriptionInput({ value, defaultValue, onCopyPrevDamage, onChange }) {
|
|
6
|
+
let initializedRef = useRef(false);
|
|
7
|
+
let [input, setInput] = useState(defaultValue ?? null);
|
|
8
|
+
let inputValue = value === undefined ? input : value;
|
|
9
|
+
// biome-ignore lint: intentionally skipping "value" dependency as this should never run when "value" changes
|
|
10
|
+
useEffect(() => {
|
|
11
|
+
if (initializedRef.current) {
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
if (value === undefined && defaultValue) {
|
|
15
|
+
setInput(defaultValue);
|
|
16
|
+
initializedRef.current = true;
|
|
17
|
+
}
|
|
18
|
+
}, [defaultValue]);
|
|
19
|
+
function handleCopyPrevDamage() {
|
|
20
|
+
let description = localStorage.getItem("ElementDamage_Description") ?? "";
|
|
21
|
+
let cause = localStorage.getItem("ElementDamage_Cause") ?? "";
|
|
22
|
+
let action = localStorage.getItem("ElementDamage_Action") ?? "";
|
|
23
|
+
onCopyPrevDamage?.({
|
|
24
|
+
Description: description,
|
|
25
|
+
Cause: cause,
|
|
26
|
+
Action: action,
|
|
27
|
+
});
|
|
28
|
+
setInput({
|
|
29
|
+
...inputValue,
|
|
30
|
+
Description: description,
|
|
31
|
+
Cause: cause,
|
|
32
|
+
Action: action,
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
function handleOnChange(value) {
|
|
36
|
+
onChange?.(value);
|
|
37
|
+
setInput(value);
|
|
38
|
+
}
|
|
39
|
+
return (_jsxs(_Fragment, { children: [_jsx(TextField, { name: "Date", type: "date", value: (inputValue?.Date ?? new Date()).toISOString().split("T")[0], onChange: (event) => handleOnChange({ ...inputValue, Date: new Date(event.target.value) }), id: "NewElementDamage_Date", label: getLocalizedString("Date"), fullWidth: true, required: true, slotProps: { inputLabel: { shrink: true } } }), _jsx(Button, { variant: "contained", onClick: handleCopyPrevDamage, children: getLocalizedString("Copy previous damage") }), _jsx(Autocomplete, { value: inputValue?.Description ?? "", onChange: (_event, value) => handleOnChange({ ...inputValue, Description: value ?? "" }), options: [
|
|
40
|
+
getLocalizedString("Tear in element"),
|
|
41
|
+
getLocalizedString("Damage around lifting anchor"),
|
|
42
|
+
getLocalizedString("Damage on underside"),
|
|
43
|
+
], freeSolo: true, renderInput: (params) => (_jsx(TextField, { name: "Description", required: true, ...params, label: getLocalizedString("Description") })) }), _jsx(TextField, { name: "Cause", id: "NewElementDamage_Cause", value: inputValue?.Cause ?? "", onChange: (event) => handleOnChange({ ...inputValue, Cause: event.currentTarget.value }), label: getLocalizedString("Cause"), fullWidth: true }), _jsx(TextField, { name: "Action", id: "NewElementDamage_Action", value: inputValue?.Action ?? "", onChange: (event) => handleOnChange({ ...inputValue, Action: event.currentTarget.value }), label: getLocalizedString("Action"), fullWidth: true })] }));
|
|
44
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { DamagesRecord } from "../../data";
|
|
2
|
+
type ElementDamagesItemProps = {
|
|
3
|
+
record: DamagesRecord;
|
|
4
|
+
};
|
|
5
|
+
export declare function ElementDamagesItem({ record }: ElementDamagesItemProps): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare function ElementDamagesHeader(): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { Grid, Typography } from "@mui/material";
|
|
3
|
+
import { getLocalizedString } from "@olenbetong/appframe-core";
|
|
4
|
+
import { Link } from "@olenbetong/appframe-mui";
|
|
5
|
+
function SummaryItem({ col, label, children, em, align, padding }) {
|
|
6
|
+
return (_jsxs(Grid, { size: col, sx: { p: padding ?? 2, borderBottom: (t) => `1px solid ${t.palette.divider}` }, children: [label && (_jsx(Typography, { variant: "body1", fontSize: "0.9rem", fontWeight: 500, mb: 1, textAlign: align, children: getLocalizedString(label) })), children && (_jsx(Typography, { fontSize: em ? "1.4rem" : "0.9rem", whiteSpace: "pre-line", fontWeight: em ? 600 : undefined, textAlign: align, children: children }))] }));
|
|
7
|
+
}
|
|
8
|
+
export function ElementDamagesItem({ record }) {
|
|
9
|
+
return (_jsxs(_Fragment, { children: [_jsx(SummaryItem, { col: 1.5, children: _jsx(Link, { href: "#", onClick: (e) => {
|
|
10
|
+
e.preventDefault();
|
|
11
|
+
window.location.href = `${record.ID}`;
|
|
12
|
+
}, children: record.ID }) }), _jsx(SummaryItem, { col: 2.5, align: "right", children: record.Date.toISOString().split("T")[0] }), _jsx(SummaryItem, { col: 3, children: record.Description }), _jsx(SummaryItem, { col: 2.5, children: record.Cause }), _jsx(SummaryItem, { col: 2.5, children: record.Action })] }));
|
|
13
|
+
}
|
|
14
|
+
export function ElementDamagesHeader() {
|
|
15
|
+
return (_jsxs(_Fragment, { children: [_jsx(SummaryItem, { col: 1.5, label: "ID" }), _jsx(SummaryItem, { col: 2.5, label: "Date", align: "right" }), _jsx(SummaryItem, { col: 3, label: "Description" }), _jsx(SummaryItem, { col: 2.5, label: "Cause" }), _jsx(SummaryItem, { col: 2.5, label: "Action" })] }));
|
|
16
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { DamagesRecord } from "../../data";
|
|
2
|
+
type DuplicateElementDamageDialogProps = {
|
|
3
|
+
open: boolean;
|
|
4
|
+
onClose: () => void;
|
|
5
|
+
record: DamagesRecord[];
|
|
6
|
+
onRegisterAnyway: () => void;
|
|
7
|
+
loading: boolean;
|
|
8
|
+
};
|
|
9
|
+
export declare function DuplicateElementDamageDialog({ open, onClose, record, onRegisterAnyway, loading, }: DuplicateElementDamageDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export {};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import Add from "@mui/icons-material/Add";
|
|
3
|
+
import { Button, Dialog, DialogActions, DialogContent, DialogTitle, Grid, useMediaQuery } from "@mui/material";
|
|
4
|
+
import { getLocalizedString } from "@olenbetong/appframe-core";
|
|
5
|
+
import { theme } from "@olenbetong/appframe-mui";
|
|
6
|
+
import { ElementDamagesHeader, ElementDamagesItem } from "./DesktopView";
|
|
7
|
+
import { DuplicatePhoneViewItem } from "./PhoneView";
|
|
8
|
+
export function DuplicateElementDamageDialog({ open, onClose, record, onRegisterAnyway, loading, }) {
|
|
9
|
+
let matches = useMediaQuery(theme.breakpoints.up("lg"));
|
|
10
|
+
let backgroundColor = "#e9ebee";
|
|
11
|
+
return (_jsxs(Dialog, { open: open, onClose: onClose, fullWidth: true, fullScreen: !matches, children: [_jsx(DialogTitle, { sx: { backgroundColor: backgroundColor }, children: getLocalizedString("This element has one or more unfixed registered damage") }), _jsx(DialogContent, { sx: { backgroundColor: backgroundColor }, children: _jsx(Grid, { container: true, children: matches ? (_jsxs(_Fragment, { children: [_jsx(ElementDamagesHeader, {}), record.map((record) => (_jsx(ElementDamagesItem, { record: record }, record.PrimKey)))] })) : (_jsx("div", { className: "flow", style: { width: "100%" }, children: record.map((record) => (_jsx(DuplicatePhoneViewItem, { record: record }, record.PrimKey))) })) }) }), _jsxs(DialogActions, { sx: { backgroundColor: backgroundColor }, children: [_jsx(Button, { onClick: onClose, children: getLocalizedString("Cancel") }), _jsx(Button, { startIcon: _jsx(Add, {}), variant: "contained", type: "submit", onClick: onRegisterAnyway, loading: loading, loadingPosition: "start", children: getLocalizedString("Register damage anyway") })] })] }));
|
|
12
|
+
}
|