@frollo/frollo-web-ui 9.0.10 → 9.0.12

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/cjs/index.js CHANGED
@@ -7994,8 +7994,8 @@ styleInject(css_248z$o);__default__$g.render = render$v;var __default__$f = vue.
7994
7994
  var __injectCSSVars__$b = function __injectCSSVars__() {
7995
7995
  vue.useCssVars(function (_ctx) {
7996
7996
  return {
7997
- "v221768dc": _ctx.primaryFade5,
7998
- "v0b83798c": _ctx.colorErrorTextFade5
7997
+ "v027ca7bd": _ctx.primaryFade5,
7998
+ "v6423b1fe": _ctx.colorErrorTextFade5
7999
7999
  };
8000
8000
  });
8001
8001
  };
@@ -8024,39 +8024,35 @@ var _hoisted_7$a = {
8024
8024
  "class": "relative"
8025
8025
  };
8026
8026
  var _hoisted_8$9 = {
8027
- key: 0,
8028
- "class": "border border-grey-100 bg-white rounded-lg p-3"
8029
- };
8030
- var _hoisted_9$8 = {
8031
8027
  key: 0,
8032
8028
  "class": "flex text-body absolute w-9 h-full inset-y-0 left-0 items-center pl-3 pointer-events-none"
8033
8029
  };
8034
- var _hoisted_10$6 = {
8035
- "class": "pl-9 flex flex-row items-center flex-wrap"
8030
+ var _hoisted_9$8 = {
8031
+ "class": "flex flex-row items-center flex-wrap"
8036
8032
  };
8037
- var _hoisted_11$5 = ["id", "name", "type", "readonly", "tabindex", "disabled", "autocomplete", "maxlength"];
8038
- var _hoisted_12$4 = {
8033
+ var _hoisted_10$6 = ["id", "name", "type", "readonly", "tabindex", "disabled", "autocomplete", "placeholder", "maxlength"];
8034
+ var _hoisted_11$5 = {
8039
8035
  key: 1,
8040
8036
  "class": "flex text-black absolute w-10 h-full inset-y-0 right-0 items-center pr-3"
8041
8037
  };
8042
- var _hoisted_13$4 = {
8038
+ var _hoisted_12$4 = {
8043
8039
  key: 0,
8044
8040
  "class": "flex text-body absolute w-9 h-full inset-y-0 left-0 items-center pl-3 pointer-events-none"
8045
8041
  };
8046
- var _hoisted_14$4 = ["id", "name", "placeholder", "type", "readonly", "tabindex", "disabled", "autocomplete", "maxlength"];
8047
- var _hoisted_15$3 = {
8042
+ var _hoisted_13$4 = ["id", "name", "placeholder", "type", "readonly", "tabindex", "disabled", "autocomplete", "maxlength"];
8043
+ var _hoisted_14$4 = {
8048
8044
  key: 1,
8049
8045
  "class": "flex text-black absolute w-10 h-full inset-y-0 right-0 items-center pr-3"
8050
8046
  };
8051
- var _hoisted_16$2 = {
8047
+ var _hoisted_15$3 = {
8052
8048
  key: 0,
8053
8049
  "class": "text-left text-p-small mt-2 min-h-[21px]"
8054
8050
  };
8055
- var _hoisted_17$2 = {
8051
+ var _hoisted_16$2 = {
8056
8052
  key: 0,
8057
8053
  "class": "text-brand-error-text"
8058
8054
  };
8059
- var _hoisted_18$1 = {
8055
+ var _hoisted_17$2 = {
8060
8056
  key: 1,
8061
8057
  "class": "text-brand-text2"
8062
8058
  };
@@ -8085,9 +8081,15 @@ function render$u(_ctx, _cache, $props, $setup, $data, $options) {
8085
8081
  key: 0,
8086
8082
  "for": _ctx.inputId || "fw-input-".concat(_ctx.name),
8087
8083
  "class": vue.normalizeClass([[(errorMessage || errors[0]) && meta.touched || _ctx.invalidate ? 'text-brand-error-text' : 'text-brand-text2'], "block mb-2 text-base"])
8088
- }, [vue.createTextVNode(vue.toDisplayString(_ctx.label) + " ", 1), _ctx.required ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5$f, "*")) : vue.createCommentVNode("", true)], 10, _hoisted_4$g)) : vue.createCommentVNode("", true), _ctx.$slots.action ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$d, [vue.renderSlot(_ctx.$slots, "action")])) : vue.createCommentVNode("", true)]), vue.createElementVNode("div", _hoisted_7$a, [_ctx.enableTags && _ctx.tags ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$9, [_ctx.$slots.prefix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9$8, [vue.renderSlot(_ctx.$slots, "prefix", {
8084
+ }, [vue.createTextVNode(vue.toDisplayString(_ctx.label) + " ", 1), _ctx.required ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5$f, "*")) : vue.createCommentVNode("", true)], 10, _hoisted_4$g)) : vue.createCommentVNode("", true), _ctx.$slots.action ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$d, [vue.renderSlot(_ctx.$slots, "action")])) : vue.createCommentVNode("", true)]), vue.createElementVNode("div", _hoisted_7$a, [_ctx.enableTags && _ctx.tags ? (vue.openBlock(), vue.createElementBlock("div", {
8085
+ key: 0,
8086
+ "class": vue.normalizeClass([{
8087
+ 'pl-10': !!_ctx.$slots.prefix,
8088
+ 'pr-20': !!_ctx.$slots.suffix
8089
+ }, (errorMessage || errors[0]) && meta.touched || _ctx.invalidate ? 'input--error-state border-brand-error-text caret-brand-error-text' : 'caret-primary bg-white border-grey-100 hover:border-brand-text3 focus:border-brand-text3', _ctx.inputBaseClass, _ctx.rounded ? 'rounded-full' : 'rounded-lg', _ctx.inputClass, 'fw-input__tagged'])
8090
+ }, [_ctx.$slots.prefix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$9, [vue.renderSlot(_ctx.$slots, "prefix", {
8089
8091
  "class": "h-full"
8090
- })])) : vue.createCommentVNode("", true), vue.createElementVNode("div", _hoisted_10$6, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.tags, function (tag) {
8092
+ })])) : vue.createCommentVNode("", true), vue.createElementVNode("div", _hoisted_9$8, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.tags, function (tag) {
8091
8093
  return vue.openBlock(), vue.createBlock(_component_FwTag, {
8092
8094
  key: tag.id,
8093
8095
  label: tag.name,
@@ -8108,6 +8110,7 @@ function render$u(_ctx, _cache, $props, $setup, $data, $options) {
8108
8110
  tabindex: _ctx.tabindex,
8109
8111
  disabled: _ctx.readonly,
8110
8112
  autocomplete: _ctx.autocomplete,
8113
+ placeholder: _ctx.placeholder,
8111
8114
  maxlength: _ctx.maxLength,
8112
8115
  "class": "border-none outline-none !bg-transparent flex-grow pl-1",
8113
8116
  onFocus: _cache[0] || (_cache[0] = function () {
@@ -8116,11 +8119,11 @@ function render$u(_ctx, _cache, $props, $setup, $data, $options) {
8116
8119
  onBlur: _cache[1] || (_cache[1] = function () {
8117
8120
  return _ctx.onBlur && _ctx.onBlur.apply(_ctx, arguments);
8118
8121
  })
8119
- }), null, 16, _hoisted_11$5)]), _ctx.$slots.suffix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$4, [vue.renderSlot(_ctx.$slots, "suffix", {
8122
+ }), null, 16, _hoisted_10$6)]), _ctx.$slots.suffix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_11$5, [vue.renderSlot(_ctx.$slots, "suffix", {
8120
8123
  "class": "h-full"
8121
- })])) : vue.createCommentVNode("", true)])) : vue.createCommentVNode("", true), !_ctx.enableTags ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
8124
+ })])) : vue.createCommentVNode("", true)], 2)) : vue.createCommentVNode("", true), !_ctx.enableTags ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
8122
8125
  key: 1
