Skip to content

Commit

Permalink
feat(types): better readability, intellisense improvements, small fixes
Browse files Browse the repository at this point in the history
This PR adds small improvements as well as a few quickfixes to the first types iteration:

Some properties and behaviors where missing for calendar, api, modal, search and toast.
The DefititelyTyped link has been removed from index.d.ts.
I've also rewritten modules definitions to be more readable, extensible, and to get rid of this awful _Impl interface system (new versions of Typescript are way more flexible for that). As the cherry on the top, Intellisense seems to better undertstand definitions and autocompletion works better than before 🎉
  • Loading branch information
prudho committed Jun 26, 2023
1 parent 569cce1 commit 40a7aee
Show file tree
Hide file tree
Showing 25 changed files with 6,640 additions and 8,243 deletions.
338 changes: 166 additions & 172 deletions types/fomantic-ui-accordion.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,172 +28,168 @@ declare namespace FomanticUI {
(behavior: 'toggle', index: number): JQuery;

(behavior: 'destroy'): JQuery;
<K extends keyof AccordionSettings>(
behavior: 'setting',
name: K,
value?: undefined,
): AccordionSettings._Impl[K];
<K extends keyof AccordionSettings>(behavior: 'setting', name: K, value: AccordionSettings._Impl[K]): JQuery;
(behavior: 'setting', value: AccordionSettings): JQuery;
(settings?: AccordionSettings): JQuery;
<K extends keyof AccordionSettings>(behavior: 'setting', name: K, value?: undefined, ): Partial<Pick<AccordionSettings, keyof AccordionSettings>>;
<K extends keyof AccordionSettings>(behavior: 'setting', name: K, value: AccordionSettings[K]): JQuery;
(behavior: 'setting', value: Partial<Pick<AccordionSettings, keyof AccordionSettings>>): JQuery;
(settings?: Partial<Pick<AccordionSettings, keyof AccordionSettings>>): JQuery;
}

/**
* @see {@link https://fomantic-ui.com/modules/accordion.html#/settings}
*/
type AccordionSettings = AccordionSettings.Param;

