@dskripchenko/ui 1.19.1 → 1.21.0

package/README.md

@@ -91,7 +91,7 @@ A short selection — the full catalog is in [Storybook](https://dskripchenko.gi
 
 **Navigation:** Tabs, Breadcrumb, Link, Pagination (+ Cursor / LoadMore / InfiniteScroll / PageSize), BackTop, Affix, Anchor
 
-**Data display:** Card, Avatar, AvatarGroup, Tag, Divider, Accordion, Table, VirtualList, Stat, DescriptionList, Timeline, TreeView, Code, Watermark, Carousel, Calendar, NotificationBadge
+**Data display:** Card, Avatar, AvatarGroup, Tag, Divider, Accordion, Table, VirtualList, Stat, DescriptionList, Timeline, TreeView, Code, Watermark, Carousel, Calendar, EventCalendar, Board, Kanban, NotificationBadge
 
 **Layout helpers:** Stack, Grid, Container, Splitter
 
@@ -111,7 +111,7 @@ A short selection — the full catalog is in [Storybook](https://dskripchenko.gi
 
 User docs are translated into four languages — pick yours:
 
-- 🇬🇧 **English** (default): [getting-started](./docs/en/getting-started.md), [theming](./docs/en/theming.md), [tokens](./docs/en/tokens.md), [icons](./docs/en/icons.md), [patterns](./docs/en/patterns.md), [validation](./docs/en/validation.md), [charts](./docs/en/charts.md), [markdown](./docs/en/markdown.md), [video](./docs/en/video.md), [audio](./docs/en/audio.md), [i18n](./docs/en/i18n.md)
+- 🇬🇧 **English** (default): [getting-started](./docs/en/getting-started.md), [theming](./docs/en/theming.md), [tokens](./docs/en/tokens.md), [icons](./docs/en/icons.md), [patterns](./docs/en/patterns.md), [validation](./docs/en/validation.md), [charts](./docs/en/charts.md), [markdown](./docs/en/markdown.md), [board](./docs/en/board.md), [calendar](./docs/en/calendar.md), [kanban](./docs/en/kanban.md), [event calendar](./docs/en/event-calendar.md), [video](./docs/en/video.md), [audio](./docs/en/audio.md), [i18n](./docs/en/i18n.md)
 - 🇷🇺 **Русский**: [docs/ru/](./docs/ru/)
 - 🇩🇪 **Deutsch**: [docs/de/](./docs/de/)
 - 🇨🇳 **中文**: [docs/zh/](./docs/zh/)

package/dist/components/Board/UidBoard.vue.d.ts

@@ -4,11 +4,23 @@ export interface BoardCardTag {
     label: string;
     tone?: Tone | 'default';
 }
+/** Who a card is assigned to: a name, or a name with an avatar picture or colour. */
+export type BoardAssignee = string | {
+    name: string;
+    avatar?: string;
+    color?: string;
+};
 export interface BoardCard {
     key: BoardKey;
     title: string;
     subtitle?: string;
     tags?: BoardCardTag[];
+    /** Shown in the card's footer as initials or the avatar picture. */
+    assignee?: BoardAssignee;
+    /** `YYYY-MM-DD`: the due date, shown formatted; before `today` (and not `done`) it is overdue. */
+    due?: string;
+    /** A finished card: muted, and never overdue. */
+    done?: boolean;
     /** The swimlane the card sits in, when the board has lanes. */
     lane?: BoardKey;
     /** Columns the card may move to; omitted — any column. */
@@ -18,6 +30,8 @@ export interface BoardColumn {
     key: BoardKey;
     title: string;
     cards: BoardCard[];
+    /** The real number of cards when only some are loaded; the count and WIP check use it. */
+    total?: number;
     /** Work-in-progress limit; the header warns when the column holds more. */
     wip?: number | null;
 }
@@ -40,6 +54,8 @@ export interface UidBoardProps {
     /** Freeze the board while a move is being saved. */
     busy?: boolean;
     readonly?: boolean;
+    /** `YYYY-MM-DD`: a card `due` before it is overdue. The local date by default. */
+    today?: string;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -53,6 +69,10 @@ declare function __VLS_template(): {
             count: number;
             over: boolean;
         }): unknown;
+        /** The bottom of a column, below its cards (with lanes — below the last lane). */
+        'column-footer'?(props: {
+            column: BoardColumn;
+        }): unknown;
     }> & {
         card?(props: {
             card: BoardCard;
@@ -63,6 +83,10 @@ declare function __VLS_template(): {
             count: number;
             over: boolean;
         }): unknown;
+        /** The bottom of a column, below its cards (with lanes — below the last lane). */
+        'column-footer'?(props: {
+            column: BoardColumn;
+        }): unknown;
     };
     refs: {};
     rootEl: HTMLDivElement;
@@ -78,6 +102,7 @@ declare const __VLS_component: import('vue').DefineComponent<UidBoardProps, {},
     readonly: boolean;
     lanes: BoardLane[];
     busy: boolean;
+    today: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/Board/index.d.ts

@@ -1,2 +1,2 @@
 export { default as UidBoard } from './UidBoard.vue';
-export type { UidBoardProps, BoardCard, BoardCardTag, BoardColumn, BoardLane, BoardMove, BoardKey } from './UidBoard.vue';
+export type { UidBoardProps, BoardCard, BoardCardTag, BoardColumn, BoardLane, BoardMove, BoardKey, BoardAssignee } from './UidBoard.vue';

package/dist/components/Calendar/UidCalendar.vue.d.ts

@@ -1,5 +1,6 @@
 import { CalendarEvent, CalendarRange, CalendarView } from './calendarModel';
 export type { CalendarEvent, CalendarRange, CalendarView } from './calendarModel';
+/** `event-move`: a move gives the new date (and times); a resize gives the new `endTime` (time grid) or inclusive `endDate` (month, all-day row). */
 export interface CalendarEventMove {
     event: CalendarEvent;
     date: string;
@@ -7,6 +8,7 @@ export interface CalendarEventMove {
     time?: string;
     endTime?: string;
 }
+/** The payload of `slot-click`: an empty slot — a time in the day/week grid, a day in the all-day row. */
 export interface CalendarSlot {
     date: string;
     time?: string;
@@ -20,6 +22,8 @@ export interface UidCalendarProps {
     todayLabel?: string;
     views?: CalendarView[];
     editable?: boolean;
+    /** Emit `slot-click` for clicks on empty slots. Defaults to `editable`. */
+    selectable?: boolean;
     hourHeight?: number;
     scrollToHour?: number;
 }
@@ -57,11 +61,12 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
     "onUpdate:view"?: ((value: CalendarView) => any) | undefined;
     "onUpdate:anchor"?: ((value: string | null) => any) | undefined;
 }>, {
+    selectable: boolean;
     compact: boolean;
+    editable: boolean;
     events: CalendarEvent[];
     maxEventsPerDay: number;
     views: CalendarView[];
-    editable: boolean;
     hourHeight: number;
     scrollToHour: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {

package/dist/components/Calendar/calendarModel.d.ts

@@ -7,6 +7,8 @@ export interface CalendarEvent {
     endTime?: string;
     title: string;
     color?: string;
+    /** `false` — never dragged or resized, even in an editable calendar; omitted — follows the calendar. */
+    editable?: boolean;
 }
 export interface CalendarRange {
     view: CalendarView;
@@ -37,4 +39,6 @@ export interface TimedBlock {
     cols: number;
 }
 export declare function layoutDay(events: readonly CalendarEvent[], iso: string): TimedBlock[];
+/** The event stretched to end on `end` (inclusive, never before the start), times kept. */
+export declare function resized(e: CalendarEvent, end: string): Pick<CalendarEvent, 'date' | 'endDate' | 'time' | 'endTime'>;
 export declare function moved(e: CalendarEvent, date: string, time?: string): Pick<CalendarEvent, 'date' | 'endDate' | 'time' | 'endTime'>;

package/dist/components/Calendar/index.d.ts

@@ -1,2 +1,2 @@
 export { default as UidCalendar } from './UidCalendar.vue';
-export type { UidCalendarProps, CalendarEvent } from './UidCalendar.vue';
+export type { UidCalendarProps, CalendarEvent, CalendarEventMove, CalendarSlot, CalendarRange, CalendarView } from './UidCalendar.vue';

package/dist/components/EventCalendar/UidEventCalendar.vue.d.ts

@@ -0,0 +1,43 @@
+import { CalendarRange, CalendarView } from '../Calendar/calendarModel';
+export interface UidEventCalendarProps {
+    /** The calendar's markup. */
+    source?: string;
+    /** Drag and resize, the event builder, the source tab. */
+    editable?: boolean;
+    /** Read-only, whatever `editable` says. */
+    locked?: boolean;
+    /** Show the lock button (it emits `lock`). */
+    lockable?: boolean;
+    /** The view shown first; empty — the markup's `view:`, else the month. */
+    view?: CalendarView | '';
+    /** The date shown first (`YYYY-MM-DD`); empty — the markup's `date:`, else today. */
+    date?: string;
+    /** The views offered. */
+    views?: CalendarView[];
+}
+/** The payload of `open`: the event (the series for a repeat) and the date opened. */
+export interface EventCalendarOpen {
+    id: string;
+    date: string;
+    title: string;
+}
+declare const _default: import('vue').DefineComponent<UidEventCalendarProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    range: (range: CalendarRange) => any;
+    change: (source: string) => any;
+    lock: (locked: boolean) => any;
+    open: (event: EventCalendarOpen) => any;
+}, string, import('vue').PublicProps, Readonly<UidEventCalendarProps> & Readonly<{
+    onRange?: ((range: CalendarRange) => any) | undefined;
+    onChange?: ((source: string) => any) | undefined;
+    onLock?: ((locked: boolean) => any) | undefined;
+    onOpen?: ((event: EventCalendarOpen) => any) | undefined;
+}>, {
+    source: string;
+    view: CalendarView | "";
+    date: string;
+    editable: boolean;
+    views: CalendarView[];
+    locked: boolean;
+    lockable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/dist/components/EventCalendar/UidEventCalendarBuilder.vue.d.ts

@@ -0,0 +1,18 @@
+import { EventCalendarDraft } from './eventCalendarDraft';
+type __VLS_PublicProps = {
+    'draft': EventCalendarDraft;
+};
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    cancel: () => any;
+    remove: () => any;
+    save: () => any;
+    skip: () => any;
+    "update:draft": (value: EventCalendarDraft) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onCancel?: (() => any) | undefined;
+    onRemove?: (() => any) | undefined;
+    onSave?: (() => any) | undefined;
+    onSkip?: (() => any) | undefined;
+    "onUpdate:draft"?: ((value: EventCalendarDraft) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLFormElement>;
+export default _default;

package/dist/components/EventCalendar/eventCalendarDraft.d.ts

@@ -0,0 +1,31 @@
+import { EventCalendarFields, EventCalendarFreq, EventCalendarItem, EventCalendarRule } from './eventCalendarMarkup';
+export interface EventCalendarDraft {
+    itemId: string | null;
+    /** The occurrence of a repeat that was opened. */
+    occurrence: string | null;
+    scope: 'one' | 'all';
+    title: string;
+    allDay: boolean;
+    date: string;
+    endDate: string | null;
+    time: string;
+    endTime: string;
+    freq: 'none' | EventCalendarFreq;
+    interval: number;
+    byDay: number[];
+    monthMode: 'day' | 'nth' | 'last';
+    monthDay: number;
+    nth: number;
+    nthDay: number;
+    ends: 'never' | 'until' | 'count';
+    until: string | null;
+    count: number;
+    except: string[];
+    tags: string[];
+    where: string;
+    extra: string;
+}
+export declare function newDraft(date: string, time?: string): EventCalendarDraft;
+export declare function draftOf(item: EventCalendarItem, occurrence: string | null): EventCalendarDraft;
+export declare function ruleOf(d: EventCalendarDraft): EventCalendarRule | null;
+export declare function fieldsOf(d: EventCalendarDraft, single?: boolean): EventCalendarFields;

package/dist/components/EventCalendar/eventCalendarMarkup.d.ts

@@ -0,0 +1,82 @@
+import { MarkupProps } from '../Kanban/kanbanMarkup';
+export type EventCalendarFreq = 'daily' | 'weekly' | 'monthly' | 'yearly';
+export interface EventCalendarByDay {
+    /** 0 = Monday … 6 = Sunday. */
+    day: number;
+    /** The n-th weekday of the month (1…4, -1 = last); undefined — every such weekday. */
+    nth?: number;
+}
+export interface EventCalendarRule {
+    freq: EventCalendarFreq;
+    interval: number;
+    byDay: EventCalendarByDay[];
+    /** Days of the month (-1 = the last day). */
+    byMonthDay: number[];
+    /** Months 1…12. */
+    byMonth: number[];
+    from: string | null;
+    until: string | null;
+    count: number | null;
+    except: string[];
+}
+export interface EventCalendarItem {
+    id: string;
+    line: number;
+    title: string;
+    tags: string[];
+    props: MarkupProps;
+    date: string | null;
+    endDate: string | null;
+    time: string | null;
+    endTime: string | null;
+    rule: EventCalendarRule | null;
+}
+export interface EventCalendarProblem {
+    line: number;
+    message: string;
+}
+export interface EventCalendarDoc {
+    title: string | null;
+    settings: MarkupProps;
+    tagTones: Record<string, string>;
+    items: EventCalendarItem[];
+    problems: EventCalendarProblem[];
+}
+/** `FREQ=WEEKLY;INTERVAL=2;BYDAY=MO,FR;UNTIL=20261228` → a rule. */
+export declare function parseEventRRule(text: string): EventCalendarRule | null;
+export declare function parseEventCalendar(source: string): EventCalendarDoc;
+/** One event line → an item, or the reason it is not one. */
+export declare function parseEventLine(text: string, line?: number, id?: string): EventCalendarItem | string;
+/** The dates a rule produces between `start` and `end` (inclusive). */
+export declare function eventOccurrences(rule: EventCalendarRule, start: string, end: string, limit?: number): string[];
+export interface EventCalendarOccurrence {
+    /** `<item id>` or `<item id>@<date>` for a repeat. */
+    id: string;
+    item: EventCalendarItem;
+    date: string;
+    endDate?: string;
+    time?: string;
+    endTime?: string;
+}
+/** Every event and repeat occurrence that touches the days `start`…`end`. */
+export declare function expandEventCalendar(doc: EventCalendarDoc, start: string, end: string): EventCalendarOccurrence[];
+export declare function eventRuleText(rule: EventCalendarRule): string;
+export interface EventCalendarFields {
+    title: string;
+    date?: string | null;
+    endDate?: string | null;
+    time?: string | null;
+    endTime?: string | null;
+    tags?: string[];
+    props?: MarkupProps;
+    rule?: EventCalendarRule | null;
+}
+export declare function serializeCalendarEvent(e: EventCalendarFields): string;
+export declare function addCalendarEvent(source: string, e: EventCalendarFields): string;
+export declare function updateCalendarEvent(source: string, id: string, e: EventCalendarFields): string;
+export declare function removeCalendarEvent(source: string, id: string): string;
+/**
+ * One occurrence of a repeat changed (moved, or edited "this one only"): the
+ * series skips that date and a single event takes its place.
+ */
+export declare function detachCalendarOccurrence(source: string, id: string, date: string, single: EventCalendarFields): string;

package/dist/components/EventCalendar/index.d.ts

@@ -0,0 +1,4 @@
+export { default as UidEventCalendar } from './UidEventCalendar.vue';
+export type { UidEventCalendarProps, EventCalendarOpen } from './UidEventCalendar.vue';
+export { parseEventCalendar, parseEventLine, parseEventRRule, expandEventCalendar, eventOccurrences, eventRuleText, serializeCalendarEvent, addCalendarEvent, updateCalendarEvent, removeCalendarEvent, detachCalendarOccurrence, } from './eventCalendarMarkup';
+export type { EventCalendarDoc, EventCalendarItem, EventCalendarProblem, EventCalendarRule, EventCalendarFreq, EventCalendarByDay, EventCalendarOccurrence, EventCalendarFields, } from './eventCalendarMarkup';

package/dist/components/Kanban/UidKanban.vue.d.ts

@@ -0,0 +1,34 @@
+export interface UidKanbanProps {
+    /** The board's markup. */
+    source?: string;
+    /** Allow moves, new and changed cards and the source tab. */
+    editable?: boolean;
+    /** Read-only, whatever `editable` says. */
+    locked?: boolean;
+    /** Show the lock button (it emits `lock`). */
+    lockable?: boolean;
+    /** `YYYY-MM-DD`: a due date before it is overdue. Today (UTC) by default. */
+    today?: string;
+}
+/** The payload of `open`: the card and the title of its column. */
+export interface KanbanOpen {
+    id: string;
+    title: string;
+    column: string;
+}
+declare const _default: import('vue').DefineComponent<UidKanbanProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    change: (source: string) => any;
+    lock: (locked: boolean) => any;
+    open: (card: KanbanOpen) => any;
+}, string, import('vue').PublicProps, Readonly<UidKanbanProps> & Readonly<{
+    onChange?: ((source: string) => any) | undefined;
+    onLock?: ((locked: boolean) => any) | undefined;
+    onOpen?: ((card: KanbanOpen) => any) | undefined;
+}>, {
+    source: string;
+    today: string;
+    editable: boolean;
+    locked: boolean;
+    lockable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/dist/components/Kanban/index.d.ts

@@ -0,0 +1,4 @@
+export { default as UidKanban } from './UidKanban.vue';
+export type { UidKanbanProps, KanbanOpen } from './UidKanban.vue';
+export { parseKanban, addKanbanCard, moveKanbanCard, updateKanbanCard, removeKanbanCard, addKanbanColumn, serializeKanbanCard, kanbanInlineMarkdown, parseMarkupProps, serializeMarkupProps, splitMarkupProps, } from './kanbanMarkup';
+export type { KanbanDoc, KanbanCard, KanbanColumn, KanbanProblem, KanbanPriority, KanbanCardFields, MarkupProps, } from './kanbanMarkup';

package/dist/components/Kanban/kanbanMarkup.d.ts

@@ -0,0 +1,80 @@
+/**
+ * The kanban markup:
+ *
+ *   # Board title
+ *   lanes: Payments, Refunds
+ *
+ *   ## Column {wip: 3}
+ *   - Card title #tag !high {lane: Payments, who: Anna, due: 2026-11-15}
+ *     Description, indented.
+ *
+ * Parsing keeps each column's and card's line range, so an edit (moving a
+ * card, changing one) rewrites only its own lines and leaves comments, blank
+ * lines and the rest of the text as they were.
+ */
+/**
+ * `{key: value, flag, list: a, b}` — the properties at the end of a kanban
+ * card, column or calendar event line. A part without a colon is a flag
+ * (`done`) when it reads like a name, otherwise the next item of the
+ * previous value (`except: 2026-11-30, 2026-12-07`). Flags map to ''.
+ */
+export type MarkupProps = Map<string, string>;
+export declare function parseMarkupProps(inner: string): MarkupProps;
+export declare function serializeMarkupProps(props: MarkupProps): string;
+/** `Title {a: 1, b}` → the text and its props (the braces at the end of a line). */
+export declare function splitMarkupProps(text: string): {
+    text: string;
+    props: MarkupProps;
+};
+export type KanbanPriority = 'high' | 'low';
+export interface KanbanCard {
+    id: string;
+    title: string;
+    tags: string[];
+    priority: KanbanPriority | null;
+    props: MarkupProps;
+    description: string;
+    /** Lines of the card: its own line and the description under it. */
+    start: number;
+    end: number;
+}
+export interface KanbanColumn {
+    id: string;
+    title: string;
+    props: MarkupProps;
+    wip: number | null;
+    done: boolean;
+    cards: KanbanCard[];
+    start: number;
+    end: number;
+}
+export interface KanbanProblem {
+    line: number;
+    message: string;
+}
+export interface KanbanDoc {
+    title: string | null;
+    settings: MarkupProps;
+    lanes: string[];
+    tagTones: Record<string, string>;
+    columns: KanbanColumn[];
+    problems: KanbanProblem[];
+}
+export declare function parseKanban(source: string): KanbanDoc;
+export interface KanbanCardFields {
+    title: string;
+    tags?: string[];
+    priority?: KanbanPriority | null;
+    props?: MarkupProps;
+    description?: string;
+}
+/** A card as markup lines: its own line, then the description indented under it. */
+export declare function serializeKanbanCard(card: KanbanCardFields): string[];
+/** Moves a card into a column, before another card or (null) to its end; `lane` changes its swimlane. */
+export declare function moveKanbanCard(source: string, cardId: string, toColumnId: string, beforeCardId: string | null, lane?: string | null): string;
+export declare function addKanbanCard(source: string, columnId: string, card: KanbanCardFields): string;
+export declare function updateKanbanCard(source: string, cardId: string, card: KanbanCardFields): string;
+export declare function removeKanbanCard(source: string, cardId: string): string;
+export declare function addKanbanColumn(source: string, title: string): string;
+/** A card title's inline markdown as HTML: links, code, bold, italics. The text is escaped first. */
+export declare function kanbanInlineMarkdown(text: string): string;