@logosphere-ui/core 0.0.0-alpha.23 → 0.0.0-alpha.25
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 +1118 -0
- package/dist/AGENTS.md +1118 -0
- package/dist/atoms/Badge/badge.d.ts +1 -1
- package/dist/atoms/FormField/formfield.d.ts +3 -0
- package/dist/badge-CGgnn_UN.js +72 -0
- package/dist/badge-DXBwR32c.cjs +13 -0
- package/dist/badge.cjs +1 -1
- package/dist/badge.js +1 -1
- package/dist/button-BBf5JAD-.js +58 -0
- package/dist/button-BryTzF74.cjs +10 -0
- package/dist/button.cjs +1 -1
- package/dist/button.js +1 -1
- package/dist/{calendar-WZ_GQvnn.js → calendar-BiJlAmA6.js} +1 -1
- package/dist/{calendar-LMn1ZF3N.cjs → calendar-D5W-t26J.cjs} +1 -1
- package/dist/calendar.cjs +1 -1
- package/dist/calendar.js +1 -1
- package/dist/{card-KiNHfEi2.cjs → card-C8G9YXhU.cjs} +1 -1
- package/dist/{card-CNoTUaJC.js → card-RWV7CumH.js} +1 -1
- package/dist/card.cjs +1 -1
- package/dist/card.js +1 -1
- package/dist/chatbot-BfzuCerB.cjs +183 -0
- package/dist/{chatbot-B1Yb35Rp.js → chatbot-CDtwNwGX.js} +146 -84
- package/dist/chatbot.cjs +1 -1
- package/dist/chatbot.js +1 -1
- package/dist/{combobox-C6zoQopK.cjs → combobox-BrANDiaM.cjs} +4 -4
- package/dist/{combobox-LBU6VHLi.js → combobox-D5QdM3ue.js} +22 -10
- package/dist/combobox.cjs +1 -1
- package/dist/combobox.js +1 -1
- package/dist/{datepicker-CwDDA6np.cjs → datepicker-CxKs90IQ.cjs} +1 -1
- package/dist/{datepicker-SwKsdw3S.js → datepicker-DZsZdSCv.js} +3 -3
- package/dist/datepicker.cjs +1 -1
- package/dist/datepicker.js +1 -1
- package/dist/{drawer-DVINJB4a.js → drawer-D_qOdapq.js} +2 -2
- package/dist/drawer-s1BLy2Xe.cjs +25 -0
- package/dist/drawer.cjs +1 -1
- package/dist/drawer.js +1 -1
- package/dist/{formfield-CNh4mBSs.js → formfield-BZOK4Pkz.js} +23 -16
- package/dist/formfield-HIqosWPz.cjs +33 -0
- package/dist/formfield.cjs +1 -1
- package/dist/formfield.js +1 -1
- package/dist/index.cjs +119 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.js +358 -41
- package/dist/index.umd.js +404 -196
- package/dist/input-CG6RsUJs.js +257 -0
- package/dist/input-DgGaco-Y.cjs +59 -0
- 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-DBcncBN8.cjs → leftmenu-BSVpwbyD.cjs} +1 -1
- package/dist/{leftmenu-C-q1h_2U.js → leftmenu-DJE2N5kl.js} +7 -7
- package/dist/{modal-DU1sszVn.cjs → modal-3-TNUICH.cjs} +1 -1
- package/dist/{modal-B8aQyCBg.js → modal-BhhhXCEK.js} +1 -1
- package/dist/modal.cjs +1 -1
- package/dist/modal.js +1 -1
- package/dist/molecules/Input/input.d.ts +4 -0
- package/dist/molecules/Textarea/text-area.d.ts +5 -1
- package/dist/molecules/TimePicker/index.d.ts +2 -0
- package/dist/molecules/TimePicker/timepicker.d.ts +62 -0
- package/dist/organisms/Chatbot/chatbot.d.ts +7 -0
- package/dist/organisms/Combobox/combobox.d.ts +2 -0
- package/dist/organisms/Toast/index.d.ts +2 -0
- package/dist/organisms/Toast/toast-container.d.ts +42 -0
- package/dist/organisms/Toast/toast.d.ts +48 -0
- package/dist/styles/main.css +89 -83
- package/dist/text-area-Bz62kq2S.cjs +51 -0
- package/dist/text-area-CG0gBXni.js +235 -0
- package/dist/textarea.cjs +1 -1
- package/dist/textarea.js +1 -1
- package/dist/toast-container-Br8TDkFh.js +274 -0
- package/dist/toast-container-DsEbVrT7.cjs +64 -0
- package/dist/toast.cjs +1 -0
- package/dist/toast.js +6 -0
- package/dist/{tree-menu-BbX8GK_z.js → tree-menu-B39KDvKV.js} +2 -2
- package/dist/tree-menu-BZEOD4_f.cjs +47 -0
- package/dist/tree-menu.cjs +1 -1
- package/dist/tree-menu.js +1 -1
- package/dist/ui-icon-BRl1UmIf.cjs +22 -0
- package/dist/ui-icon-CFvsDv0z.js +66 -0
- package/package.json +21 -11
- package/dist/badge-7IIatiRv.cjs +0 -13
- package/dist/badge-B2chRYGd.js +0 -72
- package/dist/button-BqOMevro.js +0 -58
- package/dist/button-CDRccsk9.cjs +0 -10
- package/dist/chatbot-CweQSDtr.cjs +0 -161
- package/dist/drawer-BvcPd5nz.cjs +0 -25
- package/dist/formfield-BFOIEicR.cjs +0 -33
- package/dist/input-JpAWN-M1.cjs +0 -59
- package/dist/input-jmbvgWEq.js +0 -212
- package/dist/text-area-CZDdxbrN.cjs +0 -46
- package/dist/text-area-Dec_k4rs.js +0 -205
- package/dist/tree-menu-B1iwfHyd.cjs +0 -47
- package/dist/ui-icon-Bys4HYSQ.js +0 -57
- package/dist/ui-icon-DWh1MhBa.cjs +0 -22
|
@@ -2,13 +2,13 @@ import { unsafeCSS as u, css as m, LitElement as _, nothing as c, html as n } fr
|
|
|
2
2
|
import { property as s, state as p, query as b, customElement as f } from "lit/decorators.js";
|
|
3
3
|
import { createPopper as g } from "@popperjs/core";
|
|
4
4
|
import "./checkbox-g6kl2jGR.js";
|
|
5
|
-
import "./formfield-
|
|
6
|
-
import "./ui-icon-
|
|
7
|
-
const x = '.combobox{display:flex;flex-direction:column;gap:var(--spacing-1);font-family:var(--font-family-base);width:100%}.combobox__label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-body-text)}.combobox__label--required:after{content:" *";color:var(--color-primary)}.combobox__readonly{border:none;background:transparent;font-size:var(--font-size-sm);color:var(--color-body-text);padding:0;outline:none;font-family:var(--font-family-base)}.combobox__wrapper{position:relative;width:100%;cursor:pointer}.combobox__trigger{display:flex;align-items:center;justify-content:space-between;width:100%;gap:var(--spacing-2);padding:0;border:none;border-radius:0;background-color:transparent;cursor:pointer;overflow:hidden;font-size:var(--font-size-sm);color:var(--color-body-text);transition:color var(--transition-speed-fast) var(--transition-timing);box-sizing:border-box}.combobox__trigger--default{min-height:20px}.combobox__trigger--large{min-height:24px;font-size:var(--font-size-base)}.combobox__trigger--open{color:var(--color-body-text)}.combobox__trigger--readonly{cursor:default;color:var(--color-tertiary)}.combobox__trigger--disabled{cursor:not-allowed;color:var(--color-tertiary)}.combobox__trigger--readonly .combobox__chevron,.combobox__trigger--disabled .combobox__chevron{opacity:.3}.combobox__placeholder{color:var(--color-tertiary);font-size:var(--font-size-sm);flex:1}.combobox__single-value{flex:1;font-size:var(--font-size-sm);color:var(--color-body-text)}.combobox__chevron{display:inline-flex;align-items:center;justify-content:center;color:var(--color-tertiary);flex-shrink:0;transition:transform var(--transition-speed-fast) var(--transition-timing);position:absolute;right:var(--spacing-3)}.combobox__chevron--open{transform:rotate(180deg)}.combobox__tags{display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-1);flex:1;overflow:hidden}.combobox__tag{display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background-color:var(--color-tertiary-bg);border-radius:var(--radius-sm);font-size:var(--font-size-xs);color:var(--color-body-text);white-space:nowrap}.combobox__tag-remove{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:0;cursor:pointer;color:var(--color-tertiary);line-height:1;transition:color var(--transition-speed-fast) var(--transition-timing)}.combobox__tag-remove:hover{color:var(--color-body-text)}.combobox__clear{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:0 12px 0 0;cursor:pointer;color:var(--color-secondary);line-height:1;flex-shrink:0;transition:color var(--transition-speed-fast) var(--transition-timing)}.combobox__clear:hover{color:var(--color-body-text)}.combobox__filter-input{flex:1;border:none;outline:none;background:transparent;font-size:var(--font-size-sm);font-family:var(--font-family-base);color:var(--color-body-text);min-width:0;padding:0;cursor:text}.combobox__filter-input:disabled{cursor:not-allowed}.combobox__filter-input::placeholder{color:var(--color-tertiary)}.combobox__filter-input--inline{flex:1;min-width:60px}.combobox__trigger--multi-filter{flex-wrap:wrap;height:auto;min-height:32px;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3)}.combobox__trigger--large.combobox__trigger--multi-filter{min-height:40px}.combobox__dropdown{width:auto;min-width:240px;background-color:var(--color-body-bg);border:1px solid var(--color-border);border-radius:var(--radius-base);box-shadow:var(--shadow-base);z-index:var(--z-index-dropdown);overflow:hidden}.combobox__search{width:100%;padding:var(--spacing-
|
|
8
|
-
var
|
|
9
|
-
for (var a = l > 1 ? void 0 : l ?
|
|
5
|
+
import "./formfield-BZOK4Pkz.js";
|
|
6
|
+
import "./ui-icon-CFvsDv0z.js";
|
|
7
|
+
const x = '.combobox{display:flex;flex-direction:column;gap:var(--spacing-1);font-family:var(--font-family-base);width:100%}.combobox__label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-body-text)}.combobox__label--required:after{content:" *";color:var(--color-primary)}.combobox__readonly{border:none;background:transparent;font-size:var(--font-size-sm);color:var(--color-body-text);padding:0;outline:none;font-family:var(--font-family-base)}.combobox__wrapper{position:relative;width:100%;cursor:pointer}.combobox__trigger{display:flex;align-items:center;justify-content:space-between;width:100%;gap:var(--spacing-2);padding:0;border:none;border-radius:0;background-color:transparent;cursor:pointer;overflow:hidden;font-size:var(--font-size-sm);color:var(--color-body-text);transition:color var(--transition-speed-fast) var(--transition-timing);box-sizing:border-box}.combobox__trigger--default{min-height:20px}.combobox__trigger--large{min-height:24px;font-size:var(--font-size-base)}.combobox__trigger--open{color:var(--color-body-text)}.combobox__trigger--readonly{cursor:default;color:var(--color-tertiary)}.combobox__trigger--disabled{cursor:not-allowed;color:var(--color-tertiary)}.combobox__trigger--readonly .combobox__chevron,.combobox__trigger--disabled .combobox__chevron{opacity:.3}.combobox__placeholder{color:var(--color-tertiary);font-size:var(--font-size-sm);flex:1}.combobox__single-value{flex:1;font-size:var(--font-size-sm);color:var(--color-body-text)}.combobox__chevron{display:inline-flex;align-items:center;justify-content:center;color:var(--color-tertiary);flex-shrink:0;transition:transform var(--transition-speed-fast) var(--transition-timing);position:absolute;right:var(--spacing-3)}.combobox__chevron--open{transform:rotate(180deg)}.combobox__tags{display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-1);flex:1;overflow:hidden}.combobox__tag{display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background-color:var(--color-tertiary-bg);border-radius:var(--radius-sm);font-size:var(--font-size-xs);color:var(--color-body-text);white-space:nowrap}.combobox__tag-remove{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:0;cursor:pointer;color:var(--color-tertiary);line-height:1;transition:color var(--transition-speed-fast) var(--transition-timing)}.combobox__tag-remove:hover{color:var(--color-body-text)}.combobox__clear{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:0 12px 0 0;cursor:pointer;color:var(--color-secondary);line-height:1;flex-shrink:0;transition:color var(--transition-speed-fast) var(--transition-timing)}.combobox__clear:hover{color:var(--color-body-text)}.combobox__filter-input{flex:1;border:none;outline:none;background:transparent;font-size:var(--font-size-sm);font-family:var(--font-family-base);color:var(--color-body-text);min-width:0;padding:0;cursor:text}.combobox__filter-input:disabled{cursor:not-allowed}.combobox__filter-input::placeholder{color:var(--color-tertiary)}.combobox__filter-input--inline{flex:1;min-width:60px}.combobox__trigger--multi-filter{flex-wrap:wrap;height:auto;min-height:32px;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3)}.combobox__trigger--large.combobox__trigger--multi-filter{min-height:40px}.combobox__dropdown[popover]{position:fixed;inset:unset;margin:0;padding:0;border:none}.combobox__dropdown{width:auto;min-width:240px;background-color:var(--color-body-bg);border:1px solid var(--color-border);border-radius:var(--radius-base);box-shadow:var(--shadow-base);z-index:var(--z-index-dropdown);overflow:hidden}.combobox__search{width:100%;padding:var(--spacing-2) var(--spacing-3);border:none;border-bottom:1px solid var(--color-border);font-size:var(--font-size-sm);color:var(--color-body-text);font-family:var(--font-family-base);outline:none;box-sizing:border-box;background-color:var(--color-body-bg)}.combobox__search::placeholder{color:var(--color-tertiary)}.combobox__list{max-height:208px;overflow-y:auto}.combobox__item{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm);color:var(--color-body-text);cursor:pointer;transition:background-color var(--transition-speed-fast) var(--transition-timing)}.combobox__item:hover,.combobox__item--selected,.combobox__item--focused{background-color:var(--color-tertiary-bg)}.combobox__empty{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm);color:var(--color-tertiary);text-align:center}';
|
|
8
|
+
var v = Object.defineProperty, y = Object.getOwnPropertyDescriptor, o = (e, i, r, l) => {
|
|
9
|
+
for (var a = l > 1 ? void 0 : l ? y(i, r) : i, d = e.length - 1, h; d >= 0; d--)
|
|
10
10
|
(h = e[d]) && (a = (l ? h(i, r, a) : h(a)) || a);
|
|
11
|
-
return l && a &&
|
|
11
|
+
return l && a && v(i, r, a), a;
|
|
12
12
|
};
|
|
13
13
|
let t = class extends _ {
|
|
14
14
|
constructor() {
|
|
@@ -73,7 +73,9 @@ let t = class extends _ {
|
|
|
73
73
|
}
|
|
74
74
|
updated(e) {
|
|
75
75
|
if (e.has("isOpen") && this.isOpen && this.filterable && this.multiple && this.shadowRoot?.querySelector(".combobox__search")?.focus(), e.has("isOpen")) {
|
|
76
|
-
this.isOpen ? this.updateComplete.then(() =>
|
|
76
|
+
this.isOpen ? this.updateComplete.then(() => {
|
|
77
|
+
this._showPopover(), this._updatePopper();
|
|
78
|
+
}) : (this._hidePopover(), this._destroyPopper());
|
|
77
79
|
return;
|
|
78
80
|
}
|
|
79
81
|
this.isOpen && this._updatePopper();
|
|
@@ -171,8 +173,8 @@ let t = class extends _ {
|
|
|
171
173
|
` : n`<span class="combobox__placeholder">${this.placeholder}</span>`;
|
|
172
174
|
}
|
|
173
175
|
_renderDropdown() {
|
|
174
|
-
return
|
|
175
|
-
<div data-combobox-popper class="combobox__dropdown">
|
|
176
|
+
return n`
|
|
177
|
+
<div data-combobox-popper popover="manual" class="combobox__dropdown">
|
|
176
178
|
${this.filterable && this.multiple ? n`
|
|
177
179
|
<input
|
|
178
180
|
class="combobox__search"
|
|
@@ -210,7 +212,7 @@ let t = class extends _ {
|
|
|
210
212
|
)}
|
|
211
213
|
</div>
|
|
212
214
|
</div>
|
|
213
|
-
|
|
215
|
+
`;
|
|
214
216
|
}
|
|
215
217
|
_getPopperModifiers() {
|
|
216
218
|
return [
|
|
@@ -251,6 +253,16 @@ let t = class extends _ {
|
|
|
251
253
|
_destroyPopper() {
|
|
252
254
|
this._popperInstance && (this._popperInstance.destroy(), this._popperInstance = void 0);
|
|
253
255
|
}
|
|
256
|
+
_showPopover() {
|
|
257
|
+
this._dropdownElement?.showPopover?.();
|
|
258
|
+
}
|
|
259
|
+
_hidePopover() {
|
|
260
|
+
const e = this._dropdownElement;
|
|
261
|
+
try {
|
|
262
|
+
e?.hidePopover?.();
|
|
263
|
+
} catch {
|
|
264
|
+
}
|
|
265
|
+
}
|
|
254
266
|
// ==================== MAIN RENDER ====================
|
|
255
267
|
render() {
|
|
256
268
|
const e = [
|
package/dist/combobox.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./combobox-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./combobox-BrANDiaM.cjs");Object.defineProperty(exports,"Combobox",{enumerable:!0,get:()=>e.Combobox});
|
package/dist/combobox.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const s=require("lit"),r=require("lit/decorators.js"),d=require("lit/directives/live.js"),u=require("@popperjs/core");require("./formfield-
|
|
1
|
+
"use strict";const s=require("lit"),r=require("lit/decorators.js"),d=require("lit/directives/live.js"),u=require("@popperjs/core");require("./formfield-HIqosWPz.cjs");const h=require("./calendar-D5W-t26J.cjs");require("./ui-icon-BRl1UmIf.cjs");const _=require("dayjs"),c=".dp{display:block;position:relative;width:100%;font-family:var(--font-family-base)}.dp__field,.dp__reference{width:100%}.dp__input{width:100%;border:none;outline:none;background:transparent;font-size:var(--font-size-sm);font-family:var(--font-family-base);color:var(--color-body-text);line-height:1.5}.dp__input::placeholder{color:var(--color-tertiary)}.dp__input:disabled{cursor:not-allowed}.dp__icon-btn{border:none;background:transparent;color:var(--color-gray-400);cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center;line-height:1;transition:color var(--transition-speed-fast) var(--transition-timing)}.dp__icon-btn_suffix{padding-right:var(--spacing-1)}.dp__icon-btn:hover{color:var(--color-gray-600)}.dp__icon-btn:disabled{cursor:not-allowed;opacity:.5}.dp__popup{background-color:var(--color-body-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);z-index:var(--z-index-dropdown);padding:var(--spacing-4);box-sizing:border-box;overflow:hidden;max-height:calc(100vh - 16px)}";var g=Object.defineProperty,f=Object.getOwnPropertyDescriptor,i=(p,e,t,a)=>{for(var n=a>1?void 0:a?f(e,t):e,o=p.length-1,l;o>=0;o--)(l=p[o])&&(n=(a?l(e,t,n):l(n))||n);return a&&n&&g(e,t,n),n};let y=0;const m=()=>`dp-${++y}`;exports.LogosphereDatePicker=class extends s.LitElement{constructor(){super(...arguments),this.value=null,this.min=null,this.max=null,this.required=!1,this.disabled=!1,this.readonly=!1,this.expandFactor=1.05,this.placeholder="GG/AA/YYYY veya GG.AA.YYYY",this.label="",this.helper="",this.error="",this.size="default",this.variant="default",this.rangeMode=!1,this.disabledDays=[],this.rangeStart=null,this.rangeEnd=null,this._open=!1,this._rangeStart=null,this._rangeEnd=null,this._hasError=!1,this._errorMsg="",this._inputDraft=null,this._errorTimer=null,this.inputId=m(),this._outsideClick=e=>{this._open&&(e.composedPath().includes(this)||(this._parseAndSetDate(),this._toggleOpen(!1)))},this._openDropdown=()=>{this._toggleOpen(!0)},this._onBlur=()=>{this._parseAndSetDate()}}willUpdate(e){e.has("rangeStart")&&(this._rangeStart=this.rangeStart),e.has("rangeEnd")&&(this._rangeEnd=this.rangeEnd),e.has("value")&&!this._isInputFocused()&&(this._inputDraft=null)}connectedCallback(){super.connectedCallback(),window.addEventListener("click",this._outsideClick,!0)}disconnectedCallback(){window.removeEventListener("click",this._outsideClick,!0),this._destroyPopper(),this._errorTimer&&clearTimeout(this._errorTimer),super.disconnectedCallback()}updated(e){if(super.updated(e),e.has("_open")){this._open?this._updatePopper():this._destroyPopper();return}this._open&&this._updatePopper()}_safeDay(e){return h.safeDay(e)}_isInputFocused(){return this.shadowRoot?.activeElement===this._inputElement}_withinBounds(e){const t=this._safeDay(this.min),a=this._safeDay(this.max);return!(t&&e.isBefore(t,"day")||a&&e.isAfter(a,"day")||this.disabledDays.includes(e.day()))}_displayValue(){if(this.rangeMode&&this._rangeStart&&this._rangeEnd){const t=this._safeDay(this._rangeStart),a=this._safeDay(this._rangeEnd);if(t&&a)return`${t.format("DD/MM/YYYY")} - ${a.format("DD/MM/YYYY")}`}const e=this._safeDay(this.value);return e?e.format("DD/MM/YYYY"):""}_inputValue(){return this._inputDraft??this._displayValue()}_emitChange(e){this.value=e,this.dispatchEvent(new CustomEvent("change",{detail:{value:e}})),this.onChange?.(e)}_emitRangeChange(){if(!this._rangeStart||!this._rangeEnd)return;const e={start:this._rangeStart,end:this._rangeEnd};this.dispatchEvent(new CustomEvent("rangeChange",{detail:e})),this.onRangeChange?.(e)}_showInputError(e){this._errorTimer&&clearTimeout(this._errorTimer),this._hasError=!0,this._errorMsg=e,this._errorTimer=setTimeout(()=>this._clearInputError(),3e3)}_clearInputError(){this._hasError=!1,this._errorMsg="",this._errorTimer&&(clearTimeout(this._errorTimer),this._errorTimer=null)}_toggleOpen(e){if(this.disabled)return;const t=e??!this._open;this._open=t,t&&this.updateComplete.then(()=>this._updatePopper())}_onInput(e){const t=e.target.value;this._inputDraft=t,t.trim()||(this._emitChange(null),this.rangeMode&&(this._rangeStart=null,this._rangeEnd=null)),this._clearInputError()}_parseSingleDate(e){for(const t of h.DATE_FORMATS){const a=_(e,t,!0);if(a.isValid())return a}return this._safeDay(e)}_parseRangeInput(e){const t=e.split(/\s+-\s+/);if(t.length!==2)return null;const a=this._parseSingleDate(t[0].trim()),n=this._parseSingleDate(t[1].trim());return!a||!n?null:a.isAfter(n,"day")?{start:n,end:a}:{start:a,end:n}}_onKeydown(e){(e.key==="Tab"||e.key==="Enter")&&this._parseAndSetDate()}_parseAndSetDate(){const e=this._inputElement;if(!e)return;const t=e.value.trim();if(!t){if(this.rangeMode&&this._rangeStart&&!this._rangeEnd)return;this._emitChange(null),this.rangeMode&&(this._rangeStart=null,this._rangeEnd=null),this._inputDraft=null;return}if(this.rangeMode){const n=this._parseRangeInput(t);if(n){if(this._withinBounds(n.start)&&this._withinBounds(n.end)){this._rangeStart=n.start.format("YYYY-MM-DD"),this._rangeEnd=n.end.format("YYYY-MM-DD"),this._inputDraft=null,this._clearInputError(),this._emitRangeChange();return}this._showInputError("Seçilen aralık sınırlar dışında.");return}const o=this._parseSingleDate(t);if(o&&this._withinBounds(o)){this._rangeStart=o.format("YYYY-MM-DD"),this._rangeEnd=null,this._inputDraft=null,this._clearInputError();return}this._showInputError("Geçersiz aralık formatı. Örnek: 19/09/2025 - 25/09/2025");return}const a=this._parseSingleDate(t);a&&this._withinBounds(a)?(this._emitChange(a.format("YYYY-MM-DD")),this._inputDraft=null,this._clearInputError()):this._showInputError("Geçersiz tarih formatı. Örnek: 19/09/2025")}_updatePopper(){if(!this._open||!this.isConnected)return;const e=this._referenceElement,t=this._popupElement;if(!e||!t)return;const a=Math.max(270,Math.round(e.getBoundingClientRect().width*(this.expandFactor||1)));if(t.style.width=`${a}px`,this._popperInstance){this._popperInstance.setOptions({placement:"bottom",strategy:"fixed",modifiers:this._getPopperModifiers()}),this._popperInstance.update();return}this._popperInstance=u.createPopper(e,t,{placement:"bottom",strategy:"fixed",modifiers:this._getPopperModifiers()})}_getPopperModifiers(){return[{name:"offset",options:{offset:[0,8]}},{name:"preventOverflow",options:{padding:8}},{name:"flip",options:{padding:8,fallbackPlacements:["top-start","right-start","left-start","bottom-end","top-end","right-end","left-end"]}}]}_destroyPopper(){this._popperInstance&&(this._popperInstance.destroy(),this._popperInstance=void 0)}_handleCalendarChange(e){this._emitChange(e.detail.value),this._inputDraft=null,this._toggleOpen(!1)}_handleCalendarRangeChange(e){this._rangeStart=e.detail.start,this._rangeEnd=e.detail.end,this._inputDraft=null,this._emitRangeChange(),this._toggleOpen(!1)}_handleCalendarStateChange(e){this._rangeStart=e.detail.rangeStart,this._rangeEnd=e.detail.rangeEnd}_handleSuffixClick(e){e.stopPropagation(),this._openDropdown(),this._inputElement?.focus()}_handleClearClick(e){e.stopPropagation(),this._emitChange(null),this._rangeStart=null,this._rangeEnd=null,this._inputDraft=null,this._clearInputError(),this._inputElement?.focus()}render(){const e=this.error||(this._hasError?this._errorMsg:""),t=!!this._displayValue();return s.html`
|
|
2
2
|
<div class="dp">
|
|
3
3
|
<div class="dp__reference">
|
|
4
4
|
<logosphere-formfield
|
|
@@ -2,9 +2,9 @@ import { unsafeCSS as c, css as g, LitElement as f, nothing as _, html as d } fr
|
|
|
2
2
|
import { property as a, state as l, query as u, customElement as m } from "lit/decorators.js";
|
|
3
3
|
import { live as y } from "lit/directives/live.js";
|
|
4
4
|
import { createPopper as b } from "@popperjs/core";
|
|
5
|
-
import "./formfield-
|
|
6
|
-
import { s as v, D as E } from "./calendar-
|
|
7
|
-
import "./ui-icon-
|
|
5
|
+
import "./formfield-BZOK4Pkz.js";
|
|
6
|
+
import { s as v, D as E } from "./calendar-BiJlAmA6.js";
|
|
7
|
+
import "./ui-icon-CFvsDv0z.js";
|
|
8
8
|
import D from "dayjs";
|
|
9
9
|
const S = ".dp{display:block;position:relative;width:100%;font-family:var(--font-family-base)}.dp__field,.dp__reference{width:100%}.dp__input{width:100%;border:none;outline:none;background:transparent;font-size:var(--font-size-sm);font-family:var(--font-family-base);color:var(--color-body-text);line-height:1.5}.dp__input::placeholder{color:var(--color-tertiary)}.dp__input:disabled{cursor:not-allowed}.dp__icon-btn{border:none;background:transparent;color:var(--color-gray-400);cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center;line-height:1;transition:color var(--transition-speed-fast) var(--transition-timing)}.dp__icon-btn_suffix{padding-right:var(--spacing-1)}.dp__icon-btn:hover{color:var(--color-gray-600)}.dp__icon-btn:disabled{cursor:not-allowed;opacity:.5}.dp__popup{background-color:var(--color-body-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);z-index:var(--z-index-dropdown);padding:var(--spacing-4);box-sizing:border-box;overflow:hidden;max-height:calc(100vh - 16px)}";
|
|
10
10
|
var C = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, i = (t, e, n, s) => {
|
package/dist/datepicker.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./datepicker-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./datepicker-CxKs90IQ.cjs");Object.defineProperty(exports,"LogosphereDatePicker",{enumerable:!0,get:()=>e.LogosphereDatePicker});
|
package/dist/datepicker.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { unsafeCSS as c, css as p, LitElement as h, html as w } from "lit";
|
|
2
2
|
import { property as l, customElement as _ } from "lit/decorators.js";
|
|
3
|
-
import "./ui-icon-
|
|
4
|
-
const m = ":host{display:block}.drawer{position:relative;font-family:var(--font-family-base)}.drawer__trigger{display:inline-flex}.drawer__panel{position:fixed;top:0;bottom:0;width:var(--drawer-width, 360px);max-width:min(100vw,var(--drawer-width, 360px));background:var(--color-body-bg);border-left:1px solid var(--color-border);box-shadow:var(--shadow-lg);z-index:var(--z-index-modal);display:flex;flex-direction:column;pointer-events:none;opacity:0;transition:transform var(--transition-speed-slow) var(--transition-timing),opacity var(--transition-speed-slow) linear}.drawer__panel--right{right:0;transform:translate(100%)}.drawer__panel--left{left:0;transform:translate(-100%);border-left:none;border-right:1px solid var(--color-border)}.drawer__panel--open{transform:translate(0);pointer-events:auto;opacity:1}.drawer__header{padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-2)}.drawer__title{margin:0;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-body-
|
|
3
|
+
import "./ui-icon-CFvsDv0z.js";
|
|
4
|
+
const m = ":host{display:block}.drawer{position:relative;font-family:var(--font-family-base)}.drawer__trigger{display:inline-flex}.drawer__panel{position:fixed;top:0;bottom:0;width:var(--drawer-width, 360px);max-width:min(100vw,var(--drawer-width, 360px));background:var(--color-body-bg);border-left:1px solid var(--color-border);box-shadow:var(--shadow-lg);z-index:var(--z-index-modal);display:flex;flex-direction:column;pointer-events:none;opacity:0;transition:transform var(--transition-speed-slow) var(--transition-timing),opacity var(--transition-speed-slow) linear}.drawer__panel--right{right:0;transform:translate(100%)}.drawer__panel--left{left:0;transform:translate(-100%);border-left:none;border-right:1px solid var(--color-border)}.drawer__panel--open{transform:translate(0);pointer-events:auto;opacity:1}.drawer__header{padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-2)}.drawer__title{margin:0;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-body-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drawer__close{width:28px;height:28px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-body-bg);display:inline-flex;align-items:center;justify-content:center;color:var(--color-body-color);cursor:pointer}.drawer__close:hover{background:var(--color-tertiary)}.drawer__body{flex:1;overflow:auto;padding:var(--spacing-4)}";
|
|
5
5
|
var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, s = (e, t, r, n) => {
|
|
6
6
|
for (var o = n > 1 ? void 0 : n ? v(t, r) : t, a = e.length - 1, d; a >= 0; a--)
|
|
7
7
|
(d = e[a]) && (o = (n ? d(t, r, o) : d(o)) || o);
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";const l=require("lit"),i=require("lit/decorators.js");require("./ui-icon-BRl1UmIf.cjs");const c=":host{display:block}.drawer{position:relative;font-family:var(--font-family-base)}.drawer__trigger{display:inline-flex}.drawer__panel{position:fixed;top:0;bottom:0;width:var(--drawer-width, 360px);max-width:min(100vw,var(--drawer-width, 360px));background:var(--color-body-bg);border-left:1px solid var(--color-border);box-shadow:var(--shadow-lg);z-index:var(--z-index-modal);display:flex;flex-direction:column;pointer-events:none;opacity:0;transition:transform var(--transition-speed-slow) var(--transition-timing),opacity var(--transition-speed-slow) linear}.drawer__panel--right{right:0;transform:translate(100%)}.drawer__panel--left{left:0;transform:translate(-100%);border-left:none;border-right:1px solid var(--color-border)}.drawer__panel--open{transform:translate(0);pointer-events:auto;opacity:1}.drawer__header{padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-2)}.drawer__title{margin:0;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-body-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drawer__close{width:28px;height:28px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-body-bg);display:inline-flex;align-items:center;justify-content:center;color:var(--color-body-color);cursor:pointer}.drawer__close:hover{background:var(--color-tertiary)}.drawer__body{flex:1;overflow:auto;padding:var(--spacing-4)}";var p=Object.defineProperty,h=Object.getOwnPropertyDescriptor,s=(d,e,r,t)=>{for(var o=t>1?void 0:t?h(e,r):e,a=d.length-1,n;a>=0;a--)(n=d[a])&&(o=(t?n(e,r,o):n(o))||o);return t&&o&&p(e,r,o),o};exports.Drawer=class extends l.LitElement{constructor(){super(...arguments),this.open=!1,this.title="",this.position="right",this.width=360,this.closeOnEsc=!0,this.containerSelector="",this._frameStyle="",this._onKeyDown=e=>{!this.open||!this.closeOnEsc||(e.key==="Escape"||e.key==="Esc")&&this._setOpen(!1)},this._onTriggerClick=()=>this._setOpen(!0),this._onCloseClick=()=>this._setOpen(!1),this._syncFrame=()=>{const e=this._resolveContainer().getBoundingClientRect(),r=Math.max(0,e.top),t=Math.max(0,window.innerHeight-e.bottom),o=Math.max(0,e.left),a=Math.max(0,window.innerWidth-e.right),n=Math.max(0,e.width);this._frameStyle=this.position==="right"?`top:${r}px;bottom:${t}px;right:${a}px;max-width:${n}px;`:`top:${r}px;bottom:${t}px;left:${o}px;max-width:${n}px;`}}connectedCallback(){super.connectedCallback(),window.addEventListener("keydown",this._onKeyDown,!0),window.addEventListener("resize",this._syncFrame),window.addEventListener("scroll",this._syncFrame,!0),this.updateComplete.then(()=>this._syncFrame())}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("keydown",this._onKeyDown,!0),window.removeEventListener("resize",this._syncFrame),window.removeEventListener("scroll",this._syncFrame,!0)}updated(e){(e.has("open")||e.has("position")||e.has("width")||e.has("containerSelector"))&&this._syncFrame()}openDrawer(){this._setOpen(!0)}closeDrawer(){this._setOpen(!1)}_setOpen(e){this.open!==e&&(this.open=e,this.dispatchEvent(new CustomEvent(e?"drawer-open":"drawer-close",{bubbles:!0,composed:!0})))}_resolveContainer(){if(this.containerSelector){const e=this.getRootNode();if("querySelector"in e){const t=e.querySelector(this.containerSelector);if(t)return t}const r=document.querySelector(this.containerSelector);if(r)return r}return this.parentElement??this}render(){return l.html`
|
|
2
|
+
<div class="drawer">
|
|
3
|
+
<div class="drawer__trigger" @click=${this._onTriggerClick}>
|
|
4
|
+
<slot name="trigger"></slot>
|
|
5
|
+
</div>
|
|
6
|
+
|
|
7
|
+
<aside
|
|
8
|
+
class="drawer__panel drawer__panel--${this.position} ${this.open?"drawer__panel--open":""}"
|
|
9
|
+
style=${`--drawer-width:${this.width}px;${this._frameStyle}`}
|
|
10
|
+
role="dialog"
|
|
11
|
+
aria-modal="false"
|
|
12
|
+
aria-hidden=${this.open?"false":"true"}
|
|
13
|
+
>
|
|
14
|
+
<div class="drawer__header">
|
|
15
|
+
<h3 class="drawer__title">${this.title}</h3>
|
|
16
|
+
<button class="drawer__close" type="button" aria-label="Close drawer" @click=${this._onCloseClick}>
|
|
17
|
+
<ui-icon name="uil-times" size="16"></ui-icon>
|
|
18
|
+
</button>
|
|
19
|
+
</div>
|
|
20
|
+
<div class="drawer__body">
|
|
21
|
+
<slot></slot>
|
|
22
|
+
</div>
|
|
23
|
+
</aside>
|
|
24
|
+
</div>
|
|
25
|
+
`}};exports.Drawer.styles=[l.css`${l.unsafeCSS(c)}`];s([i.property({type:Boolean,reflect:!0})],exports.Drawer.prototype,"open",2);s([i.property({type:String})],exports.Drawer.prototype,"title",2);s([i.property({type:String})],exports.Drawer.prototype,"position",2);s([i.property({type:Number})],exports.Drawer.prototype,"width",2);s([i.property({type:Boolean})],exports.Drawer.prototype,"closeOnEsc",2);s([i.property({type:String})],exports.Drawer.prototype,"containerSelector",2);exports.Drawer=s([i.customElement("logosphere-drawer")],exports.Drawer);
|
package/dist/drawer.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./drawer-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./drawer-s1BLy2Xe.cjs");Object.defineProperty(exports,"Drawer",{enumerable:!0,get:()=>e.Drawer});
|
package/dist/drawer.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { unsafeCSS as h, css as
|
|
2
|
-
import { property as i, state as f, customElement as
|
|
3
|
-
const m = ":host{display:block}.formfield{position:relative;font-family:var(--font-family-base)}.formfield__label{display:block;font-size:
|
|
4
|
-
var g = Object.defineProperty, v = Object.getOwnPropertyDescriptor, o = (e, r,
|
|
5
|
-
for (var
|
|
6
|
-
(c = e[d]) && (
|
|
7
|
-
return a &&
|
|
1
|
+
import { unsafeCSS as h, css as p, LitElement as _, html as n } from "lit";
|
|
2
|
+
import { property as i, state as f, customElement as u } from "lit/decorators.js";
|
|
3
|
+
const m = ":host{display:block}.formfield{position:relative;font-family:var(--font-family-base)}.formfield__label{display:block;font-size:12px;line-height:1.125rem;letter-spacing:-.12px;font-weight:var(--font-weight-medium);color:var(--color-tertiary);margin-bottom:var(--spacing-1)}.formfield__required{color:var(--color-danger);margin-left:var(--spacing-1)}.formfield__container{position:relative;display:flex;align-items:center;box-sizing:border-box;border-radius:var(--radius-base);border:1px solid var(--color-border);padding:0 var(--spacing-2) 0 var(--spacing-3);background-color:var(--color-body-bg);cursor:text;transition:border-color var(--transition-speed-base) var(--transition-timing),background-color var(--transition-speed-base) var(--transition-timing)}.formfield__container--cursor-text{cursor:text}.formfield__container--cursor-pointer{cursor:pointer}.formfield__container--cursor-default{cursor:default}.formfield__container--default{min-height:32px}.formfield__container--large{min-height:40px}.formfield__container--multiline{align-items:flex-start;min-height:64px;padding-top:var(--spacing-2);padding-bottom:var(--spacing-2)}.formfield__container--hovered:not(.formfield__container--focused):not(.formfield__container--error):not(.formfield__container--disabled){background-color:var(--color-tertiary-bg)}.formfield__container--focused{border-color:var(--color-body-text);background-color:var(--color-body-bg)}.formfield__container--error{border-color:var(--color-danger)}.formfield__container--disabled{background-color:var(--color-body-bg);opacity:.4;cursor:not-allowed;pointer-events:none}.formfield__container--subtle:not(.formfield__container--focused):not(.formfield__container--error){border-color:transparent;background-color:var(--color-tertiary-bg)}.formfield__input-area{flex:1;min-width:0;display:flex;align-items:center}.formfield__container--multiline .formfield__input-area{align-items:flex-start;align-self:stretch}.formfield__prefix,.formfield__clear,.formfield__suffix{display:flex;align-items:center;flex-shrink:0;align-self:stretch}.formfield__container--multiline .formfield__clear,.formfield__container--multiline .formfield__suffix{align-items:flex-start}.formfield__prefix{margin-right:var(--spacing-2)}.formfield__clear,.formfield__suffix{margin-left:var(--spacing-2)}.formfield__container--has-prefix .formfield__prefix{border-right:1px solid var(--color-border);padding-right:var(--spacing-2)}.formfield__container--has-suffix .formfield__suffix{border-left:1px solid var(--color-border);padding-left:var(--spacing-2)}.formfield__prefix:empty,.formfield__clear:empty,.formfield__suffix:empty{display:none}.formfield__helper{font-size:11px;line-height:1rem;letter-spacing:-.11px;font-weight:var(--font-weight-regular);color:var(--color-tertiary);margin-top:var(--spacing-1)}.formfield__error{font-size:11px;line-height:1rem;letter-spacing:-.11px;font-weight:var(--font-weight-regular);color:var(--color-danger);margin-top:var(--spacing-1)}::slotted(input),::slotted(textarea){width:100%;border:none;outline:none;background:transparent;font-family:inherit;font-size:14px;line-height:1.25rem;letter-spacing:-.14px;color:var(--color-body-text)}::slotted(input:disabled),::slotted(textarea:disabled){cursor:not-allowed}";
|
|
4
|
+
var g = Object.defineProperty, v = Object.getOwnPropertyDescriptor, o = (e, r, s, a) => {
|
|
5
|
+
for (var l = a > 1 ? void 0 : a ? v(r, s) : r, d = e.length - 1, c; d >= 0; d--)
|
|
6
|
+
(c = e[d]) && (l = (a ? c(r, s, l) : c(l)) || l);
|
|
7
|
+
return a && l && g(r, s, l), l;
|
|
8
8
|
};
|
|
9
|
-
let t = class extends
|
|
9
|
+
let t = class extends _ {
|
|
10
10
|
constructor() {
|
|
11
|
-
super(...arguments), this.label = "", this.helper = "", this.error = "", this.placeholder = "", this.size = "default", this.variant = "default", this.cursor = "text", this.required = !1, this.disabled = !1, this.readonly = !1, this._focused = !1, this._hovered = !1, this._hasPrefix = !1, this._hasSuffix = !1, this.handleSlotFocus = (e) => {
|
|
11
|
+
super(...arguments), this.label = "", this.helper = "", this.error = "", this.placeholder = "", this.size = "default", this.variant = "default", this.cursor = "text", this.required = !1, this.disabled = !1, this.readonly = !1, this.multiline = !1, this.forceFocused = !1, this._focused = !1, this._hovered = !1, this._hasPrefix = !1, this._hasSuffix = !1, this.handleSlotFocus = (e) => {
|
|
12
12
|
const r = e.target;
|
|
13
13
|
["INPUT", "TEXTAREA", "SELECT"].includes(r.tagName) && (this._focused = !0, this.dispatchEvent(new CustomEvent("field-focus", {
|
|
14
14
|
bubbles: !0,
|
|
@@ -29,7 +29,7 @@ let t = class extends u {
|
|
|
29
29
|
}, this.handleContainerClick = (e) => {
|
|
30
30
|
const r = e.target;
|
|
31
31
|
if (["INPUT", "TEXTAREA", "SELECT", "BUTTON"].includes(r.tagName)) return;
|
|
32
|
-
this.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({ flatten: !0 }).find((
|
|
32
|
+
this.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({ flatten: !0 }).find((l) => ["INPUT", "TEXTAREA", "SELECT"].includes(l.tagName))?.focus();
|
|
33
33
|
}, this.handlePrefixSlotChange = (e) => {
|
|
34
34
|
const r = e.target;
|
|
35
35
|
this._hasPrefix = r.assignedElements({ flatten: !0 }).length > 0;
|
|
@@ -49,17 +49,18 @@ let t = class extends u {
|
|
|
49
49
|
super.disconnectedCallback(), this.removeEventListener("focus", this.handleSlotFocus, !0), this.removeEventListener("blur", this.handleSlotBlur, !0);
|
|
50
50
|
}
|
|
51
51
|
render() {
|
|
52
|
-
const e = !!this.error, r = !e && !!this.helper,
|
|
52
|
+
const e = !!this.error, r = !e && !!this.helper, s = [
|
|
53
53
|
"formfield__container",
|
|
54
54
|
`formfield__container--${this.size}`,
|
|
55
55
|
`formfield__container--cursor-${this.cursor}`,
|
|
56
56
|
this._hasPrefix ? "formfield__container--has-prefix" : "",
|
|
57
57
|
this._hasSuffix ? "formfield__container--has-suffix" : "",
|
|
58
58
|
e ? "formfield__container--error" : "",
|
|
59
|
-
this._focused ? "formfield__container--focused" : "",
|
|
59
|
+
this._focused || this.forceFocused ? "formfield__container--focused" : "",
|
|
60
60
|
this._hovered ? "formfield__container--hovered" : "",
|
|
61
61
|
this.disabled ? "formfield__container--disabled" : "",
|
|
62
|
-
this.variant === "subtle" ? "formfield__container--subtle" : ""
|
|
62
|
+
this.variant === "subtle" ? "formfield__container--subtle" : "",
|
|
63
|
+
this.multiline ? "formfield__container--multiline" : ""
|
|
63
64
|
].filter(Boolean).join(" ");
|
|
64
65
|
return n`
|
|
65
66
|
<div class="formfield">
|
|
@@ -71,7 +72,7 @@ let t = class extends u {
|
|
|
71
72
|
` : ""}
|
|
72
73
|
|
|
73
74
|
<div
|
|
74
|
-
class="${
|
|
75
|
+
class="${s}"
|
|
75
76
|
@mouseenter=${this.handleMouseEnter}
|
|
76
77
|
@mouseleave=${this.handleMouseLeave}
|
|
77
78
|
@click=${this.handleContainerClick}
|
|
@@ -96,7 +97,7 @@ let t = class extends u {
|
|
|
96
97
|
`;
|
|
97
98
|
}
|
|
98
99
|
};
|
|
99
|
-
t.styles = [
|
|
100
|
+
t.styles = [p`${h(m)}`];
|
|
100
101
|
o([
|
|
101
102
|
i({ type: String })
|
|
102
103
|
], t.prototype, "label", 2);
|
|
@@ -127,6 +128,12 @@ o([
|
|
|
127
128
|
o([
|
|
128
129
|
i({ type: Boolean })
|
|
129
130
|
], t.prototype, "readonly", 2);
|
|
131
|
+
o([
|
|
132
|
+
i({ type: Boolean })
|
|
133
|
+
], t.prototype, "multiline", 2);
|
|
134
|
+
o([
|
|
135
|
+
i({ type: Boolean })
|
|
136
|
+
], t.prototype, "forceFocused", 2);
|
|
130
137
|
o([
|
|
131
138
|
f()
|
|
132
139
|
], t.prototype, "_focused", 2);
|
|
@@ -140,7 +147,7 @@ o([
|
|
|
140
147
|
f()
|
|
141
148
|
], t.prototype, "_hasSuffix", 2);
|
|
142
149
|
t = o([
|
|
143
|
-
|
|
150
|
+
u("logosphere-formfield")
|
|
144
151
|
], t);
|
|
145
152
|
export {
|
|
146
153
|
t as F
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";const l=require("lit"),t=require("lit/decorators.js"),d=":host{display:block}.formfield{position:relative;font-family:var(--font-family-base)}.formfield__label{display:block;font-size:12px;line-height:1.125rem;letter-spacing:-.12px;font-weight:var(--font-weight-medium);color:var(--color-tertiary);margin-bottom:var(--spacing-1)}.formfield__required{color:var(--color-danger);margin-left:var(--spacing-1)}.formfield__container{position:relative;display:flex;align-items:center;box-sizing:border-box;border-radius:var(--radius-base);border:1px solid var(--color-border);padding:0 var(--spacing-2) 0 var(--spacing-3);background-color:var(--color-body-bg);cursor:text;transition:border-color var(--transition-speed-base) var(--transition-timing),background-color var(--transition-speed-base) var(--transition-timing)}.formfield__container--cursor-text{cursor:text}.formfield__container--cursor-pointer{cursor:pointer}.formfield__container--cursor-default{cursor:default}.formfield__container--default{min-height:32px}.formfield__container--large{min-height:40px}.formfield__container--multiline{align-items:flex-start;min-height:64px;padding-top:var(--spacing-2);padding-bottom:var(--spacing-2)}.formfield__container--hovered:not(.formfield__container--focused):not(.formfield__container--error):not(.formfield__container--disabled){background-color:var(--color-tertiary-bg)}.formfield__container--focused{border-color:var(--color-body-text);background-color:var(--color-body-bg)}.formfield__container--error{border-color:var(--color-danger)}.formfield__container--disabled{background-color:var(--color-body-bg);opacity:.4;cursor:not-allowed;pointer-events:none}.formfield__container--subtle:not(.formfield__container--focused):not(.formfield__container--error){border-color:transparent;background-color:var(--color-tertiary-bg)}.formfield__input-area{flex:1;min-width:0;display:flex;align-items:center}.formfield__container--multiline .formfield__input-area{align-items:flex-start;align-self:stretch}.formfield__prefix,.formfield__clear,.formfield__suffix{display:flex;align-items:center;flex-shrink:0;align-self:stretch}.formfield__container--multiline .formfield__clear,.formfield__container--multiline .formfield__suffix{align-items:flex-start}.formfield__prefix{margin-right:var(--spacing-2)}.formfield__clear,.formfield__suffix{margin-left:var(--spacing-2)}.formfield__container--has-prefix .formfield__prefix{border-right:1px solid var(--color-border);padding-right:var(--spacing-2)}.formfield__container--has-suffix .formfield__suffix{border-left:1px solid var(--color-border);padding-left:var(--spacing-2)}.formfield__prefix:empty,.formfield__clear:empty,.formfield__suffix:empty{display:none}.formfield__helper{font-size:11px;line-height:1rem;letter-spacing:-.11px;font-weight:var(--font-weight-regular);color:var(--color-tertiary);margin-top:var(--spacing-1)}.formfield__error{font-size:11px;line-height:1rem;letter-spacing:-.11px;font-weight:var(--font-weight-regular);color:var(--color-danger);margin-top:var(--spacing-1)}::slotted(input),::slotted(textarea){width:100%;border:none;outline:none;background:transparent;font-family:inherit;font-size:14px;line-height:1.25rem;letter-spacing:-.14px;color:var(--color-body-text)}::slotted(input:disabled),::slotted(textarea:disabled){cursor:not-allowed}";var c=Object.defineProperty,h=Object.getOwnPropertyDescriptor,o=(n,e,r,s)=>{for(var i=s>1?void 0:s?h(e,r):e,a=n.length-1,f;a>=0;a--)(f=n[a])&&(i=(s?f(e,r,i):f(i))||i);return s&&i&&c(e,r,i),i};exports.FormField=class extends l.LitElement{constructor(){super(...arguments),this.label="",this.helper="",this.error="",this.placeholder="",this.size="default",this.variant="default",this.cursor="text",this.required=!1,this.disabled=!1,this.readonly=!1,this.multiline=!1,this.forceFocused=!1,this._focused=!1,this._hovered=!1,this._hasPrefix=!1,this._hasSuffix=!1,this.handleSlotFocus=e=>{const r=e.target;["INPUT","TEXTAREA","SELECT"].includes(r.tagName)&&(this._focused=!0,this.dispatchEvent(new CustomEvent("field-focus",{bubbles:!0,composed:!0,detail:{originalEvent:e}})))},this.handleSlotBlur=e=>{const r=e.target;["INPUT","TEXTAREA","SELECT"].includes(r.tagName)&&(this._focused=!1,this.dispatchEvent(new CustomEvent("field-blur",{bubbles:!0,composed:!0,detail:{originalEvent:e}})))},this.handleMouseEnter=()=>{this._hovered=!0},this.handleMouseLeave=()=>{this._hovered=!1},this.handleContainerClick=e=>{const r=e.target;if(["INPUT","TEXTAREA","SELECT","BUTTON"].includes(r.tagName))return;this.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({flatten:!0}).find(a=>["INPUT","TEXTAREA","SELECT"].includes(a.tagName))?.focus()},this.handlePrefixSlotChange=e=>{const r=e.target;this._hasPrefix=r.assignedElements({flatten:!0}).length>0},this.handleSuffixSlotChange=e=>{const r=e.target;this._hasSuffix=r.assignedElements({flatten:!0}).length>0}}connectedCallback(){super.connectedCallback(),this.addEventListener("focus",this.handleSlotFocus,!0),this.addEventListener("blur",this.handleSlotBlur,!0)}firstUpdated(){const e=this.shadowRoot?.querySelector('slot[name="prefix"]'),r=this.shadowRoot?.querySelector('slot[name="suffix"]');e&&(this._hasPrefix=e.assignedElements({flatten:!0}).length>0),r&&(this._hasSuffix=r.assignedElements({flatten:!0}).length>0)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("focus",this.handleSlotFocus,!0),this.removeEventListener("blur",this.handleSlotBlur,!0)}render(){const e=!!this.error,r=!e&&!!this.helper,s=["formfield__container",`formfield__container--${this.size}`,`formfield__container--cursor-${this.cursor}`,this._hasPrefix?"formfield__container--has-prefix":"",this._hasSuffix?"formfield__container--has-suffix":"",e?"formfield__container--error":"",this._focused||this.forceFocused?"formfield__container--focused":"",this._hovered?"formfield__container--hovered":"",this.disabled?"formfield__container--disabled":"",this.variant==="subtle"?"formfield__container--subtle":"",this.multiline?"formfield__container--multiline":""].filter(Boolean).join(" ");return l.html`
|
|
2
|
+
<div class="formfield">
|
|
3
|
+
${this.label?l.html`
|
|
4
|
+
<label class="formfield__label">
|
|
5
|
+
${this.label}
|
|
6
|
+
${this.required?l.html`<span class="formfield__required">*</span>`:""}
|
|
7
|
+
</label>
|
|
8
|
+
`:""}
|
|
9
|
+
|
|
10
|
+
<div
|
|
11
|
+
class="${s}"
|
|
12
|
+
@mouseenter=${this.handleMouseEnter}
|
|
13
|
+
@mouseleave=${this.handleMouseLeave}
|
|
14
|
+
@click=${this.handleContainerClick}
|
|
15
|
+
>
|
|
16
|
+
<div class="formfield__prefix">
|
|
17
|
+
<slot name="prefix" @slotchange=${this.handlePrefixSlotChange}></slot>
|
|
18
|
+
</div>
|
|
19
|
+
<div class="formfield__input-area">
|
|
20
|
+
<slot></slot>
|
|
21
|
+
</div>
|
|
22
|
+
<div class="formfield__clear">
|
|
23
|
+
<slot name="clear"></slot>
|
|
24
|
+
</div>
|
|
25
|
+
<div class="formfield__suffix">
|
|
26
|
+
<slot name="suffix" @slotchange=${this.handleSuffixSlotChange}></slot>
|
|
27
|
+
</div>
|
|
28
|
+
</div>
|
|
29
|
+
|
|
30
|
+
${r?l.html`<div class="formfield__helper">${this.helper}</div>`:""}
|
|
31
|
+
${e?l.html`<div class="formfield__error">${this.error}</div>`:""}
|
|
32
|
+
</div>
|
|
33
|
+
`}};exports.FormField.styles=[l.css`${l.unsafeCSS(d)}`];o([t.property({type:String})],exports.FormField.prototype,"label",2);o([t.property({type:String})],exports.FormField.prototype,"helper",2);o([t.property({type:String})],exports.FormField.prototype,"error",2);o([t.property({type:String})],exports.FormField.prototype,"placeholder",2);o([t.property({type:String})],exports.FormField.prototype,"size",2);o([t.property({type:String})],exports.FormField.prototype,"variant",2);o([t.property({type:String})],exports.FormField.prototype,"cursor",2);o([t.property({type:Boolean})],exports.FormField.prototype,"required",2);o([t.property({type:Boolean})],exports.FormField.prototype,"disabled",2);o([t.property({type:Boolean})],exports.FormField.prototype,"readonly",2);o([t.property({type:Boolean})],exports.FormField.prototype,"multiline",2);o([t.property({type:Boolean})],exports.FormField.prototype,"forceFocused",2);o([t.state()],exports.FormField.prototype,"_focused",2);o([t.state()],exports.FormField.prototype,"_hovered",2);o([t.state()],exports.FormField.prototype,"_hasPrefix",2);o([t.state()],exports.FormField.prototype,"_hasSuffix",2);exports.FormField=o([t.customElement("logosphere-formfield")],exports.FormField);
|
package/dist/formfield.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./formfield-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./formfield-HIqosWPz.cjs");Object.defineProperty(exports,"FormField",{enumerable:!0,get:()=>e.FormField});
|
package/dist/formfield.js
CHANGED
package/dist/index.cjs
CHANGED
|
@@ -1 +1,119 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./button-BryTzF74.cjs"),h=require("./badge-DXBwR32c.cjs"),_=require("./checkbox-CdDTRdKV.cjs"),m=require("./formfield-HIqosWPz.cjs"),b=require("./switch-Rnnn10bn.cjs"),g=require("./breadcrumb-Cop-B1J7.cjs"),v=require("./card-C8G9YXhU.cjs"),f=require("./input-DgGaco-Y.cjs"),y=require("./popover-C2p5Pmts.cjs"),k=require("./text-area-Bz62kq2S.cjs"),a=require("lit"),t=require("lit/decorators.js"),P=require("@popperjs/core");require("./ui-icon-BRl1UmIf.cjs");const x=require("./chatbot-BfzuCerB.cjs"),$=require("./calendar-D5W-t26J.cjs"),O=require("./combobox-BrANDiaM.cjs"),w=require("./datepicker-CxKs90IQ.cjs"),S=require("./drawer-s1BLy2Xe.cjs"),T=require("./download-manager-BSIMTGaK.cjs"),u=require("./leftmenu-BSVpwbyD.cjs"),j=require("./modal-3-TNUICH.cjs"),l=require("./toast-container-DsEbVrT7.cjs"),C=require("./tab-DcjAlXzU.cjs"),q=require("./tree-menu-BZEOD4_f.cjs"),M=":host{display:block;width:100%}.timepicker__reference{display:block;width:100%}.timepicker__trigger{border:none;background:transparent;color:var(--color-tertiary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;flex-shrink:0;height:100%;min-height:32px;outline:none;border-radius:0 var(--radius-base) var(--radius-base) 0;transition:color var(--transition-speed-fast) var(--transition-timing),background-color var(--transition-speed-fast) var(--transition-timing)}.timepicker__trigger:hover{color:var(--color-body-text);background-color:var(--color-body-bg-hover)}.timepicker__trigger--active{color:var(--color-body-text)}.timepicker__trigger:disabled{pointer-events:none;opacity:.4}.timepicker__popup[popover]{position:fixed;inset:unset;margin:0;padding:0;border:none;width:240px;background-color:var(--color-body-bg);border-radius:12px;box-shadow:0 4px 16px #7878783d;overflow:hidden;z-index:var(--z-index-dropdown, 1000)}.timepicker__spinner{display:flex;flex-direction:row;align-items:stretch;padding:var(--spacing-1) var(--spacing-2)}.timepicker__col{flex:1;display:flex;flex-direction:column;padding:0px var(--spacing-5)}.timepicker__col--left{align-items:flex-start}.timepicker__col--right{align-items:flex-end}.timepicker__col--sep{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 var(--spacing-1)}.timepicker__spin-btn{height:32px;display:flex;align-items:center;justify-content:center;border:none;padding:var(--spacing-2);background:transparent;color:var(--color-secondary);border-radius:var(--radius-base);cursor:pointer;outline:none;box-sizing:border-box;transition:background-color var(--transition-speed-fast) var(--transition-timing),color var(--transition-speed-fast) var(--transition-timing)}.timepicker__spin-btn:hover{background-color:var(--color-body-bg-hover);color:var(--color-body-text)}.timepicker__spin-btn:active{background-color:var(--color-body-bg-active)}.timepicker__time-unit{height:32px;display:flex;align-items:center;justify-content:center;font-size:14px;font-family:var(--font-family-base);font-weight:var(--font-weight-regular);line-height:1.25rem;letter-spacing:-.14px;color:var(--color-body-text);text-align:center;box-sizing:border-box;padding:var(--spacing-2)}.timepicker__colon{height:32px;display:flex;align-items:center;justify-content:center;font-size:16px;font-family:var(--font-family-base);font-weight:var(--font-weight-medium);color:var(--color-secondary)}.timepicker__actions{display:flex;align-items:center;padding:var(--spacing-2);border-top:1px solid var(--color-border);gap:var(--spacing-1)}.timepicker__action-btn{flex:1 0 0;min-width:0;height:32px;display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--color-secondary);border-radius:var(--radius-full);cursor:pointer;padding:var(--spacing-2);outline:none;transition:background-color var(--transition-speed-fast) var(--transition-timing),color var(--transition-speed-fast) var(--transition-timing)}.timepicker__action-btn:hover{background-color:var(--color-body-bg-hover);color:var(--color-body-text)}.timepicker__action-btn:active{background-color:var(--color-body-bg-active)}";var L=Object.defineProperty,z=Object.getOwnPropertyDescriptor,i=(p,e,r,n)=>{for(var o=n>1?void 0:n?z(e,r):e,s=p.length-1,c;s>=0;s--)(c=p[s])&&(o=(n?c(e,r,o):c(o))||o);return n&&o&&L(e,r,o),o};exports.TimePicker=class extends a.LitElement{constructor(){super(...arguments),this.value="",this.label="",this.helper="",this.error="",this.placeholder="__:__",this.required=!1,this.disabled=!1,this.readonly=!1,this.size="default",this.variant="default",this._isOpen=!1,this._hour=0,this._minute=0,this._handleOutsideClick=e=>{this._isOpen&&!e.composedPath().includes(this)&&(this._isOpen=!1)},this._handleInputChange=e=>{e.stopPropagation();const r=e.detail?.value??"";if(/^\d{2}:\d{2}$/.test(r)){const[n,o]=this._parseValue(r);this._hour=n,this._minute=o;const s=`${this._pad(n)}:${this._pad(o)}`;this.value=s,this._emit(s)}},this._handleInputClear=e=>{e.stopPropagation(),this.value="",this._hour=0,this._minute=0,this._emit(""),this.dispatchEvent(new CustomEvent("clear",{bubbles:!0,composed:!0})),this._isOpen=!1},this._incrementHour=()=>{this._hour=(this._hour+1)%24,this._syncValue()},this._decrementHour=()=>{this._hour=(this._hour-1+24)%24,this._syncValue()},this._incrementMinute=()=>{this._minute=(this._minute+1)%60,this._syncValue()},this._decrementMinute=()=>{this._minute=(this._minute-1+60)%60,this._syncValue()}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this._handleOutsideClick),this._destroyPopper()}willUpdate(e){if(e.has("value")&&/^\d{1,2}:\d{2}$/.test(this.value)){const[r,n]=this._parseValue(this.value);this._hour=r,this._minute=n}}updated(e){e.has("_isOpen")&&(this._isOpen?this.updateComplete.then(()=>{this._showPopover(),this._updatePopper()}):(this._hidePopover(),this._destroyPopper()))}_parseValue(e){const r=e.match(/^(\d{1,2}):(\d{2})$/);return r?[Math.min(23,Math.max(0,parseInt(r[1],10))),Math.min(59,Math.max(0,parseInt(r[2],10)))]:[0,0]}_pad(e){return String(e).padStart(2,"0")}_updatePopper(){!this._referenceEl||!this._popupEl||(this._popperInstance=P.createPopper(this._referenceEl,this._popupEl,{placement:"bottom-start",modifiers:[{name:"offset",options:{offset:[0,4]}},{name:"flip",options:{fallbackPlacements:["top-start"]}},{name:"preventOverflow",options:{boundary:document.documentElement,padding:8}}]}))}_destroyPopper(){this._popperInstance?.destroy(),this._popperInstance=void 0}_showPopover(){this._popupEl?.showPopover?.()}_hidePopover(){const e=this._popupEl;try{e?.hidePopover?.()}catch{}}_togglePopup(){if(!(this.disabled||this.readonly))if(this._isOpen)this._isOpen=!1;else{const[e,r]=this._parseValue(this.value);this._hour=e,this._minute=r,this._isOpen=!0}}_clearValue(e){e?.stopPropagation(),this.value="",this._hour=0,this._minute=0,this._emit(""),this.dispatchEvent(new CustomEvent("clear",{bubbles:!0,composed:!0})),this._isOpen=!1}_setNow(){const e=new Date;this._hour=e.getHours(),this._minute=e.getMinutes(),this._syncValue()}_emit(e){this.onChange?.(e),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:e}}))}_syncValue(){const e=`${this._pad(this._hour)}:${this._pad(this._minute)}`;this.value=e,this._emit(e)}_startSpin(e){e(),this._spinInterval=setInterval(e,120)}_stopSpin(){clearInterval(this._spinInterval),this._spinInterval=void 0}_renderPopup(){return a.html`
|
|
2
|
+
<div data-timepicker-popup popover="manual" class="timepicker__popup">
|
|
3
|
+
<div class="timepicker__spinner">
|
|
4
|
+
<!-- Sol sütun: saat -->
|
|
5
|
+
<div class="timepicker__col timepicker__col--left">
|
|
6
|
+
<button
|
|
7
|
+
class="timepicker__spin-btn"
|
|
8
|
+
@mousedown=${()=>this._startSpin(this._incrementHour)}
|
|
9
|
+
@mouseup=${this._stopSpin}
|
|
10
|
+
@mouseleave=${this._stopSpin}
|
|
11
|
+
@touchstart=${e=>{e.preventDefault(),this._startSpin(this._incrementHour)}}
|
|
12
|
+
@touchend=${this._stopSpin}
|
|
13
|
+
tabindex="-1"
|
|
14
|
+
aria-label="Saat artır"
|
|
15
|
+
><ui-icon name="uil-arrow-up" size="16"></ui-icon></button>
|
|
16
|
+
<div class="timepicker__time-unit">${this._pad(this._hour)}</div>
|
|
17
|
+
<button
|
|
18
|
+
class="timepicker__spin-btn"
|
|
19
|
+
@mousedown=${()=>this._startSpin(this._decrementHour)}
|
|
20
|
+
@mouseup=${this._stopSpin}
|
|
21
|
+
@mouseleave=${this._stopSpin}
|
|
22
|
+
@touchstart=${e=>{e.preventDefault(),this._startSpin(this._decrementHour)}}
|
|
23
|
+
@touchend=${this._stopSpin}
|
|
24
|
+
tabindex="-1"
|
|
25
|
+
aria-label="Saat azalt"
|
|
26
|
+
><ui-icon name="uil-arrow-down" size="16"></ui-icon></button>
|
|
27
|
+
</div>
|
|
28
|
+
|
|
29
|
+
<!-- Orta sütun: iki nokta -->
|
|
30
|
+
<div class="timepicker__col timepicker__col--sep">
|
|
31
|
+
<div class="timepicker__colon">:</div>
|
|
32
|
+
</div>
|
|
33
|
+
|
|
34
|
+
<!-- Sağ sütun: dakika -->
|
|
35
|
+
<div class="timepicker__col timepicker__col--right">
|
|
36
|
+
<button
|
|
37
|
+
class="timepicker__spin-btn"
|
|
38
|
+
@mousedown=${()=>this._startSpin(this._incrementMinute)}
|
|
39
|
+
@mouseup=${this._stopSpin}
|
|
40
|
+
@mouseleave=${this._stopSpin}
|
|
41
|
+
@touchstart=${e=>{e.preventDefault(),this._startSpin(this._incrementMinute)}}
|
|
42
|
+
@touchend=${this._stopSpin}
|
|
43
|
+
tabindex="-1"
|
|
44
|
+
aria-label="Dakika artır"
|
|
45
|
+
><ui-icon name="uil-arrow-up" size="16"></ui-icon></button>
|
|
46
|
+
<div class="timepicker__time-unit">${this._pad(this._minute)}</div>
|
|
47
|
+
<button
|
|
48
|
+
class="timepicker__spin-btn"
|
|
49
|
+
@mousedown=${()=>this._startSpin(this._decrementMinute)}
|
|
50
|
+
@mouseup=${this._stopSpin}
|
|
51
|
+
@mouseleave=${this._stopSpin}
|
|
52
|
+
@touchstart=${e=>{e.preventDefault(),this._startSpin(this._decrementMinute)}}
|
|
53
|
+
@touchend=${this._stopSpin}
|
|
54
|
+
tabindex="-1"
|
|
55
|
+
aria-label="Dakika azalt"
|
|
56
|
+
><ui-icon name="uil-arrow-down" size="16"></ui-icon></button>
|
|
57
|
+
</div>
|
|
58
|
+
</div>
|
|
59
|
+
|
|
60
|
+
<!-- Action buttons -->
|
|
61
|
+
<div class="timepicker__actions">
|
|
62
|
+
<button
|
|
63
|
+
class="timepicker__action-btn"
|
|
64
|
+
@click=${this._setNow}
|
|
65
|
+
title="Şu anki saati seç"
|
|
66
|
+
>
|
|
67
|
+
<ui-icon name="uil-calendar-alt" size="16"></ui-icon>
|
|
68
|
+
</button>
|
|
69
|
+
<button
|
|
70
|
+
class="timepicker__action-btn"
|
|
71
|
+
@click=${()=>this._clearValue()}
|
|
72
|
+
title="Temizle"
|
|
73
|
+
>
|
|
74
|
+
<ui-icon name="uil-trash" size="16"></ui-icon>
|
|
75
|
+
</button>
|
|
76
|
+
<button
|
|
77
|
+
class="timepicker__action-btn"
|
|
78
|
+
@click=${()=>{this._isOpen=!1}}
|
|
79
|
+
title="Kapat"
|
|
80
|
+
>
|
|
81
|
+
<ui-icon name="uil-times" size="16"></ui-icon>
|
|
82
|
+
</button>
|
|
83
|
+
</div>
|
|
84
|
+
</div>
|
|
85
|
+
`}render(){return a.html`
|
|
86
|
+
<div class="timepicker__reference">
|
|
87
|
+
<logosphere-input
|
|
88
|
+
.label=${this.label}
|
|
89
|
+
.helper=${this.helper}
|
|
90
|
+
.error=${this.error}
|
|
91
|
+
.required=${this.required}
|
|
92
|
+
.disabled=${this.disabled}
|
|
93
|
+
.readonly=${this.readonly}
|
|
94
|
+
.size=${this.size}
|
|
95
|
+
.variant=${this.variant}
|
|
96
|
+
.placeholder=${this.placeholder}
|
|
97
|
+
.value=${this.value}
|
|
98
|
+
mask="00:00"
|
|
99
|
+
@input=${this._handleInputChange}
|
|
100
|
+
@clear=${this._handleInputClear}
|
|
101
|
+
@change=${e=>e.stopPropagation()}
|
|
102
|
+
>
|
|
103
|
+
<button
|
|
104
|
+
slot="suffix"
|
|
105
|
+
type="button"
|
|
106
|
+
class="timepicker__trigger ${this._isOpen?"timepicker__trigger--active":""}"
|
|
107
|
+
@click=${this._togglePopup}
|
|
108
|
+
?disabled=${this.disabled}
|
|
109
|
+
tabindex=${this.disabled?"-1":"0"}
|
|
110
|
+
aria-label="Saat seç"
|
|
111
|
+
aria-expanded=${this._isOpen?"true":"false"}
|
|
112
|
+
>
|
|
113
|
+
<ui-icon name="uil-clock" size="16"></ui-icon>
|
|
114
|
+
</button>
|
|
115
|
+
</logosphere-input>
|
|
116
|
+
</div>
|
|
117
|
+
|
|
118
|
+
${this._renderPopup()}
|
|
119
|
+
`}};exports.TimePicker.styles=[a.css`${a.unsafeCSS(M)}`];i([t.property({type:String})],exports.TimePicker.prototype,"value",2);i([t.property({type:String})],exports.TimePicker.prototype,"label",2);i([t.property({type:String})],exports.TimePicker.prototype,"helper",2);i([t.property({type:String})],exports.TimePicker.prototype,"error",2);i([t.property({type:String})],exports.TimePicker.prototype,"placeholder",2);i([t.property({type:Boolean})],exports.TimePicker.prototype,"required",2);i([t.property({type:Boolean})],exports.TimePicker.prototype,"disabled",2);i([t.property({type:Boolean})],exports.TimePicker.prototype,"readonly",2);i([t.property({type:String})],exports.TimePicker.prototype,"size",2);i([t.property({type:String})],exports.TimePicker.prototype,"variant",2);i([t.property({attribute:!1})],exports.TimePicker.prototype,"onChange",2);i([t.state()],exports.TimePicker.prototype,"_isOpen",2);i([t.state()],exports.TimePicker.prototype,"_hour",2);i([t.state()],exports.TimePicker.prototype,"_minute",2);i([t.query(".timepicker__reference")],exports.TimePicker.prototype,"_referenceEl",2);i([t.query("[data-timepicker-popup]")],exports.TimePicker.prototype,"_popupEl",2);exports.TimePicker=i([t.customElement("logosphere-timepicker")],exports.TimePicker);Object.defineProperty(exports,"Button",{enumerable:!0,get:()=>d.Button});Object.defineProperty(exports,"LogosphereBadge",{enumerable:!0,get:()=>h.LogosphereBadge});Object.defineProperty(exports,"Checkbox",{enumerable:!0,get:()=>_.Checkbox});Object.defineProperty(exports,"FormField",{enumerable:!0,get:()=>m.FormField});Object.defineProperty(exports,"Switch",{enumerable:!0,get:()=>b.Switch});Object.defineProperty(exports,"Breadcrumb",{enumerable:!0,get:()=>g.Breadcrumb});Object.defineProperty(exports,"Card",{enumerable:!0,get:()=>v.Card});Object.defineProperty(exports,"LogosphereInput",{enumerable:!0,get:()=>f.LogosphereInput});Object.defineProperty(exports,"Popover",{enumerable:!0,get:()=>y.Popover});Object.defineProperty(exports,"TextArea",{enumerable:!0,get:()=>k.TextArea});Object.defineProperty(exports,"LogosphereChatBot",{enumerable:!0,get:()=>x.LogosphereChatBot});Object.defineProperty(exports,"LogosphereCalendar",{enumerable:!0,get:()=>$.LogosphereCalendar});Object.defineProperty(exports,"Combobox",{enumerable:!0,get:()=>O.Combobox});Object.defineProperty(exports,"LogosphereDatePicker",{enumerable:!0,get:()=>w.LogosphereDatePicker});Object.defineProperty(exports,"Drawer",{enumerable:!0,get:()=>S.Drawer});Object.defineProperty(exports,"DownloadManager",{enumerable:!0,get:()=>T.DownloadManager});Object.defineProperty(exports,"LeftMenu",{enumerable:!0,get:()=>u.LeftMenu});Object.defineProperty(exports,"LeftMenuItemElement",{enumerable:!0,get:()=>u.LeftMenuItemElement});Object.defineProperty(exports,"Modal",{enumerable:!0,get:()=>j.Modal});Object.defineProperty(exports,"LogosphereToast",{enumerable:!0,get:()=>l.LogosphereToast});Object.defineProperty(exports,"LogosphereToastContainer",{enumerable:!0,get:()=>l.LogosphereToastContainer});exports.ToastService=l.ToastService;Object.defineProperty(exports,"LogosphereTab",{enumerable:!0,get:()=>C.LogosphereTab});Object.defineProperty(exports,"TreeMenu",{enumerable:!0,get:()=>q.TreeMenu});
|
package/dist/index.d.ts
CHANGED
|
@@ -8,6 +8,7 @@ export * from "./molecules/Card/index.js";
|
|
|
8
8
|
export * from "./molecules/Input/index.js";
|
|
9
9
|
export * from "./molecules/Popover/index.js";
|
|
10
10
|
export * from "./molecules/Textarea/index.js";
|
|
11
|
+
export * from "./molecules/TimePicker/index.js";
|
|
11
12
|
export * from "./organisms/Chatbot/index.js";
|
|
12
13
|
export * from "./organisms/Calendar/index.js";
|
|
13
14
|
export * from "./organisms/Combobox/index.js";
|
|
@@ -16,5 +17,6 @@ export * from "./organisms/Drawer/index.js";
|
|
|
16
17
|
export * from "./organisms/DownloadManager/index.js";
|
|
17
18
|
export * from "./organisms/LeftMenu/index.js";
|
|
18
19
|
export * from "./organisms/Modal/index.js";
|
|
20
|
+
export * from "./organisms/Toast/index.js";
|
|
19
21
|
export * from "./organisms/Tab/index.js";
|
|
20
22
|
export * from "./organisms/TreeMenu/index.js";
|