@flightlesslabs/dodo-ui 0.19.1 → 0.21.0

package/dist/stories/components/Info/Calendar/Calendar.stories.svelte

@@ -1,115 +0,0 @@
-<script module lang="ts">import { defineMeta } from '@storybook/addon-svelte-csf';
-import Calendar from './Calendar.svelte';
-import getMoment from '../../../developer tools/helpers/Time/getMoment/getMoment.js';
-import { componentColorArray } from '../../../../types/colors.js';
-import { componentSizeArray } from '../../../../types/size.js';
-import { calendarWeekNamesArray } from './SubComponents/CalendarDatesChart/CalendarWeek/CalendarWeek.svelte';
-export const storyCalendarArgTypes = {
-    startOfWeek: {
-        control: { type: 'select' },
-        options: calendarWeekNamesArray,
-    },
-    color: {
-        control: { type: 'select' },
-        options: componentColorArray,
-    },
-    size: {
-        control: { type: 'select' },
-        options: componentSizeArray,
-    },
-};
-// More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-const { Story } = defineMeta({
-    component: Calendar,
-    tags: ['autodocs'],
-    argTypes: storyCalendarArgTypes,
-});
-let value = $state(getMoment().toDate());
-</script>
-
-<!-- Default Calendar -->
-<Story
-  name="Default"
-  args={{
-    value,
-  }}
-/>
-
-<Story
-  name="StartOfWeek"
-  args={{
-    value,
-    startOfWeek: 'mon',
-  }}
-/>
-
-<Story
-  name="ActiveMonth"
-  args={{
-    activeMonth: getMoment('01-02-2025', 'DD-MM-YYYY').toDate(),
-    value,
-  }}
-/>
-
-<Story
-  name="WeekendDays"
-  args={{
-    weekendDays: ['sun'],
-    value,
-  }}
-/>
-
-<Story
-  name="WeekHeadingColorOnly"
-  args={{
-    weekendDays: ['sun'],
-    value,
-    weekendDaysColorDays: false,
-  }}
-/>
-
-<Story
-  name="HideSelected"
-  args={{
-    showSelected: false,
-    value,
-  }}
-/>
-
-<Story
-  name="HideLastMonth"
-  args={{
-    value: getMoment('01-03-2025', 'DD-MM-YYYY').toDate(),
-    showLastMonth: false,
-  }}
-/>
-
-<Story
-  name="HideNextMonth"
-  args={{
-    value: getMoment('01-03-2025', 'DD-MM-YYYY').toDate(),
-    showNextMonth: false,
-  }}
-/>
-
-<Story
-  name="HideCalendarControls"
-  args={{
-    value: getMoment('01-03-2025', 'DD-MM-YYYY').toDate(),
-    showCalendarControls: false,
-  }}
-/>
-
-<Story
-  name="ManipulateDate"
-  args={{
-    manipulateDate: (dateToModify: DateOfMonth) => {
-      // Disable all Fridays
-      if (getMoment(dateToModify.date, undefined).day() === 5) {
-        dateToModify.disabled = true;
-      }
-
-      return dateToModify;
-    },
-  }}
-/>

package/dist/stories/components/Info/Calendar/Calendar.svelte