8123
- }, [_ctx.$slots.prefix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_13$4, [vue.renderSlot(_ctx.$slots, "prefix", {
8126
+ }, [_ctx.$slots.prefix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$4, [vue.renderSlot(_ctx.$slots, "prefix", {
8124
8127
  "class": "h-full"
8125
8128
  })])) : vue.createCommentVNode("", true), vue.createElementVNode("input", vue.mergeProps(field, {
8126
8129
  id: _ctx.inputId || "fw-input-".concat(_ctx.name),
@@ -8142,22 +8145,22 @@ function render$u(_ctx, _cache, $props, $setup, $data, $options) {
8142
8145
  onBlur: _cache[3] || (_cache[3] = function () {
8143
8146
  return _ctx.onBlur && _ctx.onBlur.apply(_ctx, arguments);
8144
8147
  })
8145
- }), null, 16, _hoisted_14$4), _ctx.$slots.suffix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_15$3, [vue.renderSlot(_ctx.$slots, "suffix", {
8148
+ }), null, 16, _hoisted_13$4), _ctx.$slots.suffix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$4, [vue.renderSlot(_ctx.$slots, "suffix", {
8146
8149
  "class": "h-full"
8147
- })])) : vue.createCommentVNode("", true)], 64)) : vue.createCommentVNode("", true)]), _ctx.enableErrors ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_16$2, [vue.createVNode(vue.Transition, {
8150
+ })])) : vue.createCommentVNode("", true)], 64)) : vue.createCommentVNode("", true)]), _ctx.enableErrors ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_15$3, [vue.createVNode(vue.Transition, {
8148
8151
  name: "fwFadeIn",
8149
8152
  mode: "out-in"
8150
8153
  }, {
8151
8154
  "default": vue.withCtx(function () {
8152
- return [(errorMessage || errors[0]) && meta.touched ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_17$2, vue.toDisplayString(errorMessage || errors[0]), 1)) : _ctx.hint ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_18$1, vue.toDisplayString(_ctx.hint), 1)) : vue.createCommentVNode("", true)];
8155
+ return [(errorMessage || errors[0]) && meta.touched ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_16$2, vue.toDisplayString(errorMessage || errors[0]), 1)) : _ctx.hint ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_17$2, vue.toDisplayString(_ctx.hint), 1)) : vue.createCommentVNode("", true)];
8153
8156
  }),
8154
8157
  _: 2
8155
8158
  }, 1024)])) : vue.createCommentVNode("", true)])];
8156
8159
  }),
8157
8160
  _: 3
8158
8161
  }, 8, ["modelValue", "tags", "name", "rules"])]);
8159
- }var css_248z$n = ".fwFadeIn-enter-active,.fwFadeIn-leave-active{-webkit-transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,-webkit-transform .12s ease;-moz-transition:opacity .12s ease,transform .12s ease,-moz-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease,-moz-transform .12s ease;will-change:opacity,transform}.fwFadeIn-enter-from,.fwFadeIn-leave-to{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}.fw-input input:focus{background-color:var(--v221768dc)}.fw-input input.input--error-state{background-color:var(--v0b83798c)}";
8160
- var stylesheet$n = ".fwFadeIn-enter-active,.fwFadeIn-leave-active{-webkit-transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,-webkit-transform .12s ease;-moz-transition:opacity .12s ease,transform .12s ease,-moz-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease,-moz-transform .12s ease;will-change:opacity,transform}.fwFadeIn-enter-from,.fwFadeIn-leave-to{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}.fw-input input:focus{background-color:var(--v221768dc)}.fw-input input.input--error-state{background-color:var(--v0b83798c)}";
8162
+ }var css_248z$n = ".fwFadeIn-enter-active,.fwFadeIn-leave-active{-webkit-transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,-webkit-transform .12s ease;-moz-transition:opacity .12s ease,transform .12s ease,-moz-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease,-moz-transform .12s ease;will-change:opacity,transform}.fwFadeIn-enter-from,.fwFadeIn-leave-to{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}.fw-input input:focus{background-color:var(--v027ca7bd)}.fw-input input.input--error-state{background-color:var(--v6423b1fe)}.fw-input__tagged:focus-within{background-color:var(--v027ca7bd)}.fw-input__tagged.input--error-state{background-color:var(--v6423b1fe)}";
8163
+ var stylesheet$n = ".fwFadeIn-enter-active,.fwFadeIn-leave-active{-webkit-transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,-webkit-transform .12s ease;-moz-transition:opacity .12s ease,transform .12s ease,-moz-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease,-moz-transform .12s ease;will-change:opacity,transform}.fwFadeIn-enter-from,.fwFadeIn-leave-to{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}.fw-input input:focus{background-color:var(--v027ca7bd)}.fw-input input.input--error-state{background-color:var(--v6423b1fe)}.fw-input__tagged:focus-within{background-color:var(--v027ca7bd)}.fw-input__tagged.input--error-state{background-color:var(--v6423b1fe)}";
8161
8164
  styleInject(css_248z$n);__default__$f.render = render$u;/** Detect free variable `global` from Node.js. */
