@justeattakeaway/pie-textarea 0.17.22 → 0.17.24

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/index.js CHANGED
@@ -10,7 +10,7 @@ const _ = class _ extends N {
10
10
  this.getAttribute("v") || this.setAttribute("v", _.v);
11
11
  }
12
12
  };
13
- _.v = "0.17.22";
13
+ _.v = "0.17.24";
14
14
  let w = _;
15
15
  var $ = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
16
16
  function ee(e) {
@@ -19,25 +19,25 @@ function ee(e) {
19
19
  var L = "Expected a function", M = NaN, te = "[object Symbol]", re = /^\s+|\s+$/g, ae = /^[-+]0x[0-9a-f]+$/i, ie = /^0b[01]+$/i, oe = /^0o[0-7]+$/i, ne = parseInt, se = typeof $ == "object" && $ && $.Object === Object && $, le = typeof self == "object" && self && self.Object === Object && self, de = se || le || Function("return this")(), ce = Object.prototype, ue = ce.toString, pe = Math.max, he = Math.min, W = function() {
20
20
  return de.Date.now();
21
21
  };
22
- function xe(e, t, r) {
23
- var n, a, p, l, d, h, f = 0, g = !1, v = !1, m = !0;
22
+ function fe(e, t, r) {
23
+ var n, a, p, l, d, h, x = 0, g = !1, v = !1, m = !0;
24
24
  if (typeof e != "function")
25
25
  throw new TypeError(L);
26
26
  t = D(t) || 0, T(r) && (g = !!r.leading, v = "maxWait" in r, p = v ? pe(D(r.maxWait) || 0, t) : p, m = "trailing" in r ? !!r.trailing : m);
27
27
  function C(i) {
28
- var x = n, y = a;
29
- return n = a = void 0, f = i, l = e.apply(y, x), l;
28
+ var f = n, y = a;
29
+ return n = a = void 0, x = i, l = e.apply(y, f), l;
30
30
  }
31
31
  function q(i) {
32
- return f = i, d = setTimeout(k, t), g ? C(i) : l;
32
+ return x = i, d = setTimeout(k, t), g ? C(i) : l;
33
33
  }
34
34
  function B(i) {
35
- var x = i - h, y = i - f, F = t - x;
35
+ var f = i - h, y = i - x, F = t - f;
36
36
  return v ? he(F, p - y) : F;
37
37
  }
38
38
  function E(i) {
39
- var x = i - h, y = i - f;
40
- return h === void 0 || x >= t || x < 0 || v && y >= p;
39
+ var f = i - h, y = i - x;
40
+ return h === void 0 || f >= t || f < 0 || v && y >= p;
41
41
  }
42
42
  function k() {
43
43
  var i = W();
@@ -49,14 +49,14 @@ function xe(e, t, r) {
49
49
  return d = void 0, m && n ? C(i) : (n = a = void 0, l);
50
50
  }
51
51
  function P() {
52
- d !== void 0 && clearTimeout(d), f = 0, n = h = a = d = void 0;
52
+ d !== void 0 && clearTimeout(d), x = 0, n = h = a = d = void 0;
53
53
  }
54
54
  function V() {
55
55
  return d === void 0 ? l : I(W());
56
56
  }
57
57
  function S() {
58
- var i = W(), x = E(i);
59
- if (n = arguments, a = this, h = i, x) {
58
+ var i = W(), f = E(i);
59
+ if (n = arguments, a = this, h = i, f) {
60
60
  if (d === void 0)
61
61
  return q(h);
62
62
  if (v)
@@ -66,11 +66,11 @@ function xe(e, t, r) {
66
66
  }
67
67
  return S.cancel = P, S.flush = V, S;
68
68
  }
69
- function fe(e, t, r) {
69
+ function xe(e, t, r) {
70
70
  var n = !0, a = !0;
71
71
  if (typeof e != "function")
72
72
  throw new TypeError(L);
73
- return T(r) && (n = "leading" in r ? !!r.leading : n, a = "trailing" in r ? !!r.trailing : a), xe(e, t, {
73
+ return T(r) && (n = "leading" in r ? !!r.leading : n, a = "trailing" in r ? !!r.trailing : a), fe(e, t, {
74
74
  leading: n,
75
75
  maxWait: t,
76
76
  trailing: a
@@ -101,8 +101,8 @@ function D(e) {
101
101
  var r = ie.test(e);
102
102
  return r || oe.test(e) ? ne(e.slice(2), r ? 2 : 8) : ae.test(e) ? M : +e;
103
103
  }
104
- var be = fe;
105
- const me = /* @__PURE__ */ ee(be), ye = "*,*:after,*:before{box-sizing:inherit}:host{display:block}.c-textareaWrapper{--textarea-line-height: calc(var(--dt-font-body-l-line-height) * 1px);--textarea-border-thickness: 1px;--textarea-resize: none;--textarea-padding-inline: var(--dt-spacing-c);--textarea-padding-block: var(--dt-spacing-b);--textarea-background-color: var(--dt-color-container-default);--textarea-border-color: var(--dt-color-border-form);--textarea-content-color: var(--dt-color-content-default);--textarea-placeholder-color: var(--dt-color-content-placeholder);--textarea-height: calc((var(--textarea-line-height) * 2) + (var(--textarea-padding-block) * 2));line-height:0;padding:var(--dt-spacing-a);border:var(--textarea-border-thickness) solid var(--textarea-border-color);background-color:var(--textarea-background-color);border-radius:var(--dt-radius-rounded-c);inline-size:100%}.c-textareaWrapper textarea{font-size:calc(var(--dt-font-body-l-size) * 1px);line-height:var(--textarea-line-height);font-family:var(--dt-font-body-l-family);resize:var(--textarea-resize);border:none;background-color:var(--textarea-background-color);color:var(--textarea-content-color);block-size:var(--textarea-height);max-block-size:var(--textarea-max-height);min-block-size:var(--textarea-min-height);inline-size:100%;padding-block-start:var(--textarea-padding-block);padding-block-end:var(--textarea-padding-block);padding-inline-start:var(--textarea-padding-inline);padding-inline-end:var(--textarea-padding-inline)}.c-textareaWrapper textarea:focus{box-shadow:none;outline:none}.c-textareaWrapper textarea::placeholder{color:var(--textarea-placeholder-color);opacity:1}.c-textareaWrapper.c-textarea--readonly{--textarea-background-color: var(--dt-color-container-subtle);--textarea-border-color: var(--dt-color-border-form)}.c-textareaWrapper.is-disabled{--textarea-background-color: var(--dt-color-disabled-01);--textarea-border-color: var(--dt-color-disabled-01);--textarea-content-color: var(--dt-color-content-disabled);--textarea-placeholder-color: var(--dt-color-content-disabled)}@media (hover: hover){.c-textareaWrapper:hover:not(.is-disabled,.c-textarea--readonly){--textarea-background-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + calc(-1 * var(--dt-color-hover-01))))}@supports (background-color: color-mix(in srgb,black,white)){.c-textareaWrapper:hover:not(.is-disabled,.c-textarea--readonly){--textarea-background-color: color-mix(in srgb, var(--dt-color-hover-01-bg) var(--dt-color-hover-01), var(--dt-color-container-default))}}}.c-textareaWrapper:focus-within{box-shadow:0 0 0 2px var(--dt-color-focus-inner),0 0 0 4px var(--dt-color-focus-outer);outline:none}.c-textareaWrapper.c-textarea--large{--textarea-padding-block: var(--dt-spacing-c)}.c-textareaWrapper.c-textarea--small{--textarea-padding-block: var(--dt-spacing-a)}.c-textareaWrapper.c-textarea--resize-manual{--textarea-resize: vertical;--textarea-min-height: calc((var(--textarea-line-height) * 1) + (var(--textarea-padding-block) * 2))}@media (pointer: coarse){.c-textareaWrapper.c-textarea--resize-manual{--textarea-height: calc((var(--textarea-line-height) * 6) + (var(--textarea-padding-block) * 2));--textarea-min-height: calc((var(--textarea-line-height) * 6) + (var(--textarea-padding-block) * 2));--textarea-max-height: calc((var(--textarea-line-height) * 6) + (var(--textarea-padding-block) * 2));--textarea-resize: none}}.c-textareaWrapper.c-textarea--resize-auto{--textarea-max-height: calc((var(--textarea-line-height) * 6) + (var(--textarea-padding-block) * 2));--textarea-min-height: var(--textarea-height)}.c-textareaWrapper.c-textarea--error{--textarea-border-color: var(--dt-color-support-error)}", ze = ["small", "medium", "large"], ke = ["auto", "manual"], $e = ["default", "success", "error"], u = {
104
+ var be = xe;
105
+ const me = /* @__PURE__ */ ee(be), ye = "*,*:after,*:before{box-sizing:inherit}:host{display:block}.c-textareaWrapper{--textarea-line-height: calc(var(--dt-font-body-l-line-height) * 1px);--textarea-border-thickness: 1px;--textarea-resize: none;--textarea-padding-inline: var(--dt-spacing-c);--textarea-padding-block: var(--dt-spacing-b);--textarea-background-color: var(--dt-color-container-default);--textarea-border-color: var(--dt-color-border-form);--textarea-content-color: var(--dt-color-content-default);--textarea-placeholder-color: var(--dt-color-content-placeholder);--textarea-height: calc((var(--textarea-line-height) * 2) + (var(--textarea-padding-block) * 2));line-height:0;padding:var(--dt-spacing-a);border:var(--textarea-border-thickness) solid var(--textarea-border-color);background-color:var(--textarea-background-color);border-radius:var(--dt-radius-rounded-c);inline-size:100%}.c-textareaWrapper textarea{font-size:calc(var(--dt-font-body-l-size) * 1px);line-height:var(--textarea-line-height);font-family:var(--dt-font-body-l-family);resize:var(--textarea-resize);border:none;background-color:var(--textarea-background-color);color:var(--textarea-content-color);block-size:var(--textarea-height);max-block-size:var(--textarea-max-height);min-block-size:var(--textarea-min-height);inline-size:100%;padding-block-start:var(--textarea-padding-block);padding-block-end:var(--textarea-padding-block);padding-inline-start:var(--textarea-padding-inline);padding-inline-end:var(--textarea-padding-inline)}.c-textareaWrapper textarea:focus{box-shadow:none;outline:none}.c-textareaWrapper textarea::placeholder{color:var(--textarea-placeholder-color);opacity:1}.c-textareaWrapper.is-readonly{--textarea-background-color: var(--dt-color-container-subtle);--textarea-border-color: var(--dt-color-border-form)}.c-textareaWrapper.is-disabled{--textarea-background-color: var(--dt-color-disabled-01);--textarea-border-color: var(--dt-color-disabled-01);--textarea-content-color: var(--dt-color-content-disabled);--textarea-placeholder-color: var(--dt-color-content-disabled)}@media (hover: hover){.c-textareaWrapper:hover:not(.is-disabled,.is-readonly){--textarea-background-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + calc(-1 * var(--dt-color-hover-01))))}@supports (background-color: color-mix(in srgb,black,white)){.c-textareaWrapper:hover:not(.is-disabled,.is-readonly){--textarea-background-color: color-mix(in srgb, var(--dt-color-hover-01-bg) var(--dt-color-hover-01), var(--dt-color-container-default))}}}.c-textareaWrapper:focus-within{box-shadow:0 0 0 2px var(--dt-color-focus-inner),0 0 0 4px var(--dt-color-focus-outer);outline:none}.c-textareaWrapper.c-textarea--large{--textarea-padding-block: var(--dt-spacing-c)}.c-textareaWrapper.c-textarea--small{--textarea-padding-block: var(--dt-spacing-a)}.c-textareaWrapper.c-textarea--resize-manual{--textarea-resize: vertical;--textarea-min-height: calc((var(--textarea-line-height) * 1) + (var(--textarea-padding-block) * 2))}@media (pointer: coarse){.c-textareaWrapper.c-textarea--resize-manual{--textarea-height: calc((var(--textarea-line-height) * 6) + (var(--textarea-padding-block) * 2));--textarea-min-height: calc((var(--textarea-line-height) * 6) + (var(--textarea-padding-block) * 2));--textarea-max-height: calc((var(--textarea-line-height) * 6) + (var(--textarea-padding-block) * 2));--textarea-resize: none}}.c-textareaWrapper.c-textarea--resize-auto{--textarea-max-height: calc((var(--textarea-line-height) * 6) + (var(--textarea-padding-block) * 2));--textarea-min-height: var(--textarea-height)}.c-textareaWrapper.has-error{--textarea-border-color: var(--dt-color-support-error)}", ze = ["small", "medium", "large"], ke = ["auto", "manual"], $e = ["default", "success", "error"], u = {
106
106
  disabled: !1,
107
107
  size: "medium",
108
108
  resize: "auto",
@@ -194,14 +194,14 @@ let o = class extends X(J(Q(w))) {
194
194
  readonly: l,
195
195
  placeholder: d,
196
196
  value: h,
197
- required: f,
197
+ required: x,
198
198
  status: g,
199
199
  assistiveText: v
200
200
  } = this, m = {
201
201
  "c-textareaWrapper": !0,
202
202
  "is-disabled": e,
203
- "c-textarea--readonly": l,
204
- "c-textarea--error": g === "error",
203
+ "is-readonly": l,
204
+ "has-error": g === "error",
205
205
  [`c-textarea--resize-${t}`]: !0,
206
206
  [`c-textarea--${r}`]: !0
207
207
  };
@@ -218,7 +218,7 @@ let o = class extends X(J(Q(w))) {
218
218
  .value=${K(h)}
219
219
  ?autofocus=${a}
220
220
  ?readonly=${l}
221
- ?required=${f}
221
+ ?required=${x}
222
222
  ?disabled=${e}
223
223
  aria-describedby=${b(v ? j : void 0)}
224
224
  aria-invalid=${g === "error" ? "true" : "false"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@justeattakeaway/pie-textarea",
3
3
  "description": "PIE Design System Textarea built using Web Components",
4
- "version": "0.17.22",
4
+ "version": "0.17.24",
5
5
  "repository": {
6
6
  "type": "git",
7
7
  "url": "https://github.com/justeattakeaway/pie",
@@ -45,14 +45,14 @@
45
45
  "devDependencies": {
46
46
  "@custom-elements-manifest/analyzer": "0.9.0",
47
47
  "@justeattakeaway/pie-components-config": "0.21.0",
48
- "@justeattakeaway/pie-css": "0.32.0",
49
- "@justeattakeaway/pie-monorepo-utils": "0.7.0",
48
+ "@justeattakeaway/pie-css": "1.1.0",
49
+ "@justeattakeaway/pie-monorepo-utils": "0.8.0",
50
50
  "@types/lodash.throttle": "4.1.9",
51
51
  "cem-plugin-module-file-extensions": "0.0.5"
52
52
  },
53
53
  "dependencies": {
54
- "@justeattakeaway/pie-assistive-text": "0.11.22",
55
- "@justeattakeaway/pie-webc-core": "12.0.0",
54
+ "@justeattakeaway/pie-assistive-text": "0.11.24",
55
+ "@justeattakeaway/pie-webc-core": "14.0.0",
56
56
  "lodash.throttle": "4.1.1"
57
57
  },
58
58
  "volta": {
package/src/index.ts CHANGED
@@ -221,8 +221,8 @@ export class PieTextarea extends FormControlMixin(RtlMixin(DelegatesFocusMixin(P
221
221
  const classes = {
222
222
  'c-textareaWrapper': true,
223
223
  'is-disabled': disabled,
224
- 'c-textarea--readonly': readonly,
225
- 'c-textarea--error': status === 'error',
224
+ 'is-readonly': readonly,
225
+ 'has-error': status === 'error',
226
226
  [`c-textarea--resize-${resize}`]: true,
227
227
  [`c-textarea--${size}`]: true,
228
228
  };
package/src/textarea.scss CHANGED
@@ -62,7 +62,7 @@
62
62
  }
63
63
  }
64
64
 
65
- &.c-textarea--readonly {
65
+ &.is-readonly {
66
66
  --textarea-background-color: var(--dt-color-container-subtle);
67
67
  --textarea-border-color: var(--dt-color-border-form);
68
68
  }
@@ -75,7 +75,7 @@
75
75
  }
76
76
 
77
77
  @media (hover: hover) {
78
- &:hover:not(.is-disabled, .c-textarea--readonly) {
78
+ &:hover:not(.is-disabled, .is-readonly) {
79
79
  --textarea-background-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + calc(-1 * var(--dt-color-hover-01))));
80
80
 
81
81
  @supports (background-color: color-mix(in srgb, black, white)) {
@@ -119,7 +119,7 @@
119
119
  --textarea-min-height: var(--textarea-height);
120
120
  }
121
121
 
122
- &.c-textarea--error {
122
+ &.has-error {
123
123
  --textarea-border-color: var(--dt-color-support-error);
124
124
  }
125
125
  }