namespace AccordionSettings {
type Param = Pick<_Impl, 'exclusive'> & Partial<Pick<_Impl, keyof _Impl>>;

interface _Impl {
// region Accordion Settings

/**
* Only allow one section open at a time.
* @default true
*/
exclusive: boolean;

/**
* Event on 'title' that will cause accordion to open.
* @default 'click'
*/
on: string;

/**
* Whether child content opacity should be animated (may cause performance issues with many child elements).
* @default true
*/
animateChildren: boolean;

/**
* Close open nested accordion content when an element closes.
* @default true
*/
closeNested: boolean;

/**
* Allow active sections to collapse.
* @default true
*/
collapsible: boolean;

/**
* Duration in ms of opening animation.
* @default 500
*/
duration: number;

/**
* Easing of opening animation. EaseInOutQuint is included with accordion, for additional options you must include easing equations.
* @see {@link http://gsgd.co.uk/sandbox/jquery/easing/}
* @default 'easeInOutQuint'
*/
easing: string;

// endregion

// region Callbacks

/**
* Callback before element opens.
*/
onOpening(this: JQuery): void;

/**
* Callback after element is open.
*/
onOpen(this: JQuery): void;

/**
* Callback before element closes.
*/
onClosing(this: JQuery): void;

/**
* Callback after element is closed.
*/
onClose(this: JQuery): void;

/**
* Callback before element opens or closes.
*/
onChanging(this: JQuery): void;

/**
* Callback before element opens or closes.
*/
onChange(this: JQuery): void;

// endregion

// region DOM Settings

/**
* DOM Selectors used internally.
* Selectors used to find parts of a module.
*/
selector: Accordion.SelectorSettings;

/**
* Class names used to determine element state.
*/
className: Accordion.ClassNameSettings;

// endregion

// region Debug Settings

/**
* Name used in log statements
*/
name: string;

/**
* Event namespace. Makes sure module teardown does not effect other events attached to an element.
*/
namespace: string;

/**
* Silences all console output including error messages, regardless of other debug settings.
*/
silent: boolean;

/**
* Debug output to console
*/
debug: boolean;

/**
* Show console.table output with performance metrics
*/
performance: boolean;

/**
* Debug output includes all internal behaviors
*/
verbose: boolean;

error: Accordion.ErrorSettings;

// endregion
}
interface AccordionSettings {
// region Accordion Settings

/**
* Only allow one section open at a time.
* @default true
*/
exclusive?: boolean | undefined;

/**
* Event on 'title' that will cause accordion to open.
* @default 'click'
*/
on: string;

/**
* Whether child content opacity should be animated (may cause performance issues with many child elements).
* @default true
*/
animateChildren: boolean;

/**
* Close open nested accordion content when an element closes.
* @default false
*/
closeNested: boolean;

/**
* Allow active sections to collapse.
* @default true
*/
collapsible: boolean;

/**
* Duration in ms of opening animation.
* @default 350
*/
duration: number;

/**
* Easing of opening animation. EaseInOutQuint is included with accordion, for additional options you must include easing equations.
* @see {@link http://gsgd.co.uk/sandbox/jquery/easing/}
* @default 'easeOutQuad'
*/
easing: string;

/**
* Whether accordion should automatically refresh on DOM insertion
* @default true
*/
observeChanges: boolean;

// endregion

// region Callbacks

/**
* Callback before element opens.
*/
onOpening(this: JQuery): void;

/**
* Callback after element is open.
*/
onOpen(this: JQuery): void;

/**
* Callback before element closes.
*/
onClosing(this: JQuery): void;

/**
* Callback after element is closed.
*/
onClose(this: JQuery): void;

/**
* Callback before element opens or closes.
*/
onChanging(this: JQuery): void;

/**
* Callback before element opens or closes.
*/
onChange(this: JQuery): void;

// endregion

// region DOM Settings

/**
* DOM Selectors used internally.
* Selectors used to find parts of a module.
*/
selector: Accordion.SelectorSettings;

/**
* Class names used to determine element state.
*/
className: Accordion.ClassNameSettings;

// endregion

// region Debug Settings

/**
* Name used in log statements
* @default 'Accordion'
*/
name: string;

/**
* Event namespace. Makes sure module teardown does not effect other events attached to an element.
* @default 'accordion'
*/
namespace: string;

/**
* Silences all console output including error messages, regardless of other debug settings.
* @default false
*/
silent: boolean;

/**
* Debug output to console
* @default false
*/
debug: boolean;

/**
* Show console.table output with performance metrics
* @default true
*/
performance: boolean;

/**
* Debug output includes all internal behaviors
* @default false
*/
verbose: boolean;

error: Accordion.ErrorSettings;

// endregion
}

namespace Accordion {
type SelectorSettings = SelectorSettings.Param;

namespace SelectorSettings {
type Param = (
| Pick<_Impl, 'accordion'>
| Pick<_Impl, 'title'>
| Pick<_Impl, 'trigger'>
| Pick<_Impl, 'content'>
) &
Partial<Pick<_Impl, keyof _Impl>>;

interface _Impl {
type SelectorSettings = Partial<Pick<Settings.Selectors, keyof Settings.Selectors>>;
type ClassNameSettings = Partial<Pick<Settings.ClassNames, keyof Settings.ClassNames>>;
type ErrorSettings = Partial<Pick<Settings.Errors, keyof Settings.Errors>>;

namespace Settings {
interface Selectors {
/**
* @default '.accordion'
*/
Expand All @@ -209,19 +205,18 @@ declare namespace FomanticUI {
*/
trigger: string;

/**
* @default '.ui.dropdown'
*/
ignore: string;

/**
* @default '.content'
*/
content: string;
}
}

type ClassNameSettings = ClassNameSettings.Param;

namespace ClassNameSettings {
type Param = (Pick<_Impl, 'active'> | Pick<_Impl, 'animating'>) & Partial<Pick<_Impl, keyof _Impl>>;

interface _Impl {
interface ClassNames {
/**
* @default 'active'
*/
Expand All @@ -231,15 +226,14 @@ declare namespace FomanticUI {
* @default 'animating'
*/
animating: string;
}
}

type ErrorSettings = ErrorSettings.Param;

namespace ErrorSettings {
type Param = Pick<_Impl, 'method'> & Partial<Pick<_Impl, keyof _Impl>>;
/**
* @default 'transition'
*/
transition: string;
}

interface _Impl {
interface Errors {
/**
* @default 'The method you called is not defined.'
*/
Expand Down
Loading

0 comments on commit 40a7aee

Please sign in to comment.