@shoper/phoenix_design_system 1.15.11-31 → 1.15.11-32

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.
Files changed (11) hide show
  1. package/build/cjs/packages/phoenix/src/components/messages/base_message.js +7 -1
  2. package/build/cjs/packages/phoenix/src/components/messages/base_message.js.map +1 -1
  3. package/build/cjs/packages/phoenix/src/components/messages/base_message_content.js +7 -0
  4. package/build/cjs/packages/phoenix/src/components/messages/base_message_content.js.map +1 -1
  5. package/build/esm/packages/phoenix/src/components/messages/base_message.d.ts +1 -0
  6. package/build/esm/packages/phoenix/src/components/messages/base_message.js +7 -1
  7. package/build/esm/packages/phoenix/src/components/messages/base_message.js.map +1 -1
  8. package/build/esm/packages/phoenix/src/components/messages/base_message_content.d.ts +2 -0
  9. package/build/esm/packages/phoenix/src/components/messages/base_message_content.js +7 -0
  10. package/build/esm/packages/phoenix/src/components/messages/base_message_content.js.map +1 -1
  11. package/package.json +1 -1
package/build/cjs/packages/phoenix/src/components/messages/base_message.js CHANGED
@@ -7,6 +7,7 @@ var lit = require('lit');
7
7
  var decorators = require('lit/decorators');
8
8
  var utilities = require('@dreamcommerce/utilities');
9
9
  var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
10
+ var ref_js = require('lit-html/directives/ref.js');
10
11
  var v4 = require('../../../../../external/uuid/dist/esm-browser/v4.js');
11
12
  var portal_constants = require('../portal/portal_constants.js');
12
13
  var click_outside_controller = require('../../controllers/click_outside_controller/click_outside_controller.js');
@@ -23,6 +24,7 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
23
24
  this.mouseonly = false;
24
25
  this.tabindex = '-1';
25
26
  this._messageId = v4['default']();
27
+ this._tooltipRef = ref_js.createRef();
26
28
  this._handleChildrenAriaAttributes = () => {
27
29
  [...this.children].forEach((child) => {
28
30
  if (base_message_constants.LIST_OF_MESSAGE_CHILDREN.includes(child.tagName.toLowerCase()))
@@ -49,6 +51,8 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
49
51
  });
50
52
  };