8162
8165
  var freeGlobal$2 = typeof global == 'object' && global && global.Object === Object && global;/** Detect free variable `self`. */
8163
8166
  var freeSelf$1 = typeof self == 'object' && self && self.Object === Object && self;
@@ -8478,6 +8481,13 @@ function uniqueId(prefix) {
8478
8481
  inputId: {
8479
8482
  type: String,
8480
8483
  required: false
8484
+ },
8485
+ /**
8486
+ * Whether the checkbox is disabled or not.
8487
+ */
8488
+ disabled: {
8489
+ type: Boolean,
8490
+ "default": false
8481
8491
  }
8482
8492
  },
8483
8493
  setup: function setup() {
@@ -8485,17 +8495,19 @@ function uniqueId(prefix) {
8485
8495
  var _useColours = useColours(),
8486
8496
  primaryFade5 = _useColours.primaryFade5,
8487
8497
  colorErrorTextFade5 = _useColours.colorErrorTextFade5;
8498
+ var checkboxBaseClass = 'w-6 h-6 cursor-pointer border-brand-text2 border rounded';
8488
8499
  return {
8489
8500
  uuid: uuid,
8490
8501
  primaryFade5: primaryFade5,
8491
- colorErrorTextFade5: colorErrorTextFade5
8502
+ colorErrorTextFade5: colorErrorTextFade5,
8503
+ checkboxBaseClass: checkboxBaseClass
8492
8504
  };
8493
8505
  }
8494
8506
  });
8495
8507
  var __injectCSSVars__$a = function __injectCSSVars__() {
8496
8508
  vue.useCssVars(function (_ctx) {
8497
8509
  return {
8498
- "v96bda67e": _ctx.primaryFade5
8510
+ "v242a63d2": _ctx.primaryFade5
8499
8511
  };
8500
8512
  });
8501
8513
  };
@@ -8510,8 +8522,8 @@ var _hoisted_2$w = {
8510
8522
  "class": "flex flex-col"
8511
8523
  };
8512
8524
  var _hoisted_3$q = ["for"];
8513
- var _hoisted_4$f = ["id", "value", "name"];
8514
- var _hoisted_5$e = ["id", "value", "name", "checked"];
8525
+ var _hoisted_4$f = ["id", "value", "name", "disabled"];
8526
+ var _hoisted_5$e = ["id", "value", "name", "disabled", "checked"];
8515
8527
  var _hoisted_6$c = ["innerHTML"];
8516
8528
  var _hoisted_7$9 = {
8517
8529
  key: 0,
@@ -8548,7 +8560,8 @@ function render$t(_ctx, _cache, $props, $setup, $data, $options) {
8548
8560
  value: _ctx.value ? _ctx.value : _ctx.name,
8549
8561
  name: _ctx.disableNamePrefix ? _ctx.name : "fw-checkbox-".concat(_ctx.name, "-").concat(_ctx.uuid),
8550
8562
  type: "checkbox",
8551
- "class": "bg-white w-6 h-6 cursor-pointer border-brand-text2 border rounded"
8563
+ disabled: _ctx.disabled,
8564
+ "class": [_ctx.checkboxBaseClass, _ctx.disabled ? 'bg-grey-60' : 'bg-white']
8552
8565
  }), null, 16, _hoisted_4$f)) : (vue.openBlock(), vue.createElementBlock("input", vue.mergeProps({
8553
8566
  key: 1
8554
8567
  }, field, {
@@ -8556,8 +8569,9 @@ function render$t(_ctx, _cache, $props, $setup, $data, $options) {
8556
8569
  value: _ctx.value ? _ctx.value : _ctx.name,
8557
8570
  name: _ctx.disableNamePrefix ? _ctx.name : "fw-checkbox-".concat(_ctx.name, "-").concat(_ctx.uuid),
8558
8571
  type: "checkbox",
8572
+ disabled: _ctx.disabled,
8559
8573
  checked: _ctx.isChecked,
8560
- "class": "bg-white w-6 h-6 cursor-pointer border-brand-text2 border rounded"
8574
+ "class": [_ctx.checkboxBaseClass, _ctx.disabled ? 'bg-grey-60' : 'bg-white']
8561
8575
  }), null, 16, _hoisted_5$e)), _ctx.label ? (vue.openBlock(), vue.createElementBlock("span", {
8562
8576
  key: 2,
8563
8577
  "class": "ml-2 text-p text-body",
@@ -8574,10 +8588,10 @@ function render$t(_ctx, _cache, $props, $setup, $data, $options) {
8574
8588
  }),
8575
8589
  _: 1
8576
8590
  }, 8, ["name", "value", "rules"])]);
