seblify 0.2.1 → 0.4.0

package/dist/components/framework/surface/paper/Paper.svelte.d.ts

@@ -2,7 +2,7 @@ import type { Snippet } from 'svelte';
 type PaperElement = keyof HTMLElementTagNameMap;
 type PaperPadding = 'none' | 'sm' | 'md' | 'lg';
 type PaperRadius = 'sm' | 'md' | 'lg';
-type PaperTone = 'neutral' | 'primary' | 'success' | 'danger' | 'warning' | 'info' | 'inverse';
+type PaperTone = 'neutral' | 'strong' | 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
 type PaperVariant = 'solid' | 'soft' | 'tint' | 'plain';
 declare const Paper: import("svelte").Component<{
     as?: PaperElement | undefined;

package/dist/components/utility/format/date-time/formatDateTime.d.ts

@@ -0,0 +1,23 @@
+export type DateTimeInput = Date | number | string;
+export type DateTimeDateStyle = 'short' | 'medium' | 'long' | 'full';
+export type DateTimeTimeStyle = 'short' | 'medium' | 'long' | 'full';
+export type DateTimeLocaleOptions = {
+    locale?: Intl.LocalesArgument;
+    timeZone?: string;
+};
+export type FormatDateOptions = DateTimeLocaleOptions & {
+    dateStyle?: DateTimeDateStyle;
+};
+export type FormatTimeOptions = DateTimeLocaleOptions & {
+    hour12?: boolean;
+    timeStyle?: DateTimeTimeStyle;
+};
+export type FormatDateTimeOptions = DateTimeLocaleOptions & {
+    dateStyle?: DateTimeDateStyle;
+    hour12?: boolean;
+    timeStyle?: DateTimeTimeStyle;
+};
+export declare function formatDate(timestamp: DateTimeInput, options?: FormatDateOptions): string;
+export declare function formatTime(timestamp: DateTimeInput, options?: FormatTimeOptions): string;
+export declare function formatDateTime(timestamp: DateTimeInput, options?: FormatDateTimeOptions): string;
+export declare function dateTimeIsoString(timestamp: DateTimeInput): string;

package/dist/components/utility/format/date-time/formatDateTime.js

@@ -0,0 +1,33 @@
+export function formatDate(timestamp, options = {}) {
+    return new Intl.DateTimeFormat(options.locale, {
+        dateStyle: options.dateStyle ?? 'medium',
+        timeZone: options.timeZone,
+    }).format(toDate(timestamp));
+}
+export function formatTime(timestamp, options = {}) {
+    return new Intl.DateTimeFormat(options.locale, {
+        hour12: options.hour12,
+        timeStyle: options.timeStyle ?? 'short',
+        timeZone: options.timeZone,
+    }).format(toDate(timestamp));
+}
+export function formatDateTime(timestamp, options = {}) {
+    return new Intl.DateTimeFormat(options.locale, {
+        dateStyle: options.dateStyle ?? 'medium',
+        hour12: options.hour12,
+        timeStyle: options.timeStyle ?? 'short',
+        timeZone: options.timeZone,
+    }).format(toDate(timestamp));
+}
+export function dateTimeIsoString(timestamp) {
+    return toDate(timestamp).toISOString();
+}
+function toDate(timestamp) {
+    const date = timestamp instanceof Date
+        ? new Date(timestamp.getTime())
+        : new Date(timestamp);
+    if (Number.isNaN(date.getTime())) {
+        throw new RangeError('Invalid date time timestamp.');
+    }
+    return date;
+}

package/dist/components/utility/format/duration/formatDuration.d.ts

@@ -0,0 +1,15 @@
+export type DurationFormat = 'unit' | 'clock';
+export type DurationRounding = 'floor' | 'round' | 'ceil';
+export type DurationUnit = 'year' | 'month' | 'week' | 'millisecond' | 'second' | 'minute' | 'hour' | 'day';
+export type DurationStyle = 'long' | 'short' | 'narrow';
+export type FormatDurationOptions = {
+    format?: DurationFormat;
+    largestUnit?: DurationUnit;
+    locale?: Intl.LocalesArgument;
+    minUnits?: number;
+    maxUnits?: number;
+    rounding?: DurationRounding;
+    smallestUnit?: DurationUnit;
+    style?: DurationStyle;
+};
+export declare function formatDuration(value: number, options?: FormatDurationOptions): string;

package/dist/components/utility/format/duration/formatDuration.js

@@ -0,0 +1,218 @@
+const MILLISECOND = 1;
+const SECOND = 1000;
+const MINUTE = 60 * SECOND;
+const HOUR = 60 * MINUTE;
+const DAY = 24 * HOUR;
+const WEEK = 7 * DAY;
+const YEAR = 365.25 * DAY;
+const MONTH = YEAR / 12;
+const UNITS = [
+    { unit: 'year', milliseconds: YEAR },
+    { unit: 'month', milliseconds: MONTH },
+    { unit: 'week', milliseconds: WEEK },
+    { unit: 'day', milliseconds: DAY },
+    { unit: 'hour', milliseconds: HOUR },
+    { unit: 'minute', milliseconds: MINUTE },
+    { unit: 'second', milliseconds: SECOND },
+    { unit: 'millisecond', milliseconds: MILLISECOND },
+];
+export function formatDuration(value, options = {}) {
+    const milliseconds = toDurationMilliseconds(value);
+    if (options.format === 'clock') {
+        return formatClockDuration(milliseconds, options);
+    }
+    return formatUnitDuration(milliseconds, options);
+}
+function toDurationMilliseconds(value) {
+    if (!Number.isFinite(value) || value < 0) {
+        throw new RangeError('Invalid duration value.');
+    }
+    return value;
+}
+function formatUnitDuration(milliseconds, options) {
+    const largestUnit = options.largestUnit ?? 'day';
+    const smallestUnit = options.smallestUnit ?? 'second';
+    const maxUnits = getMaxUnits(options.maxUnits);
+    const minUnits = getMinUnits(options.minUnits, maxUnits);
+    const unitConfigs = getUnitConfigs(largestUnit, smallestUnit);
+    const parts = maxUnits === 1
+        ? selectSingleUnitPart(milliseconds, unitConfigs, options)
+        : selectUnitParts(milliseconds, unitConfigs, maxUnits, minUnits, options);
+    const formattedParts = parts.map((part) => formatUnit(part.amount, part.unit, options));
+    return new Intl.ListFormat(options.locale, {
+        style: options.style ?? 'long',
+        type: 'unit',
+    }).format(formattedParts);
+}
+function getMaxUnits(maxUnits) {
+    if (maxUnits === undefined) {
+        return 2;
+    }
+    if (!Number.isFinite(maxUnits) || maxUnits < 1) {
+        throw new RangeError('Invalid duration maxUnits.');
+    }
+    return Math.floor(maxUnits);
+}
+function getMinUnits(minUnits, maxUnits) {
+    if (minUnits === undefined) {
+        return 1;
+    }
+    if (!Number.isFinite(minUnits) || minUnits < 1 || minUnits > maxUnits) {
+        throw new RangeError('Invalid duration minUnits.');
+    }
+    return Math.floor(minUnits);
+}
+function getUnitConfigs(largestUnit, smallestUnit) {
+    const startIndex = UNITS.findIndex((config) => config.unit === largestUnit);
+    const endIndex = UNITS.findIndex((config) => config.unit === smallestUnit);
+    if (startIndex === -1) {
+        throw new RangeError('Invalid duration largestUnit.');
+    }
+    if (endIndex === -1) {
+        throw new RangeError('Invalid duration smallestUnit.');
+    }
+    if (startIndex > endIndex) {
+        throw new RangeError('Duration largestUnit must be larger than smallestUnit.');
+    }
+    return [...UNITS.slice(startIndex, endIndex + 1)];
+}
+function selectSingleUnitPart(milliseconds, unitConfigs, options) {
+    const smallestUnit = unitConfigs[unitConfigs.length - 1];
+    const selectedUnit = unitConfigs.find((config) => milliseconds >= config.milliseconds) ??
+        smallestUnit;
+    const rounding = options.rounding ?? 'round';
+    const amount = milliseconds < smallestUnit.milliseconds
+        ? 0
+        : roundToTenths(milliseconds / selectedUnit.milliseconds, rounding);
+    return [
+        {
+            amount,
+            unit: selectedUnit.unit,
+        },
+    ];
+}
+function selectUnitParts(milliseconds, unitConfigs, maxUnits, minUnits, options) {
+    const smallestUnit = unitConfigs[unitConfigs.length - 1];
+    let remainingMilliseconds = roundToUnit(milliseconds, smallestUnit.milliseconds, options.rounding ?? 'floor');
+    const decomposedParts = [];
+    for (const config of unitConfigs) {
+        const amount = Math.floor(remainingMilliseconds / config.milliseconds);
+        decomposedParts.push({
+            amount,
+            unit: config.unit,
+        });
+        remainingMilliseconds -= amount * config.milliseconds;
+    }
+    const firstNonZeroIndex = decomposedParts.findIndex((part) => part.amount !== 0);
+    if (firstNonZeroIndex === -1) {
+        return [
+            {
+                amount: 0,
+                unit: smallestUnit.unit,
+            },
+        ];
+    }
+    if (minUnits > 1) {
+        const startIndex = Math.max(0, Math.min(firstNonZeroIndex, decomposedParts.length - minUnits));
+        return decomposedParts.slice(startIndex, startIndex + maxUnits);
+    }
+    const parts = decomposedParts.filter((part) => part.amount !== 0);
+    return parts.slice(0, maxUnits);
+}
+function formatUnit(amount, unit, options) {
+    return new Intl.NumberFormat(options.locale, {
+        maximumFractionDigits: 1,
+        style: 'unit',
+        unit,
+        unitDisplay: options.style ?? 'long',
+    }).format(amount);
+}
+function formatClockDuration(milliseconds, options) {
+    const largestUnit = options.largestUnit ?? 'day';
+    const smallestUnit = options.smallestUnit ?? 'second';
+    const unitConfigs = getUnitConfigs(largestUnit, smallestUnit);
+    const minUnits = getClockMinUnits(options.minUnits);
+    const smallestConfig = unitConfigs[unitConfigs.length - 1];
+    const visibleMilliseconds = roundToUnit(milliseconds, smallestConfig.milliseconds, options.rounding ?? 'floor');
+    const showMilliseconds = options.smallestUnit === 'millisecond';
+    const parts = decomposeDuration(visibleMilliseconds, unitConfigs);
+    const partByUnit = new Map(parts.map((part) => [part.unit, part.amount]));
+    const years = partByUnit.get('year') ?? 0;
+    const months = partByUnit.get('month') ?? 0;
+    const weeks = partByUnit.get('week') ?? 0;
+    const days = partByUnit.get('day') ?? 0;
+    const hours = partByUnit.get('hour') ?? 0;
+    const minutes = partByUnit.get('minute') ?? 0;
+    const seconds = partByUnit.get('second') ?? 0;
+    const prefixes = [
+        formatClockPrefix(years, 'y', includesUnit(unitConfigs, 'year'), minUnits >= 6),
+        formatClockPrefix(months, 'mo', includesUnit(unitConfigs, 'month'), minUnits >= 5),
+        formatClockPrefix(weeks, 'w', includesUnit(unitConfigs, 'week'), minUnits >= 5),
+        formatClockPrefix(days, 'd', includesUnit(unitConfigs, 'day'), minUnits >= 4),
+    ].filter((part) => part !== undefined);
+    const showHours = hours > 0 ||
+        prefixes.length > 0 ||
+        largestUnit === 'hour' ||
+        minUnits >= 3;
+    const formattedHours = prefixes.length > 0 || minUnits >= 3
+        ? pad(hours)
+        : hours.toString();
+    const clock = showHours
+        ? `${formattedHours}:${pad(minutes)}:${pad(seconds)}`
+        : `${pad(minutes)}:${pad(seconds)}`;
+    const clockWithPrefixes = prefixes.length > 0 ? `${prefixes.join(' ')} ${clock}` : clock;
+    if (!showMilliseconds) {
+        return clockWithPrefixes;
+    }
+    return `${clockWithPrefixes}.${padMilliseconds(partByUnit.get('millisecond') ?? 0)}`;
+}
+function decomposeDuration(milliseconds, unitConfigs) {
+    let remainingMilliseconds = milliseconds;
+    return unitConfigs.map((config) => {
+        const amount = Math.floor(remainingMilliseconds / config.milliseconds);
+        remainingMilliseconds -= amount * config.milliseconds;
+        return {
+            amount,
+            unit: config.unit,
+        };
+    });
+}
+function includesUnit(unitConfigs, unit) {
+    return unitConfigs.some((config) => config.unit === unit);
+}
+function getClockMinUnits(minUnits) {
+    if (minUnits === undefined) {
+        return 2;
+    }
+    if (!Number.isFinite(minUnits) || minUnits < 1) {
+        throw new RangeError('Invalid duration minUnits.');
+    }
+    return Math.floor(minUnits);
+}
+function formatClockPrefix(amount, suffix, unitIsIncluded, force) {
+    if (!unitIsIncluded || (amount === 0 && !force)) {
+        return undefined;
+    }
+    return `${amount}${suffix}`;
+}
+function roundToTenths(value, rounding) {
+    return roundValue(value * 10, rounding) / 10;
+}
+function roundToUnit(milliseconds, unitMilliseconds, rounding) {
+    return roundValue(milliseconds / unitMilliseconds, rounding) * unitMilliseconds;
+}
+function roundValue(value, rounding) {
+    if (rounding === 'floor') {
+        return Math.floor(value);
+    }
+    if (rounding === 'ceil') {
+        return Math.ceil(value);
+    }
+    return Math.round(value);
+}
+function pad(value) {
+    return value.toString().padStart(2, '0');
+}
+function padMilliseconds(value) {
+    return value.toString().padStart(3, '0');
+}

package/dist/components/utility/format/relative-time/formatRelativeTime.d.ts

@@ -0,0 +1,42 @@
+import type { DurationRounding } from '../duration/formatDuration';
+export type RelativeTimeInput = Date | number | string;
+export type RelativeTimeLabel = {
+    label: string;
+    threshold?: number;
+} | {
+    label?: string;
+    threshold: number;
+};
+export type RelativeTimePresentation = 'relative' | 'unit';
+export type RelativeTimeMode = 'time' | 'calendar';
+export type RelativeTimeRounding = DurationRounding;
+export type RelativeTimeStyle = 'long' | 'short' | 'narrow';
+export type RelativeTimeUnitSteps = 'detailed' | 'compact' | 'simple';
+export type RelativeTimeUnit = 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year';
+export type RelativeTimeDirection = 'past' | 'present' | 'future';
+export type RelativeTimeState = {
+    amount: number;
+    direction: RelativeTimeDirection;
+    milliseconds: number;
+    label?: string;
+    signedAmount: number;
+    unit: RelativeTimeUnit;
+    updateInMilliseconds: number;
+};
+export type FormatRelativeTimeOptions = {
+    from?: RelativeTimeInput;
+    labels?: readonly RelativeTimeLabel[];
+    largestUnit?: RelativeTimeUnit;
+    locale?: Intl.LocalesArgument;
+    maxUnits?: number;
+    minUnits?: number;
+    mode?: RelativeTimeMode;
+    presentation?: RelativeTimePresentation;
+    rounding?: RelativeTimeRounding;
+    smallestUnit?: RelativeTimeUnit;
+    style?: RelativeTimeStyle;
+    unitSteps?: RelativeTimeUnitSteps;
+};
+export declare function formatRelativeTime(value: RelativeTimeInput, options?: FormatRelativeTimeOptions): string;
+export declare function getRelativeTimeState(value: RelativeTimeInput, options?: FormatRelativeTimeOptions): RelativeTimeState;
+export declare function relativeTimeDateTime(value: RelativeTimeInput): string;