fomantic / Fomantic-UI

Fomantic-UI is the official community fork of Semantic-UI
https://fomantic-ui.com
MIT License
3.55k stars 328 forks source link

[Types] APISettings Should Supports JQueryAjaxSettings? #2840

Closed KiddoV closed 1 year ago

KiddoV commented 1 year ago

Bug Report

I see a new implement in this commit for types in the lib. Yay!

However when I do this:

jq("#test").search({
    ...
    apiSettings: {
        action: ...
        timeout: 8000, //<-- GOT ERROR
        error(error: function(jqXHR, textStatus, errorThrown)) {} //<-- GOT ERROR
    }
});

Those error keys are from JQueryAjaxSettings. Should the APISettings include the JQueryAjaxSettings as well?, based on this doc: https://server3.kproxy.com/servlet/redirect.srv/sruj/sre-ovhcqdgy/p2/behaviors/api.html#/settings

You can pass in any standard jQuery AJAX setting like timeout or contentType to API's settings and it will be automatically passed to the request's AJAX call.

Correct me if I am wrong, thanks!

Version

2.9.2-nightly

prudho commented 1 year ago

@KiddoV yep, you're not wrong. Typings are still a work in progress, I missed this point, obviously, so thanks for reporting. #2841 should fix your issues.

Also, i think that the correct way to use it should be:

jq("#test").search({
    ...
    apiSettings: {
        action: ...
        timeout: 8000,
        error: function(jqXHR, textStatus, errorThrown) {}
    }
});

@lubber-de I think that we should create a label for types or typings, to use in issues and pull requests.

KiddoV commented 1 year ago

@prudho thanks for this PR. Type definition is what I have been waiting for in a long time.

Quick question, is there anyway that I can merge all type definitions into one single file? Or is it better to do it this current way?

prudho commented 1 year ago

Yes, all of thoses definition can be merged into one file: index.d.ts:

// Type definitions for fomantic-ui 2.9
// Project: https://github.com/fomantic/Fomantic-UI
// Definitions by: Fomantic Team <https://github.com/fomantic>

/// <reference types="jquery" />

interface JQuery {
    accordion:  FomanticUI.Accordion;
    api:        FomanticUI.API;
    calendar:   FomanticUI.Calendar;
    checkbox:   FomanticUI.Checkbox;
    dimmer:     FomanticUI.Dimmer;
    dropdown:   FomanticUI.Dropdown;
    embed:      FomanticUI.Embed;
    flyout:     FomanticUI.Flyout;
    form:       FomanticUI.Form;
    modal:      FomanticUI.Modal;
    nag:        FomanticUI.Nag;
    popup:      FomanticUI.Popup;
    progress:   FomanticUI.Progress;
    rating:     FomanticUI.Rating;
    search:     FomanticUI.Search;
    shape:      FomanticUI.Shape;
    sidebar:    FomanticUI.Sidebar;
    slider:     FomanticUI.Slider;
    sticky:     FomanticUI.Sticky;
    tab:        FomanticUI.Tab;
    toast:      FomanticUI.Toast;
    transition: FomanticUI.Transition;
    visibility: FomanticUI.Visibility;
}

interface JQueryStatic {
    api:        FomanticUI.API;
    flyout:     FomanticUI.Flyout;
    modal:      FomanticUI.Modal;
    toast:      FomanticUI.Toast;
}

declare namespace FomanticUI {
    // here the content of fomantic-ui-accordion.d.ts file
    interface Accordion { /* ... */ }

    interface AccordionSettings { /* ... */ }

    namespace Accordion { /* ... */ }

    // and then the content of each fomantic-ui-*.d.ts file...
}

However, this would provide a very long unique file, not readable and not easily maintainable. So each module has his own definition file. It can also allow a user to select which definitions he needs (for typescript at least):

/// <reference path="fomantic-ui/types/fomantic-ui-accordion.d.ts" />
KiddoV commented 1 year ago

Will it be in a single auto-generated file, similar to the CDN JS version, or will it be in multiple file formats when deployed?