8577
- }var css_248z$m = ".fwFadeIn-enter-active[data-v-5e61228a],.fwFadeIn-leave-active[data-v-5e61228a]{-webkit-transition:opacity .35s ease;-moz-transition:opacity .35s ease;transition:opacity .35s ease}.fwFadeIn-enter-from[data-v-5e61228a],.fwFadeIn-leave-to[data-v-5e61228a]{opacity:0}.fwFadeIn-enter-to[data-v-5e61228a],.fwFadeIn-leave-from[data-v-5e61228a]{opacity:1}.fw-checkbox input[data-v-5e61228a]{-ms-flex-negative:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-origin:border-box;background-size:60% 100%;display:inline-block;-webkit-flex-shrink:0;flex-shrink:0;-webkit-transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;-moz-transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,-webkit-box-shadow .14s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.fw-checkbox input[data-v-5e61228a]:hover{background-color:var(--v96bda67e);border-color:var(--colorPrimary)}.fw-checkbox input[data-v-5e61228a]:checked{background-color:var(--colorPrimary);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%23F7F7F7'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:var(--colorPrimary)}";
8578
- var stylesheet$m = ".fwFadeIn-enter-active[data-v-5e61228a],.fwFadeIn-leave-active[data-v-5e61228a]{-webkit-transition:opacity .35s ease;-moz-transition:opacity .35s ease;transition:opacity .35s ease}.fwFadeIn-enter-from[data-v-5e61228a],.fwFadeIn-leave-to[data-v-5e61228a]{opacity:0}.fwFadeIn-enter-to[data-v-5e61228a],.fwFadeIn-leave-from[data-v-5e61228a]{opacity:1}.fw-checkbox input[data-v-5e61228a]{-ms-flex-negative:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-origin:border-box;background-size:60% 100%;display:inline-block;-webkit-flex-shrink:0;flex-shrink:0;-webkit-transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;-moz-transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,-webkit-box-shadow .14s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.fw-checkbox input[data-v-5e61228a]:hover{background-color:var(--v96bda67e);border-color:var(--colorPrimary)}.fw-checkbox input[data-v-5e61228a]:checked{background-color:var(--colorPrimary);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%23F7F7F7'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:var(--colorPrimary)}";
8591
+ }var css_248z$m = ".fwFadeIn-enter-active[data-v-2ee5b97b],.fwFadeIn-leave-active[data-v-2ee5b97b]{-webkit-transition:opacity .35s ease;-moz-transition:opacity .35s ease;transition:opacity .35s ease}.fwFadeIn-enter-from[data-v-2ee5b97b],.fwFadeIn-leave-to[data-v-2ee5b97b]{opacity:0}.fwFadeIn-enter-to[data-v-2ee5b97b],.fwFadeIn-leave-from[data-v-2ee5b97b]{opacity:1}.fw-checkbox input[data-v-2ee5b97b]{-ms-flex-negative:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-origin:border-box;background-size:60% 100%;display:inline-block;-webkit-flex-shrink:0;flex-shrink:0;-webkit-transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;-moz-transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,-webkit-box-shadow .14s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.fw-checkbox input[data-v-2ee5b97b]:hover{background-color:var(--v242a63d2);border-color:var(--colorPrimary)}.fw-checkbox input[data-v-2ee5b97b]:checked{background-color:var(--colorPrimary);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%23F7F7F7'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:var(--colorPrimary)}.fw-checkbox input[data-v-2ee5b97b]:disabled{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(222 224 227/var(--tw-bg-opacity));background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%235F6489'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:rgb(222 224 227/var(--tw-border-opacity))}.fw-checkbox input[data-v-2ee5b97b]:disabled:not(:checked){background-image:none}";
8592
+ var stylesheet$m = ".fwFadeIn-enter-active[data-v-2ee5b97b],.fwFadeIn-leave-active[data-v-2ee5b97b]{-webkit-transition:opacity .35s ease;-moz-transition:opacity .35s ease;transition:opacity .35s ease}.fwFadeIn-enter-from[data-v-2ee5b97b],.fwFadeIn-leave-to[data-v-2ee5b97b]{opacity:0}.fwFadeIn-enter-to[data-v-2ee5b97b],.fwFadeIn-leave-from[data-v-2ee5b97b]{opacity:1}.fw-checkbox input[data-v-2ee5b97b]{-ms-flex-negative:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-origin:border-box;background-size:60% 100%;display:inline-block;-webkit-flex-shrink:0;flex-shrink:0;-webkit-transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;-moz-transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,-webkit-box-shadow .14s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.fw-checkbox input[data-v-2ee5b97b]:hover{background-color:var(--v242a63d2);border-color:var(--colorPrimary)}.fw-checkbox input[data-v-2ee5b97b]:checked{background-color:var(--colorPrimary);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%23F7F7F7'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:var(--colorPrimary)}.fw-checkbox input[data-v-2ee5b97b]:disabled{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(222 224 227/var(--tw-bg-opacity));background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%235F6489'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:rgb(222 224 227/var(--tw-border-opacity))}.fw-checkbox input[data-v-2ee5b97b]:disabled:not(:checked){background-image:none}";
8579
8593
  styleInject(css_248z$m);__default__$e.render = render$t;
