generated from Tinkoff/angular-open-source-starter
-
Notifications
You must be signed in to change notification settings - Fork 35
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(kit):
Time
& DateTime
support AM
/ PM
formats
- Loading branch information
1 parent
732013e
commit b8e741d
Showing
42 changed files
with
1,242 additions
and
134 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
415 changes: 415 additions & 0 deletions
415
projects/demo-integrations/src/tests/kit/date-time/date-time-meridiem.cy.ts
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
375 changes: 375 additions & 0 deletions
375
projects/demo-integrations/src/tests/kit/time/time-meridiem.cy.ts
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
export function range(from: number, to: number): number[] { | ||
return new Array(to - from + 1).fill(null).map((_, i) => from + i); | ||
} | ||
|
||
export function withCaretLabel(value: string, caretIndex: number): string { | ||
return `${value.slice(0, caretIndex)}|${value.slice(caretIndex)}`; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import {type MaskitoOptions, maskitoUpdateElement} from '@maskito/core'; | ||
import {maskitoEventHandler, maskitoTimeOptionsGenerator} from '@maskito/kit'; | ||
|
||
const timeOptions = maskitoTimeOptionsGenerator({ | ||
mode: 'HH:MM AA', | ||
}); | ||
|
||
export default { | ||
...timeOptions, | ||
plugins: [ | ||
...timeOptions.plugins, | ||
maskitoEventHandler('blur', (element) => { | ||
if (element.value.length >= 'HH:MM'.length && !element.value.endsWith('M')) { | ||
maskitoUpdateElement(element, `${element.value} AM`); | ||
} | ||
}), | ||
], | ||
} satisfies MaskitoOptions; |
23 changes: 0 additions & 23 deletions
23
projects/demo/src/pages/kit/time/examples/2-twelve-hour-format/mask.ts
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,22 @@ | ||
import {maskitoTimeOptionsGenerator} from '@maskito/kit'; | ||
import {type MaskitoOptions, maskitoUpdateElement} from '@maskito/core'; | ||
import {maskitoEventHandler, maskitoTimeOptionsGenerator} from '@maskito/kit'; | ||
|
||
export default maskitoTimeOptionsGenerator({ | ||
const timeOptions = maskitoTimeOptionsGenerator({ | ||
mode: 'HH:MM:SS', | ||
step: 1, | ||
}); | ||
|
||
export default { | ||
...timeOptions, | ||
plugins: [ | ||
...timeOptions.plugins, | ||
maskitoEventHandler('blur', (element) => { | ||
const [hh = '', mm = '', ss = ''] = element.value.split(':'); | ||
|
||
maskitoUpdateElement( | ||
element, | ||
[hh, mm, ss].map((segment) => segment.padEnd(2, '0')).join(':'), | ||
); | ||
}), | ||
], | ||
} satisfies MaskitoOptions; |
39 changes: 39 additions & 0 deletions
39
projects/demo/src/pages/kit/time/examples/4-time-segments-min-max/component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
import {ChangeDetectionStrategy, Component} from '@angular/core'; | ||
import {FormsModule} from '@angular/forms'; | ||
import {MaskitoDirective} from '@maskito/angular'; | ||
import {TuiTextfield} from '@taiga-ui/core'; | ||
import {TuiSegmented} from '@taiga-ui/kit'; | ||
|
||
import mask from './mask'; | ||
|
||
@Component({ | ||
standalone: true, | ||
selector: 'time-mask-doc-example-4', | ||
imports: [FormsModule, MaskitoDirective, TuiSegmented, TuiTextfield], | ||
template: ` | ||
<!-- TODO: remove (input)="(0)" (Taiga UI CD bug) --> | ||
<tui-textfield | ||
filler="HH:MM" | ||
[style.max-width.rem]="20" | ||
[tuiTextfieldCleaner]="false" | ||
(input)="(0)" | ||
> | ||
<input | ||
inputmode="decimal" | ||
tuiTextfield | ||
[maskito]="mask" | ||
[(ngModel)]="value" | ||
/> | ||
<tui-segmented> | ||
<button type="button">AM</button> | ||
<button type="button">PM</button> | ||
</tui-segmented> | ||
</tui-textfield> | ||
`, | ||
changeDetection: ChangeDetectionStrategy.OnPush, | ||
}) | ||
export class TimeMaskDocExample4 { | ||
protected value = '03:30'; | ||
protected readonly mask = mask; | ||
} |
7 changes: 7 additions & 0 deletions
7
projects/demo/src/pages/kit/time/examples/4-time-segments-min-max/mask.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
import {maskitoTimeOptionsGenerator} from '@maskito/kit'; | ||
|
||
export default maskitoTimeOptionsGenerator({ | ||
mode: 'HH:MM', | ||
timeSegmentMaxValues: {hours: 12}, | ||
timeSegmentMinValues: {hours: 1}, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.