@tactics/toddle-styleguide 1.2.8 → 1.2.9

package/src/theme/provider/staff-member.theme.d.ts

@@ -1,49 +1,49 @@
 export declare const StaffMemberTheme: {
-  colors: {
-    gradient: {
-      1: string[];
-      0: string[];
+    colors: {
+        gradient: {
+            1: string[];
+            0: string[];
+        };
+        main: {
+            9: string;
+            8: string;
+            7: string;
+            6: string;
+            5: string;
+            4: string;
+            3: string;
+            2: string;
+            1: string;
+            0: string;
+        };
+        ui: {
+            black: string;
+            white: string;
+            xlightgrey: string;
+            lightgrey: string;
+            grey: string;
+            darkgrey: string;
+            success: {
+                xlight: string;
+                light: string;
+                default: string;
+                dark: string;
+            };
+            warning: {
+                xlight: string;
+                light: string;
+                default: string;
+                dark: string;
+            };
+            error: {
+                xlight: string;
+                light: string;
+                default: string;
+                dark: string;
+            };
+        };
     };
-    main: {
-      9: string;
-      8: string;
-      7: string;
-      6: string;
-      5: string;
-      4: string;
-      3: string;
-      2: string;
-      1: string;
-      0: string;
+    wave: {
+        path: any;
     };
-    ui: {
-      black: string;
-      white: string;
-      xlightgrey: string;
-      lightgrey: string;
-      grey: string;
-      darkgrey: string;
-      success: {
-        xlight: string;
-        light: string;
-        default: string;
-        dark: string;
-      };
-      warning: {
-        xlight: string;
-        light: string;
-        default: string;
-        dark: string;
-      };
-      error: {
-        xlight: string;
-        light: string;
-        default: string;
-        dark: string;
-      };
-    };
-  };
-  wave: {
-    path: any;
-  };
 };

package/src/theme/responsive/index.d.ts

@@ -1,5 +1,2 @@
-import {ScaledSize, StyleProp, StyleSheet} from 'react-native';
-export default function CreateResponsiveStyle<T, U extends Partial<T>>(
-  mobileStyles: StyleSheet.NamedStyles<T>,
-  tabletStyles: StyleSheet.NamedStyles<U>
-): (layout: ScaledSize) => (style: keyof T) => StyleProp<any>;
+import { ScaledSize, StyleProp, StyleSheet } from 'react-native';
+export default function CreateResponsiveStyle<T, U extends Partial<T>>(mobileStyles: StyleSheet.NamedStyles<T>, tabletStyles: StyleSheet.NamedStyles<U>): (layout: ScaledSize) => (style: keyof T) => StyleProp<any>;

package/src/theme/scale/index.d.ts

@@ -1,12 +1,12 @@
 export declare const Scale: {
-  xxxs: number;
-  xxs: number;
-  xs: number;
-  s: number;
-  m: number;
-  l: number;
-  xl: number;
-  xxl: number;
-  xxxl: number;
-  xxxxl: number;
+    xxxs: number;
+    xxs: number;
+    xs: number;
+    s: number;
+    m: number;
+    l: number;
+    xl: number;
+    xxl: number;
+    xxxl: number;
+    xxxxl: number;
 };

package/src/types/bubble-alignment.enum.d.ts

@@ -1,4 +1,4 @@
 export declare enum BubbleAlignment {
-  SENT = 'SENT',
-  RECEIVE = 'RECEIVE',
+    SENT = "SENT",
+    RECEIVE = "RECEIVE"
 }

package/src/types/icontype.type.d.ts

@@ -1,42 +1,2 @@
 export type IconStyleType = 'solid' | 'regular';
-export type IconNameType =
-  | 'calendar'
-  | 'chat'
-  | 'chat-alt'
-  | 'check-circle'
-  | 'chevron-left'
-  | 'chevron-right'
-  | 'clock'
-  | 'cloud-download'
-  | 'currency-euro'
-  | 'document-text'
-  | 'exclamation'
-  | 'exclamation-circle'
-  | 'eye'
-  | 'eye-off'
-  | 'filter'
-  | 'information-circle'
-  | 'logout'
-  | 'mail'
-  | 'mail-open'
-  | 'menu'
-  | 'minus-sm'
-  | 'office-building'
-  | 'paper-airplane'
-  | 'paper-clip'
-  | 'pencil'
-  | 'phone'
-  | 'plus'
-  | 'plus-sm'
-  | 'qrcode'
-  | 'refresh'
-  | 'search'
-  | 'selector'
-  | 'sm-view-grid-add'
-  | 'status-online'
-  | 'thumb-up'
-  | 'trash'
-  | 'user'
-  | 'user-group'
-  | 'users'
-  | 'xmark';
+export type IconNameType = 'calendar' | 'chat' | 'chat-alt' | 'check-circle' | 'chevron-left' | 'chevron-right' | 'clock' | 'cloud-download' | 'currency-euro' | 'document-text' | 'exclamation' | 'exclamation-circle' | 'eye' | 'eye-off' | 'filter' | 'information-circle' | 'logout' | 'mail' | 'mail-open' | 'menu' | 'minus-sm' | 'office-building' | 'paper-airplane' | 'paper-clip' | 'pencil' | 'phone' | 'plus' | 'plus-sm' | 'qrcode' | 'refresh' | 'search' | 'selector' | 'sm-view-grid-add' | 'status-online' | 'thumb-up' | 'trash' | 'user' | 'user-group' | 'users' | 'xmark';

package/src/types/keyboard-types.enum.d.ts

@@ -1,9 +1,9 @@
 export declare enum KeyBoardTypes {
-  DEFAULT = 'default',
-  NUMBER_PAD = 'number-pad',
-  DECIMAL_PAD = 'decimal-pad',
-  NUMERIC = 'numeric',
-  EMAIL_ADDRESS = 'email-address',
-  PHONE_PAD = 'phone-pad',
-  URL = 'url',
+    DEFAULT = "default",
+    NUMBER_PAD = "number-pad",
+    DECIMAL_PAD = "decimal-pad",
+    NUMERIC = "numeric",
+    EMAIL_ADDRESS = "email-address",
+    PHONE_PAD = "phone-pad",
+    URL = "url"
 }

package/src/types/loading-dots.type.d.ts

@@ -1,8 +1,8 @@
 export type LoadingDotsProps = {
-  animation?: string;
-  dots?: number;
-  color?: string;
-  size?: number;
-  spacing?: number;
-  delay?: number;
+    animation?: string;
+    dots?: number;
+    color?: string;
+    size?: number;
+    spacing?: number;
+    delay?: number;
 };

package/src/types/size.enum.d.ts

@@ -1,5 +1,5 @@
 export declare enum Size {
-  SMALL = 'SMALL',
-  MEDIUM = 'MEDIUM',
-  LARGE = 'LARGE',
+    SMALL = "SMALL",
+    MEDIUM = "MEDIUM",
+    LARGE = "LARGE"
 }

package/src/types/text-properties.type.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
-import {StyleProp, TextStyle} from 'react-native';
+import { StyleProp, TextStyle } from 'react-native';
 export type TextProperties = {
-  bold?: boolean;
-  textColor?: string;
-  children: React.ReactNode;
-  textAlign?: 'auto' | 'left' | 'right' | 'center' | 'justify' | undefined;
-  numberOfLines?: number | undefined;
-  ellipsizeMode?: 'head' | 'tail' | 'middle' | 'clip' | undefined;
-  addStyle?: StyleProp<TextStyle>;
+    bold?: boolean;
+    textColor?: string;
+    children: React.ReactNode;
+    textAlign?: 'auto' | 'left' | 'right' | 'center' | 'justify' | undefined;
+    numberOfLines?: number | undefined;
+    ellipsizeMode?: 'head' | 'tail' | 'middle' | 'clip' | undefined;
+    addStyle?: StyleProp<TextStyle>;
 };

package/src/types/visual-state.enum.d.ts

@@ -1,7 +1,7 @@
 export declare enum VisualState {
-  DEFAULT = 'DEFAULT',
-  SUCCESS = 'SUCCESS',
-  WARNING = 'WARNING',
-  ERROR = 'ERROR',
-  INACTIVE = 'INACTIVE',
+    DEFAULT = "DEFAULT",
+    SUCCESS = "SUCCESS",
+    WARNING = "WARNING",
+    ERROR = "ERROR",
+    INACTIVE = "INACTIVE"
 }

package/src/utilities/color-handler/color-handler.d.ts

@@ -1,6 +1,2 @@
-import {VisualState} from '../../types/visual-state.enum';
-export declare const TextColorHandler: (
-  visualState: VisualState,
-  selected?: boolean,
-  loading?: boolean
-) => string;
+import { VisualState } from '../../types/visual-state.enum';
+export declare const TextColorHandler: (visualState: VisualState, selected?: boolean, loading?: boolean) => string;

package/src/utilities/toddle-datetime/interfaces/duration.interface.d.ts

@@ -1,22 +1,22 @@
 export interface DurationObjectUnits {
-  years?: number | undefined;
-  quarters?: number | undefined;
-  months?: number | undefined;
-  weeks?: number | undefined;
-  days?: number | undefined;
-  hours?: number | undefined;
-  minutes?: number | undefined;
-  seconds?: number | undefined;
-  milliseconds?: number | undefined;
+    years?: number | undefined;
+    quarters?: number | undefined;
+    months?: number | undefined;
+    weeks?: number | undefined;
+    days?: number | undefined;
+    hours?: number | undefined;
+    minutes?: number | undefined;
+    seconds?: number | undefined;
+    milliseconds?: number | undefined;
 }
 export interface DurationLikeObject extends DurationObjectUnits {
-  year?: number | undefined;
-  quarter?: number | undefined;
-  month?: number | undefined;
-  week?: number | undefined;
-  day?: number | undefined;
-  hour?: number | undefined;
-  minute?: number | undefined;
-  second?: number | undefined;
-  millisecond?: number | undefined;
+    year?: number | undefined;
+    quarter?: number | undefined;
+    month?: number | undefined;
+    week?: number | undefined;
+    day?: number | undefined;
+    hour?: number | undefined;
+    minute?: number | undefined;
+    second?: number | undefined;
+    millisecond?: number | undefined;
 }

package/src/utilities/toddle-datetime/interfaces/toddle-datetime.interface.d.ts

@@ -1,18 +1,22 @@
+import { ConversionAccuracy } from '../types/toddle-datetime.type';
 export interface LocaleOptions {
-  /**
-   *  @default system's locale
-   */
-  locale?: string | undefined;
+    /**
+     *  @default system's locale
+     */
+    locale?: string | undefined;
 }
 export interface DateTimeOptions extends LocaleOptions {
-  /**
-   * Use this zone if no offset is specified in the input string itself. Will also convert the time to this zone.
-   * @default local
-   */
-  zone?: string | undefined;
-  /**
-   * Override the zone with a fixed-offset zone specified in the string itself, if it specifies one.
-   * @default false
-   */
-  setZone?: boolean | undefined;
+    /**
+     * Use this zone if no offset is specified in the input string itself. Will also convert the time to this zone.
+     * @default local
+     */
+    zone?: string | undefined;
+    /**
+     * Override the zone with a fixed-offset zone specified in the string itself, if it specifies one.
+     * @default false
+     */
+    setZone?: boolean | undefined;
+}
+export interface DiffOptions {
+    conversionAccuracy?: ConversionAccuracy | undefined;
 }

package/src/utilities/toddle-datetime/interfaces/toddle-datetime.interface.tsx

@@ -1,3 +1,5 @@
+import {ConversionAccuracy} from '../types/toddle-datetime.type';
+
 export interface LocaleOptions {
   /**
    *  @default system's locale
@@ -17,3 +19,7 @@ export interface DateTimeOptions extends LocaleOptions {
    */
   setZone?: boolean | undefined;
 }
+
+export interface DiffOptions {
+  conversionAccuracy?: ConversionAccuracy | undefined;
+}

package/src/utilities/toddle-datetime/toddle-datetime.class.d.ts

@@ -1,94 +1,50 @@
-import {
-  LocaleOptions,
-  DateTimeOptions,
-} from './interfaces/toddle-datetime.interface';
-import {DurationLike} from './types/duration-like.type';
-import {
-  DateTimeFormatOptions,
-  DateTimeJSOptions,
-  DateTimeUnit,
-} from './types/toddle-datetime.type';
+import { Duration as LuxonDuration } from 'luxon';
+import { LocaleOptions, DateTimeOptions, DiffOptions } from './interfaces/toddle-datetime.interface';
+import { DurationLike, DurationUnits } from './types/duration.type';
+import { DateTimeFormatOptions, DateTimeJSOptions, DateTimeUnit } from './types/toddle-datetime.type';
+import { DurationObjectUnits } from './interfaces/duration.interface';
+export declare class Duration {
+    private duration;
+    constructor(duration: LuxonDuration);
+    toObject(): DurationObjectUnits;
+}
 export declare class ToddleDateTime {
-  private dateTime;
-  private constructor();
-  /**
-   * Create a ToddleDateTime for the current instant, in the system's time zone.
-   *
-   * Use Settings to override these default values if needed.
-   * @example
-   * ToddleDateTime.now().toISO() //~> now in the ISO format
-   */
-  static now(): ToddleDateTime;
-  static local(opts?: DateTimeJSOptions): ToddleDateTime;
-  static local(year: number, opts?: DateTimeJSOptions): ToddleDateTime;
-  static local(
-    year: number,
-    month: number,
-    opts?: DateTimeJSOptions
-  ): ToddleDateTime;
-  static local(
-    year: number,
-    month: number,
-    day: number,
-    opts?: DateTimeJSOptions
-  ): ToddleDateTime;
-  static local(
-    year: number,
-    month: number,
-    day: number,
-    hour: number,
-    opts?: DateTimeJSOptions
-  ): ToddleDateTime;
-  static local(
-    year: number,
-    month: number,
-    day: number,
-    hour: number,
-    minute: number,
-    opts?: DateTimeJSOptions
-  ): ToddleDateTime;
-  static local(
-    year: number,
-    month: number,
-    day: number,
-    hour: number,
-    minute: number,
-    second: number,
-    opts?: DateTimeJSOptions
-  ): ToddleDateTime;
-  static local(
-    year: number,
-    month: number,
-    day: number,
-    hour: number,
-    minute: number,
-    second: number,
-    milliseconds: number,
-    opts?: DateTimeJSOptions
-  ): ToddleDateTime;
-  static fromISO(date: string, options?: DateTimeOptions): ToddleDateTime;
-  static fromSeconds(
-    seconds: number,
-    options?: DateTimeJSOptions
-  ): ToddleDateTime;
-  static get DATE_MED(): DateTimeFormatOptions;
-  get hour(): number;
-  get minute(): number;
-  get second(): number;
-  get millisecond(): number;
-  get day(): number;
-  get weekdayShort(): string;
-  plus(duration: DurationLike): ToddleDateTime;
-  minus(duration: DurationLike): ToddleDateTime;
-  startOf(unit: DateTimeUnit): ToddleDateTime;
-  endOf(unit: DateTimeUnit): ToddleDateTime;
-  toFormat(format: string, options?: LocaleOptions): string;
-  toISO(): string | null;
-  toISODate(): string | null;
-  toString(): string;
-  toLocaleString(
-    formatOptions?: DateTimeFormatOptions,
-    options?: LocaleOptions
-  ): string;
-  timestamp(): number;
+    private dateTime;
+    private constructor();
+    /**
+     * Create a ToddleDateTime for the current instant, in the system's time zone.
+     *
+     * Use Settings to override these default values if needed.
+     * @example
+     * ToddleDateTime.now().toISO() //~> now in the ISO format
+     */
+    static now(): ToddleDateTime;
+    static local(opts?: DateTimeJSOptions): ToddleDateTime;
+    static local(year: number, opts?: DateTimeJSOptions): ToddleDateTime;
+    static local(year: number, month: number, opts?: DateTimeJSOptions): ToddleDateTime;
+    static local(year: number, month: number, day: number, opts?: DateTimeJSOptions): ToddleDateTime;
+    static local(year: number, month: number, day: number, hour: number, opts?: DateTimeJSOptions): ToddleDateTime;
+    static local(year: number, month: number, day: number, hour: number, minute: number, opts?: DateTimeJSOptions): ToddleDateTime;
+    static local(year: number, month: number, day: number, hour: number, minute: number, second: number, opts?: DateTimeJSOptions): ToddleDateTime;
+    static local(year: number, month: number, day: number, hour: number, minute: number, second: number, milliseconds: number, opts?: DateTimeJSOptions): ToddleDateTime;
+    static fromISO(date: string, options?: DateTimeOptions): ToddleDateTime;
+    static fromSeconds(seconds: number, options?: DateTimeJSOptions): ToddleDateTime;
+    static get DATE_MED(): DateTimeFormatOptions;
+    get hour(): number;
+    get minute(): number;
+    get second(): number;
+    get millisecond(): number;
+    get day(): number;
+    get weekdayShort(): string;
+    plus(duration: DurationLike): ToddleDateTime;
+    minus(duration: DurationLike): ToddleDateTime;
+    startOf(unit: DateTimeUnit): ToddleDateTime;
+    endOf(unit: DateTimeUnit): ToddleDateTime;
+    toFormat(format: string, options?: LocaleOptions): string;
+    toISO(): string | null;
+    toISODate(): string | null;
+    toString(): string;
+    toLocaleString(formatOptions?: DateTimeFormatOptions, options?: LocaleOptions): string;
+    timestamp(): number;
+    diff(otherDateTime: ToddleDateTime, unit?: DurationUnits, options?: DiffOptions): Duration;
 }

package/src/utilities/toddle-datetime/toddle-datetime.class.tsx

@@ -1,16 +1,30 @@
-import {DateTime as LuxonDateTime} from 'luxon';
+import {DateTime as LuxonDateTime, Duration as LuxonDuration} from 'luxon';
 
 import {
   LocaleOptions,
   DateTimeOptions,
+  DiffOptions,
 } from './interfaces/toddle-datetime.interface';
 
-import {DurationLike} from './types/duration-like.type';
+import {DurationLike, DurationUnits} from './types/duration.type';
 import {
   DateTimeFormatOptions,
   DateTimeJSOptions,
   DateTimeUnit,
 } from './types/toddle-datetime.type';
+import {DurationObjectUnits} from './interfaces/duration.interface';
+
+export class Duration {
+  private duration: LuxonDuration;
+
+  constructor(duration: LuxonDuration) {
+    this.duration = duration;
+  }
+
+  toObject(): DurationObjectUnits {
+    return this.duration.toObject();
+  }
+}
 
 export class ToddleDateTime {
   private dateTime: LuxonDateTime;
@@ -174,4 +188,19 @@ export class ToddleDateTime {
   timestamp(): number {
     return this.dateTime.toUnixInteger();
   }
+
+  // COMPARE
+
+  diff(
+    otherDateTime: ToddleDateTime,
+    unit?: DurationUnits,
+    options?: DiffOptions
+  ): Duration {
+    const luxonDuration = this.dateTime.diff(
+      otherDateTime.dateTime,
+      unit,
+      options
+    );
+    return new Duration(luxonDuration);
+  }
 }