8580
- __default__$e.__scopeId = "data-v-5e61228a";var stateMap = new WeakMap();
8594
+ __default__$e.__scopeId = "data-v-2ee5b97b";var stateMap = new WeakMap();
8581
8595
  function getState(el) {
8582
8596
  var s = stateMap.get(el);
8583
8597
  if (!s) {
@@ -72,6 +72,13 @@ var __default__ = defineComponent({
72
72
  inputId: {
73
73
  type: String,
74
74
  required: false
75
+ },
76
+ /**
77
+ * Whether the checkbox is disabled or not.
78
+ */
79
+ disabled: {
80
+ type: Boolean,
81
+ "default": false
75
82
  }
76
83
  },
77
84
  setup: function setup() {
@@ -79,17 +86,19 @@ var __default__ = defineComponent({
79
86
  var _useColours = useColours(),
80
87
  primaryFade5 = _useColours.primaryFade5,
81
88
  colorErrorTextFade5 = _useColours.colorErrorTextFade5;
89
+ var checkboxBaseClass = 'w-6 h-6 cursor-pointer border-brand-text2 border rounded';
82
90
  return {
83
91
  uuid: uuid,
84
92
  primaryFade5: primaryFade5,
85
- colorErrorTextFade5: colorErrorTextFade5
93
+ colorErrorTextFade5: colorErrorTextFade5,
94
+ checkboxBaseClass: checkboxBaseClass
86
95
  };
87
96
  }
88
97
  });
89
98
  var __injectCSSVars__ = function __injectCSSVars__() {
90
99
  useCssVars(function (_ctx) {
91
100
  return {
92
- "v96bda67e": _ctx.primaryFade5
101
+ "v242a63d2": _ctx.primaryFade5
93
102
  };
94
103
  });
95
104
  };
@@ -106,8 +115,8 @@ var _hoisted_2 = {
106
115
  "class": "flex flex-col"
107
116
  };
108
117
  var _hoisted_3 = ["for"];
109
- var _hoisted_4 = ["id", "value", "name"];
110
- var _hoisted_5 = ["id", "value", "name", "checked"];
118
+ var _hoisted_4 = ["id", "value", "name", "disabled"];
119
+ var _hoisted_5 = ["id", "value", "name", "disabled", "checked"];
111
120
  var _hoisted_6 = ["innerHTML"];
112
121
  var _hoisted_7 = {
113
122
  key: 0,
@@ -144,7 +153,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
144
153
  value: _ctx.value ? _ctx.value : _ctx.name,
145
154
  name: _ctx.disableNamePrefix ? _ctx.name : "fw-checkbox-".concat(_ctx.name, "-").concat(_ctx.uuid),
146
155
  type: "checkbox",
147
- "class": "bg-white w-6 h-6 cursor-pointer border-brand-text2 border rounded"
156
+ disabled: _ctx.disabled,
157
+ "class": [_ctx.checkboxBaseClass, _ctx.disabled ? 'bg-grey-60' : 'bg-white']
148
158
  }), null, 16, _hoisted_4)) : (openBlock(), createElementBlock("input", mergeProps({
149
159
  key: 1
150
160
  }, field, {
@@ -152,8 +162,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
152
162
  value: _ctx.value ? _ctx.value : _ctx.name,
153
163
  name: _ctx.disableNamePrefix ? _ctx.name : "fw-checkbox-".concat(_ctx.name, "-").concat(_ctx.uuid),
154
164
  type: "checkbox",
165
+ disabled: _ctx.disabled,
155
166
  checked: _ctx.isChecked,
156
- "class": "bg-white w-6 h-6 cursor-pointer border-brand-text2 border rounded"
167
+ "class": [_ctx.checkboxBaseClass, _ctx.disabled ? 'bg-grey-60' : 'bg-white']
157
168
  }), null, 16, _hoisted_5)), _ctx.label ? (openBlock(), createElementBlock("span", {
158
169
  key: 2,
159
170
  "class": "ml-2 text-p text-body",
@@ -172,11 +183,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
172
183
  }, 8, ["name", "value", "rules"])]);
173
184
  }
174
185
 
175
- var css_248z = ".fwFadeIn-enter-active[data-v-5e61228a],.fwFadeIn-leave-active[data-v-5e61228a]{-webkit-transition:opacity .35s ease;-moz-transition:opacity .35s ease;transition:opacity .35s ease}.fwFadeIn-enter-from[data-v-5e61228a],.fwFadeIn-leave-to[data-v-5e61228a]{opacity:0}.fwFadeIn-enter-to[data-v-5e61228a],.fwFadeIn-leave-from[data-v-5e61228a]{opacity:1}.fw-checkbox input[data-v-5e61228a]{-ms-flex-negative:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-origin:border-box;background-size:60% 100%;display:inline-block;-webkit-flex-shrink:0;flex-shrink:0;-webkit-transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;-moz-transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,-webkit-box-shadow .14s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.fw-checkbox input[data-v-5e61228a]:hover{background-color:var(--v96bda67e);border-color:var(--colorPrimary)}.fw-checkbox input[data-v-5e61228a]:checked{background-color:var(--colorPrimary);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%23F7F7F7'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:var(--colorPrimary)}";
176
- var stylesheet = ".fwFadeIn-enter-active[data-v-5e61228a],.fwFadeIn-leave-active[data-v-5e61228a]{-webkit-transition:opacity .35s ease;-moz-transition:opacity .35s ease;transition:opacity .35s ease}.fwFadeIn-enter-from[data-v-5e61228a],.fwFadeIn-leave-to[data-v-5e61228a]{opacity:0}.fwFadeIn-enter-to[data-v-5e61228a],.fwFadeIn-leave-from[data-v-5e61228a]{opacity:1}.fw-checkbox input[data-v-5e61228a]{-ms-flex-negative:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-origin:border-box;background-size:60% 100%;display:inline-block;-webkit-flex-shrink:0;flex-shrink:0;-webkit-transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;-moz-transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,-webkit-box-shadow .14s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.fw-checkbox input[data-v-5e61228a]:hover{background-color:var(--v96bda67e);border-color:var(--colorPrimary)}.fw-checkbox input[data-v-5e61228a]:checked{background-color:var(--colorPrimary);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%23F7F7F7'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:var(--colorPrimary)}";
186
+ var css_248z = ".fwFadeIn-enter-active[data-v-2ee5b97b],.fwFadeIn-leave-active[data-v-2ee5b97b]{-webkit-transition:opacity .35s ease;-moz-transition:opacity .35s ease;transition:opacity .35s ease}.fwFadeIn-enter-from[data-v-2ee5b97b],.fwFadeIn-leave-to[data-v-2ee5b97b]{opacity:0}.fwFadeIn-enter-to[data-v-2ee5b97b],.fwFadeIn-leave-from[data-v-2ee5b97b]{opacity:1}.fw-checkbox input[data-v-2ee5b97b]{-ms-flex-negative:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-origin:border-box;background-size:60% 100%;display:inline-block;-webkit-flex-shrink:0;flex-shrink:0;-webkit-transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;-moz-transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,-webkit-box-shadow .14s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.fw-checkbox input[data-v-2ee5b97b]:hover{background-color:var(--v242a63d2);border-color:var(--colorPrimary)}.fw-checkbox input[data-v-2ee5b97b]:checked{background-color:var(--colorPrimary);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%23F7F7F7'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:var(--colorPrimary)}.fw-checkbox input[data-v-2ee5b97b]:disabled{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(222 224 227/var(--tw-bg-opacity));background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%235F6489'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:rgb(222 224 227/var(--tw-border-opacity))}.fw-checkbox input[data-v-2ee5b97b]:disabled:not(:checked){background-image:none}";
187
+ var stylesheet = ".fwFadeIn-enter-active[data-v-2ee5b97b],.fwFadeIn-leave-active[data-v-2ee5b97b]{-webkit-transition:opacity .35s ease;-moz-transition:opacity .35s ease;transition:opacity .35s ease}.fwFadeIn-enter-from[data-v-2ee5b97b],.fwFadeIn-leave-to[data-v-2ee5b97b]{opacity:0}.fwFadeIn-enter-to[data-v-2ee5b97b],.fwFadeIn-leave-from[data-v-2ee5b97b]{opacity:1}.fw-checkbox input[data-v-2ee5b97b]{-ms-flex-negative:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-origin:border-box;background-size:60% 100%;display:inline-block;-webkit-flex-shrink:0;flex-shrink:0;-webkit-transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,-webkit-box-shadow .14s ease;-moz-transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,-webkit-box-shadow .14s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle}.fw-checkbox input[data-v-2ee5b97b]:hover{background-color:var(--v242a63d2);border-color:var(--colorPrimary)}.fw-checkbox input[data-v-2ee5b97b]:checked{background-color:var(--colorPrimary);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%23F7F7F7'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:var(--colorPrimary)}.fw-checkbox input[data-v-2ee5b97b]:disabled{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(222 224 227/var(--tw-bg-opacity));background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.753.219c.319.294.319.769 0 1.034l-8.25 8.25c-.266.319-.74.319-1.034 0l-4.25-4.25c-.292-.265-.292-.74 0-1.034a.754.754 0 0 1 1.061 0L5 7.94 12.719.219c.293-.292.769-.292 1.034 0Z' fill='%235F6489'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:60%;border-color:rgb(222 224 227/var(--tw-border-opacity))}.fw-checkbox input[data-v-2ee5b97b]:disabled:not(:checked){background-image:none}";
177
188
  styleInject(css_248z);
