@optionfactory/ful 0.76.0 → 0.78.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/ful.css CHANGED
@@ -1,2 +1,2 @@
1
- ful-errors{--ful-errors-color:var(--bs-danger-text-emphasis);--ful-errors-bg:var(--bs-danger-bg-subtle);--ful-errors-border-color:var(--bs-danger-border-subtle);--ful-errors-border-radius:0.375rem;background-color:var(--ful-errors-bg);border:1px solid var(--ful-errors-border-color);border-radius:var(--ful-errors-border-radius);color:var(--ful-errors-color);display:block;margin-bottom:1rem;padding:1rem}ful-field-error{display:none}[ful-validated-field]:has(.is-invalid) ful-field-error{color:var(--bs-form-invalid-color);display:block;font-size:.875em;margin-top:.25rem}ful-input:not(:defined){visibility:hidden}ful-input{display:block}ful-input:has(.is-invalid) ful-field-error{display:block}ful-select:not(:defined){visibility:hidden}ful-select{display:block}ful-select .ts-control{border-radius:inherit!important}ful-select:has(.is-invalid) .invalid-feedback{display:block}ful-select:has(.is-invalid) .form-control,ful-select:has(.is-invalid) .form-select{border-color:var(--bs-form-invalid-border-color)!important}ful-select:has(.is-invalid) .focus .ts-control{box-shadow:0 0 0 .25rem rgba(var(--bs-danger-rgb),.25)}ful-radio-group:not(:defined){visibility:hidden}ful-radio{display:none}ful-radio-group{--ful-radio-group-label-border-color:var(--bs-border-color);--ful-radio-group-label-border-color-checked:#46ce95;--ful-radio-group-label-background-color:inherit;--ful-radio-group-label-background-color-checked:#f5fffc;display:block}ful-radio-group>fieldset legend{font-size:16px;margin:0}ful-radio-group>fieldset>section{display:grid;gap:10px;grid-template-columns:1fr}ful-radio-group.horizontal>fieldset>section{gap:16px;grid-template-columns:1fr 1fr}ful-radio-group>fieldset input[type=radio]{height:16px;margin-left:8px;margin-right:12px;vertical-align:text-bottom;width:16px}ful-radio-group>fieldset label:has(input[type=radio]){background-color:var(--ful-radio-group-label-background-color);border:1px solid var(--ful-radio-group-label-border-color);border-radius:4px;display:block;padding:6px 10px}ful-radio-group>fieldset label:has(input[type=radio].is-invalid){border-color:var(--bs-form-invalid-border-color)}ful-radio-group>fieldset label:has(input[type=radio]:checked){background-color:var(--ful-radio-group-label-background-color-checked);border-color:var(--ful-radio-group-label-border-color-checked)}ful-radio-group:has(.is-invalid) ful-field-error{display:block}ful-spinner:not(:defined){visibility:hidden}ful-spinner{--ful-spinner-icon-width:1rem;--ful-spinner-icon-height:1rem;--ful-spinner-icon-border-width:0.2em;--ful-spinner-icon-vertical-align:-0.125em;--ful-spinner-icon-animation-speed:0.75s;--ful-spinner-icon-animation-name:spinner-border;--ful-spinner-icon-color:currentcolor}ful-spinner.centered{align-items:center;display:flex;justify-content:center}ful-spinner.big{--ful-spinner-icon-width:2rem;--ful-spinner-icon-height:2rem;--ful-spinner-icon-border-width:0.25em}ful-spinner.backdrop,ful-spinner.bigger{--ful-spinner-icon-width:4rem;--ful-spinner-icon-height:4rem;--ful-spinner-icon-border-width:0.5em}ful-spinner.backdrop{align-items:center;background-color:hsla(0,0%,65%,.8);display:flex;height:100vh;justify-content:center;left:0;outline:0;overflow-x:hidden;overflow-y:auto;position:fixed;top:0;width:100vw;z-index:2000}ful-spinner>.ful-spinner-wrapper{display:inline}ful-spinner.backdrop>.ful-spinner-wrapper{background-color:#fff;border-radius:1rem;padding:2rem}ful-spinner>.ful-spinner-wrapper>.ful-spinner-icon{animation:var(--ful-spinner-icon-animation-speed) linear infinite var(--ful-spinner-icon-animation-name);border:var(--ful-spinner-icon-border-width) solid var(--ful-spinner-icon-color);border-radius:50%;border-right-color:transparent;display:inline-block;height:var(--ful-spinner-icon-height);vertical-align:var(--ful-spinner-icon-vertical-align);width:var(--ful-spinner-icon-width)}body:has(ful-spinner.backdrop:not([hidden])){overflow:hidden}
1
+ ful-errors{--ful-errors-color:var(--bs-danger-text-emphasis,#58151c);--ful-errors-bg:var(--bs-danger-bg-subtle,#f8d7da);--ful-errors-border-color:var(--bs-danger-border-subtle,#f1aeb5);--ful-errors-border-radius:0.375rem;background-color:var(--ful-errors-bg);border:1px solid var(--ful-errors-border-color);border-radius:var(--ful-errors-border-radius);color:var(--ful-errors-color);display:block;margin-bottom:1rem;padding:1rem}ful-field-error{--ful-field-error-color-invalid:var(--bs-form-invalid-color,#dc3545);display:none;[ful-validated-field]:has(.is-invalid) &{color:var(--ful-field-error-color-invalid);display:block;font-size:.875em;margin-top:.25rem}}ful-input{display:block;&:not(:defined){visibility:hidden}}ful-select{--ful-select-box-shadow-invalid:0 0 0 .25rem rgba(var(--bs-danger-rgb,220,53,69),.25);--ful-select-border-color-invalid:var(--bs-form-invalid-border-color);display:block;&:not(:defined){visibility:hidden}& .ts-control{border-radius:inherit!important}&:has(.is-invalid) .focus .ts-control{box-shadow:var(--ful-select-box-shadow-invalid)}&:has(.is-invalid) .form-control,&:has(.is-invalid) .form-select{border-color:var(--ful-select-border-color-invalid)!important}}ful-radio-group{--ful-radio-group-label-border-color:var(--bs-border-color,#dee2e6);--ful-radio-group-label-border-color-checked:#46ce95;--ful-radio-group-label-background-color:inherit;--ful-radio-group-label-background-color-checked:#f5fffc;display:block;&:not(:defined){visibility:hidden}&>fieldset{&>legend{font-size:16px;margin:0}&>section{display:grid;gap:10px;grid-template-columns:1fr;& label:has(input[type=radio]){background-color:var(--ful-radio-group-label-background-color);border:1px solid var(--ful-radio-group-label-border-color);border-radius:4px;display:block;padding:6px 10px;k &.is-invalid{border-color:var(--bs-form-invalid-border-color)}}& label:has(input[type=radio]:checked){background-color:var(--ful-radio-group-label-background-color-checked);border-color:var(--ful-radio-group-label-border-color-checked)}& input[type=radio]{height:16px;margin-left:8px;margin-right:12px;vertical-align:text-bottom;width:16px}}}&.horizontal>fieldset>section{gap:16px;grid-template-columns:1fr 1fr}}ful-radio{display:none}ful-spinner{--ful-spinner-icon-width:1rem;--ful-spinner-icon-height:1rem;--ful-spinner-icon-border-width:0.2em;--ful-spinner-icon-vertical-align:-0.125em;--ful-spinner-icon-animation-speed:0.75s;--ful-spinner-icon-animation-name:spinner-border;--ful-spinner-icon-color:currentcolor;&:not(:defined){visibility:hidden}&.centered{align-items:center;display:flex;justify-content:center}&.big{--ful-spinner-icon-width:2rem;--ful-spinner-icon-height:2rem;--ful-spinner-icon-border-width:0.25em}&.backdrop,&.bigger{--ful-spinner-icon-width:4rem;--ful-spinner-icon-height:4rem;--ful-spinner-icon-border-width:0.5em}&.backdrop{align-items:center;background-color:hsla(0,0%,65%,.8);display:flex;height:100vh;justify-content:center;left:0;outline:0;overflow-x:hidden;overflow-y:auto;position:fixed;top:0;width:100vw;z-index:2000;&>.ful-spinner-wrapper{background-color:#fff;border-radius:1rem;padding:2rem}}&>.ful-spinner-wrapper{display:inline;&>.ful-spinner-icon{animation:var(--ful-spinner-icon-animation-speed) linear infinite var(--ful-spinner-icon-animation-name);border:var(--ful-spinner-icon-border-width) solid var(--ful-spinner-icon-color);border-radius:50%;border-right-color:transparent;display:inline-block;height:var(--ful-spinner-icon-height);vertical-align:var(--ful-spinner-icon-vertical-align);width:var(--ful-spinner-icon-width)}}}body:has(ful-spinner.backdrop:not([hidden])){overflow:hidden}
2
2
  /*# sourceMappingURL=ful.css.map */
package/dist/ful.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["errors.scss","input.scss","select.scss","radio.scss","spinner.scss"],"names":[],"mappings":"AAAA,WACE,iDAAkD,CAClD,0CAA2C,CAC3C,wDAAyD,CACzD,mCAAoC,CAKpC,qCAAsC,CACtC,+CAAgD,CAChD,6CAA8C,CAH9C,6BAA8B,CAH9B,aAAc,CAEd,kBAAmB,CADnB,YAMF,CAEA,gBACE,YACF,CAEA,uDAIE,kCAAmC,CAHnC,aAAc,CAEd,gBAAkB,CADlB,iBAGF,CCvBA,wBACE,iBACF,CAEA,UACE,aACF,CAEA,2CACE,aACF,CCVA,yBACE,iBACF,CAEA,WACE,aACF,CAEA,uBAEE,+BACF,CAEA,8CACE,aACF,CAEA,mFAEE,0DACF,CAEA,+CACE,sDACF,CCxBA,8BACE,iBACF,CAEA,UACE,YACF,CAEA,gBAEE,2DAA4D,CAC5D,oDAAqD,CACrD,gDAAiD,CACjD,wDAAyD,CAJzD,aAKF,CAEA,gCACE,cAAe,CACf,QACF,CAEA,iCACE,YAAa,CACb,QAAS,CACT,yBACF,CAEA,4CACE,QAAS,CACT,6BACF,CAEA,2CAGE,WAAY,CAFZ,eAAgB,CAChB,iBAAkB,CAGlB,0BAA2B,CAD3B,UAEF,CAEA,sDAGE,8DAA+D,CAD/D,0DAA2D,CAE3D,iBAAkB,CAHlB,aAAc,CAId,gBACF,CAEA,iEACE,gDACF,CAEA,8DACE,sEAAuE,CACvE,8DACF,CAEA,iDACE,aACF,CC3DA,0BACE,iBACF,CAEA,YACE,6BAA8B,CAC9B,8BAA+B,CAC/B,qCAAsC,CACtC,0CAA2C,CAC3C,wCAAyC,CACzC,gDAAiD,CACjD,qCACF,CAEA,qBAEE,kBAAmB,CADnB,YAAa,CAEb,sBACF,CAEA,gBACE,6BAA8B,CAC9B,8BAA+B,CAC/B,sCACF,CAQA,wCALE,6BAA8B,CAC9B,8BAA+B,CAC/B,qCAoBF,CAjBA,qBAeE,kBAAmB,CAFnB,kCAA0C,CAC1C,YAAa,CALb,YAAa,CAOb,sBAAuB,CATvB,MAAO,CAKP,SAAU,CAFV,iBAAkB,CAClB,eAAgB,CANhB,cAAe,CACf,KAAM,CAEN,WAAY,CAJZ,YAaF,CAEA,iCACE,cACF,CAEA,0CAEE,qBAAuB,CACvB,kBAAmB,CAFnB,YAGF,CAEA,mDAQE,wGAAyG,CAFzG,+EAAgF,CADhF,iBAAkB,CAElB,8BAA+B,CAN/B,oBAAqB,CAErB,qCAAsC,CACtC,qDAAsD,CAFtD,mCAOF,CAEA,6CACE,eACF","file":"ful.css","sourcesContent":["ful-errors {\n --ful-errors-color: var(--bs-danger-text-emphasis);\n --ful-errors-bg: var(--bs-danger-bg-subtle);\n --ful-errors-border-color: var(--bs-danger-border-subtle);\n --ful-errors-border-radius: 0.375rem;\n display: block;\n padding: 1rem;\n margin-bottom: 1rem;\n color: var(--ful-errors-color);\n background-color: var(--ful-errors-bg);\n border: 1px solid var(--ful-errors-border-color);\n border-radius: var(--ful-errors-border-radius);\n}\n\nful-field-error {\n display: none;\n}\n\n[ful-validated-field]:has(.is-invalid) ful-field-error {\n display: block;\n margin-top: 0.25rem;\n font-size: 0.875em;\n color: var(--bs-form-invalid-color);\n}","ful-input:not(:defined) {\n visibility: hidden;\n}\n\nful-input {\n display: block;\n}\n\nful-input:has(.is-invalid) ful-field-error {\n display: block;\n}","ful-select:not(:defined) {\n visibility: hidden;\n}\n\nful-select {\n display: block;\n}\n\nful-select .ts-control {\n /*fixes border radius on box-shadow*/\n border-radius: inherit !important;\n}\n\nful-select:has(.is-invalid) .invalid-feedback {\n display: block;\n}\n\nful-select:has(.is-invalid) .form-select,\nful-select:has(.is-invalid) .form-control {\n border-color: var(--bs-form-invalid-border-color) !important;\n}\n\nful-select:has(.is-invalid) .focus .ts-control {\n box-shadow: 0 0 0 0.25rem rgba(var(--bs-danger-rgb), 0.25);\n}","ful-radio-group:not(:defined) {\n visibility: hidden;\n}\n\nful-radio {\n display: none;\n}\n\nful-radio-group {\n display: block;\n --ful-radio-group-label-border-color: var(--bs-border-color);\n --ful-radio-group-label-border-color-checked: #46ce95;\n --ful-radio-group-label-background-color: inherit;\n --ful-radio-group-label-background-color-checked: #f5fffc;\n}\n\nful-radio-group > fieldset legend {\n font-size: 16px;\n margin: 0;\n}\n\nful-radio-group > fieldset > section {\n display: grid;\n gap: 10px;\n grid-template-columns: 1fr;\n}\n\nful-radio-group.horizontal > fieldset > section {\n gap: 16px;\n grid-template-columns: 1fr 1fr;\n}\n\nful-radio-group > fieldset input[type=radio] {\n margin-left: 8px;\n margin-right: 12px;\n height: 16px;\n width: 16px;\n vertical-align: text-bottom;\n}\n\nful-radio-group > fieldset label:has(input[type=radio]) {\n display: block;\n border: 1px solid var(--ful-radio-group-label-border-color);\n background-color: var(--ful-radio-group-label-background-color);\n border-radius: 4px;\n padding: 6px 10px;\n}\n\nful-radio-group > fieldset label:has(input[type=radio].is-invalid) {\n border-color: var(--bs-form-invalid-border-color);\n}\n\nful-radio-group > fieldset label:has(input[type=radio]:checked) {\n background-color: var(--ful-radio-group-label-background-color-checked);\n border-color: var(--ful-radio-group-label-border-color-checked);\n}\n\nful-radio-group:has(.is-invalid) ful-field-error {\n display: block;\n}","ful-spinner:not(:defined) {\n visibility: hidden;\n}\n\nful-spinner {\n --ful-spinner-icon-width: 1rem;\n --ful-spinner-icon-height: 1rem;\n --ful-spinner-icon-border-width: 0.2em;\n --ful-spinner-icon-vertical-align: -0.125em;\n --ful-spinner-icon-animation-speed: 0.75s;\n --ful-spinner-icon-animation-name: spinner-border;\n --ful-spinner-icon-color: currentcolor;\n}\n\nful-spinner.centered {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\nful-spinner.big {\n --ful-spinner-icon-width: 2rem;\n --ful-spinner-icon-height: 2rem;\n --ful-spinner-icon-border-width: 0.25em;\n}\n\nful-spinner.bigger {\n --ful-spinner-icon-width: 4rem;\n --ful-spinner-icon-height: 4rem;\n --ful-spinner-icon-border-width: 0.5em;\n}\n\nful-spinner.backdrop {\n --ful-spinner-icon-width: 4rem;\n --ful-spinner-icon-height: 4rem;\n --ful-spinner-icon-border-width: 0.5em;\n z-index: 2000;\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n overflow-x: hidden;\n overflow-y: auto;\n outline: 0;\n background-color: rgba(167, 167, 167, 0.8);\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\nful-spinner > .ful-spinner-wrapper {\n display: inline;\n}\n\nful-spinner.backdrop > .ful-spinner-wrapper {\n padding: 2rem;\n background-color: white;\n border-radius: 1rem;\n}\n\nful-spinner > .ful-spinner-wrapper > .ful-spinner-icon {\n display: inline-block;\n width: var(--ful-spinner-icon-width);\n height: var(--ful-spinner-icon-height);\n vertical-align: var(--ful-spinner-icon-vertical-align);\n border-radius: 50%;\n border: var(--ful-spinner-icon-border-width) solid var(--ful-spinner-icon-color);\n border-right-color: transparent;\n animation: var(--ful-spinner-icon-animation-speed) linear infinite var(--ful-spinner-icon-animation-name);\n}\n\nbody:has(ful-spinner.backdrop:not([hidden])) {\n overflow: hidden;\n}"]}
1
+ {"version":3,"sources":["errors.css","input.css","select.css","radio.css","spinner.css"],"names":[],"mappings":"AAAA,WACI,yDAA2D,CAC3D,kDAAoD,CACpD,gEAAkE,CAClE,mCAAoC,CAMpC,qCAAsC,CACtC,+CAAgD,CAChD,6CAA8C,CAH9C,6BAA8B,CAH9B,aAAc,CAEd,kBAAmB,CADnB,YAMJ,CAEA,gBACI,oEAAsE,CACtE,YAAa,CAEb,yCAII,0CAA2C,CAH3C,aAAc,CAEd,gBAAiB,CADjB,iBAGJ,CACJ,CCzBA,UACI,aAAc,CAEd,gBACI,iBACJ,CACJ,CCNA,WACI,qFAA0F,CAC1F,qEAAsE,CAMtE,aAAc,CAJd,gBACI,iBACJ,CAIA,cAEI,+BACJ,CAEA,sCACI,+CACJ,CAEA,iEAEI,6DACJ,CACJ,CCvBA,gBACI,mEAAqE,CACrE,oDAAqD,CACrD,gDAAiD,CACjD,wDAAyD,CACzD,aAAc,CAEd,gBACI,iBACJ,CAEA,WACI,SACI,cAAe,CACf,QACJ,CAEA,UACI,YAAa,CACb,QAAS,CACT,yBAA0B,CAE1B,+BAGI,8DAA+D,CAD/D,0DAA2D,CAE3D,iBAAkB,CAHlB,aAAc,CAId,gBAAiB,CAEjB,eACI,gDACJ,CACJ,CAEA,uCACI,sEAAuE,CACvE,8DACJ,CAEA,oBAGI,WAAY,CAFZ,eAAgB,CAChB,iBAAkB,CAGlB,0BAA2B,CAD3B,UAEJ,CACJ,CACJ,CAEA,8BACI,QAAS,CACT,6BACJ,CACJ,CAEA,UACI,YACJ,CCzDA,YACI,6BAA8B,CAC9B,8BAA+B,CAC/B,qCAAsC,CACtC,0CAA2C,CAC3C,wCAAyC,CACzC,gDAAiD,CACjD,qCAAsC,CAEtC,gBACI,iBACJ,CAEA,WAEI,kBAAmB,CADnB,YAAa,CAEb,sBACJ,CAEA,MACI,6BAA8B,CAC9B,8BAA+B,CAC/B,sCACJ,CAQA,oBALI,6BAA8B,CAC9B,8BAA+B,CAC/B,qCA4BJ,CAzBA,WAiBI,kBAAmB,CAHnB,kCAAwC,CAExC,YAAa,CANb,YAAa,CAQb,sBAAuB,CAVvB,MAAO,CAKP,SAAU,CAFV,iBAAkB,CAClB,eAAgB,CANhB,cAAe,CACf,KAAM,CAEN,WAAY,CAJZ,YAAa,CAeb,uBAEI,qBAAuB,CACvB,kBAAmB,CAFnB,YAGJ,CACJ,CAEA,uBACI,cAAe,CAEf,oBAQI,wGAAyG,CAFzG,+EAAgF,CADhF,iBAAkB,CAElB,8BAA+B,CAN/B,oBAAqB,CAErB,qCAAsC,CACtC,qDAAsD,CAFtD,mCAOJ,CACJ,CAEJ,CAEA,6CACI,eACJ","file":"ful.css","sourcesContent":["ful-errors {\n --ful-errors-color: var(--bs-danger-text-emphasis, #58151c);\n --ful-errors-bg: var(--bs-danger-bg-subtle, #f8d7da);\n --ful-errors-border-color: var(--bs-danger-border-subtle, #f1aeb5);\n --ful-errors-border-radius: 0.375rem;\n\n display: block;\n padding: 1rem;\n margin-bottom: 1rem;\n color: var(--ful-errors-color);\n background-color: var(--ful-errors-bg);\n border: 1px solid var(--ful-errors-border-color);\n border-radius: var(--ful-errors-border-radius);\n}\n\nful-field-error {\n --ful-field-error-color-invalid: var(--bs-form-invalid-color, #dc3545);\n display: none;\n\n [ful-validated-field]:has(.is-invalid) & {\n display: block;\n margin-top: .25rem;\n font-size: .875em;\n color: var(--ful-field-error-color-invalid);\n }\n}","ful-input {\n display: block;\n\n &:not(:defined) {\n visibility: hidden;\n }\n}","ful-select {\n --ful-select-box-shadow-invalid: 0 0 0 .25rem rgba(var(--bs-danger-rgb, 220, 53, 69), .25);\n --ful-select-border-color-invalid: var(--bs-form-invalid-border-color);\n\n &:not(:defined) {\n visibility: hidden;\n }\n\n display: block;\n\n & .ts-control {\n /*fixes border radius on box-shadow*/\n border-radius: inherit !important;\n }\n\n &:has(.is-invalid) .focus .ts-control {\n box-shadow: var(--ful-select-box-shadow-invalid);\n }\n\n &:has(.is-invalid) .form-select,\n &:has(.is-invalid) .form-control {\n border-color: var(--ful-select-border-color-invalid) !important;\n }\n}","ful-radio-group {\n --ful-radio-group-label-border-color: var(--bs-border-color, #dee2e6);\n --ful-radio-group-label-border-color-checked: #46ce95;\n --ful-radio-group-label-background-color: inherit;\n --ful-radio-group-label-background-color-checked: #f5fffc;\n display: block;\n\n &:not(:defined) {\n visibility: hidden;\n }\n\n &>fieldset {\n &>legend {\n font-size: 16px;\n margin: 0;\n }\n\n &>section {\n display: grid;\n gap: 10px;\n grid-template-columns: 1fr;\n\n & label:has(input[type=radio]) {\n display: block;\n border: 1px solid var(--ful-radio-group-label-border-color);\n background-color: var(--ful-radio-group-label-background-color);\n border-radius: 4px;\n padding: 6px 10px;\n\n k &.is-invalid {\n border-color: var(--bs-form-invalid-border-color);\n }\n }\n\n & label:has(input[type=radio]:checked) {\n background-color: var(--ful-radio-group-label-background-color-checked);\n border-color: var(--ful-radio-group-label-border-color-checked);\n }\n\n & input[type=radio] {\n margin-left: 8px;\n margin-right: 12px;\n height: 16px;\n width: 16px;\n vertical-align: text-bottom;\n }\n }\n }\n\n &.horizontal>fieldset>section {\n gap: 16px;\n grid-template-columns: 1fr 1fr;\n }\n}\n\nful-radio {\n display: none;\n}","ful-spinner {\n --ful-spinner-icon-width: 1rem;\n --ful-spinner-icon-height: 1rem;\n --ful-spinner-icon-border-width: 0.2em;\n --ful-spinner-icon-vertical-align: -0.125em;\n --ful-spinner-icon-animation-speed: 0.75s;\n --ful-spinner-icon-animation-name: spinner-border;\n --ful-spinner-icon-color: currentcolor;\n\n &:not(:defined) {\n visibility: hidden;\n }\n\n &.centered {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n &.big {\n --ful-spinner-icon-width: 2rem;\n --ful-spinner-icon-height: 2rem;\n --ful-spinner-icon-border-width: 0.25em;\n }\n\n &.bigger {\n --ful-spinner-icon-width: 4rem;\n --ful-spinner-icon-height: 4rem;\n --ful-spinner-icon-border-width: 0.5em;\n }\n\n &.backdrop {\n --ful-spinner-icon-width: 4rem;\n --ful-spinner-icon-height: 4rem;\n --ful-spinner-icon-border-width: 0.5em;\n\n z-index: 2000;\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n overflow-x: hidden;\n overflow-y: auto;\n outline: 0;\n background-color: rgb(167 167 167 / 80%);\n ;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &>.ful-spinner-wrapper {\n padding: 2rem;\n background-color: white;\n border-radius: 1rem;\n }\n }\n\n &>.ful-spinner-wrapper {\n display: inline;\n\n &>.ful-spinner-icon {\n display: inline-block;\n width: var(--ful-spinner-icon-width);\n height: var(--ful-spinner-icon-height);\n vertical-align: var(--ful-spinner-icon-vertical-align);\n border-radius: 50%;\n border: var(--ful-spinner-icon-border-width) solid var(--ful-spinner-icon-color);\n border-right-color: transparent;\n animation: var(--ful-spinner-icon-animation-speed) linear infinite var(--ful-spinner-icon-animation-name);\n }\n }\n\n}\n\nbody:has(ful-spinner.backdrop:not([hidden])) {\n overflow: hidden;\n}"]}
package/dist/ful.iife.js CHANGED
@@ -715,19 +715,6 @@ var ful = (function (exports) {
715
715
  }
716
716
  }
717
717
 
718
- class Events {
719
- static dispatchChange(el, value) {
720
- return el.dispatchEvent(new CustomEvent("change", {
721
- bubbles: true,
722
- cancelable: true,
723
- detail: {
724
- target: el,
725
- value: value
726
- }
727
- }));
728
- }
729
- }
730
-
731
718
  class TemplatesRegistry {
732
719
  #idToFragment = {};
733
720
  #idToTemplate = {};
@@ -749,11 +736,11 @@ var ful = (function (exports) {
749
736
  }
750
737
  return tpl;
751
738
  }
752
- configure(ec) {
739
+ configure(ec, ...data) {
753
740
  this.#ec = ec;
754
741
  for (const [k, fragment] of Object.entries(this.#idToFragment)) {
755
742
  delete this.#idToFragment[k];
756
- this.#idToTemplate[k] = ftl.Template.fromFragment(fragment, ec);
743
+ this.#idToTemplate[k] = ftl.Template.fromFragment(fragment, ec, ...data);
757
744
  }
758
745
  }
759
746
  }
@@ -776,12 +763,6 @@ var ful = (function (exports) {
776
763
  this.#templates.put(name, Fragments.fromHtml(html));
777
764
  return name;
778
765
  }
779
- template(k) {
780
- if (k === null || k === undefined) {
781
- return undefined;
782
- }
783
- return this.#templates.get(k);
784
- }
785
766
  define(tag, klass) {
786
767
  if (!this.#configured) {
787
768
  this.#tagToclass[tag] = klass;
@@ -790,14 +771,20 @@ var ful = (function (exports) {
790
771
  customElements.define(tag, klass);
791
772
  return this;
792
773
  }
793
- configure(ec) {
794
- this.#templates.configure(ec);
774
+ configure(ec, ...data) {
775
+ this.#templates.configure(ec, ...data);
795
776
  for (const [tag, klass] of Object.entries(this.#tagToclass)) {
796
777
  customElements.define(tag, klass);
797
778
  delete this.#tagToclass[tag];
798
779
  }
799
780
  this.#configured = true;
800
781
  }
782
+ template(k) {
783
+ if (k === null || k === undefined) {
784
+ return undefined;
785
+ }
786
+ return this.#templates.get(k);
787
+ }
801
788
  }
802
789
 
803
790
  const elements = new ElementsRegistry();
@@ -992,7 +979,10 @@ var ful = (function (exports) {
992
979
  if (el.dataset['fulBindType'] === 'boolean') {
993
980
  return !el.value ? null : el.value === 'true';
994
981
  }
995
- return el.value === '' || el.value === undefined ? null : el.value;
982
+ if (el.tagName === 'INPUT' || el.tagName === 'SELECT'){
983
+ return el.value === '' || el.value === undefined ? null : el.value;
984
+ }
985
+ return el.value;
996
986
  }
997
987
 
998
988
  function mutate(el, raw) {
@@ -1010,6 +1000,7 @@ var ful = (function (exports) {
1010
1000
  class Form extends ParsedElement() {
1011
1001
  static IGNORED_CHILDREN_SELECTOR = '.d-none, [hidden]';
1012
1002
  static SCROLL_OFFSET = 50;
1003
+ static INVALID_CLASS = 'is-invalid';
1013
1004
  render() {
1014
1005
  const form = document.createElement('form');
1015
1006
  form.replaceChildren(...this.childNodes);
@@ -1072,7 +1063,7 @@ var ful = (function (exports) {
1072
1063
  set errors(es) {
1073
1064
  const fieldErrors = es.filter((e) => e.type === 'FIELD_ERROR' || e.type === 'INVALID_FORMAT');
1074
1065
  const globalErrors = es.filter((e) => e.type !== 'FIELD_ERROR' && e.type !== 'INVALID_FORMAT');
1075
- this.querySelectorAll('.is-invalid').forEach(el => el.classList.remove('is-invalid'));
1066
+ this.querySelectorAll(`.${Form.INVALID_CLASS}`).forEach(el => el.classList.remove(Form.INVALID_CLASS));
1076
1067
  this.querySelectorAll("ful-errors").forEach(el => {
1077
1068
  el.replaceChildren();
1078
1069
  el.setAttribute('hidden', '');
@@ -1080,7 +1071,7 @@ var ful = (function (exports) {
1080
1071
  fieldErrors.forEach((e) => {
1081
1072
  const name = e.context.replace("[", ".").replace("].", ".");
1082
1073
  const validationTargetsSelector = `[name='${CSS.escape(name)}'] [ful-validation-target],[name='${CSS.escape(name)}']:not(:has([ful-validation-target]))`;
1083
- this.querySelectorAll(validationTargetsSelector).forEach(input => input.classList.add('is-invalid'));
1074
+ this.querySelectorAll(validationTargetsSelector).forEach(input => input.classList.add(Form.INVALID_CLASS));
1084
1075
  const fieldErrorsSelector = `ful-field-error[field='${CSS.escape(name)}']`;
1085
1076
  this.querySelectorAll(fieldErrorsSelector).forEach(el => el.innerText = e.reason);
1086
1077
  });
@@ -1093,7 +1084,7 @@ var ful = (function (exports) {
1093
1084
  if (!this.hasAttribute('scroll-on-error')) {
1094
1085
  return;
1095
1086
  }
1096
- const ys = Array.from(this.querySelectorAll('[ful-validated-field]:has(.is-invalid) ful-field-error'))
1087
+ const ys = Array.from(this.querySelectorAll(`[ful-validated-field]:has(.${Form.INVALID_CLASS}) ful-field-error`))
1097
1088
  .map(el => el.parentElement ? el.parentElement : el)
1098
1089
  .map(el => el.getBoundingClientRect().y + window.scrollY);
1099
1090
  const miny = Math.min(...ys);
@@ -1126,7 +1117,13 @@ var ful = (function (exports) {
1126
1117
  input.setAttribute('ful-validation-target', '');
1127
1118
  input.addEventListener('change', (evt) => {
1128
1119
  evt.stopPropagation();
1129
- Events.dispatchChange(el, el.value);
1120
+ el.dispatchEvent(new CustomEvent('change', {
1121
+ bubbles: true,
1122
+ cancelable: false,
1123
+ detail: {
1124
+ value: el.value
1125
+ }
1126
+ }));
1130
1127
  });
1131
1128
  const id = input.getAttribute('id') || el.getAttribute('input-id') || Attributes.uid('ful-input');
1132
1129
  Attributes.forward('input-', el, slots.input);
@@ -1234,7 +1231,13 @@ var ful = (function (exports) {
1234
1231
  shouldLoad: (query) => this.shouldLoad ? this.shouldLoad(query) : true
1235
1232
  } : {}, tsDefaultConfig, this.tsConfig));
1236
1233
  this.ts.on('change', value => {
1237
- Events.dispatchChange(this, this.value);
1234
+ this.dispatchEvent(new CustomEvent('change', {
1235
+ bubbles: true,
1236
+ cancelable: false,
1237
+ detail: {
1238
+ value: this.value
1239
+ }
1240
+ }));
1238
1241
  });
1239
1242
  //we remove the input to move it
1240
1243
  input.addEventListener('change', (evt) => {
@@ -1306,7 +1309,13 @@ var ful = (function (exports) {
1306
1309
  input.addEventListener('change', evt => {
1307
1310
  evt.stopPropagation();
1308
1311
  //change is not cancelable
1309
- Events.dispatchChange(this, this.value);
1312
+ this.dispatchEvent(new CustomEvent('change', {
1313
+ bubbles: true,
1314
+ cancelable: false,
1315
+ detail: {
1316
+ value: this.value
1317
+ }
1318
+ }));
1310
1319
  });
1311
1320
  const label = Fragments.fromChildNodes(el);
1312
1321
  return [input, label];
@@ -1320,9 +1329,6 @@ var ful = (function (exports) {
1320
1329
  return checked ? checked.value : null;
1321
1330
  }
1322
1331
  set value(value) {
1323
- if(!Events.dispatchChange(this, value)){
1324
- return;
1325
- }
1326
1332
  this.querySelector(`input[type=radio][value=${CSS.escape(value)}]`).checked = true;
1327
1333
  }
1328
1334
  }
@@ -1348,7 +1354,6 @@ var ful = (function (exports) {
1348
1354
  exports.Base64 = Base64;
1349
1355
  exports.Deferred = Deferred;
1350
1356
  exports.ElementsRegistry = ElementsRegistry;
1351
- exports.Events = Events;
1352
1357
  exports.Failure = Failure;
1353
1358
  exports.Form = Form;
1354
1359
  exports.Fragments = Fragments;