fomantic-ui 2.9.4-beta.1 → 2.9.4-beta.100

package/types/fomantic-ui-api.d.ts

@@ -107,7 +107,7 @@ declare namespace FomanticUI {
          */
         (behavior: 'destroy'): JQuery;
 
-        <K extends keyof APISettings | JQueryAjaxSettings>(behavior: 'setting', name: K, value?: undefined, ): Partial<Pick<APISettings, keyof APISettings>> | Partial<Pick<JQueryAjaxSettings, keyof JQueryAjaxSettings>>;
+        <K extends keyof APISettings | JQueryAjaxSettings>(behavior: 'setting', name: K, value?: undefined,): Partial<Pick<APISettings, keyof APISettings>> | Partial<Pick<JQueryAjaxSettings, keyof JQueryAjaxSettings>>;
         <K extends keyof APISettings>(behavior: 'setting', name: K, value: APISettings[K]): JQuery;
         (behavior: 'setting', value: Partial<Pick<APISettings, keyof APISettings>> | Partial<Pick<JQueryAjaxSettings, keyof JQueryAjaxSettings>>): JQuery;
         (settings?: Partial<Pick<APISettings, keyof APISettings>> | Partial<Pick<JQueryAjaxSettings, keyof JQueryAjaxSettings>>): JQuery;
@@ -125,6 +125,12 @@ declare namespace FomanticUI {
          */
         on: string;
 
+        /**
+         * Object containing all templates endpoints
+         * @default {}
+         */
+        api: {[key: string]: string};
+
         /**
          * Can be set to 'local' to cache successful returned AJAX responses when using a JSON API.
          * This helps avoid server roundtrips when API endpoints will return the same results when accessed repeatedly.
@@ -137,7 +143,7 @@ declare namespace FomanticUI {
          * UI state will be applied to this element, defaults to triggering element.
          * @default false
          */
-        stateContext: false | JQuery;
+        stateContext: false | string | JQuery<any>;
 
         /**
          * Whether to encode parameters with 'encodeURIComponent' before adding into url string.
@@ -259,7 +265,7 @@ declare namespace FomanticUI {
          * Method for transmitting request to server.
          * @default 'get'
          */
-        method: 'get' | 'post' | 'put' | 'delete' | 'head' | 'options' | 'patch';
+        method: Uppercase<'get' | 'post' | 'put' | 'delete' | 'head' | 'options' | 'patch'> | Lowercase<'get' | 'post' | 'put' | 'delete' | 'head' | 'options' | 'patch'>;
 
         /**
          * Expected data type of response.

package/types/fomantic-ui-calendar.d.ts

@@ -30,14 +30,14 @@ declare namespace FomanticUI {
         /**
          * Get the selected date
          */
-        (behavior: 'get date'): Date | string;
+        (behavior: 'get date', format?: string): Date | string;
 
         /**
          * Set the selected date.
          * Pass false to updateInput to disable updating the input.
          * Pass false to fireChange to disable the onBeforeChange and onChange callbacks for this change
          */
-        (behavior: 'set date', date: string, updateInput: boolean, fireChange: boolean): JQuery;
+        (behavior: 'set date', date: Date | string | null, updateInput?: boolean, fireChange?: boolean): JQuery;
 
         /**
          * Get the current selection mode (year, month, day, hour, minute)
@@ -52,7 +52,7 @@ declare namespace FomanticUI {
         /**
          * Get the start date for range selection
          */
-        (behavior: 'get startDate'): Date | string;
+        (behavior: 'get startDate', format?: string): Date | string;
 
         /**
          * Set the start date for range selection
@@ -62,7 +62,7 @@ declare namespace FomanticUI {
         /**
          * Get the end date for range selection
          */
-        (behavior: 'get endDate'): Date | string;
+        (behavior: 'get endDate', format?: string): Date | string;
 
         /**
          * Set the end date for range selection
@@ -72,7 +72,7 @@ declare namespace FomanticUI {
         /**
          * Get the currently focused date
          */
-        (behavior: 'get focusDate'): Date | string;
+        (behavior: 'get focusDate', format?: string): Date | string;
 
         /**
          * Set the currently focused date
@@ -82,12 +82,12 @@ declare namespace FomanticUI {
         /**
          * Set the minimal selectable date
          */
-        (behavior: 'set minDate', date: Date | string): JQuery;
+        (behavior: 'set minDate', date: Date | string | null): JQuery;
 
         /**
          * Set the maximal selectable date
          */
-        (behavior: 'set maxDate', date: Date | string): JQuery;
+        (behavior: 'set maxDate', date: Date | string | null): JQuery;
 
         (behavior: 'destroy'): JQuery;
 
@@ -214,7 +214,7 @@ declare namespace FomanticUI {
          *
          * @default null
          */
-        initialDate: null | Date;
+        initialDate: Date | string | null;
 
         /**
          * Display mode to start in, can be 'year', 'month', 'day', 'hour', 'minute' (false = 'day').
@@ -319,13 +319,31 @@ declare namespace FomanticUI {
          *
          * @default false
          */
-        selectAdjacentDays: 5 | 10 | 15 | 20 | 30;
+        selectAdjacentDays: boolean;
 
         popupOptions: Calendar.PopupSettings;
 
         text: Calendar.TextSettings;
 
-        // endregion
+        formatter: Calendar.FormatterSettings;
+
+        /**
+         * Customizable methods to parse a given date
+         * Has to return a date object
+         */
+        parser: {
+            date: (text: string, settings: CalendarSettings) => Date;
+        }
+
+        /**
+         * DOM selector where the calendar popup should be attached to. By default (false) the calendar popup
+         * is attached as direct child of the triggering element.
+         *
+         * @default false
+         */
+        context: string | JQuery | false
+
+        // end region
 
         // region Callbacks
 
@@ -333,12 +351,12 @@ declare namespace FomanticUI {
          * Is called before a calendar date changes. 'return false;' will cancel the change.
          * @since 2.8.0
          */
-        onBeforeChange(this: JQuery): void;
+        onBeforeChange(this: JQuery, date?: Date, text?: string, mode?: string): void;
 
         /**
          * Is called after a calendar date has changed.
          */
-        onChange(this: JQuery): void;
+        onChange(this: JQuery, date?: Date): void;
 
         /**
          * Is called before a calendar is shown. 'return false;' will prevent the calendar to be shown.
@@ -364,7 +382,7 @@ declare namespace FomanticUI {
          * Is called when a cell of the calendar is selected providing its value and current mode.
          * 'return false;' will prevent the selection.
          */
-        onSelect(this: JQuery, date: Date, mode: string): void;
+        onSelect(this: JQuery, date?: Date, mode?: string): void;
 
         // endregion
 
@@ -436,6 +454,7 @@ declare namespace FomanticUI {
     namespace Calendar {
         type PopupSettings = Partial<Pick<Settings.Popup, keyof Settings.Popup>>;
         type TextSettings = Partial<Pick<Settings.Texts, keyof Settings.Texts>>;
+        type FormatterSettings = Partial<Pick<Settings.Formatters, keyof Settings.Formatters>>;
         type SelectorSettings = Partial<Pick<Settings.Selectors, keyof Settings.Selectors>>;
         type ClassNameSettings = Partial<Pick<Settings.ClassNames, keyof Settings.ClassNames>>;
         type RegExpSettings = Partial<Pick<Settings.RegExps, keyof Settings.RegExps>>;
@@ -471,6 +490,16 @@ declare namespace FomanticUI {
                  */
                 days: string[];
 
+                /**
+                 * @default ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
+                 */
+                dayNamesShort: string[];
+
+                /**
+                 * @default ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']
+                 */
+                dayNames: string[];
+
                 /**
                  * @default ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
                  */
@@ -507,6 +536,78 @@ declare namespace FomanticUI {
                 weekNo: string;
             }
 
+            interface Formatters {
+                /**
+                 *
+                 */
+                yearHeader(date: Date, settings?: CalendarSettings): string;
+
+                /**
+                 * @default 'YYYY'
+                 */
+                monthHeader: string;
+
+                /**
+                 * @default 'MMMM YYYY'
+                 */
+                dayHeader: string;
+
+                /**
+                 * @default 'MMMM D, YYYY'
+                 */
+                hourHeader: string;
+
+                /**
+                 * @default 'MMMM D, YYYY'
+                 */
+                minuteHeader: string;
+
+                /**
+                 * @default 'MMMM D, YYYY'
+                 */
+                dayColumnHeader(day: number, settings: CalendarSettings): string;
+
+                /**
+                 * @default 'MMMM D, YYYY h:mm A'
+                 */
+                datetime: string;
+
+                /**
+                 * @default 'MMMM D, YYYY'
+                 */
+                date: string;
+
+                /**
+                 * @default 'h:mm A'
+                 */
+                time: string;
+
+                /**
+                 * @default 'h:mm A'
+                 */
+                cellTime: string;
+
+                /**
+                 * @default 'MMMM YYYY'
+                 */
+                month: string;
+
+                /**
+                 * @default 'YYYY'
+                 */
+                year: string;
+
+                /**
+                 *
+                 */
+                today(settings: CalendarSettings): string;
+
+                /**
+                 *
+                 */
+                cell(cell: string, date: Date, cellOptions: any): any
+            }
+
             interface Selectors {
                 /**
                  * @default '.ui.popup'

package/types/fomantic-ui-checkbox.d.ts

@@ -32,6 +32,11 @@ declare namespace FomanticUI {
          */
         (behavior: 'enable'): JQuery;
 
+        /**
+         * Disable interaction with a checkbox.
+         */
+        (behavior: 'disable'): JQuery;
+
         /**
          * Set a checkbox state to checked without callbacks.
          */
@@ -82,6 +87,11 @@ declare namespace FomanticUI {
          */
         (behavior: 'is unchecked'): boolean;
 
+        /**
+         * Returns whether element is not determinate.
+         */
+        (behavior: 'is indeterminate'): boolean;
+
         /**
          * Returns whether element is able to be changed.
          */
@@ -175,22 +185,22 @@ declare namespace FomanticUI {
         /**
          * Callback before a checkbox is checked. Can cancel change by returning 'false'.
          */
-        beforeChecked(this: JQuery): void | false;
+        beforeChecked(this: JQuery): void | Promise<void> | boolean;
 
         /**
          * Callback before a checkbox is set to indeterminate. Can cancel change by returning 'false'.
          */
-        beforeIndeterminate(this: JQuery): void | false;
+        beforeIndeterminate(this: JQuery): void | Promise<void> | false;
 
         /**
          * Callback before a checkbox is set to determinate. Can cancel change by returning 'false'.
          */
-        beforeDeterminate(this: JQuery): void | false;
+        beforeDeterminate(this: JQuery): void | Promise<void> | false;
 
         /**
          * Callback before a checkbox is unchecked. Can cancel change by returning 'false'.
          */
-        beforeUnchecked(this: JQuery): void | false;
+        beforeUnchecked(this: JQuery): void | Promise<void> | false;
 
         /**
          * Callback after a checkbox is enabled.

package/types/fomantic-ui-dimmer.d.ts

@@ -113,7 +113,7 @@ declare namespace FomanticUI {
         (behavior: 'set disabled'): JQuery;
 
         (behavior: 'destroy'): JQuery;
-        <K extends keyof DimmerSettings>(behavior: 'setting', name: K, value?: undefined, ): Partial<Pick<DimmerSettings, keyof DimmerSettings>>;
+        <K extends keyof DimmerSettings>(behavior: 'setting', name: K, value?: undefined,): Partial<Pick<DimmerSettings, keyof DimmerSettings>>;
         <K extends keyof DimmerSettings>(behavior: 'setting', name: K, value: DimmerSettings[K]): JQuery;
         (behavior: 'setting', value: Partial<Pick<DimmerSettings, keyof DimmerSettings>>): JQuery;
         (settings?: Partial<Pick<DimmerSettings, keyof DimmerSettings>>): JQuery;

package/types/fomantic-ui-dropdown.d.ts

@@ -6,7 +6,7 @@ declare namespace FomanticUI {
          * Recreates dropdown menu from passed values.
          * values should be an object with the following structure: { values: [ {value, text, name} ] }.
          */
-        (behavior: 'setup menu', values: object): void;
+        (behavior: 'setup menu', values: object): JQuery;
 
         /**
          * Changes dropdown to use new values.
@@ -17,7 +17,7 @@ declare namespace FomanticUI {
         /**
          * Refreshes all cached selectors and data
          */
-        (behavior: 'refresh'): void;
+        (behavior: 'refresh'): JQuery;
 
         /**
          * Toggles current visibility of dropdown
@@ -29,20 +29,20 @@ declare namespace FomanticUI {
          * If a function is provided to callback, it's called after the dropdown-menu is shown.
          * Set preventFocus to true if you don't want the dropdown field to focus after the menu is shown
          */
-        (behavior: 'show', callback: Function, preventFocus: boolean): void;
+        (behavior: 'show', callback?: () => void, preventFocus?: boolean): void;
 
         /**
          * Hides dropdown.
          * If a function is provided to callback, it's called after the dropdown-menu is hidden.
          * Set preventBlur to true if you don't want the dropdown field to blur after the menu is hidden
          */
-        (behavior: 'hide', callback:Function, preventBlur: boolean): void;
+        (behavior: 'hide', callback?: () => void, preventBlur?: boolean): void;
 
         /**
          * Clears dropdown of selection.
          * Set preventChangeTrigger to true to omit the change event (default: false).
          */
-        (behavior: 'clear', preventChangeTrigger: boolean): void;
+        (behavior: 'clear', preventChangeTrigger?: boolean): JQuery;
 
         /**
          * Hides all other dropdowns that is not current dropdown
@@ -53,7 +53,7 @@ declare namespace FomanticUI {
          * Restores dropdown text and value to its value on page load.
          * Set preventChangeTrigger to true to omit the change event (default: false).
          */
-        (behavior: 'restore defaults', preventChangeTrigger: boolean): void;
+        (behavior: 'restore defaults', preventChangeTrigger?: boolean): void;
 
         /**
          * Restores dropdown text to its value on page load
@@ -79,33 +79,28 @@ declare namespace FomanticUI {
          * Sets value as selected.
          * Set preventChangeTrigger to true to omit the change event (default: false).
          */
-        (behavior: 'set selected', value: string, preventChangeTrigger: boolean): void;
+        (behavior: 'set selected', value: string | string[], preventChangeTrigger?: boolean, keepSearchTerm?: boolean): JQuery;
 
         /**
          * Remove value from selected
          */
         (behavior: 'remove selected', value: string): void;
 
-        /**
-         * Adds a group of values as selected
-         */
-        (behavior: 'set selected', values: string[]): void;
-
         /**
          * Sets selected values to exactly specified values, removing current selection
          */
-        (behavior: 'set exactly', values: string[]): void;
+        (behavior: 'set exactly', values: string[]): JQuery;
 
         /**
          * Sets dropdown text to a value
          */
-        (behavior: 'text', text: string): void;
+        (behavior: 'set text', text: string): JQuery;
 
         /**
          * Sets dropdown input to value (does not update display state).
          * Set preventChangeTrigger to true to omit the change event (default: false).
          */
-        (behavior: 'set value', value: string, preventChangeTrigger: boolean): void;
+        (behavior: 'set value', value: string, preventChangeTrigger?: boolean): JQuery;
 
         /**
          * Returns current dropdown text
@@ -215,7 +210,7 @@ declare namespace FomanticUI {
         (behavior: 'get placeholder text'): string;
 
         (behavior: 'destroy'): JQuery;
-        <K extends keyof DropdownSettings>(behavior: 'setting', name: K, value?: undefined, ): Partial<Pick<DropdownSettings, keyof DropdownSettings>>;
+        <K extends keyof DropdownSettings>(behavior: 'setting', name: K, value?: undefined,): Partial<Pick<DropdownSettings, keyof DropdownSettings>>;
         <K extends keyof DropdownSettings>(behavior: 'setting', name: K, value: DropdownSettings[K]): JQuery;
         (behavior: 'setting', value: Partial<Pick<DropdownSettings, keyof DropdownSettings>>): JQuery;
         (settings?: Partial<Pick<DropdownSettings, keyof DropdownSettings>>): JQuery;
@@ -265,7 +260,7 @@ declare namespace FomanticUI {
          * @see {@link https://fomantic-ui.com/behaviors/api.html#/settings}
          * @default false
          */
-        apiSettings: false | APISettings | JQueryAjaxSettings;
+        apiSettings: false | Partial<Pick<APISettings, keyof APISettings>> | Partial<Pick<JQueryAjaxSettings, keyof JQueryAjaxSettings>>;
 
         /**
          * Whether dropdown should select new option when using keyboard shortcuts.
@@ -350,7 +345,7 @@ declare namespace FomanticUI {
          *
          * @default 'auto'
          */
-        placeholder: 'auto' | String | false;
+        placeholder: 'auto' | string | false;
 
         /**
          * Whether HTML included in dropdown values should be preserved.
@@ -363,7 +358,7 @@ declare namespace FomanticUI {
          * Whether to sort values when creating a dropdown automatically from a select element.
          * @default false
          */
-        sortSelect: boolean | 'natural' | Function;
+        sortSelect: boolean | 'natural' | ((a: any, b: any) => number);
 
         /**
          * Whether search selection will force currently selected choice when element is blurred.
@@ -390,6 +385,12 @@ declare namespace FomanticUI {
          */
         ignoreSearchCase: boolean;
 
+        /**
+         * Whether search result should highlight matching strings
+         * @default false
+         */
+        highlightMatches: boolean;
+
         /**
          * If disabled user additions will appear in the dropdown's menu using a specially formatted selection item formatted by 'templates.addition'.
          * @default true
@@ -452,7 +453,7 @@ declare namespace FomanticUI {
          * Alternatively you can provide an 'object' to set individual values for hide/show transitions as well as hide/show duration.
          * @default 'auto'
          */
-        transition: boolean | object;
+        transition: string | Dropdown.TransitionSettings;
 
         /**
          * Duration of animation events.
@@ -467,13 +468,6 @@ declare namespace FomanticUI {
          */
         displayType: false | string;
 
-        /**
-         * Maximum glyph width, used to calculate search size.
-         * This is usually size of a "W" in your font in 'em'.
-         * @default 1.037
-         */
-        glyphWidth: number;
-
         /**
          * Whether option headers should have an additional divider line underneath when converted from '<select><optgroup>'.
          * @default true
@@ -486,6 +480,12 @@ declare namespace FomanticUI {
          */
         collapseOnActionable: boolean;
 
+        /**
+         * Whether the dropdown should collapse upon clicking the clearable icon.
+         * @default false
+         */
+        collapseOnClearable: boolean;
+
         /**
          * Allows customization of multi-select labels.
          * @default true
@@ -506,7 +506,7 @@ declare namespace FomanticUI {
          * Is called after a dropdown value changes.
          * Receives the name and value of selection and the active menu element.
          */
-        onChange(value: string, text: string, $choice: JQuery): void;
+        onChange(value?: string, text?: string, $choice?: JQuery): void;
 
         /**
          * Is called after a dropdown selection is added using a multiple select dropdown, only receives the added value.
@@ -582,22 +582,22 @@ declare namespace FomanticUI {
         message: Dropdown.MessageSettings;
 
         /**
-         * 
+         *
          */
         regExp: Dropdown.RegExpSettings;
 
         /**
-         * 
+         *
          */
         metadata: Dropdown.MetadataSettings;
 
         /**
-         * 
+         *
          */
         fields: Dropdown.FieldsSettings;
 
         /**
-         * 
+         *
          */
         keys: Dropdown.KeysSettings;
 
@@ -647,6 +647,7 @@ declare namespace FomanticUI {
     }
 
     namespace Dropdown {
+        type TransitionSettings = Partial<Pick<Settings.Transition, keyof Settings.Transition>>;
         type SelectorSettings = Partial<Pick<Settings.Selectors, keyof Settings.Selectors>>;
         type ClassNameSettings = Partial<Pick<Settings.ClassNames, keyof Settings.ClassNames>>;
         type MessageSettings = Partial<Pick<Settings.Messages, keyof Settings.Messages>>;
@@ -657,6 +658,31 @@ declare namespace FomanticUI {
         type ErrorSettings = Partial<Pick<Settings.Errors, keyof Settings.Errors>>;
 
         namespace Settings {
+            interface Transition {
+
+                /**
+                 * Named animation show event to used.
+                 * Must be defined in CSS.
+                 */
+                showMethod: string;
+
+                /**
+                 * Duration of the CSS show transition animation
+                 */
+                showDuration: number;
+
+                /**
+                 * Named animation hide event to used.
+                 * Must be defined in CSS.
+                 */
+                hideMethod: string;
+
+                /**
+                 * Duration of the CSS hide transition animation
+                 */
+                hideDuration: number;
+            }
+
             interface Selectors {
                 /**
                  * @default '.addition'
@@ -743,7 +769,7 @@ declare namespace FomanticUI {
                  */
                 clearIcon: string;
             }
-        
+
             interface ClassNames {
                 /**
                  * @default 'active'
@@ -920,7 +946,7 @@ declare namespace FomanticUI {
                  */
                 actionable: string;
             }
-        
+
             interface Messages {
                 /**
                  * @default 'Add <b>{term}</b>'
@@ -952,9 +978,9 @@ declare namespace FomanticUI {
                 /**
                  * @default '/[-[\]{}()*+?.,\\^$|#\s]/g'
                  */
-                escape: string;  
+                escape: string;
             }
-        
+
             interface Metadatas {
                 /**
                  * @default 'defaultText'
@@ -964,24 +990,24 @@ declare namespace FomanticUI {
                 /**
                  * @default 'defaultValue'
                  */
-                defaultValue: string;  
+                defaultValue: string;
 
                 /**
                  * @default 'placeholderText'
                  */
-                placeholderText: string;  
+                placeholderText: string;
 
                 /**
                  * @default 'text'
                  */
-                text: string;  
+                text: string;
 
                 /**
                  * @default 'value'
                  */
-                value: string;  
+                value: string;
             }
-       
+
             interface Fields {
                 /**
                  * Grouping for api results
@@ -993,13 +1019,13 @@ declare namespace FomanticUI {
                  * Grouping for all dropdown values
                  * @default 'values'
                  */
-                values: string;  
+                values: string;
 
                 /**
                  * Whether value should be disabled
                  * @default 'disabled'
                  */
-                disabled: string;  
+                disabled: string;
 
                 /**
                  * Displayed dropdown text
@@ -1031,6 +1057,12 @@ declare namespace FomanticUI {
                  */
                 text: string;
 
+                /**
+                 * custom data atttributes
+                 * @default 'data'
+                 */
+                data: string;
+
                 /**
                  * Type of dropdown element
                  * @default 'type'
@@ -1049,6 +1081,12 @@ declare namespace FomanticUI {
                  */
                 imageClass: string;
 
+                /**
+                 * Optional alt text for image
+                 * @default 'alt'
+                 */
+                alt: string;
+
                 /**
                  * Optional icon name
                  * @default 'icon'
@@ -1079,7 +1117,7 @@ declare namespace FomanticUI {
                  */
                 actionable: string;
             }
-        
+
             interface Keys {
                 /**
                  * @default 8