178
189
 
179
190
  __default__.render = render;
180
- __default__.__scopeId = "data-v-5e61228a";
191
+ __default__.__scopeId = "data-v-2ee5b97b";
181
192
 
182
193
  export { __default__ as FwCheckbox };
@@ -204,8 +204,8 @@ var __default__ = defineComponent({
204
204
  var __injectCSSVars__ = function __injectCSSVars__() {
205
205
  useCssVars(function (_ctx) {
206
206
  return {
207
- "v221768dc": _ctx.primaryFade5,
208
- "v0b83798c": _ctx.colorErrorTextFade5
207
+ "v027ca7bd": _ctx.primaryFade5,
208
+ "v6423b1fe": _ctx.colorErrorTextFade5
209
209
  };
210
210
  });
211
211
  };
@@ -236,39 +236,35 @@ var _hoisted_7 = {
236
236
  "class": "relative"
237
237
  };
238
238
  var _hoisted_8 = {
239
- key: 0,
240
- "class": "border border-grey-100 bg-white rounded-lg p-3"
241
- };
242
- var _hoisted_9 = {
243
239
  key: 0,
244
240
  "class": "flex text-body absolute w-9 h-full inset-y-0 left-0 items-center pl-3 pointer-events-none"
245
241
  };
246
- var _hoisted_10 = {
247
- "class": "pl-9 flex flex-row items-center flex-wrap"
242
+ var _hoisted_9 = {
243
+ "class": "flex flex-row items-center flex-wrap"
248
244
  };
249
- var _hoisted_11 = ["id", "name", "type", "readonly", "tabindex", "disabled", "autocomplete", "maxlength"];
250
- var _hoisted_12 = {
245
+ var _hoisted_10 = ["id", "name", "type", "readonly", "tabindex", "disabled", "autocomplete", "placeholder", "maxlength"];
246
+ var _hoisted_11 = {
251
247
  key: 1,
252
248
  "class": "flex text-black absolute w-10 h-full inset-y-0 right-0 items-center pr-3"
253
249
  };
254
- var _hoisted_13 = {
250
+ var _hoisted_12 = {
255
251
  key: 0,
256
252
  "class": "flex text-body absolute w-9 h-full inset-y-0 left-0 items-center pl-3 pointer-events-none"
257
253
  };
258
- var _hoisted_14 = ["id", "name", "placeholder", "type", "readonly", "tabindex", "disabled", "autocomplete", "maxlength"];
259
- var _hoisted_15 = {
254
+ var _hoisted_13 = ["id", "name", "placeholder", "type", "readonly", "tabindex", "disabled", "autocomplete", "maxlength"];
255
+ var _hoisted_14 = {
260
256
  key: 1,
261
257
  "class": "flex text-black absolute w-10 h-full inset-y-0 right-0 items-center pr-3"
262
258
  };
263
- var _hoisted_16 = {
259
+ var _hoisted_15 = {
264
260
  key: 0,
265
261
  "class": "text-left text-p-small mt-2 min-h-[21px]"
266
262
  };
267
- var _hoisted_17 = {
263
+ var _hoisted_16 = {
268
264
  key: 0,
269
265
  "class": "text-brand-error-text"
270
266
  };
271
- var _hoisted_18 = {
267
+ var _hoisted_17 = {
272
268
  key: 1,
273
269
  "class": "text-brand-text2"
274
270
  };
@@ -297,9 +293,15 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
297
293
  key: 0,
298
294
  "for": _ctx.inputId || "fw-input-".concat(_ctx.name),
299
295
  "class": normalizeClass([[(errorMessage || errors[0]) && meta.touched || _ctx.invalidate ? 'text-brand-error-text' : 'text-brand-text2'], "block mb-2 text-base"])
300
- }, [createTextVNode(toDisplayString(_ctx.label) + " ", 1), _ctx.required ? (openBlock(), createElementBlock("span", _hoisted_5, "*")) : createCommentVNode("", true)], 10, _hoisted_4)) : createCommentVNode("", true), _ctx.$slots.action ? (openBlock(), createElementBlock("div", _hoisted_6, [renderSlot(_ctx.$slots, "action")])) : createCommentVNode("", true)]), createElementVNode("div", _hoisted_7, [_ctx.enableTags && _ctx.tags ? (openBlock(), createElementBlock("div", _hoisted_8, [_ctx.$slots.prefix ? (openBlock(), createElementBlock("div", _hoisted_9, [renderSlot(_ctx.$slots, "prefix", {
296
+ }, [createTextVNode(toDisplayString(_ctx.label) + " ", 1), _ctx.required ? (openBlock(), createElementBlock("span", _hoisted_5, "*")) : createCommentVNode("", true)], 10, _hoisted_4)) : createCommentVNode("", true), _ctx.$slots.action ? (openBlock(), createElementBlock("div", _hoisted_6, [renderSlot(_ctx.$slots, "action")])) : createCommentVNode("", true)]), createElementVNode("div", _hoisted_7, [_ctx.enableTags && _ctx.tags ? (openBlock(), createElementBlock("div", {
297
+ key: 0,
298
+ "class": normalizeClass([{
299
+ 'pl-10': !!_ctx.$slots.prefix,
300
+ 'pr-20': !!_ctx.$slots.suffix
301
+ }, (errorMessage || errors[0]) && meta.touched || _ctx.invalidate ? 'input--error-state border-brand-error-text caret-brand-error-text' : 'caret-primary bg-white border-grey-100 hover:border-brand-text3 focus:border-brand-text3', _ctx.inputBaseClass, _ctx.rounded ? 'rounded-full' : 'rounded-lg', _ctx.inputClass, 'fw-input__tagged'])
302
+ }, [_ctx.$slots.prefix ? (openBlock(), createElementBlock("div", _hoisted_8, [renderSlot(_ctx.$slots, "prefix", {
301
303
  "class": "h-full"
302
- })])) : createCommentVNode("", true), createElementVNode("div", _hoisted_10, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.tags, function (tag) {
304
+ })])) : createCommentVNode("", true), createElementVNode("div", _hoisted_9, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.tags, function (tag) {
303
305
  return openBlock(), createBlock(_component_FwTag, {
304
306
  key: tag.id,
305
307
  label: tag.name,
@@ -320,6 +322,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
320
322
  tabindex: _ctx.tabindex,
321
323
  disabled: _ctx.readonly,
322
324
  autocomplete: _ctx.autocomplete,
325
+ placeholder: _ctx.placeholder,
323
326
  maxlength: _ctx.maxLength,
324
327
  "class": "border-none outline-none !bg-transparent flex-grow pl-1",
325
328
  onFocus: _cache[0] || (_cache[0] = function () {
@@ -328,11 +331,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
328
331
  onBlur: _cache[1] || (_cache[1] = function () {
329
332
  return _ctx.onBlur && _ctx.onBlur.apply(_ctx, arguments);
330
333
  })
331
- }), null, 16, _hoisted_11)]), _ctx.$slots.suffix ? (openBlock(), createElementBlock("div", _hoisted_12, [renderSlot(_ctx.$slots, "suffix", {
334
+ }), null, 16, _hoisted_10)]), _ctx.$slots.suffix ? (openBlock(), createElementBlock("div", _hoisted_11, [renderSlot(_ctx.$slots, "suffix", {
332
335
  "class": "h-full"
333
- })])) : createCommentVNode("", true)])) : createCommentVNode("", true), !_ctx.enableTags ? (openBlock(), createElementBlock(Fragment, {
336
+ })])) : createCommentVNode("", true)], 2)) : createCommentVNode("", true), !_ctx.enableTags ? (openBlock(), createElementBlock(Fragment, {
334
337
  key: 1
335
- }, [_ctx.$slots.prefix ? (openBlock(), createElementBlock("div", _hoisted_13, [renderSlot(_ctx.$slots, "prefix", {
338
+ }, [_ctx.$slots.prefix ? (openBlock(), createElementBlock("div", _hoisted_12, [renderSlot(_ctx.$slots, "prefix", {
336
339
  "class": "h-full"
337
340
  })])) : createCommentVNode("", true), createElementVNode("input", mergeProps(field, {
338
341
  id: _ctx.inputId || "fw-input-".concat(_ctx.name),
@@ -354,14 +357,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
354
357
  onBlur: _cache[3] || (_cache[3] = function () {
355
358
  return _ctx.onBlur && _ctx.onBlur.apply(_ctx, arguments);
356
359
  })
357
- }), null, 16, _hoisted_14), _ctx.$slots.suffix ? (openBlock(), createElementBlock("div", _hoisted_15, [renderSlot(_ctx.$slots, "suffix", {
360
+ }), null, 16, _hoisted_13), _ctx.$slots.suffix ? (openBlock(), createElementBlock("div", _hoisted_14, [renderSlot(_ctx.$slots, "suffix", {
358
361
  "class": "h-full"
359
- })])) : createCommentVNode("", true)], 64)) : createCommentVNode("", true)]), _ctx.enableErrors ? (openBlock(), createElementBlock("div", _hoisted_16, [createVNode(Transition, {
362
+ })])) : createCommentVNode("", true)], 64)) : createCommentVNode("", true)]), _ctx.enableErrors ? (openBlock(), createElementBlock("div", _hoisted_15, [createVNode(Transition, {
360
363
  name: "fwFadeIn",
361
364
  mode: "out-in"
362
365
  }, {
363
366
  "default": withCtx(function () {
364
- return [(errorMessage || errors[0]) && meta.touched ? (openBlock(), createElementBlock("span", _hoisted_17, toDisplayString(errorMessage || errors[0]), 1)) : _ctx.hint ? (openBlock(), createElementBlock("span", _hoisted_18, toDisplayString(_ctx.hint), 1)) : createCommentVNode("", true)];
367
+ return [(errorMessage || errors[0]) && meta.touched ? (openBlock(), createElementBlock("span", _hoisted_16, toDisplayString(errorMessage || errors[0]), 1)) : _ctx.hint ? (openBlock(), createElementBlock("span", _hoisted_17, toDisplayString(_ctx.hint), 1)) : createCommentVNode("", true)];
365
368
  }),
366
369
  _: 2
367
370
  }, 1024)])) : createCommentVNode("", true)])];
@@ -370,8 +373,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
370
373
  }, 8, ["modelValue", "tags", "name", "rules"])]);
