@alegendstale/holly-components 0.2.36 → 0.2.37
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/components/color-palette/color-palette.d.ts.map +1 -1
- package/dist/components/color-palette/color-palette.js +1 -0
- package/dist/components/tool-tip/tool-tip.d.ts +3 -1
- package/dist/components/tool-tip/tool-tip.d.ts.map +1 -1
- package/dist/components/tool-tip/tool-tip.js +17 -9
- package/dist/components/tool-tip/tool-tip.stories.d.ts +1 -0
- package/dist/components/tool-tip/tool-tip.stories.d.ts.map +1 -1
- package/dist/components/tool-tip/tool-tip.stories.js +6 -4
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"color-palette.d.ts","sourceRoot":"","sources":["../../../src/components/color-palette/color-palette.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,cAAc,EAAE,OAAO,EAAO,cAAc,EAAE,MAAM,KAAK,CAAC;AAIrF,OAAO,EAAE,oBAAoB,EAAmB,SAAS,EAAgB,eAAe,EAAe,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAIhJ,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAQ3D,KAAK,QAAQ,GAAG;IACf,OAAO,EAAE,CAAC,OAAO,EAAE,mBAAmB,CAAC,CAAC;IACxC,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,eAAe,CAAC,CAAC;IACvD,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAC9B,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;CAC1B,CAAC;AAEF,qBACa,YAAa,SAAQ,UAAU;IAC3C,MAAM,CAAC,MAAM,4BA2FX;IAGF,OAAO,EAAG,cAAc,CAAC;IAEzB,SAAS,EAAE,OAAO,CAAS;IAC3B,IACI,QAAQ,CAAC,GAAG,EAAE,OAAO,EAGxB;IACD,IAAI,QAAQ,IAJM,OAAO,CAMxB;IAGD,MAAM,EAAE,MAAM,EAAE,CAAM;IAItB,MAAM,EAAE,MAAM,CAA0B;IAExC,KAAK,EAAE,MAAM,CAAyB;IAEtC,SAAS,EAAE,SAAS,CAA6B;IAEjD,QAAQ,EAAE,OAAO,CAAS;IAE1B,YAAY,EAAE,OAAO,CAAS;IAE9B,QAAQ,EAAE,OAAO,CAAS;IAE1B,QAAQ,EAAE,OAAO,CAAS;IAE1B,OAAO,EAAE,MAAM,EAAE,CAAM;IAGvB,QAAQ,EAAE,MAAM,CAAK;IAErB;;OAEG;IACH,IAAW,QAAQ,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,eAAe,EAQ3G;IACD,IAAW,QAAQ,IAAI,eAAe,CAWrC;IAGM,MAAM,EAAE,MAAM,CAAgB;IAGrC,OAAO,CAAC,KAAK,CAAkB;IAExB,OAAO,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAgC;IAGtE,cAAc,EAAE,oBAAoB,CAAmB;IAEvD,iBAAiB,IAAI,IAAI;IAYzB,oBAAoB,IAAI,IAAI;IAK5B,SAAS,CAAC,UAAU,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAM9D;;OAEG;IACH,kBAAkB;IA8BlB,MAAM;IA2BN;;MAEE;IACK,eAAe;IAOtB,aAAa,QAAO,cAAc,GAAG,OAAO,OAAO,CAcjD;IAEF,YAAY,IAAI,cAAc;IA0E9B,cAAc,IAAI,cAAc;
|
|
1
|
+
{"version":3,"file":"color-palette.d.ts","sourceRoot":"","sources":["../../../src/components/color-palette/color-palette.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,cAAc,EAAE,OAAO,EAAO,cAAc,EAAE,MAAM,KAAK,CAAC;AAIrF,OAAO,EAAE,oBAAoB,EAAmB,SAAS,EAAgB,eAAe,EAAe,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAIhJ,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAQ3D,KAAK,QAAQ,GAAG;IACf,OAAO,EAAE,CAAC,OAAO,EAAE,mBAAmB,CAAC,CAAC;IACxC,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,eAAe,CAAC,CAAC;IACvD,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAC9B,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;CAC1B,CAAC;AAEF,qBACa,YAAa,SAAQ,UAAU;IAC3C,MAAM,CAAC,MAAM,4BA2FX;IAGF,OAAO,EAAG,cAAc,CAAC;IAEzB,SAAS,EAAE,OAAO,CAAS;IAC3B,IACI,QAAQ,CAAC,GAAG,EAAE,OAAO,EAGxB;IACD,IAAI,QAAQ,IAJM,OAAO,CAMxB;IAGD,MAAM,EAAE,MAAM,EAAE,CAAM;IAItB,MAAM,EAAE,MAAM,CAA0B;IAExC,KAAK,EAAE,MAAM,CAAyB;IAEtC,SAAS,EAAE,SAAS,CAA6B;IAEjD,QAAQ,EAAE,OAAO,CAAS;IAE1B,YAAY,EAAE,OAAO,CAAS;IAE9B,QAAQ,EAAE,OAAO,CAAS;IAE1B,QAAQ,EAAE,OAAO,CAAS;IAE1B,OAAO,EAAE,MAAM,EAAE,CAAM;IAGvB,QAAQ,EAAE,MAAM,CAAK;IAErB;;OAEG;IACH,IAAW,QAAQ,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,eAAe,EAQ3G;IACD,IAAW,QAAQ,IAAI,eAAe,CAWrC;IAGM,MAAM,EAAE,MAAM,CAAgB;IAGrC,OAAO,CAAC,KAAK,CAAkB;IAExB,OAAO,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAgC;IAGtE,cAAc,EAAE,oBAAoB,CAAmB;IAEvD,iBAAiB,IAAI,IAAI;IAYzB,oBAAoB,IAAI,IAAI;IAK5B,SAAS,CAAC,UAAU,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAM9D;;OAEG;IACH,kBAAkB;IA8BlB,MAAM;IA2BN;;MAEE;IACK,eAAe;IAOtB,aAAa,QAAO,cAAc,GAAG,OAAO,OAAO,CAcjD;IAEF,YAAY,IAAI,cAAc;IA0E9B,cAAc,IAAI,cAAc;IAsChC;;;OAGG;IACH,oBAAoB,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,SAAK;CAyB/C;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,YAAY,CAAC;KAC9B;CACD"}
|
|
@@ -4,9 +4,11 @@ export type TriggerTypes = 'hover' | 'click' | 'manual';
|
|
|
4
4
|
export declare const styles: import("lit").CSSResult;
|
|
5
5
|
export declare class ToolTip extends LitElement {
|
|
6
6
|
static styles: import("lit").CSSResult;
|
|
7
|
+
private _trigger;
|
|
7
8
|
textEl?: HTMLParagraphElement;
|
|
8
9
|
display: boolean;
|
|
9
|
-
trigger: TriggerTypes;
|
|
10
|
+
set trigger(val: TriggerTypes);
|
|
11
|
+
get trigger(): TriggerTypes;
|
|
10
12
|
text: string;
|
|
11
13
|
render(): import("lit-html").TemplateResult<1>;
|
|
12
14
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tool-tip.d.ts","sourceRoot":"","sources":["../../../src/components/tool-tip/tool-tip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,
|
|
1
|
+
{"version":3,"file":"tool-tip.d.ts","sourceRoot":"","sources":["../../../src/components/tool-tip/tool-tip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAkB,MAAM,KAAK,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAG9C,MAAM,MAAM,YAAY,GACtB,OAAO,GACP,OAAO,GACP,QAAQ,CAAA;AAEV,eAAO,MAAM,MAAM,yBAwDlB,CAAA;AAED,qBACa,OAAQ,SAAQ,UAAU;IACtC,MAAM,CAAC,MAAM,0BAAU;IAEvB,OAAO,CAAC,QAAQ,CAA0B;IAG1C,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAG9B,OAAO,UAAS;IAEhB,IACI,OAAO,CAAC,GAAG,EAAE,YAAY,EAG5B;IACD,IAAI,OAAO,IAJM,YAAY,CAM5B;IAGD,IAAI,SAAM;IAEV,MAAM;IAYN;;OAEG;IACH,aAAa,GAAI,KAAK;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,QAAQ,OAAO;;;MAsB7D;IAEK,kBAAkB,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO;IAIpD,WAAW,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM;CAInC;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD"}
|
|
@@ -14,18 +14,18 @@ export const styles = css `
|
|
|
14
14
|
--tooltip-x: 0;
|
|
15
15
|
--tooltip-y: 0;
|
|
16
16
|
}
|
|
17
|
-
|
|
18
|
-
/*
|
|
19
|
-
:host([trigger="hover"]
|
|
17
|
+
|
|
18
|
+
/* Manual or Click appear when display is true */
|
|
19
|
+
:host(:not([trigger="hover"])[display]) p {
|
|
20
20
|
display: flex;
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
-
/*
|
|
24
|
-
:host(
|
|
23
|
+
/* Hover appears when display is true and user is hovering */
|
|
24
|
+
:host([trigger="hover"][display]:hover) p {
|
|
25
25
|
display: flex;
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
-
/*
|
|
28
|
+
/* Display nothing when there is no text */
|
|
29
29
|
:host([text=""]) #tip {
|
|
30
30
|
display: none;
|
|
31
31
|
}
|
|
@@ -67,8 +67,8 @@ export const styles = css `
|
|
|
67
67
|
let ToolTip = class ToolTip extends LitElement {
|
|
68
68
|
constructor() {
|
|
69
69
|
super(...arguments);
|
|
70
|
+
this._trigger = "manual";
|
|
70
71
|
this.display = false;
|
|
71
|
-
this.trigger = 'manual';
|
|
72
72
|
this.text = '';
|
|
73
73
|
/**
|
|
74
74
|
* Clamps the tooltip position to within the bounds
|
|
@@ -98,6 +98,14 @@ let ToolTip = class ToolTip extends LitElement {
|
|
|
98
98
|
return { x: leftPosition, y: topPosition };
|
|
99
99
|
};
|
|
100
100
|
}
|
|
101
|
+
set trigger(val) {
|
|
102
|
+
this._trigger = val;
|
|
103
|
+
if (val === 'hover')
|
|
104
|
+
this.display = true;
|
|
105
|
+
}
|
|
106
|
+
get trigger() {
|
|
107
|
+
return this._trigger;
|
|
108
|
+
}
|
|
101
109
|
render() {
|
|
102
110
|
return html `
|
|
103
111
|
<slot
|
|
@@ -122,11 +130,11 @@ __decorate([
|
|
|
122
130
|
query('p')
|
|
123
131
|
], ToolTip.prototype, "textEl", void 0);
|
|
124
132
|
__decorate([
|
|
125
|
-
property({ type: Boolean, reflect: true })
|
|
133
|
+
property({ type: Boolean, reflect: true, useDefault: true })
|
|
126
134
|
], ToolTip.prototype, "display", void 0);
|
|
127
135
|
__decorate([
|
|
128
136
|
property({ type: String, reflect: true })
|
|
129
|
-
], ToolTip.prototype, "trigger",
|
|
137
|
+
], ToolTip.prototype, "trigger", null);
|
|
130
138
|
__decorate([
|
|
131
139
|
property({ type: String, reflect: true })
|
|
132
140
|
], ToolTip.prototype, "text", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tool-tip.stories.d.ts","sourceRoot":"","sources":["../../../src/components/tool-tip/tool-tip.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,QAAA,MAAM,IAAI,EAAE,IAIX,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,YAAY,CAAA;CAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"tool-tip.stories.d.ts","sourceRoot":"","sources":["../../../src/components/tool-tip/tool-tip.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,QAAA,MAAM,IAAI,EAAE,IAIX,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC;AAEvE,KAAK,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAY7B,eAAO,MAAM,KAAK,EAAE,KAOnB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAOnB,CAAC"}
|
|
@@ -6,9 +6,9 @@ const meta = {
|
|
|
6
6
|
};
|
|
7
7
|
export default meta;
|
|
8
8
|
const Template = {
|
|
9
|
-
render: ({ text, trigger }) => {
|
|
9
|
+
render: ({ text, trigger, display }) => {
|
|
10
10
|
return html `
|
|
11
|
-
<tool-tip text=${text} trigger=${trigger}>
|
|
11
|
+
<tool-tip text=${text} trigger=${trigger} ?display=${display}>
|
|
12
12
|
<button>${trigger} me</button>
|
|
13
13
|
</tool-tip>
|
|
14
14
|
`;
|
|
@@ -18,13 +18,15 @@ export const Hover = {
|
|
|
18
18
|
...Template,
|
|
19
19
|
args: {
|
|
20
20
|
text: 'hovered tooltip',
|
|
21
|
-
trigger: 'hover'
|
|
21
|
+
trigger: 'hover',
|
|
22
|
+
display: true
|
|
22
23
|
}
|
|
23
24
|
};
|
|
24
25
|
export const Click = {
|
|
25
26
|
...Template,
|
|
26
27
|
args: {
|
|
27
28
|
text: 'clicked tooltip',
|
|
28
|
-
trigger: 'click'
|
|
29
|
+
trigger: 'click',
|
|
30
|
+
display: false
|
|
29
31
|
}
|
|
30
32
|
};
|