@optionfactory/ful 0.58.0 → 0.59.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 +1 -1
- package/dist/ful.css.map +1 -1
- package/dist/ful.iife.js +23 -19
- package/dist/ful.iife.js.map +1 -1
- package/dist/ful.iife.min.js +1 -1
- package/dist/ful.iife.min.js.map +1 -1
- package/dist/ful.min.mjs +1 -1
- package/dist/ful.min.mjs.map +1 -1
- package/dist/ful.mjs +23 -19
- package/dist/ful.mjs.map +1 -1
- package/package.json +1 -1
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}
|
|
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}ful-wizard:not(:defined){visibility:hidden}ful-wizard,ful-wizard>ol>li.active{display:block}ful-wizard>ol>li,ful-wizard>section{display:none}ful-wizard>section.current{display:block}
|
|
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","wizard.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,
|
|
1
|
+
{"version":3,"sources":["errors.scss","input.scss","select.scss","radio.scss","spinner.scss","wizard.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,CC1EA,yBACE,iBACF,CAMA,mCACE,aACF,CAMA,oCACE,YACF,CAEA,2BACE,aACF","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}","ful-wizard:not(:defined) {\n visibility: hidden;\n}\n\nful-wizard {\n display: block;\n}\n\nful-wizard > ol > li.active {\n display: block;\n}\n\nful-wizard > ol > li {\n display: none;\n}\n\nful-wizard > section {\n display: none;\n}\n\nful-wizard > section.current {\n display: block;\n}"]}
|
package/dist/ful.iife.js
CHANGED
|
@@ -1076,7 +1076,7 @@ var ful = (function (exports) {
|
|
|
1076
1076
|
if (!this.hasAttribute('scroll-on-error')) {
|
|
1077
1077
|
return;
|
|
1078
1078
|
}
|
|
1079
|
-
const ys = Array.from(this.querySelectorAll('ful-field-error'))
|
|
1079
|
+
const ys = Array.from(this.querySelectorAll('[ful-validated-field]:has(.is-invalid) ful-field-error'))
|
|
1080
1080
|
.map(el => el.parentElement ? el.parentElement : el)
|
|
1081
1081
|
.map(el => el.getBoundingClientRect().y + window.scrollY);
|
|
1082
1082
|
const miny = Math.min(...ys);
|
|
@@ -1087,15 +1087,17 @@ var ful = (function (exports) {
|
|
|
1087
1087
|
}
|
|
1088
1088
|
|
|
1089
1089
|
const INPUT_TEMPLATE = `
|
|
1090
|
-
<
|
|
1091
|
-
<
|
|
1092
|
-
<
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1090
|
+
<div ful-validated-field>
|
|
1091
|
+
<label data-tpl-for="id" class="form-label">{{{{ slots.default }}}}</label>
|
|
1092
|
+
<div class="input-group">
|
|
1093
|
+
<span data-tpl-if="slots.ibefore" class="input-group-text">{{{{ slots.ibefore }}}}</span>
|
|
1094
|
+
<div data-tpl-if="slots.before" data-tpl-remove="tag">{{{{ slots.before }}}}</div>
|
|
1095
|
+
{{{{ slots.input }}}}
|
|
1096
|
+
<div data-tpl-if="slots.after" data-tpl-remove="tag">{{{{ slots.after }}}}</div>
|
|
1097
|
+
<span data-tpl-if="slots.iafter" class="input-group-text">{{{{ slots.iafter }}}}</span>
|
|
1098
|
+
</div>
|
|
1099
|
+
<ful-field-error data-tpl-if="name" data-tpl-field="name"></ful-field-error>
|
|
1097
1100
|
</div>
|
|
1098
|
-
<ful-field-error data-tpl-if="name" data-tpl-field="name"></ful-field-error>
|
|
1099
1101
|
`;
|
|
1100
1102
|
|
|
1101
1103
|
const makeInputFragment = (el, template, slots) => {
|
|
@@ -1141,16 +1143,18 @@ var ful = (function (exports) {
|
|
|
1141
1143
|
observed: ["value"],
|
|
1142
1144
|
slots: true,
|
|
1143
1145
|
template: `
|
|
1144
|
-
<
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
<
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
|
|
1151
|
-
|
|
1146
|
+
<div ful-validated-field>
|
|
1147
|
+
<label data-tpl-for="tsId" class="form-label">{{{{ slots.default }}}}</label>
|
|
1148
|
+
{{{{ input }}}}
|
|
1149
|
+
<div class="input-group">
|
|
1150
|
+
<span data-tpl-if="slots.ibefore" class="input-group-text">{{{{ slots.ibefore }}}}</span>
|
|
1151
|
+
<div data-tpl-if="slots.before" data-tpl-remove="tag">{{{{ slots.before }}}}</div>
|
|
1152
|
+
{{{{ slots.input }}}}
|
|
1153
|
+
<div data-tpl-if="slots.after" data-tpl-remove="tag">{{{{ slots.after }}}}</div>
|
|
1154
|
+
<span data-tpl-if="slots.iafter" class="input-group-text">{{{{ slots.iafter }}}}</span>
|
|
1155
|
+
</div>
|
|
1156
|
+
<ful-field-error data-tpl-if="name" data-tpl-field="name"></ful-field-error>
|
|
1152
1157
|
</div>
|
|
1153
|
-
<ful-field-error data-tpl-if="name" data-tpl-field="name"></ful-field-error>
|
|
1154
1158
|
`
|
|
1155
1159
|
}) {
|
|
1156
1160
|
constructor(tsConfig) {
|
|
@@ -1241,7 +1245,7 @@ var ful = (function (exports) {
|
|
|
1241
1245
|
observed: ['value', 'disabled:bool'],
|
|
1242
1246
|
slots: true,
|
|
1243
1247
|
template: `
|
|
1244
|
-
<fieldset>
|
|
1248
|
+
<fieldset ful-validated-field>
|
|
1245
1249
|
<legend class="form-label">
|
|
1246
1250
|
{{{{ slots.default }}}}
|
|
1247
1251
|
</legend>
|