@@ -1,205 +0,0 @@
-<script lang="ts" module>export {};
-</script>
-
-<script lang="ts">import getMoment from '../../../developer tools/helpers/Time/getMoment/getMoment.js';
-import { CalendarDatesChart, CalendarControls, calendarMonthOptions, MONTHS, } from '../../../../index.js';
-import CalendarMonthList from './SubComponents/CalendarMonthList/CalendarMonthList.svelte';
-import CalendarYearList from './SubComponents/CalendarYearList/CalendarYearList.svelte';
-let { class: className = '', ref = $bindable(), value, startOfWeek = 'sun', timezone, utc, calendarDateChipProps, activeMonth: activeMonthRaw, showSelected = true, showLastMonth = true, showNextMonth = true, showToday = true, today, minDate, maxDate, excludeDates, includeDates, onselect, customCalendarDateChipContent, customCalendarDateChip, color, customCalendarWeekContent, customCalendarWeek, size = 'normal', weekendDays, weekendDaysColorDays = true, customCalendarControls, showCalendarControls = true, calendarMonthSelectorProps, customCalendarMonthSelector, customCalendarMonthSelectorContent, onMonthSelectorClick, calendarYearSelectorProps, customCalendarYearSelector, customCalendarYearSelectorContent, onYearSelectorClick, calendarNavigationProps, customCalendarNavigation, customCalendarNavigationNext, customCalendarNavigationPrev, customCalendarNavigationNextContent, customCalendarNavigationPrevContent, onCalendarNavigationNextClick, onCalendarNavigationPrevClick, disabledCalendarNavigationNext: disabledCalendarNavigationNextRaw, disabledCalendarNavigationPrev: disabledCalendarNavigationPrevRaw, showCalendarMonthSelector, showCalendarYearSelector, showCalendarNavigator, onselectMonth, customCalendarMonthChipContent, customCalendarMonthChip, disabledMonths, calendarMonthChipProps, calendarYearChipProps, onselectYear, customCalendarYearChipContent, customCalendarYearChip, oncancelMonth, oncancelYear, showControlsMonthList = true, showControlsYearList = true, calendarTopContent: calendarTopContentInternal, calendarBottomContent: calendarBottomContentInternal, manipulateDate, } = $props();
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-let calendarTopContentTyped = calendarTopContentInternal;
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-let calendarBottomContentTyped = calendarBottomContentInternal;
-let activeMonth = $derived(activeMonthRaw ||
-    value ||
-    getMoment(undefined, undefined, { timezone, utc }).startOf('month').startOf('day').toDate());
-const disabledCalendarNavigationNext = $derived(disabledCalendarNavigationNextRaw);
-const disabledCalendarNavigationPrev = $derived(disabledCalendarNavigationPrevRaw);
-let activeSection = $state('date');
-function onCalendarNavigationNextClickMod(e) {
-    activeMonth = getMoment(activeMonth, undefined, { timezone, utc })
-        .add(1, 'month')
-        .startOf('month')
-        .startOf('day')
-        .toDate();
-    if (onCalendarNavigationNextClick) {
-        onCalendarNavigationNextClick(e);
-    }
-}
-function onCalendarNavigationPrevClickMod(e) {
-    activeMonth = getMoment(activeMonth, undefined, { timezone, utc })
-        .subtract(1, 'month')
-        .startOf('month')
-        .startOf('day')
-        .toDate();
-    if (onCalendarNavigationPrevClick) {
-        onCalendarNavigationPrevClick(e);
-    }
-}
-function onMonthSelectorClickMod(option, e) {
-    activeSection = 'month';
-    if (onMonthSelectorClick) {
-        onMonthSelectorClick(option, e);
-    }
-}
-function onYearhSelectorClickMod(selectedYear, e) {
-    activeSection = 'year';
-    if (onYearSelectorClick) {
-        onYearSelectorClick(selectedYear, e);
-    }
-}
-function onselectMonthMod(value, e) {
-    const monthValue = calendarMonthOptions.find((item) => item.abr3 === value)?.value || MONTHS.JAN;
-    activeMonth = getMoment(activeMonth, undefined, { timezone, utc })
-        .set('month', monthValue)
-        .startOf('month')
-        .startOf('day')
-        .toDate();
-    activeSection = 'date';
-    if (onselectMonth) {
-        onselectMonth(value, e);
-    }
-}
-function onselectYearMod(value, e) {
-    activeMonth = getMoment(activeMonth, undefined, { timezone, utc })
-        .set('year', Number(value))
-        .startOf('month')
-        .startOf('day')
-        .toDate();
-    activeSection = 'date';
-    if (onselectYear) {
-        onselectYear(value, e);
-    }
-}
-function oncancelMonthMod(e) {
-    activeSection = 'date';
-    if (oncancelMonth) {
-        oncancelMonth(e);
-    }
-}
-function oncancelYearMod(e) {
-    activeSection = 'date';
-    if (oncancelYear) {
-        oncancelYear(e);
-    }
-}
-</script>
-
-{#snippet daysSection()}
-  {#if showCalendarControls}
-    <CalendarControls
-      {activeMonth}
-      {value}
-      {timezone}
-      {utc}
-      {color}
-      {size}
-      {customCalendarMonthSelector}
-      {customCalendarMonthSelectorContent}
-      onMonthSelectorClick={onMonthSelectorClickMod}
-      {calendarMonthSelectorProps}
-      {customCalendarControls}
-      {calendarYearSelectorProps}
-      {customCalendarYearSelector}
-      {customCalendarYearSelectorContent}
-      onYearSelectorClick={onYearhSelectorClickMod}
-      {calendarNavigationProps}
-      {customCalendarNavigationNext}
-      {customCalendarNavigationPrev}
-      {customCalendarNavigationNextContent}
-      {customCalendarNavigationPrevContent}
-      onCalendarNavigationNextClick={onCalendarNavigationNextClickMod}
-      onCalendarNavigationPrevClick={onCalendarNavigationPrevClickMod}
-      {disabledCalendarNavigationNext}
-      {disabledCalendarNavigationPrev}
-      {customCalendarNavigation}
-      {showCalendarMonthSelector}
-      {showCalendarYearSelector}
-      {showCalendarNavigator}
-    />
-  {/if}
-
-  <CalendarDatesChart
-    {today}
-    {minDate}
-    {maxDate}
-    {excludeDates}
-    {includeDates}
-    {showToday}
-    {showSelected}
-    {showLastMonth}
-    {showNextMonth}
-    {activeMonth}
-    {value}
-    {startOfWeek}
-    {timezone}
-    {utc}
-    {calendarDateChipProps}
-    {onselect}
-    {customCalendarDateChipContent}
-    {customCalendarDateChip}
-    {color}
-    {customCalendarWeekContent}
-    {customCalendarWeek}
-    {size}
-    {weekendDays}
-    {weekendDaysColorDays}
-    {manipulateDate}
-  />
-{/snippet}
-
-{#snippet monthSection()}
-  <CalendarMonthList
-    value={getMoment(activeMonth, undefined, { timezone, utc })
-      .format('MMM')
-      .toLowerCase() as CalendarMonthNames}
-    onselect={onselectMonthMod}
-    {size}
-    {color}
-    {customCalendarMonthChipContent}
-    {customCalendarMonthChip}
-    {disabledMonths}
-    {calendarMonthChipProps}
-    oncancel={oncancelMonthMod}
-    showControls={showControlsMonthList}
-  />
-{/snippet}
-
-{#snippet yearSection()}
-  <CalendarYearList
-    value={getMoment(activeMonth, undefined, { timezone, utc }).format('YYYY')}
-    {size}
-    {color}
-    {minDate}
-    {maxDate}
-    {customCalendarYearChip}
-    {customCalendarYearChipContent}
-    {calendarYearChipProps}
-    onselect={onselectYearMod}
-    oncancel={oncancelYearMod}
-    showControls={showControlsYearList}
-  />
-{/snippet}
-
-<div class={['dodo-ui-Calendar', className].join(' ')} bind:this={ref}>
-  {#if calendarTopContentTyped}
-    {@render calendarTopContentTyped(activeSection)}
-  {/if}
-
-  {#if activeSection === 'month'}
-    {@render monthSection()}
-  {:else if activeSection === 'year'}
-    {@render yearSection()}
-  {:else}
-    {@render daysSection()}
-  {/if}
-
-  {#if calendarBottomContentTyped}
-    {@render calendarBottomContentTyped(activeSection)}
-  {/if}
-</div>
-
-<style>.dodo-ui-Calendar {
-  display: inline-flex;
-  flex-direction: column;
-}</style>

package/dist/stories/components/Info/Calendar/Calendar.svelte.d.ts

@@ -1,143 +0,0 @@
-export type CalendarActiveSection = 'date' | 'month' | 'year';
-export interface CalendarProps {
-    /** Calendar ref */
-    ref?: HTMLDivElement;
-    /** Custom css class */
-    class?: string;
-    /** Selcted date Value */
-    value?: Date;
-    /** Start Of Week */
-    startOfWeek?: CalendarWeekNames;
-    /** Define active month to override month selected with value */
-    activeMonth?: Date;
-    /** Include leading days from the previous month */
-    showLastMonth?: boolean;
-    /** Include trailing days from the next month */
-    showNextMonth?: boolean;
-    /** What color to use? */
-    color?: ComponentColor;
-    /** Show slected */
-    showSelected?: boolean;
-    /** Show Today  */
-    showToday?: boolean;
-    /** Set today manually  */
-    today?: Date;
-    /** Minimum allowed date, rest of the dates will be disabled  */
-    minDate?: Date;
-    /** Maxium allowed date, rest of the dates will be disabled  */
-    maxDate?: Date;
-    /** Exclude Dates, these dates will be disabled */
-    excludeDates?: Date[];
-    /** Include Dates, rest of the dates will be disabled  */
-    includeDates?: Date[];
-    /** Timezone string (e.g., "America/New_York"). */
-    timezone?: string;
-    /** Whether to return the time in UTC. If true, overrides timezone. */
-    utc?: boolean;
-    /** calendarDateChipProps: CalendarDateChip component props */
-    calendarDateChipProps?: Partial<CalendarDateChipProps>;
-    /** onselect event handler */
-    onselect?: (value: Date, dayOfMonth: DateOfMonth, e: ButtonClickEvent) => void;
-    /** Custom Calendar Chip Content */
-    customCalendarDateChipContent?: (dayOfMonth: DateOfMonth) => Snippet;
-    /** Custom Calendar Chip */
-    customCalendarDateChip?: (dayOfMonth: DateOfMonth) => Snippet;
-    /** Custom Calendar Week Content */
-    customCalendarWeekContent?: (week: CalendarWeekOption) => Snippet;
-    /** Custom Calendar Week */
-    customCalendarWeek?: (week: CalendarWeekOption) => Snippet;
-    /** How large should the Component be? */
-    size?: ComponentSize;
-    /** Weekend days */
-    weekendDays?: CalendarWeekNames[];
-    /** Color Weekend days */
-    weekendDaysColorDays?: boolean;
-    /** Show Calendar Controls */
-    showCalendarControls?: boolean;
-    /** Custom Calendar Controls */
-    customCalendarControls?: () => Snippet;
-    /** Show Month Selector */
-    showCalendarMonthSelector?: boolean;
-    /** Show Year Selector */
-    showCalendarYearSelector?: boolean;
-    /** Show Navigator */
-    showCalendarNavigator?: boolean;
-    /** Month Selector Props */
-    calendarMonthSelectorProps?: Partial<CalendarMonthSelectorProps>;
-    /** Custom MonthSelector */
-    customCalendarMonthSelector?: (option: CalendarMonthOption) => Snippet;
-    /** Custom MonthSelector Content */
-    customCalendarMonthSelectorContent?: (option: CalendarMonthOption) => Snippet;
-    /** Month Selector Click */
-    onMonthSelectorClick?: (option: CalendarMonthOption, e: ButtonClickEvent) => void;
-    /** Year Selector Props */
-    calendarYearSelectorProps?: Partial<CalendarYearSelectorProps>;
-    /** Custom YearSelector */
-    customCalendarYearSelector?: (selectedYear: string) => Snippet;
-    /** Custom YearSelector Content */
-    customCalendarYearSelectorContent?: (selectedYear: string) => Snippet;
-    /** Year Selector Click */
-    onYearSelectorClick?: (selectedYear: string, e: ButtonClickEvent) => void;
-    /** Calendar Navigation Props */
-    calendarNavigationProps?: Partial<CalendarYearSelectorProps>;
-    /** Navigation Next */
-    onCalendarNavigationNextClick?: MouseEventHandler<HTMLButtonElement>;
-    /** Navigation Previous */
-    onCalendarNavigationPrevClick?: MouseEventHandler<HTMLButtonElement>;
-    /** Custom YearSelector */
-    customCalendarNavigation?: () => Snippet;
-    /** Custom NavigationNext */
-    customCalendarNavigationNext?: () => Snippet;
-    /** Custom NavigationPrev */
-    customCalendarNavigationPrev?: () => Snippet;
-    /** Custom NavigationNext Content */
-    customCalendarNavigationNextContent?: () => Snippet;
-    /** Custom NavigationPrev Content */
-    customCalendarNavigationPrevContent?: () => Snippet;
-    /** Next disabled state */
-    disabledCalendarNavigationNext?: boolean;
-    /** Prev disabled state */
-    disabledCalendarNavigationPrev?: boolean;
-    /** Calendar Month select */
-    onselectMonth?: (value: CalendarMonthNames, e: ButtonClickEvent) => void;
-    /** Calendar Month cancel */
-    oncancelMonth?: (e: ButtonClickEvent) => void;
-    /** Custom Calendar Chip Content */
-    customCalendarMonthChipContent?: (value: CalendarMonthNames) => Snippet;
-    /** Custom Calendar Chip */
-    customCalendarMonthChip?: (value: CalendarMonthNames) => Snippet;
-    /** disabled Months */
-    disabledMonths?: CalendarMonthNames[];
-    /** calendarMonthChipProps: calendarMonthChip component props */
-    calendarMonthChipProps?: Partial<CalendarMonthChipProps>;
-    /** show month list controls */
-    showControlsMonthList?: boolean;
-    /** calendarYearChipProps: calendarYearChip component props */
-    calendarYearChipProps?: Partial<CalendarYearChipProps>;
-    /** Calendar Year select */
-    onselectYear?: (value: string, e: ButtonClickEvent) => void;
-    /** Calendar Year cancel */
-    oncancelYear?: (e: ButtonClickEvent) => void;
-    /** Custom Calendar Chip Content */
-    customCalendarYearChipContent?: (value: string) => Snippet;
-    /** Custom Calendar Chip */
-    customCalendarYearChip?: (value: string) => Snippet;
-    /** show Year list controls */
-    showControlsYearList?: boolean;
-    /** calendar Top Content*/
-    calendarTopContent?: (activeSection: CalendarActiveSection) => Snippet;
-    /** calendar Bottom Content*/
-    calendarBottomContent?: (activeSection: CalendarActiveSection) => Snippet;
-    /** manipulate date callback */
-    manipulateDate?: (dateToModify: DateOfMonth, settings?: CreateDatesOfMonthSettings) => DateOfMonth;
-}
-import type { ComponentColor } from '../../../../types/colors.js';
-import type { Snippet } from 'svelte';
-import type { ButtonClickEvent } from '../../Form/Button/Button.svelte';
-import type { DateOfMonth } from './utils/types.js';
-import type { ComponentSize } from '../../../../types/size.js';
-import type { MouseEventHandler } from 'svelte/elements';
-import { type CalendarWeekNames, type CalendarDateChipProps, type CalendarWeekOption, type CalendarMonthOption, type CalendarMonthSelectorProps, type CalendarYearSelectorProps, type CalendarMonthNames, type CalendarMonthChipProps, type CalendarYearChipProps, type CreateDatesOfMonthSettings } from '../../../../index.js';
-declare const Calendar: import("svelte").Component<CalendarProps, {}, "ref">;
-type Calendar = ReturnType<typeof Calendar>;
-export default Calendar;

package/dist/stories/components/Info/Calendar/Color/Color.stories.svelte

@@ -1,23 +0,0 @@
-<script module>
-  import { defineMeta } from '@storybook/addon-svelte-csf';
-  import Calendar from '../Calendar.svelte';
-  import { storyCalendarArgTypes } from '../Calendar.stories.svelte';
-  import getMoment from '../../../../developer tools/helpers/Time/getMoment/getMoment.js';
-
-  // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-  const { Story } = defineMeta({
-    component: Calendar,
-    tags: ['autodocs'],
-    argTypes: storyCalendarArgTypes,
-    args: {
-      value: getMoment().toDate(),
-    },
-  });
-</script>
-
-<Story name="Primary" />
-<Story name="Secondary" args={{ color: 'secondary' }} />
-<Story name="Neutral" args={{ color: 'neutral' }} />
-<Story name="Safe" args={{ color: 'safe' }} />
-<Story name="Warning" args={{ color: 'warning' }} />
-<Story name="Danger" args={{ color: 'danger' }} />

package/dist/stories/components/Info/Calendar/Color/Color.stories.svelte.d.ts

@@ -1,26 +0,0 @@
-export default Color;
-type Color = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Color: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}

package/dist/stories/components/Info/Calendar/Controls/Controls.stories.svelte

@@ -1,26 +0,0 @@
-<script module>
-  import { defineMeta } from '@storybook/addon-svelte-csf';
-  import Calendar from '../Calendar.svelte';
-  import { storyCalendarArgTypes } from '../Calendar.stories.svelte';
-  import getMoment from '../../../../developer tools/helpers/Time/getMoment/getMoment.js';
-
-  // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
-  const { Story } = defineMeta({
-    component: Calendar,
-    tags: ['autodocs'],
-    argTypes: storyCalendarArgTypes,
-    args: {
-      value: getMoment().toDate(),
-    },
-  });
-</script>
-
-<Story name="Normal" />
-<Story name="HideCalendarMonthSelector" args={{ showCalendarMonthSelector: false }} />
-<Story name="HideCalendarYearSelector" args={{ showCalendarYearSelector: false }} />
-<Story name="HideCalendarNavigator" args={{ showCalendarNavigator: false }} />
-<Story name="HideControlsMonthList" args={{ showControlsMonthList: false }} />
-<Story name="HideControlsYearList" args={{ showControlsYearList: false }} />
-
-<Story name="DisabledNavigationPrev" args={{ disabledCalendarNavigationPrev: true }} />
-<Story name="DisabledNavigationNext" args={{ disabledCalendarNavigationNext: true }} />

package/dist/stories/components/Info/Calendar/Controls/Controls.stories.svelte.d.ts

@@ -1,26 +0,0 @@
-export default Controls;
-type Controls = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const Controls: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}