371
374
  }
372
375
 
373
- var css_248z = ".fwFadeIn-enter-active,.fwFadeIn-leave-active{-webkit-transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,-webkit-transform .12s ease;-moz-transition:opacity .12s ease,transform .12s ease,-moz-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease,-moz-transform .12s ease;will-change:opacity,transform}.fwFadeIn-enter-from,.fwFadeIn-leave-to{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}.fw-input input:focus{background-color:var(--v221768dc)}.fw-input input.input--error-state{background-color:var(--v0b83798c)}";
374
- var stylesheet = ".fwFadeIn-enter-active,.fwFadeIn-leave-active{-webkit-transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,-webkit-transform .12s ease;-moz-transition:opacity .12s ease,transform .12s ease,-moz-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease,-moz-transform .12s ease;will-change:opacity,transform}.fwFadeIn-enter-from,.fwFadeIn-leave-to{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}.fw-input input:focus{background-color:var(--v221768dc)}.fw-input input.input--error-state{background-color:var(--v0b83798c)}";
376
+ var css_248z = ".fwFadeIn-enter-active,.fwFadeIn-leave-active{-webkit-transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,-webkit-transform .12s ease;-moz-transition:opacity .12s ease,transform .12s ease,-moz-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease,-moz-transform .12s ease;will-change:opacity,transform}.fwFadeIn-enter-from,.fwFadeIn-leave-to{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}.fw-input input:focus{background-color:var(--v027ca7bd)}.fw-input input.input--error-state{background-color:var(--v6423b1fe)}.fw-input__tagged:focus-within{background-color:var(--v027ca7bd)}.fw-input__tagged.input--error-state{background-color:var(--v6423b1fe)}";
377
+ var stylesheet = ".fwFadeIn-enter-active,.fwFadeIn-leave-active{-webkit-transition:opacity .12s ease,-webkit-transform .12s ease;transition:opacity .12s ease,-webkit-transform .12s ease;-moz-transition:opacity .12s ease,transform .12s ease,-moz-transform .12s ease;transition:opacity .12s ease,transform .12s ease;transition:opacity .12s ease,transform .12s ease,-webkit-transform .12s ease,-moz-transform .12s ease;will-change:opacity,transform}.fwFadeIn-enter-from,.fwFadeIn-leave-to{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}.fw-input input:focus{background-color:var(--v027ca7bd)}.fw-input input.input--error-state{background-color:var(--v6423b1fe)}.fw-input__tagged:focus-within{background-color:var(--v027ca7bd)}.fw-input__tagged.input--error-state{background-color:var(--v6423b1fe)}";
375
378
  styleInject(css_248z);