51
53
  this.open = () => {
54
+ var _a;
55
+ (_a = this._tooltipRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-hidden', 'false');
52
56
  this._tooltipOpenTime = Date.now();
53
57
  clearTimeout(this._closeTimeout);
54
58
  this._openTimeout = setTimeout(() => {
@@ -65,6 +69,8 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
65
69
  this.close();
66
70
  };
67
71
  this.close = () => {
72
+ var _a;
73
+ (_a = this._tooltipRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-hidden', 'true');
68
74
  clearTimeout(this._openTimeout);
69
75
  if (!this.opened)
70
76
  return;
@@ -128,7 +134,7 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
128
134
  var _a;
129
135
  super.render();
130
136
  return lit.html `
131
- <span id="${this._messageId}" class="sr-only" role="tooltip" aria-hidden="${!this.opened ? 'true' : 'false'}">
137
+ <span ${ref_js.ref(this._tooltipRef)} id="${this._messageId}" class="sr-only" role="tooltip" aria-hidden="true">
132
138
  ${utilities.DomUtils.stripHTMLTags(((_a = this._$baseMessageContent) === null || _a === void 0 ? void 0 : _a.innerHTML) || '')}
133
139
  </span>
134
140
  <h-portal ?disabled="${!this.opened}" @open="${this._positionMessage}" to="${this.portalTarget}" hidden>
package/build/cjs/packages/phoenix/src/components/messages/base_message.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA,iBAAiB,qDAAyD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA,iBAAiB,qDAAyD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/cjs/packages/phoenix/src/components/messages/base_message_content.js CHANGED
@@ -14,6 +14,13 @@ class BaseMessageContent extends phoenix_light_lit_element.PhoenixLightLitElemen
14
14
  this.portalTarget = base_message_constants.DEFAULT_MESSAGE_PORTAL_NAME;
15
15
  this.slot = base_message_constants.MESSAGE_CONTENT_SLOT_NAME;
16
16
  }
17
+ connectedCallback() {
18
+ super.connectedCallback();
19
+ this._setupAriaAttributes();
20
+ }
21
+ _setupAriaAttributes() {
22
+ this.setAttribute('role', 'tooltip');
23
+ }
17
24
  }
18
25
  tslib_es6.__decorate([
19
26
  decorators.property({ type: String, attribute: portal_constants.PORTAL_TARGET_ATTRIBUTE_NAME }),
package/build/cjs/packages/phoenix/src/components/messages/base_message_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/esm/packages/phoenix/src/components/messages/base_message.d.ts CHANGED
@@ -19,6 +19,7 @@ export declare class BaseMessage extends PhoenixLightLitElement implements IBase
19
19
  private _closeTimeout;
20
20
  private _messageComponentName;
21
21
  private _$baseMessageContent?;
22
+ private _tooltipRef;
22
23
  constructor();
23
24
  connectedCallback(messageComponentName?: string): void;
24
25
  firstUpdated(props: PropertyValues): void;
package/build/esm/packages/phoenix/src/components/messages/base_message.js CHANGED
@@ -3,6 +3,7 @@ import { html } from 'lit';
3
3
  import { property } from 'lit/decorators';
4
4
  import { DIRECTIONS, DomUtils } from '@dreamcommerce/utilities';
5
5
  import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
6
+ import { createRef, ref } from 'lit-html/directives/ref.js';
6
7
  import v4 from '../../../../../external/uuid/dist/esm-browser/v4.js';
7
8
  import { PORTAL_TARGET_COMPONENT_NAME, PORTAL_TARGET_NAME_PROP, PORTAL_TARGET_ATTRIBUTE_NAME } from '../portal/portal_constants.js';
8
9
  import { ClickOutsideController } from '../../controllers/click_outside_controller/click_outside_controller.js';
@@ -19,6 +20,7 @@ class BaseMessage extends PhoenixLightLitElement {
19
20
  this.mouseonly = false;
20
21
  this.tabindex = '-1';
21
22
  this._messageId = v4();
23
+ this._tooltipRef = createRef();
22
24
  this._handleChildrenAriaAttributes = () => {
23
25
  [...this.children].forEach((child) => {
24
26
  if (LIST_OF_MESSAGE_CHILDREN.includes(child.tagName.toLowerCase()))
@@ -45,6 +47,8 @@ class BaseMessage extends PhoenixLightLitElement {
45
47
  });
46
48
  };
47
49
  this.open = () => {
50
+ var _a;
51
+ (_a = this._tooltipRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-hidden', 'false');
48
52
  this._tooltipOpenTime = Date.now();
49
53
  clearTimeout(this._closeTimeout);
50
54
  this._openTimeout = setTimeout(() => {
@@ -61,6 +65,8 @@ class BaseMessage extends PhoenixLightLitElement {
61
65
  this.close();
62
66
  };
63
67
  this.close = () => {
68
+ var _a;
69
+ (_a = this._tooltipRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-hidden', 'true');
64
70
  clearTimeout(this._openTimeout);
65
71
  if (!this.opened)
66
72
  return;
@@ -124,7 +130,7 @@ class BaseMessage extends PhoenixLightLitElement {
124
130
  var _a;
125
131
  super.render();
126
132
  return html `
127
- <span id="${this._messageId}" class="sr-only" role="tooltip" aria-hidden="${!this.opened ? 'true' : 'false'}">
133
+ <span ${ref(this._tooltipRef)} id="${this._messageId}" class="sr-only" role="tooltip" aria-hidden="true">
128
134
  ${DomUtils.stripHTMLTags(((_a = this._$baseMessageContent) === null || _a === void 0 ? void 0 : _a.innerHTML) || '')}
129
135
  </span>
130
136
  <h-portal ?disabled="${!this.opened}" @open="${this._positionMessage}" to="${this.portalTarget}" hidden>
package/build/esm/packages/phoenix/src/components/messages/base_message.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA,eAAe,qDAAyD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA,eAAe,qDAAyD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/esm/packages/phoenix/src/components/messages/base_message_content.d.ts CHANGED
@@ -2,4 +2,6 @@ import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/pho
2
2
  export declare class BaseMessageContent extends PhoenixLightLitElement {
3
3
  portalTarget: string;
4
4
  constructor();
5
+ connectedCallback(): void;
6
+ private _setupAriaAttributes;
5
7
  }
package/build/esm/packages/phoenix/src/components/messages/base_message_content.js CHANGED
@@ -10,6 +10,13 @@ class BaseMessageContent extends PhoenixLightLitElement {
10
10
  this.portalTarget = DEFAULT_MESSAGE_PORTAL_NAME;
11
11
  this.slot = MESSAGE_CONTENT_SLOT_NAME;
12
12
  }
13
+ connectedCallback() {
14
+ super.connectedCallback();
15
+ this._setupAriaAttributes();
16
+ }
17
+ _setupAriaAttributes() {
18
+ this.setAttribute('role', 'tooltip');
19
+ }
13
20
  }
14
21
  __decorate([
15
22
  property({ type: String, attribute: PORTAL_TARGET_ATTRIBUTE_NAME }),
package/build/esm/packages/phoenix/src/components/messages/base_message_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@shoper/phoenix_design_system",
3
3
  "packageManager": "yarn@3.2.0",
4
4
  "sideEffects": false,
5
- "version": "1.15.11-31",
5
+ "version": "1.15.11-32",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",