@krumio/trailhand-ui 1.9.25 → 1.9.26

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.
@@ -84,10 +84,10 @@ Button.formAssociated = true;
84
84
  Button.styles = css `
85
85
  :host {
86
86
  display: inline-block;
87
+ font-family: var(--font-family, 'Poppins', sans-serif);
87
88
  }
88
89
 
89
90
  .trailhand-button {
90
- font-family: 'Montserrat', system-ui, sans-serif;
91
91
  font-weight: 600;
92
92
  border: 0;
93
93
  border-radius: 8px;
@@ -112,7 +112,7 @@ Checkbox.formAssociated = true;
112
112
  Checkbox.styles = css `
113
113
  :host {
114
114
  display: inline-block;
115
- font-family: 'Montserrat', system-ui, sans-serif;
115
+ font-family: var(--font-family, 'Poppins', sans-serif);
116
116
  }
117
117
 
118
118
  .wrapper {
@@ -323,7 +323,7 @@ CodeEditor.styles = css `
323
323
  :host {
324
324
  display: block;
325
325
  width: 100%;
326
- font-family: 'Montserrat', system-ui, sans-serif;
326
+ font-family: var(--font-family, 'Poppins', sans-serif);
327
327
  min-width: 0;
328
328
  }
329
329
 
@@ -358,7 +358,7 @@ CodeEditor.styles = css `
358
358
  outline: none;
359
359
  background: transparent;
360
360
  transition: border-color 0.2s ease;
361
- font-family: 'Montserrat', system-ui, sans-serif;
361
+ font-family: var(--font-family, 'Poppins', sans-serif);
362
362
  color: var(--th-input-text, #333);
363
363
  box-sizing: border-box;
364
364
  display: block;
@@ -409,7 +409,7 @@ CodeEditor.styles = css `
409
409
  position: absolute;
410
410
  inset: 0;
411
411
  padding: 0.75em 16px;
412
- font-family: 'Montserrat', system-ui, sans-serif;
412
+ font-family: var(--font-family, 'Poppins', sans-serif);
413
413
  line-height: 1.7;
414
414
  white-space: pre;
415
415
  pointer-events: none;
@@ -481,7 +481,7 @@ Dropdown.formAssociated = true;
481
481
  Dropdown.styles = css `
482
482
  :host {
483
483
  display: inline-block;
484
- font-family: 'Montserrat', system-ui, sans-serif;
484
+ font-family: var(--font-family, 'Poppins', sans-serif);
485
485
  position: relative;
486
486
  min-width: var(--th-dropdown-min-width, 220px);
487
487
  }
@@ -110,7 +110,7 @@ Selector.styles = css `
110
110
  display: block;
111
111
  width: 100%;
112
112
  box-sizing: border-box;
113
- font-family: 'Montserrat', system-ui, sans-serif;
113
+ font-family: var(--font-family, 'Poppins', sans-serif);
114
114
  }
115
115
 
116
116
  .wrapper {
@@ -0,0 +1,2 @@
1
+ export { TextArea } from './text-area';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}
@@ -0,0 +1,2 @@
1
+ export { TextArea } from './text-area';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/text-area/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}
@@ -0,0 +1,48 @@
1
+ import { LitElement, TemplateResult } from 'lit';
2
+ export interface TextAreaProps {
3
+ name: string;
4
+ value: string;
5
+ placeholder: string;
6
+ disabled: boolean;
7
+ size: 'small' | 'medium' | 'large';
8
+ label?: string;
9
+ required?: boolean;
10
+ invalid?: boolean;
11
+ rows?: number;
12
+ maxlength?: number;
13
+ resize?: 'none' | 'vertical' | 'horizontal' | 'both';
14
+ showCount?: boolean;
15
+ }
16
+ export declare class TextArea extends LitElement {
17
+ static formAssociated: boolean;
18
+ name: string;
19
+ value: string;
20
+ placeholder: string;
21
+ disabled: boolean;
22
+ size: 'small' | 'medium' | 'large';
23
+ label: string;
24
+ required: boolean;
25
+ invalid: boolean;
26
+ rows: number;
27
+ maxlength?: number;
28
+ resize: 'none' | 'vertical' | 'horizontal' | 'both';
29
+ showCount: boolean;
30
+ private internals;
31
+ private _textarea;
32
+ constructor();
33
+ static styles: import("lit").CSSResult;
34
+ connectedCallback(): void;
35
+ focus(): void;
36
+ private get _currentLength();
37
+ private get _isOverLimit();
38
+ private emitChangeEvent;
39
+ private handleInput;
40
+ firstUpdated(): void;
41
+ updated(changed: Map<string, unknown>): void;
42
+ private _updateValidity;
43
+ formResetCallback(): void;
44
+ formDisableCallback(disabled: boolean): void;
45
+ formAssociatedCallback(form: HTMLFormElement | null): void;
46
+ render(): TemplateResult;
47
+ }
48
+ //# sourceMappingURL=text-area.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/text-area.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAG5D,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,CAAC;IACrD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,qBAAa,QAAS,SAAQ,UAAU;IACtC,MAAM,CAAC,cAAc,UAAQ;IAG7B,IAAI,SAAM;IAGV,KAAK,SAAM;IAGX,WAAW,SAAM;IAGjB,QAAQ,UAAS;IAGjB,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAY;IAG9C,KAAK,SAAM;IAGX,QAAQ,UAAS;IAGjB,OAAO,UAAS;IAGhB,IAAI,SAAK;IAGT,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,MAAM,EAAE,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,CAAc;IAGjE,SAAS,UAAS;IAElB,OAAO,CAAC,SAAS,CAAmB;IACpC,OAAO,CAAC,SAAS,CAAsB;;IAOvC,MAAM,CAAC,MAAM,0BAkGX;IAEF,iBAAiB;IAQjB,KAAK;IAIL,OAAO,KAAK,cAAc,GAEzB;IAED,OAAO,KAAK,YAAY,GAEvB;IAED,OAAO,CAAC,eAAe;IAWvB,OAAO,CAAC,WAAW;IAcnB,YAAY;IAMZ,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAMrC,OAAO,CAAC,eAAe;IAiBvB,iBAAiB;IAKjB,mBAAmB,CAAC,QAAQ,EAAE,OAAO;IAIrC,sBAAsB,CAAC,IAAI,EAAE,eAAe,GAAG,IAAI;IAMnD,MAAM,IAAI,cAAc;CA4BzB"}
@@ -0,0 +1,260 @@
1
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
+ else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
6
+ };
7
+ import { LitElement, html, css } from 'lit';
8
+ import { property } from 'lit/decorators.js';
9
+ export class TextArea extends LitElement {
10
+ constructor() {
11
+ super();
12
+ this.name = '';
13
+ this.value = '';
14
+ this.placeholder = '';
15
+ this.disabled = false;
16
+ this.size = 'medium';
17
+ this.label = '';
18
+ this.required = false;
19
+ this.invalid = false;
20
+ this.rows = 4;
21
+ this.resize = 'vertical';
22
+ this.showCount = false;
23
+ this.internals = this.attachInternals();
24
+ }
25
+ connectedCallback() {
26
+ super.connectedCallback();
27
+ const fieldset = this.closest('fieldset');
28
+ if (fieldset?.disabled) {
29
+ this.disabled = true;
30
+ }
31
+ }
32
+ focus() {
33
+ this._textarea?.focus();
34
+ }
35
+ get _currentLength() {
36
+ return this.value?.length ?? 0;
37
+ }
38
+ get _isOverLimit() {
39
+ return this.maxlength != null && this._currentLength > this.maxlength;
40
+ }
41
+ emitChangeEvent() {
42
+ this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));
43
+ this.dispatchEvent(new CustomEvent('text-area-change', {
44
+ detail: { value: this.value, name: this.name },
45
+ bubbles: true,
46
+ composed: true,
47
+ }));
48
+ }
49
+ handleInput(e) {
50
+ const target = e.target;
51
+ this.value = target.value;
52
+ if (this.value) {
53
+ this.internals.setFormValue(this.value);
54
+ }
55
+ else {
56
+ this.internals.setFormValue(null);
57
+ }
58
+ this.emitChangeEvent();
59
+ this._updateValidity();
60
+ }
61
+ firstUpdated() {
62
+ this._textarea = this.shadowRoot.querySelector('textarea');
63
+ // Apply resize style via CSS custom property
64
+ this._textarea.style.resize = this.resize;
65
+ }
66
+ updated(changed) {
67
+ if (changed.has('resize') && this._textarea) {
68
+ this._textarea.style.resize = this.resize;
69
+ }
70
+ }
71
+ _updateValidity() {
72
+ const isValid = this._textarea.validity.valid && !this._isOverLimit;
73
+ this.invalid = !isValid;
74
+ if (isValid) {
75
+ this.internals.setValidity({});
76
+ }
77
+ else {
78
+ this.internals.setValidity(this._textarea.validity, this._isOverLimit
79
+ ? `Exceeded maximum length of ${this.maxlength}`
80
+ : this._textarea.validationMessage, this._textarea);
81
+ }
82
+ }
83
+ formResetCallback() {
84
+ this.value = '';
85
+ this.internals.setFormValue(this.value);
86
+ }
87
+ formDisableCallback(disabled) {
88
+ this.disabled = disabled;
89
+ }
90
+ formAssociatedCallback(form) {
91
+ form?.addEventListener('submit', () => {
92
+ this._updateValidity();
93
+ });
94
+ }
95
+ render() {
96
+ const countLabel = this.maxlength != null
97
+ ? `${this._currentLength} / ${this.maxlength}`
98
+ : `${this._currentLength}`;
99
+ return html `
100
+ <div class="wrapper">
101
+ <label for=${this.name} class="input-label">
102
+ ${this.label}
103
+ <span class="required-indicator">${this.required ? '*' : ''}</span>
104
+ </label>
105
+ <div class="textarea-wrapper">
106
+ <textarea
107
+ name=${this.name}
108
+ .value=${this.value}
109
+ placeholder=${this.placeholder}
110
+ ?disabled=${this.disabled}
111
+ ?required=${this.required}
112
+ rows=${this.rows}
113
+ @input=${this.handleInput}
114
+ ></textarea>
115
+ ${this.showCount
116
+ ? html `<span class="count ${this._isOverLimit ? 'over-limit' : ''}">${countLabel}</span>`
117
+ : ''}
118
+ </div>
119
+ </div>
120
+ `;
121
+ }
122
+ }
123
+ TextArea.formAssociated = true;
124
+ TextArea.styles = css `
125
+ :host {
126
+ display: inline-block;
127
+ font-family: var(--font-family, 'Poppins', sans-serif);
128
+ }
129
+
130
+ .wrapper {
131
+ display: flex;
132
+ flex-direction: column;
133
+ gap: 0.25rem;
134
+ }
135
+
136
+ label {
137
+ font-size: 11px;
138
+ color: var(--th-input-label, #000000);
139
+ }
140
+
141
+ label .required-indicator {
142
+ color: var(--th-color-red, #bf1e1e);
143
+ }
144
+
145
+ .textarea-wrapper {
146
+ position: relative;
147
+ display: flex;
148
+ flex-direction: column;
149
+ font-size: 14px;
150
+ }
151
+
152
+ textarea {
153
+ width: 100%;
154
+ padding: 0.75em 16px;
155
+ border-radius: 8px;
156
+ border: 1px solid var(--th-input-border, #d7d7d7);
157
+ outline: none;
158
+ background: transparent;
159
+ transition: border-color 0.2s ease;
160
+ font-size: 14px;
161
+ color: var(--th-input-text, #333);
162
+ box-sizing: border-box;
163
+ font-family: var(--font-family, 'Poppins', sans-serif);
164
+ line-height: 1.5;
165
+ resize: var(--th-textarea-resize, vertical);
166
+ min-height: 80px;
167
+ }
168
+
169
+ textarea:disabled {
170
+ background-color: var(--th-input-bg, transparent);
171
+ opacity: 0.6;
172
+ cursor: not-allowed;
173
+ }
174
+
175
+ textarea::placeholder {
176
+ color: var(--th-input-placeholder, #d7d7d7);
177
+ }
178
+
179
+ textarea:focus {
180
+ border-color: var(--th-input-focus-border, #005cb9);
181
+ }
182
+
183
+ /* Character count */
184
+ .count {
185
+ align-self: flex-end;
186
+ font-size: 11px;
187
+ color: var(--th-input-label, #999);
188
+ margin-top: 0.25rem;
189
+ user-select: none;
190
+ }
191
+
192
+ .count.over-limit {
193
+ color: var(--th-input-border-invalid, #9f3a3a);
194
+ }
195
+
196
+ /* Sizes */
197
+ :host([size='small']) .textarea-wrapper {
198
+ font-size: 12px;
199
+ }
200
+ :host([size='small']) textarea {
201
+ font-size: 12px;
202
+ min-height: 60px;
203
+ }
204
+
205
+ :host([size='large']) .textarea-wrapper {
206
+ font-size: 16px;
207
+ }
208
+ :host([size='large']) textarea {
209
+ font-size: 16px;
210
+ min-height: 100px;
211
+ }
212
+
213
+ /* Disabled label */
214
+ :host([disabled]) label {
215
+ color: var(--th-input-label-disabled, #999);
216
+ }
217
+
218
+ /* Invalid */
219
+ :host([invalid]) textarea {
220
+ border-color: var(--th-input-border-invalid, #9f3a3a);
221
+ }
222
+ `;
223
+ __decorate([
224
+ property({ type: String })
225
+ ], TextArea.prototype, "name", void 0);
226
+ __decorate([
227
+ property({ type: String })
228
+ ], TextArea.prototype, "value", void 0);
229
+ __decorate([
230
+ property({ type: String })
231
+ ], TextArea.prototype, "placeholder", void 0);
232
+ __decorate([
233
+ property({ type: Boolean, reflect: true })
234
+ ], TextArea.prototype, "disabled", void 0);
235
+ __decorate([
236
+ property({ type: String, reflect: true })
237
+ ], TextArea.prototype, "size", void 0);
238
+ __decorate([
239
+ property({ type: String })
240
+ ], TextArea.prototype, "label", void 0);
241
+ __decorate([
242
+ property({ type: Boolean })
243
+ ], TextArea.prototype, "required", void 0);
244
+ __decorate([
245
+ property({ type: Boolean, reflect: true })
246
+ ], TextArea.prototype, "invalid", void 0);
247
+ __decorate([
248
+ property({ type: Number })
249
+ ], TextArea.prototype, "rows", void 0);
250
+ __decorate([
251
+ property({ type: Number })
252
+ ], TextArea.prototype, "maxlength", void 0);
253
+ __decorate([
254
+ property({ type: String })
255
+ ], TextArea.prototype, "resize", void 0);
256
+ __decorate([
257
+ property({ type: Boolean })
258
+ ], TextArea.prototype, "showCount", void 0);
259
+ customElements.define('trailhand-text-area', TextArea);
260
+ //# sourceMappingURL=text-area.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../src/components/text-area/text-area.ts"],"names":[],"mappings":"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"}
@@ -120,7 +120,7 @@ TextInput.formAssociated = true;
120
120
  TextInput.styles = css `
121
121
  :host {
122
122
  display: inline-block;
123
- font-family: 'Montserrat', system-ui, sans-serif;
123
+ font-family: var(--font-family, 'Poppins', sans-serif);
124
124
  }
125
125
 
126
126
  .wrapper {
@@ -157,7 +157,7 @@ TextInput.styles = css `
157
157
  height: 40px;
158
158
  color: var(--th-input-text, #333);
159
159
  box-sizing: border-box;
160
- font-family: 'Montserrat', system-ui, sans-serif;
160
+ font-family: var(--font-family, 'Poppins', sans-serif);
161
161
  }
162
162
 
163
163
  .input-wrapper.has-icon input {
package/dist/index.d.ts CHANGED
@@ -14,5 +14,6 @@ export * from './components/text-input';
14
14
  export * from './components/selector';
15
15
  export * from './components/dropdown';
16
16
  export * from './components/code-editor';
17
+ export * from './components/text-area';
17
18
  export * from './utils';
18
19
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AAGzC,cAAc,SAAS,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,SAAS,CAAC"}
package/dist/index.js CHANGED
@@ -15,6 +15,7 @@ export * from './components/text-input';
15
15
  export * from './components/selector';
16
16
  export * from './components/dropdown';
17
17
  export * from './components/code-editor';
18
+ export * from './components/text-area';
18
19
  // Export utilities
19
20
  export * from './utils';
20
21
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,wBAAwB;AACxB,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AAEzC,mBAAmB;AACnB,cAAc,SAAS,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,wBAAwB;AACxB,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AAEvC,mBAAmB;AACnB,cAAc,SAAS,CAAC"}
@@ -7,6 +7,7 @@
7
7
  */
8
8
 
9
9
  :root {
10
+ --font-family: 'Arial', system-ui, sans-serif; /* Global font family */
10
11
  /* Color Palette */
11
12
  /* Primary Blues */
12
13
  --th-color-primary: #0086ff; /* Primary brand color */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@krumio/trailhand-ui",
3
- "version": "1.9.25",
3
+ "version": "1.9.26",
4
4
  "type": "module",
5
5
  "description": "Reusable web components built with Lit Element",
6
6
  "main": "./dist/index.js",