376
379
 
377
380
  __default__.render = render;
package/esm/fw-input.js CHANGED
@@ -1,4 +1,4 @@
1
- export { _ as FwInput } from './fw-input-DTYzNw81.js';
1
+ export { _ as FwInput } from './fw-input-HqJer3qu.js';
2
2
  import 'vue';
3
3
  import './vee-validate-0dtT5GSQ.js';
4
4
  import './get-root-colours-DCCAnRF4.js';
@@ -1,7 +1,7 @@
1
1
  import { f as _createForOfIteratorHelper, e as _defineProperty, b as _toConsumableArray } from './_rollupPluginBabelHelpers-BKlDnZ7n.js';
2
2
  import { ref, watch, defineComponent, shallowRef, computed, useCssVars, resolveComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, createVNode, withCtx, createBlock, createCommentVNode, createTextVNode } from 'vue';
3
3
  import { a as script, s as script$1, _ as __default__$4 } from './fw-table-row-Be4_T3Ai.js';
4
- import { _ as __default__$3 } from './fw-input-DTYzNw81.js';
4
+ import { _ as __default__$3 } from './fw-input-HqJer3qu.js';
5
5
  import { FwTag as __default__$1 } from './fw-tag.js';
6
6
  import { s as script$2 } from './fw-button-ChYejNWD.js';
7
7
  import { _ as __default__$2 } from './fw-dropdown-UJDWtWjF.js';
package/esm/index.js CHANGED
@@ -33,7 +33,7 @@ import { _ as __default__$1 } from './fw-card-DJXjRPUR.js';
33
33
  import { _ as __default__$5 } from './fw-dropdown-UJDWtWjF.js';
34
34
  import { F as Form } from './vee-validate-0dtT5GSQ.js';
35
35
  import { _ as __default__$6 } from './fw-image-fzUvzmLv.js';
36
- import { _ as __default__$7 } from './fw-input-DTYzNw81.js';
36
+ import { _ as __default__$7 } from './fw-input-HqJer3qu.js';
37
37
  import { s as script$3 } from './fw-loading-bar-CPzE92BH.js';
38
38
  import { _ as __default__$9 } from './fw-popover-BFiv7Ich.js';
39
39
  import { _ as __default__$b, s as script$f, a as script$g } from './fw-table-row-Be4_T3Ai.js';