@logosphere-ui/core 0.0.0-alpha.54 → 0.0.0-alpha.55
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/AGENTS.md +155 -1
- package/dist/AGENTS.md +155 -1
- package/dist/{chatbot-UtlXazeu.cjs → chatbot-BAou4THb.cjs} +1 -1
- package/dist/{chatbot-hRX1TlL2.js → chatbot-BRfqXYYt.js} +1 -1
- package/dist/chatbot.cjs +1 -1
- package/dist/chatbot.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +21 -19
- package/dist/index.umd.js +303 -169
- package/dist/input-DyLKo7h6.cjs +60 -0
- package/dist/{input-DIbZxkKp.js → input-N3Z8D7q1.js} +14 -17
- package/dist/input.cjs +1 -1
- package/dist/input.js +1 -1
- package/dist/left-menu.cjs +1 -1
- package/dist/left-menu.js +1 -1
- package/dist/{leftmenu-Bb7sDb6y.cjs → leftmenu-DiKo8iud.cjs} +1 -1
- package/dist/{leftmenu-CCyp8q_q.js → leftmenu-DlU_G4Sj.js} +1 -1
- package/dist/molecules/Input/input.d.ts +0 -7
- package/dist/organisms/Table/index.d.ts +1 -0
- package/dist/organisms/Table/table.d.ts +167 -0
- package/dist/table-3-P_g6-i.js +521 -0
- package/dist/table-CpzsQ87V.cjs +135 -0
- package/dist/table.cjs +1 -0
- package/dist/table.js +4 -0
- package/dist/{timepicker-C22yBR_J.js → timepicker-B9l6HN-d.js} +1 -1
- package/dist/{timepicker-DFIhvxai.cjs → timepicker-Bpf2d4Nn.cjs} +1 -1
- package/dist/timepicker.cjs +1 -1
- package/dist/timepicker.js +1 -1
- package/package.json +6 -1
- package/dist/input-tZU_snSC.cjs +0 -60
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
"use strict";const n=require("lit"),s=require("lit/decorators.js"),y=require("lit/directives/live.js");require("./formfield-JXiv9mvJ.cjs");require("./ui-icon-DWl7I5BQ.cjs");const g=":host{display:block}.input__field{width:100%;background:transparent;border:none;outline:none;font-size:var(--font-size-sm);font-family:var(--font-family-base);color:var(--color-body-text);box-sizing:border-box;line-height:1.5}.input__field::placeholder{color:var(--color-tertiary)}.input__field:disabled{cursor:not-allowed}.input__field--default{height:var(--input-field-height, 16px)}.input__field--large{height:var(--input-field-height-large, 24px)}.input__clear-btn,.input__password-toggle{border:none;background:transparent;color:var(--color-gray-400);cursor:pointer;padding:0;display:inline-flex;align-items:center;outline:none;flex-shrink:0;transition:color var(--transition-speed-fast) var(--transition-timing)}.input__clear-btn:hover,.input__password-toggle:hover{color:var(--color-gray-600)}";var c=Object.defineProperty,m=Object.getOwnPropertyDescriptor,i=(p,t,e,o)=>{for(var r=o>1?void 0:o?m(t,e):t,a=p.length-1,l;a>=0;a--)(l=p[a])&&(r=(o?l(t,e,r):l(r))||r);return o&&r&&c(t,e,r),r};const d={0:/\d/,a:/[a-zA-Z]/,"*":/[a-zA-Z0-9]/};function h(p){return p.split("").filter(t=>/[a-zA-Z0-9]/.test(t)).join("")}function v(p,t){let e=0,o="";for(let r=0;r<t.length&&!(e>=p.length);r++){const a=t[r],l=d[a];if(l){for(;e<p.length&&!l.test(p[e]);)e++;e<p.length&&(o+=p[e++])}else o+=a}return o}function f(p,t,e){let o=0;for(let r=0;r<p.length;r++)if(d[t[r]]&&(o++,o===e))return r+1;return p.length}exports.LogosphereInput=class extends n.LitElement{constructor(){super(...arguments),this.value="",this.type="text",this.placeholder="",this.name="",this.autocomplete="",this.pattern="",this.size="default",this.variant="default",this.label="",this.helper="",this.error="",this.required=!1,this.disabled=!1,this.readonly=!1,this.mask="",this.showPasswordToggle=!0,this.suppressNativeValidation=!1,this.errorDisplay="always",this._internalError="",this._showPassword=!1,this._invalid=!1,this.handleInput=t=>{const e=t.target;if(this.mask){const o=e.selectionStart??e.value.length,r=h(e.value.slice(0,o)).length,a=h(e.value),l=v(a,this.mask);e.value=l,this.value=l;const u=f(l,this.mask,r);requestAnimationFrame(()=>e.setSelectionRange(u,u))}else this.value=e.value;this._internalError&&(this._internalError="",this._inputElement.setCustomValidity("")),this._invalid=!1,this.dispatchEvent(new CustomEvent("input",{bubbles:!0,composed:!0,detail:{value:this.value,rawValue:this.mask?h(this.value):this.value,originalEvent:t}}))},this.handleChange=t=>{const e=t.target;this.value=e.value;const o=e.checkValidity();this._invalid=!o,!o&&!this.suppressNativeValidation&&(this._internalError=e.validationMessage),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:this.value,originalEvent:t}})),this.dispatchEvent(new CustomEvent("lgsChange",{bubbles:!0,composed:!0,detail:{value:this.value}}))},this.handleBlur=()=>{this._inputElement&&(this._invalid=!this._inputElement.checkValidity())},this.handleKeyDown=t=>{this.dispatchEvent(new CustomEvent("keydown",{bubbles:!0,composed:!0,detail:{key:t.key,originalEvent:t}}))},this.handleKeyUp=t=>{this.dispatchEvent(new CustomEvent("keyup",{bubbles:!0,composed:!0,detail:{key:t.key,originalEvent:t}}))},this.handleClear=()=>{this.value="",this._invalid=!1,this._inputElement&&(this._inputElement.value=""),this.dispatchEvent(new CustomEvent("clear",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,composed:!0,detail:{value:"",originalEvent:null}}))},this.handlePasswordToggle=()=>{this.disabled||(this._showPassword=!this._showPassword,this._inputElement?.focus())}}get inputElement(){return this._inputElement}focus(){this._inputElement?.focus()}blur(){this._inputElement?.blur()}select(){this._inputElement?.select()}setSelectionRange(t,e,o){this._inputElement?.setSelectionRange(t,e,o)}checkValidity(){return this._inputElement?.checkValidity()??!0}reportValidity(){return this._inputElement?.reportValidity()??!0}setCustomValidity(t){this._inputElement?.setCustomValidity(t),this._internalError=t,this.requestUpdate()}willUpdate(t){t.has("type")&&this.type!=="password"&&this._showPassword&&(this._showPassword=!1),t.has("showPasswordToggle")&&!this.showPasswordToggle&&this._showPassword&&(this._showPassword=!1)}get _effectivePlaceholder(){return this.placeholder?this.placeholder:this.mask?this.mask.replace(/[0a*]/g,"_"):""}render(){const t=this.error||this._internalError,e=this.errorDisplay==="on-invalid"?this._invalid?t:"":t,o=!!this.value&&!this.disabled&&!this.readonly,r=this.type==="password",a=r&&this._showPassword?"text":this.type,l=`input__field input__field--${this.size}`;return n.html`
|
|
2
|
+
<logosphere-formfield
|
|
3
|
+
.label=${this.label}
|
|
4
|
+
.helper=${this.helper}
|
|
5
|
+
.error=${e}
|
|
6
|
+
.required=${this.required}
|
|
7
|
+
.disabled=${this.disabled}
|
|
8
|
+
.readonly=${this.readonly}
|
|
9
|
+
.placeholder=${this._effectivePlaceholder}
|
|
10
|
+
.size=${this.size}
|
|
11
|
+
.variant=${this.variant}
|
|
12
|
+
>
|
|
13
|
+
<slot name="prefix" slot="prefix"></slot>
|
|
14
|
+
<input
|
|
15
|
+
class="${l}"
|
|
16
|
+
type=${a}
|
|
17
|
+
.value=${y.live(this.value)}
|
|
18
|
+
placeholder=${this._effectivePlaceholder||n.nothing}
|
|
19
|
+
name=${this.name||n.nothing}
|
|
20
|
+
autocomplete=${this.autocomplete||n.nothing}
|
|
21
|
+
?required=${this.required}
|
|
22
|
+
?disabled=${this.disabled}
|
|
23
|
+
?readonly=${this.readonly}
|
|
24
|
+
minlength=${this.minlength??n.nothing}
|
|
25
|
+
maxlength=${this.maxlength??n.nothing}
|
|
26
|
+
pattern=${this.pattern||n.nothing}
|
|
27
|
+
min=${this.min??n.nothing}
|
|
28
|
+
max=${this.max??n.nothing}
|
|
29
|
+
step=${this.step??n.nothing}
|
|
30
|
+
@input=${this.handleInput}
|
|
31
|
+
@change=${this.handleChange}
|
|
32
|
+
@blur=${this.handleBlur}
|
|
33
|
+
@keydown=${this.handleKeyDown}
|
|
34
|
+
@keyup=${this.handleKeyUp}
|
|
35
|
+
/>
|
|
36
|
+
${o?n.html`
|
|
37
|
+
<button
|
|
38
|
+
type="button"
|
|
39
|
+
slot="clear"
|
|
40
|
+
class="input__clear-btn"
|
|
41
|
+
@click=${this.handleClear}
|
|
42
|
+
tabindex="-1"
|
|
43
|
+
>
|
|
44
|
+
<ui-icon name="uil-times" size="14"></ui-icon>
|
|
45
|
+
</button>
|
|
46
|
+
`:n.nothing}
|
|
47
|
+
${r&&this.showPasswordToggle?n.html`
|
|
48
|
+
<button
|
|
49
|
+
type="button"
|
|
50
|
+
slot="suffix"
|
|
51
|
+
class="input__password-toggle"
|
|
52
|
+
aria-label=${this._showPassword?"Şifreyi gizle":"Şifreyi göster"}
|
|
53
|
+
@click=${this.handlePasswordToggle}
|
|
54
|
+
>
|
|
55
|
+
<ui-icon name=${this._showPassword?"uil-eye-slash":"uil-eye"} size="16"></ui-icon>
|
|
56
|
+
</button>
|
|
57
|
+
`:n.nothing}
|
|
58
|
+
<slot name="suffix" slot="suffix"></slot>
|
|
59
|
+
</logosphere-formfield>
|
|
60
|
+
`}};exports.LogosphereInput.styles=[n.css`${n.unsafeCSS(g)}`];i([s.query("input")],exports.LogosphereInput.prototype,"_inputElement",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"value",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"type",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"placeholder",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"name",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"autocomplete",2);i([s.property({type:Number})],exports.LogosphereInput.prototype,"minlength",2);i([s.property({type:Number})],exports.LogosphereInput.prototype,"maxlength",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"pattern",2);i([s.property({type:Number})],exports.LogosphereInput.prototype,"min",2);i([s.property({type:Number})],exports.LogosphereInput.prototype,"max",2);i([s.property({type:Number})],exports.LogosphereInput.prototype,"step",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"size",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"variant",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"label",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"helper",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"error",2);i([s.property({type:Boolean})],exports.LogosphereInput.prototype,"required",2);i([s.property({type:Boolean})],exports.LogosphereInput.prototype,"disabled",2);i([s.property({type:Boolean})],exports.LogosphereInput.prototype,"readonly",2);i([s.property({type:String})],exports.LogosphereInput.prototype,"mask",2);i([s.property({type:Boolean,attribute:"show-password-toggle"})],exports.LogosphereInput.prototype,"showPasswordToggle",2);i([s.property({type:Boolean,attribute:"suppress-native-validation"})],exports.LogosphereInput.prototype,"suppressNativeValidation",2);i([s.property({type:String,attribute:"error-display"})],exports.LogosphereInput.prototype,"errorDisplay",2);i([s.state()],exports.LogosphereInput.prototype,"_internalError",2);i([s.state()],exports.LogosphereInput.prototype,"_showPassword",2);i([s.state()],exports.LogosphereInput.prototype,"_invalid",2);exports.LogosphereInput=i([s.customElement("logosphere-input")],exports.LogosphereInput);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { unsafeCSS as m, css as g, LitElement as f, nothing as h, html as u } from "lit";
|
|
2
|
-
import { query as v, property as r, state as
|
|
2
|
+
import { query as v, property as r, state as c, customElement as _ } from "lit/decorators.js";
|
|
3
3
|
import { live as b } from "lit/directives/live.js";
|
|
4
4
|
import "./formfield-ss2mFweu.js";
|
|
5
5
|
import "./ui-icon-BeR-PaPg.js";
|
|
@@ -9,7 +9,7 @@ var E = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, i = (t, s, o
|
|
|
9
9
|
(p = t[a]) && (n = (l ? p(s, o, n) : p(n)) || n);
|
|
10
10
|
return l && n && E(s, o, n), n;
|
|
11
11
|
};
|
|
12
|
-
const
|
|
12
|
+
const y = {
|
|
13
13
|
0: /\d/,
|
|
14
14
|
a: /[a-zA-Z]/,
|
|
15
15
|
"*": /[a-zA-Z0-9]/
|
|
@@ -20,7 +20,7 @@ function d(t) {
|
|
|
20
20
|
function k(t, s) {
|
|
21
21
|
let o = 0, l = "";
|
|
22
22
|
for (let n = 0; n < s.length && !(o >= t.length); n++) {
|
|
23
|
-
const a = s[n], p =
|
|
23
|
+
const a = s[n], p = y[a];
|
|
24
24
|
if (p) {
|
|
25
25
|
for (; o < t.length && !p.test(t[o]); ) o++;
|
|
26
26
|
o < t.length && (l += t[o++]);
|
|
@@ -32,13 +32,13 @@ function k(t, s) {
|
|
|
32
32
|
function P(t, s, o) {
|
|
33
33
|
let l = 0;
|
|
34
34
|
for (let n = 0; n < t.length; n++)
|
|
35
|
-
if (
|
|
35
|
+
if (y[s[n]] && (l++, l === o))
|
|
36
36
|
return n + 1;
|
|
37
37
|
return t.length;
|
|
38
38
|
}
|
|
39
39
|
let e = class extends f {
|
|
40
40
|
constructor() {
|
|
41
|
-
super(...arguments), this.value = "", this.type = "text", this.placeholder = "", this.name = "", this.autocomplete = "", this.pattern = "", this.size = "default", this.variant = "default", this.label = "", this.helper = "", this.error = "", this.required = !1, this.disabled = !1, this.readonly = !1, this.
|
|
41
|
+
super(...arguments), this.value = "", this.type = "text", this.placeholder = "", this.name = "", this.autocomplete = "", this.pattern = "", this.size = "default", this.variant = "default", this.label = "", this.helper = "", this.error = "", this.required = !1, this.disabled = !1, this.readonly = !1, this.mask = "", this.showPasswordToggle = !0, this.suppressNativeValidation = !1, this.errorDisplay = "always", this._internalError = "", this._showPassword = !1, this._invalid = !1, this.handleInput = (t) => {
|
|
42
42
|
const s = t.target;
|
|
43
43
|
if (this.mask) {
|
|
44
44
|
const o = s.selectionStart ?? s.value.length, l = d(s.value.slice(0, o)).length, n = d(s.value), a = k(n, this.mask);
|
|
@@ -125,7 +125,7 @@ let e = class extends f {
|
|
|
125
125
|
return this.placeholder ? this.placeholder : this.mask ? this.mask.replace(/[0a*]/g, "_") : "";
|
|
126
126
|
}
|
|
127
127
|
render() {
|
|
128
|
-
const t = this.error || this._internalError, s = this.errorDisplay === "on-invalid" ? this._invalid ? t : "" : t, o =
|
|
128
|
+
const t = this.error || this._internalError, s = this.errorDisplay === "on-invalid" ? this._invalid ? t : "" : t, o = !!this.value && !this.disabled && !this.readonly, l = this.type === "password", n = l && this._showPassword ? "text" : this.type, a = `input__field input__field--${this.size}`;
|
|
129
129
|
return u`
|
|
130
130
|
<logosphere-formfield
|
|
131
131
|
.label=${this.label}
|
|
@@ -140,15 +140,15 @@ let e = class extends f {
|
|
|
140
140
|
>
|
|
141
141
|
<slot name="prefix" slot="prefix"></slot>
|
|
142
142
|
<input
|
|
143
|
-
class="${
|
|
144
|
-
type=${
|
|
143
|
+
class="${a}"
|
|
144
|
+
type=${n}
|
|
145
145
|
.value=${b(this.value)}
|
|
146
146
|
placeholder=${this._effectivePlaceholder || h}
|
|
147
147
|
name=${this.name || h}
|
|
148
148
|
autocomplete=${this.autocomplete || h}
|
|
149
149
|
?required=${this.required}
|
|
150
150
|
?disabled=${this.disabled}
|
|
151
|
-
?readonly=${
|
|
151
|
+
?readonly=${this.readonly}
|
|
152
152
|
minlength=${this.minlength ?? h}
|
|
153
153
|
maxlength=${this.maxlength ?? h}
|
|
154
154
|
pattern=${this.pattern || h}
|
|
@@ -161,7 +161,7 @@ let e = class extends f {
|
|
|
161
161
|
@keydown=${this.handleKeyDown}
|
|
162
162
|
@keyup=${this.handleKeyUp}
|
|
163
163
|
/>
|
|
164
|
-
${
|
|
164
|
+
${o ? u`
|
|
165
165
|
<button
|
|
166
166
|
type="button"
|
|
167
167
|
slot="clear"
|
|
@@ -172,7 +172,7 @@ let e = class extends f {
|
|
|
172
172
|
<ui-icon name="uil-times" size="14"></ui-icon>
|
|
173
173
|
</button>
|
|
174
174
|
` : h}
|
|
175
|
-
${
|
|
175
|
+
${l && this.showPasswordToggle ? u`
|
|
176
176
|
<button
|
|
177
177
|
type="button"
|
|
178
178
|
slot="suffix"
|
|
@@ -249,9 +249,6 @@ i([
|
|
|
249
249
|
i([
|
|
250
250
|
r({ type: Boolean })
|
|
251
251
|
], e.prototype, "readonly", 2);
|
|
252
|
-
i([
|
|
253
|
-
r({ type: Boolean, attribute: "pick-only" })
|
|
254
|
-
], e.prototype, "pickOnly", 2);
|
|
255
252
|
i([
|
|
256
253
|
r({ type: String })
|
|
257
254
|
], e.prototype, "mask", 2);
|
|
@@ -265,13 +262,13 @@ i([
|
|
|
265
262
|
r({ type: String, attribute: "error-display" })
|
|
266
263
|
], e.prototype, "errorDisplay", 2);
|
|
267
264
|
i([
|
|
268
|
-
|
|
265
|
+
c()
|
|
269
266
|
], e.prototype, "_internalError", 2);
|
|
270
267
|
i([
|
|
271
|
-
|
|
268
|
+
c()
|
|
272
269
|
], e.prototype, "_showPassword", 2);
|
|
273
270
|
i([
|
|
274
|
-
|
|
271
|
+
c()
|
|
275
272
|
], e.prototype, "_invalid", 2);
|
|
276
273
|
e = i([
|
|
277
274
|
_("logosphere-input")
|
package/dist/input.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./input-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./input-DyLKo7h6.cjs");Object.defineProperty(exports,"LogosphereInput",{enumerable:!0,get:()=>e.LogosphereInput});
|
package/dist/input.js
CHANGED
package/dist/left-menu.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./leftmenu-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./leftmenu-DiKo8iud.cjs");Object.defineProperty(exports,"LeftMenu",{enumerable:!0,get:()=>e.LeftMenu});exports.isLeftMenuGroup=e.isLeftMenuGroup;
|
package/dist/left-menu.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const n=require("lit"),a=require("lit/decorators.js");require("./button-vdNReBMi.cjs");require("./input-tZU_snSC.cjs");require("./popover-CrXUbUR-.cjs");require("./ui-icon-DWl7I5BQ.cjs");require("./tree-menu-DDQ_DYl7.cjs");function g(d){return"items"in d&&Array.isArray(d.items)}const v=':host{display:block;position:relative;height:100%;font-family:var(--font-family-base)}.lm{position:relative;height:100%;transition:width var(--transition-speed-base) var(--transition-timing)}.lm--resizing{transition:none}.lm__panel{position:relative;width:var(--lm-closed-width);min-width:var(--lm-closed-width);height:100%;background:var(--color-body-bg);border-right:1px solid var(--color-border);display:flex;flex-direction:column;overflow:hidden;overflow-x:hidden;box-sizing:border-box;padding:var(--spacing-2) var(--spacing-3);transition:width var(--transition-speed-base) var(--transition-timing),min-width var(--transition-speed-base) var(--transition-timing),box-shadow var(--transition-speed-base) var(--transition-timing)}.lm--resizing .lm__panel{transition:none}.lm--open .lm__panel{width:var(--lm-open-width);min-width:var(--lm-open-width)}.lm__resize-handle{position:absolute;top:0;right:-4px;width:8px;height:100%;cursor:col-resize;z-index:calc(var(--z-index-dropdown) + 1);touch-action:none}.lm__resize-handle:after{content:"";position:absolute;top:0;right:3px;width:1px;height:100%;background:transparent;transition:background-color var(--transition-speed-fast) var(--transition-timing)}.lm__resize-handle:hover:after,.lm--resizing .lm__resize-handle:after{background:var(--color-border)}.lm__brand{padding:var(--spacing-1-5) 0 18px var(--spacing-2);margin-bottom:var(--spacing-3);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-2);box-sizing:border-box}.lm--closed .lm__brand{width:100%;min-height:64px;padding:var(--spacing-1-5) 0 18px;flex-direction:column;justify-content:center}.lm__brand-logo{display:inline-flex;align-items:center;min-width:0;flex:1 1 auto;overflow:hidden}.lm--closed .lm__brand-logo{flex:0 0 auto;justify-content:center;width:100%}.lm__brand-toggle{flex:0 0 auto}.lm__brand-toggle-slot{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:32px;height:32px;min-width:32px;overflow:hidden}.lm__search{padding:var(--spacing-2) 0}.lm__nav{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}.lm__nav-actions{display:flex;justify-content:flex-end;padding-top:var(--spacing-2)}.lm__nav-action-tooltip{--popover-min-width: max-content;--popover-body-padding: var(--spacing-2) var(--spacing-3)}.lm__nav-action-tooltip-text{color:var(--color-body-color);white-space:nowrap}.lm__nav logosphere-tree-menu{width:100%}.lm__group{position:relative;margin-bottom:var(--spacing-2)}.lm__group--with-separator:after{content:"";display:block;margin:var(--spacing-2) var(--spacing-2);border-bottom:1px solid var(--color-border)}.lm__group-label{padding:var(--spacing-2) var(--spacing-1);font-size:var(--font-size-xs);letter-spacing:.04em;color:var(--color-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lm__custom{border-top:1px solid var(--color-border);margin-top:var(--spacing-4);padding:var(--spacing-2)}.lm--closed .lm__custom{padding:var(--spacing-2) 0}.lm__custom--hidden{display:none}.lm--closed .lm__nav{padding-left:0;padding-right:0;scrollbar-gutter:auto;scrollbar-color:var(--color-border) transparent}.lm--closed .lm__nav::-webkit-scrollbar{width:4px;height:4px}.lm--closed .lm__nav::-webkit-scrollbar-track{background:transparent}.lm--closed .lm__nav::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:999px}.lm--closed .lm__nav:hover::-webkit-scrollbar-thumb{background-color:var(--color-tertiary)}.lm__footer{margin-top:auto;border-top:1px solid var(--color-border);padding:var(--spacing-2) 0 0;display:flex;align-items:center;justify-content:center;gap:var(--spacing-2)}.lm--closed .lm__footer{flex-direction:column;justify-content:center}.lm__ctrl{width:32px;height:32px;border:1px solid var(--color-border);background:var(--color-body-bg);border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--color-body-color)}.lm__ctrl:hover{background:var(--color-tertiary)}.lm__toggle-icon{transform:rotate(180deg);transition:transform var(--transition-speed-base) var(--transition-timing)}.lm__toggle-icon--open{transform:rotate(0)}::slotted([slot="logo-open"]),::slotted([slot="toggle-closed"]){display:inline-flex;width:100%;height:100%}::slotted([slot="custom-open"]),::slotted([slot="custom-closed"]){display:block;width:100%}';var b=Object.defineProperty,w=Object.getOwnPropertyDescriptor,l=(d,e,t,o)=>{for(var i=o>1?void 0:o?w(e,t):e,s=d.length-1,r;s>=0;s--)(r=d[s])&&(i=(o?r(e,t,i):r(i))||i);return o&&i&&b(e,t,i),i};const u=68,_=248,x=500;function y(d){const e=new Set,t=o=>{o.forEach(i=>{e.add(i.id),i.children?.length&&t(i.children)})};return t(d),e}function m(d){const e=[];let t=null,o=0;return d.forEach(i=>{if(g(i)){t=null,e.push({id:i.id||`group-${o++}`,label:i.label?.trim()||null,items:i.items});return}t||(t={id:`group-${o++}`,label:null,items:[]},e.push(t)),t.items.push(i)}),e}function f(d){return d.map(e=>({id:e.id,label:e.label,disabled:e.disabled,active:e.active,iconName:e.iconName,badges:e.badges,data:e.data??e,children:e.children?.length?f(e.children):void 0}))}exports.LeftMenu=class extends n.LitElement{constructor(){super(...arguments),this.open=!1,this.openWidth=248,this.storageKey="logosphere-leftmenu-state",this.items=[],this.defaultExpandedIds=[],this.leading=!0,this._expandedIds=new Set,this._search="",this._searchExpandedIds=new Set,this._hasCustomOpen=!1,this._hasCustomClosed=!1,this._closedToggleHover=!1,this._currentOpenWidth=_,this._resizing=!1,this._isHydratingState=!1,this._resizeStartX=0,this._resizeStartWidth=_,this._onCustomOpenSlotChange=e=>{const t=e.target;this._hasCustomOpen=t.assignedElements({flatten:!0}).length>0},this._onCustomClosedSlotChange=e=>{const t=e.target;this._hasCustomClosed=t.assignedElements({flatten:!0}).length>0},this._handleSearchInput=e=>{const o=e.detail?.value;typeof o=="string"&&this._setSearch(o)},this._toggleOpen=()=>{const e=!this.open,t=e?this._currentOpenWidth:u;this.open=e,this._closedToggleHover=!1,this.dispatchEvent(new CustomEvent("toggle-change",{detail:{open:e,width:t,openWidth:this._currentOpenWidth,closedWidth:u},bubbles:!0,composed:!0}))},this._handleClosedToggleMouseEnter=()=>{this.open||(this._closedToggleHover=!0)},this._handleClosedToggleMouseLeave=()=>{this._closedToggleHover=!1},this._handleResizePointerDown=e=>{this.open&&(e.preventDefault(),e.stopPropagation(),this._resizing=!0,this._resizeStartX=e.clientX,this._resizeStartWidth=this._currentOpenWidth,window.addEventListener("pointermove",this._handleResizePointerMove),window.addEventListener("pointerup",this._handleResizePointerUp),window.addEventListener("pointercancel",this._handleResizePointerUp))},this._handleResizePointerMove=e=>{if(!this._resizing)return;const t=e.clientX-this._resizeStartX;this._currentOpenWidth=this._clampOpenWidth(this._resizeStartWidth+t)},this._handleResizePointerUp=()=>{this._resizing&&(this._resizing=!1,this._removeResizeListeners(),this.dispatchEvent(new CustomEvent("width-change",{detail:{width:this._currentOpenWidth},bubbles:!0,composed:!0})))},this._collapseAll=()=>{this._expandedIds=new Set,this._searchExpandedIds=new Set},this._handleTreeToggle=e=>{e.stopPropagation();const{item:t,expanded:o}=e.detail;o?this._expandedIds.add(t.id):this._expandedIds.delete(t.id),this._expandedIds=new Set(this._expandedIds)},this._handleTreeNodeClick=e=>{this.open||!e.detail.hasChildren||(this.open=!0,this._expandedIds.add(e.detail.item.id),this._expandedIds=new Set(this._expandedIds))},this._handleTreeItemClick=e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent("item-click",{detail:{item:e.detail.item.data??e.detail.item},bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this._currentOpenWidth=this._clampOpenWidth(this.openWidth),this._loadPersistedState()}disconnectedCallback(){super.disconnectedCallback(),this._removeResizeListeners()}updated(e){this._isHydratingState||(e.has("openWidth")&&!this._resizing&&(this._currentOpenWidth=this._clampOpenWidth(this.openWidth)),e.has("open")&&this._persistState(),e.has("items")&&this.defaultExpandedIds.length&&(this._expandedIds=new Set(this.defaultExpandedIds)),(e.has("items")||e.has("open"))&&this._syncIconSlots())}_loadPersistedState(){if(!(typeof window>"u"))try{const e=window.localStorage.getItem(this.storageKey);if(!e)return;const t=JSON.parse(e);this._isHydratingState=!0,typeof t.open=="boolean"&&(this.open=t.open),this._isHydratingState=!1}catch{this._isHydratingState=!1}}_persistState(){if(!(typeof window>"u"))try{window.localStorage.setItem(this.storageKey,JSON.stringify({open:this.open}))}catch{}}_syncIconSlots(){const e=Array.from(this.querySelectorAll("[slot^='icon-']")),t=Array.from(this.shadowRoot?.querySelectorAll("logosphere-tree-menu")??[]);if(!t.length)return;const o=t.map(i=>{const s=i.getAttribute("data-group-id"),r=this._renderGroups().find(h=>h.id===s);return r?y(r.items):new Set});e.forEach(i=>{const r=(i.getAttribute("slot")??"").slice(5),h=o.findIndex(p=>p.has(r)),c=h>=0?t[h]:t[0];c&&i.parentElement!==c&&c.appendChild(i)})}_allItems(){return m(this.items).flatMap(e=>e.items)}_renderGroups(){return m(this.items)}_setSearch(e){if(this._search=e,!e){this._searchExpandedIds=new Set;return}const t=new Set,o=i=>{let s=!1;return i.forEach(r=>{const h=r.children??[],c=r.label.toLocaleLowerCase().includes(e.toLocaleLowerCase()),p=h.length?o(h):!1;p&&t.add(r.id),c&&h.length&&t.add(r.id),s=s||c||p}),s};o(this._allItems()),this._searchExpandedIds=t}_filterItems(e,t){if(!t)return e;const o=t.toLocaleLowerCase(),i=s=>{const r=(s.children??[]).map(i).filter(Boolean);return!s.label.toLocaleLowerCase().includes(o)&&r.length===0?null:{...s,children:r}};return e.map(i).filter(Boolean)}_clampOpenWidth(e){return Math.min(x,Math.max(_,Math.round(e)))}_removeResizeListeners(){window.removeEventListener("pointermove",this._handleResizePointerMove),window.removeEventListener("pointerup",this._handleResizePointerUp),window.removeEventListener("pointercancel",this._handleResizePointerUp)}_effectiveExpandedIds(){const e=new Set(this._expandedIds);return this._search&&this._searchExpandedIds.forEach(t=>e.add(t)),Array.from(e)}render(){const e=this.open,t=this._effectiveExpandedIds(),o=this._renderGroups().map(s=>({group:s,items:this._filterItems(s.items,this._search)})).filter(({items:s})=>s.length>0),i=e?this._currentOpenWidth:u;return n.html`
|
|
1
|
+
"use strict";const n=require("lit"),a=require("lit/decorators.js");require("./button-vdNReBMi.cjs");require("./input-DyLKo7h6.cjs");require("./popover-CrXUbUR-.cjs");require("./ui-icon-DWl7I5BQ.cjs");require("./tree-menu-DDQ_DYl7.cjs");function g(d){return"items"in d&&Array.isArray(d.items)}const v=':host{display:block;position:relative;height:100%;font-family:var(--font-family-base)}.lm{position:relative;height:100%;transition:width var(--transition-speed-base) var(--transition-timing)}.lm--resizing{transition:none}.lm__panel{position:relative;width:var(--lm-closed-width);min-width:var(--lm-closed-width);height:100%;background:var(--color-body-bg);border-right:1px solid var(--color-border);display:flex;flex-direction:column;overflow:hidden;overflow-x:hidden;box-sizing:border-box;padding:var(--spacing-2) var(--spacing-3);transition:width var(--transition-speed-base) var(--transition-timing),min-width var(--transition-speed-base) var(--transition-timing),box-shadow var(--transition-speed-base) var(--transition-timing)}.lm--resizing .lm__panel{transition:none}.lm--open .lm__panel{width:var(--lm-open-width);min-width:var(--lm-open-width)}.lm__resize-handle{position:absolute;top:0;right:-4px;width:8px;height:100%;cursor:col-resize;z-index:calc(var(--z-index-dropdown) + 1);touch-action:none}.lm__resize-handle:after{content:"";position:absolute;top:0;right:3px;width:1px;height:100%;background:transparent;transition:background-color var(--transition-speed-fast) var(--transition-timing)}.lm__resize-handle:hover:after,.lm--resizing .lm__resize-handle:after{background:var(--color-border)}.lm__brand{padding:var(--spacing-1-5) 0 18px var(--spacing-2);margin-bottom:var(--spacing-3);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-2);box-sizing:border-box}.lm--closed .lm__brand{width:100%;min-height:64px;padding:var(--spacing-1-5) 0 18px;flex-direction:column;justify-content:center}.lm__brand-logo{display:inline-flex;align-items:center;min-width:0;flex:1 1 auto;overflow:hidden}.lm--closed .lm__brand-logo{flex:0 0 auto;justify-content:center;width:100%}.lm__brand-toggle{flex:0 0 auto}.lm__brand-toggle-slot{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:32px;height:32px;min-width:32px;overflow:hidden}.lm__search{padding:var(--spacing-2) 0}.lm__nav{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}.lm__nav-actions{display:flex;justify-content:flex-end;padding-top:var(--spacing-2)}.lm__nav-action-tooltip{--popover-min-width: max-content;--popover-body-padding: var(--spacing-2) var(--spacing-3)}.lm__nav-action-tooltip-text{color:var(--color-body-color);white-space:nowrap}.lm__nav logosphere-tree-menu{width:100%}.lm__group{position:relative;margin-bottom:var(--spacing-2)}.lm__group--with-separator:after{content:"";display:block;margin:var(--spacing-2) var(--spacing-2);border-bottom:1px solid var(--color-border)}.lm__group-label{padding:var(--spacing-2) var(--spacing-1);font-size:var(--font-size-xs);letter-spacing:.04em;color:var(--color-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lm__custom{border-top:1px solid var(--color-border);margin-top:var(--spacing-4);padding:var(--spacing-2)}.lm--closed .lm__custom{padding:var(--spacing-2) 0}.lm__custom--hidden{display:none}.lm--closed .lm__nav{padding-left:0;padding-right:0;scrollbar-gutter:auto;scrollbar-color:var(--color-border) transparent}.lm--closed .lm__nav::-webkit-scrollbar{width:4px;height:4px}.lm--closed .lm__nav::-webkit-scrollbar-track{background:transparent}.lm--closed .lm__nav::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:999px}.lm--closed .lm__nav:hover::-webkit-scrollbar-thumb{background-color:var(--color-tertiary)}.lm__footer{margin-top:auto;border-top:1px solid var(--color-border);padding:var(--spacing-2) 0 0;display:flex;align-items:center;justify-content:center;gap:var(--spacing-2)}.lm--closed .lm__footer{flex-direction:column;justify-content:center}.lm__ctrl{width:32px;height:32px;border:1px solid var(--color-border);background:var(--color-body-bg);border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--color-body-color)}.lm__ctrl:hover{background:var(--color-tertiary)}.lm__toggle-icon{transform:rotate(180deg);transition:transform var(--transition-speed-base) var(--transition-timing)}.lm__toggle-icon--open{transform:rotate(0)}::slotted([slot="logo-open"]),::slotted([slot="toggle-closed"]){display:inline-flex;width:100%;height:100%}::slotted([slot="custom-open"]),::slotted([slot="custom-closed"]){display:block;width:100%}';var b=Object.defineProperty,w=Object.getOwnPropertyDescriptor,l=(d,e,t,o)=>{for(var i=o>1?void 0:o?w(e,t):e,s=d.length-1,r;s>=0;s--)(r=d[s])&&(i=(o?r(e,t,i):r(i))||i);return o&&i&&b(e,t,i),i};const u=68,_=248,x=500;function y(d){const e=new Set,t=o=>{o.forEach(i=>{e.add(i.id),i.children?.length&&t(i.children)})};return t(d),e}function m(d){const e=[];let t=null,o=0;return d.forEach(i=>{if(g(i)){t=null,e.push({id:i.id||`group-${o++}`,label:i.label?.trim()||null,items:i.items});return}t||(t={id:`group-${o++}`,label:null,items:[]},e.push(t)),t.items.push(i)}),e}function f(d){return d.map(e=>({id:e.id,label:e.label,disabled:e.disabled,active:e.active,iconName:e.iconName,badges:e.badges,data:e.data??e,children:e.children?.length?f(e.children):void 0}))}exports.LeftMenu=class extends n.LitElement{constructor(){super(...arguments),this.open=!1,this.openWidth=248,this.storageKey="logosphere-leftmenu-state",this.items=[],this.defaultExpandedIds=[],this.leading=!0,this._expandedIds=new Set,this._search="",this._searchExpandedIds=new Set,this._hasCustomOpen=!1,this._hasCustomClosed=!1,this._closedToggleHover=!1,this._currentOpenWidth=_,this._resizing=!1,this._isHydratingState=!1,this._resizeStartX=0,this._resizeStartWidth=_,this._onCustomOpenSlotChange=e=>{const t=e.target;this._hasCustomOpen=t.assignedElements({flatten:!0}).length>0},this._onCustomClosedSlotChange=e=>{const t=e.target;this._hasCustomClosed=t.assignedElements({flatten:!0}).length>0},this._handleSearchInput=e=>{const o=e.detail?.value;typeof o=="string"&&this._setSearch(o)},this._toggleOpen=()=>{const e=!this.open,t=e?this._currentOpenWidth:u;this.open=e,this._closedToggleHover=!1,this.dispatchEvent(new CustomEvent("toggle-change",{detail:{open:e,width:t,openWidth:this._currentOpenWidth,closedWidth:u},bubbles:!0,composed:!0}))},this._handleClosedToggleMouseEnter=()=>{this.open||(this._closedToggleHover=!0)},this._handleClosedToggleMouseLeave=()=>{this._closedToggleHover=!1},this._handleResizePointerDown=e=>{this.open&&(e.preventDefault(),e.stopPropagation(),this._resizing=!0,this._resizeStartX=e.clientX,this._resizeStartWidth=this._currentOpenWidth,window.addEventListener("pointermove",this._handleResizePointerMove),window.addEventListener("pointerup",this._handleResizePointerUp),window.addEventListener("pointercancel",this._handleResizePointerUp))},this._handleResizePointerMove=e=>{if(!this._resizing)return;const t=e.clientX-this._resizeStartX;this._currentOpenWidth=this._clampOpenWidth(this._resizeStartWidth+t)},this._handleResizePointerUp=()=>{this._resizing&&(this._resizing=!1,this._removeResizeListeners(),this.dispatchEvent(new CustomEvent("width-change",{detail:{width:this._currentOpenWidth},bubbles:!0,composed:!0})))},this._collapseAll=()=>{this._expandedIds=new Set,this._searchExpandedIds=new Set},this._handleTreeToggle=e=>{e.stopPropagation();const{item:t,expanded:o}=e.detail;o?this._expandedIds.add(t.id):this._expandedIds.delete(t.id),this._expandedIds=new Set(this._expandedIds)},this._handleTreeNodeClick=e=>{this.open||!e.detail.hasChildren||(this.open=!0,this._expandedIds.add(e.detail.item.id),this._expandedIds=new Set(this._expandedIds))},this._handleTreeItemClick=e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent("item-click",{detail:{item:e.detail.item.data??e.detail.item},bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this._currentOpenWidth=this._clampOpenWidth(this.openWidth),this._loadPersistedState()}disconnectedCallback(){super.disconnectedCallback(),this._removeResizeListeners()}updated(e){this._isHydratingState||(e.has("openWidth")&&!this._resizing&&(this._currentOpenWidth=this._clampOpenWidth(this.openWidth)),e.has("open")&&this._persistState(),e.has("items")&&this.defaultExpandedIds.length&&(this._expandedIds=new Set(this.defaultExpandedIds)),(e.has("items")||e.has("open"))&&this._syncIconSlots())}_loadPersistedState(){if(!(typeof window>"u"))try{const e=window.localStorage.getItem(this.storageKey);if(!e)return;const t=JSON.parse(e);this._isHydratingState=!0,typeof t.open=="boolean"&&(this.open=t.open),this._isHydratingState=!1}catch{this._isHydratingState=!1}}_persistState(){if(!(typeof window>"u"))try{window.localStorage.setItem(this.storageKey,JSON.stringify({open:this.open}))}catch{}}_syncIconSlots(){const e=Array.from(this.querySelectorAll("[slot^='icon-']")),t=Array.from(this.shadowRoot?.querySelectorAll("logosphere-tree-menu")??[]);if(!t.length)return;const o=t.map(i=>{const s=i.getAttribute("data-group-id"),r=this._renderGroups().find(h=>h.id===s);return r?y(r.items):new Set});e.forEach(i=>{const r=(i.getAttribute("slot")??"").slice(5),h=o.findIndex(p=>p.has(r)),c=h>=0?t[h]:t[0];c&&i.parentElement!==c&&c.appendChild(i)})}_allItems(){return m(this.items).flatMap(e=>e.items)}_renderGroups(){return m(this.items)}_setSearch(e){if(this._search=e,!e){this._searchExpandedIds=new Set;return}const t=new Set,o=i=>{let s=!1;return i.forEach(r=>{const h=r.children??[],c=r.label.toLocaleLowerCase().includes(e.toLocaleLowerCase()),p=h.length?o(h):!1;p&&t.add(r.id),c&&h.length&&t.add(r.id),s=s||c||p}),s};o(this._allItems()),this._searchExpandedIds=t}_filterItems(e,t){if(!t)return e;const o=t.toLocaleLowerCase(),i=s=>{const r=(s.children??[]).map(i).filter(Boolean);return!s.label.toLocaleLowerCase().includes(o)&&r.length===0?null:{...s,children:r}};return e.map(i).filter(Boolean)}_clampOpenWidth(e){return Math.min(x,Math.max(_,Math.round(e)))}_removeResizeListeners(){window.removeEventListener("pointermove",this._handleResizePointerMove),window.removeEventListener("pointerup",this._handleResizePointerUp),window.removeEventListener("pointercancel",this._handleResizePointerUp)}_effectiveExpandedIds(){const e=new Set(this._expandedIds);return this._search&&this._searchExpandedIds.forEach(t=>e.add(t)),Array.from(e)}render(){const e=this.open,t=this._effectiveExpandedIds(),o=this._renderGroups().map(s=>({group:s,items:this._filterItems(s.items,this._search)})).filter(({items:s})=>s.length>0),i=e?this._currentOpenWidth:u;return n.html`
|
|
2
2
|
<aside
|
|
3
3
|
class="lm ${e?"lm--open":"lm--closed"} ${this._resizing?"lm--resizing":""}"
|
|
4
4
|
style=${`--lm-open-width:${this._currentOpenWidth}px; --lm-closed-width:${u}px; width:${i}px;`}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { unsafeCSS as b, css as w, LitElement as x, nothing as _, html as d } from "lit";
|
|
2
2
|
import { property as p, state as h, customElement as y } from "lit/decorators.js";
|
|
3
3
|
import "./button-CVkIa7M0.js";
|
|
4
|
-
import "./input-
|
|
4
|
+
import "./input-N3Z8D7q1.js";
|
|
5
5
|
import "./popover-M5ZcS5rj.js";
|
|
6
6
|
import "./ui-icon-BeR-PaPg.js";
|
|
7
7
|
import "./tree-menu-BZ7aBC7R.js";
|
|
@@ -27,13 +27,6 @@ export declare class LogosphereInput extends LitElement {
|
|
|
27
27
|
required: boolean;
|
|
28
28
|
disabled: boolean;
|
|
29
29
|
readonly: boolean;
|
|
30
|
-
/**
|
|
31
|
-
* "Seç-yalnızca" modu: klavyeyle değer girilemez/düzenlenemez, ancak değer
|
|
32
|
-
* koddan (`.value` / attribute) atanabilir ve temizle (X) butonu aktif kalır.
|
|
33
|
-
* Değeri yan taraftaki bir modal/seçici ile dolduran alanlar için kullanılır.
|
|
34
|
-
* `readonly`'den farkı: readonly X butonunu da gizler, `pick-only` göstermeye devam eder.
|
|
35
|
-
*/
|
|
36
|
-
pickOnly: boolean;
|
|
37
30
|
/** Input mask. Token'lar: 0=rakam, a=harf, *=rakam|harf. Örn: "(000) 000-0000" */
|
|
38
31
|
mask: string;
|
|
39
32
|
/** type="password" iken göster/gizle butonunu render et. Güvenlik gereği şifrenin hiç gösterilmemesi gereken ekranlarda kapatın. */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./table";
|
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
import { LitElement, type PropertyValues } from "lit";
|
|
2
|
+
import "../../atoms/Checkbox/checkbox";
|
|
3
|
+
import "../../molecules/Input/input";
|
|
4
|
+
import "../../shared/icons/ui-icon";
|
|
5
|
+
export type TableColumnAlign = "left" | "center" | "right";
|
|
6
|
+
export type TableSortDirection = "asc" | "desc";
|
|
7
|
+
export interface TableColumn {
|
|
8
|
+
key: string;
|
|
9
|
+
label: string;
|
|
10
|
+
/** Column width in px. Defaults to 160px, matching the design grid. */
|
|
11
|
+
width?: number;
|
|
12
|
+
align?: TableColumnAlign;
|
|
13
|
+
sortable?: boolean;
|
|
14
|
+
searchable?: boolean;
|
|
15
|
+
/** Pins the column (and its header) so it stays visible while the table scrolls horizontally. */
|
|
16
|
+
sticky?: boolean;
|
|
17
|
+
render?: (context: TableCellContext) => unknown;
|
|
18
|
+
}
|
|
19
|
+
export interface TableCellContext {
|
|
20
|
+
value: unknown;
|
|
21
|
+
row: Record<string, unknown>;
|
|
22
|
+
rowIndex: number;
|
|
23
|
+
column: TableColumn;
|
|
24
|
+
}
|
|
25
|
+
export interface TableActionContext {
|
|
26
|
+
row: Record<string, unknown>;
|
|
27
|
+
rowIndex: number;
|
|
28
|
+
}
|
|
29
|
+
export interface TableActionColumn {
|
|
30
|
+
/** Action column width in px. Defaults to 96px. */
|
|
31
|
+
width?: number;
|
|
32
|
+
render: (context: TableActionContext) => unknown;
|
|
33
|
+
}
|
|
34
|
+
export interface TableRowClickDetail {
|
|
35
|
+
row: Record<string, unknown>;
|
|
36
|
+
rowIndex: number;
|
|
37
|
+
}
|
|
38
|
+
export interface TableSortChangeDetail {
|
|
39
|
+
column: TableColumn;
|
|
40
|
+
key: string;
|
|
41
|
+
direction?: TableSortDirection;
|
|
42
|
+
sorts: TableSortState[];
|
|
43
|
+
multi: boolean;
|
|
44
|
+
}
|
|
45
|
+
export interface TableSortState {
|
|
46
|
+
column: TableColumn;
|
|
47
|
+
key: string;
|
|
48
|
+
direction: TableSortDirection;
|
|
49
|
+
order: number;
|
|
50
|
+
}
|
|
51
|
+
export interface TableSelectionChangeDetail {
|
|
52
|
+
selectedRows: Record<string, unknown>[];
|
|
53
|
+
selectedKeys: Array<string | number>;
|
|
54
|
+
}
|
|
55
|
+
export interface TableSearchChangeDetail {
|
|
56
|
+
values: Array<{
|
|
57
|
+
key: string;
|
|
58
|
+
value: string;
|
|
59
|
+
}>;
|
|
60
|
+
}
|
|
61
|
+
export interface TableWidthChangeDetail {
|
|
62
|
+
column: TableColumn;
|
|
63
|
+
key: string;
|
|
64
|
+
width: number;
|
|
65
|
+
}
|
|
66
|
+
/**
|
|
67
|
+
* Data-driven table with minimum-width columns. When the sum of column widths
|
|
68
|
+
* exceeds the available space, the table scrolls horizontally within its own
|
|
69
|
+
* bounds (it never overflows its container).
|
|
70
|
+
*/
|
|
71
|
+
export declare class Table extends LitElement {
|
|
72
|
+
static styles: import("lit").CSSResult[];
|
|
73
|
+
columns: TableColumn[];
|
|
74
|
+
actionColumn?: TableActionColumn;
|
|
75
|
+
rows: Record<string, unknown>[];
|
|
76
|
+
rowKey: string;
|
|
77
|
+
emptyMessage: string;
|
|
78
|
+
maxHeight?: number;
|
|
79
|
+
selection: boolean;
|
|
80
|
+
stickySelection: boolean;
|
|
81
|
+
resizable: boolean;
|
|
82
|
+
borderless: boolean;
|
|
83
|
+
onRowClick?: (row: Record<string, unknown>, rowIndex: number) => void;
|
|
84
|
+
onSortChange?: (detail: TableSortChangeDetail) => void;
|
|
85
|
+
onSelectChange?: (detail: TableSelectionChangeDetail) => void;
|
|
86
|
+
onSearch?: (detail: TableSearchChangeDetail) => void;
|
|
87
|
+
onWidthChange?: (detail: TableWidthChangeDetail) => void;
|
|
88
|
+
private sortStates;
|
|
89
|
+
private selectedKeys;
|
|
90
|
+
private searchValues;
|
|
91
|
+
private activeSearchKeys;
|
|
92
|
+
private columnWidths;
|
|
93
|
+
private warnedSortableWithoutHandlerKey;
|
|
94
|
+
private warnedSearchableWithoutHandlerKey;
|
|
95
|
+
private warnedSelectionWithoutHandler;
|
|
96
|
+
private searchTimers;
|
|
97
|
+
private resizing;
|
|
98
|
+
private resizeColumn?;
|
|
99
|
+
private resizeStartX;
|
|
100
|
+
private resizeStartWidth;
|
|
101
|
+
firstUpdated(): void;
|
|
102
|
+
willUpdate(changedProperties: PropertyValues<this>): void;
|
|
103
|
+
updated(changedProperties: PropertyValues<this>): void;
|
|
104
|
+
/**
|
|
105
|
+
* `columns` is passed in fresh from the consumer on every change (new array/column
|
|
106
|
+
* objects, columns removed or replaced). Internal state keyed by `column.key`
|
|
107
|
+
* (resize widths, active sort, in-progress search text) would otherwise keep
|
|
108
|
+
* referencing keys that no longer exist — a slow memory leak, and a correctness
|
|
109
|
+
* bug if a key is later reused for a semantically different column. This drops
|
|
110
|
+
* any entries whose key is no longer present in the current `columns`.
|
|
111
|
+
*/
|
|
112
|
+
private _pruneStaleColumnState;
|
|
113
|
+
disconnectedCallback(): void;
|
|
114
|
+
private _effectiveWidth;
|
|
115
|
+
private _totalWidth;
|
|
116
|
+
/**
|
|
117
|
+
* Pinned (sticky) columns are laid out left-to-right in `columns` order. The selection
|
|
118
|
+
* checkbox column only joins the pinned group when `stickySelection` is explicitly set —
|
|
119
|
+
* it does not become sticky automatically just because a data column is sticky. Only the
|
|
120
|
+
* single right-most pinned cell (by its resolved `left` offset) gets the divider shadow,
|
|
121
|
+
* even if the sticky columns aren't contiguous in `columns`.
|
|
122
|
+
*/
|
|
123
|
+
private _stickyLayout;
|
|
124
|
+
private _stickyCellStyle;
|
|
125
|
+
private _stickyCellClass;
|
|
126
|
+
/** Shared by the header and body selection (checkbox) cell — kept in sync in one place. */
|
|
127
|
+
private _selectionCellClass;
|
|
128
|
+
private _selectionCellStyle;
|
|
129
|
+
private _warnSortableWithoutHandler;
|
|
130
|
+
private _warnSelectionWithoutHandler;
|
|
131
|
+
private _warnSearchableWithoutHandler;
|
|
132
|
+
private _rowSelectionKey;
|
|
133
|
+
private _selectedRows;
|
|
134
|
+
private _emitSelectionChange;
|
|
135
|
+
private _setSelectedKeys;
|
|
136
|
+
private _handleSelectAllChange;
|
|
137
|
+
private _handleRowSelectionChange;
|
|
138
|
+
private _handleRowClick;
|
|
139
|
+
private _sortDetailStates;
|
|
140
|
+
private _nextSortDirection;
|
|
141
|
+
private _handleSortClick;
|
|
142
|
+
private _handleSearchInput;
|
|
143
|
+
private _toggleSearchInput;
|
|
144
|
+
private _renderCellValue;
|
|
145
|
+
private _cellStyle;
|
|
146
|
+
private _actionCellStyle;
|
|
147
|
+
private _headerCellClass;
|
|
148
|
+
private _renderSortIndicator;
|
|
149
|
+
private _renderSearchToggle;
|
|
150
|
+
private _renderSearchInput;
|
|
151
|
+
private _renderHeaderMain;
|
|
152
|
+
private _handleResizePointerDown;
|
|
153
|
+
private _handleResizePointerMove;
|
|
154
|
+
private _handleResizePointerUp;
|
|
155
|
+
private _removeResizeListeners;
|
|
156
|
+
private _renderResizeHandle;
|
|
157
|
+
private _renderHeader;
|
|
158
|
+
private _renderRow;
|
|
159
|
+
private _renderBody;
|
|
160
|
+
private _tableClass;
|
|
161
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
162
|
+
}
|
|
163
|
+
declare global {
|
|
164
|
+
interface HTMLElementTagNameMap {
|
|
165
|
+
"logosphere-table": Table;
|
|
166
|
+
}
|
|
167
|
+
}
|