From 1abd6ee8d646e113dbac4146bdb61833e0646076 Mon Sep 17 00:00:00 2001 From: Leonard Thieu Date: Thu, 27 Jul 2017 11:07:27 -0400 Subject: [PATCH] [semantic-ui] Update to 2.2.11 (#18431) * [semantic-ui-form] Update to 2.2.11. * [semantic-ui-form] Add previously undocumented 'add prompt' behavior. * [semantic-ui-modal] Fix spacing in documentation. * [semantic-ui-sticky] Update to 2.2.11. * [semantic-ui-popup] Update to 2.2.11. * [semantic-ui-api] Add 'api' setting. * [semantic-ui-api] Lint. --- types/semantic-ui-api/global.d.ts | 7 +- .../semantic-ui-api/semantic-ui-api-tests.ts | 34 ++++++ types/semantic-ui-form/global.d.ts | 52 ++++++++- .../semantic-ui-form-tests.ts | 109 +++++++++++++++++- types/semantic-ui-modal/global.d.ts | 2 +- types/semantic-ui-popup/global.d.ts | 19 ++- .../semantic-ui-popup-tests.ts | 6 +- types/semantic-ui-sticky/global.d.ts | 9 ++ .../semantic-ui-sticky-tests.ts | 1 + 9 files changed, 233 insertions(+), 6 deletions(-) diff --git a/types/semantic-ui-api/global.d.ts b/types/semantic-ui-api/global.d.ts index f7292b4f54..b0cd596798 100644 --- a/types/semantic-ui-api/global.d.ts +++ b/types/semantic-ui-api/global.d.ts @@ -110,7 +110,8 @@ declare namespace SemanticUI { type ApiSettings = ApiSettings.Param; namespace ApiSettings { - type Param = (Pick<_Impl, 'on'> | + type Param = (Pick<_Impl, 'api'> | + Pick<_Impl, 'on'> | Pick<_Impl, 'cache'> | Pick<_Impl, 'stateContext'> | Pick<_Impl, 'encodeParameters'> | @@ -156,6 +157,10 @@ declare namespace SemanticUI { Partial>; interface _Impl { + api: { + [action: string]: string; + }; + // region Behavior /** diff --git a/types/semantic-ui-api/semantic-ui-api-tests.ts b/types/semantic-ui-api/semantic-ui-api-tests.ts index ca8107d8ec..d94b02cfb8 100644 --- a/types/semantic-ui-api/semantic-ui-api-tests.ts +++ b/types/semantic-ui-api/semantic-ui-api-tests.ts @@ -140,6 +140,40 @@ function test_api() { $(selector).api({ foo: 'bar' }); // $ExpectError } +function creating_an_api() { + function required_parameters() { + /* Two required variables */ + $.fn.api.settings.api = { + 'get followers': '/followers/{id}?results={count}', + }; + } + + function optional_parameters() { + /* One required, one optional variable */ + $.fn.api.settings.api = { + 'get followers': '/followers/{id}/{/sort}', + }; + } + + function creating_your_api() { + /* Define API endpoints once globally */ + $.fn.api.settings.api = { + 'get followers': '/followers/{id}?results={count}', + 'create user': '/create', + 'add user': '/add/{id}', + 'follow user': '/follow/{id}', + search: '/search/?query={value}' + }; + } + + function using_urls() { + $('.search.button') + .api({ + url: 'http://www.google.com?q={value}' + }); + } +} + import api = require('semantic-ui-api'); function test_module() { diff --git a/types/semantic-ui-form/global.d.ts b/types/semantic-ui-form/global.d.ts index 3f8b3977e9..0bc8bf9b66 100644 --- a/types/semantic-ui-form/global.d.ts +++ b/types/semantic-ui-form/global.d.ts @@ -14,6 +14,43 @@ declare namespace SemanticUI { * Returns true/false whether a form passes its validation rules */ (behavior: 'is valid'): boolean; + /** + * Adds rule to existing rules for field + * @since 2.2.11 + */ + (behavior: 'add rule', field: string, rules: string | string[] | Form.Rules): JQuery; + /** + * Adds rule to existing rules for field + * @since 2.2.11 + */ + (behavior: 'add field', field: string, rules: string | string[] | Form.Rules): JQuery; + /** + * Adds fields object to existing fields + * @since 2.2.11 + */ + (behavior: 'add fields', fields: Form.Fields): JQuery; + /** + * Removes specific rule from field leaving other rules + * @since 2.2.11 + */ + (behavior: 'remove rule', field: string, rule: Form.Rule): JQuery; + /** + * Remove all validation for a field + * @since 2.2.11 + */ + (behavior: 'remove field', field: string): JQuery; + /** + * @since 2.2.11 + */ + (behavior: 'remove rules', fields: string | string[], rules: Form.Rule[]): JQuery; + /** + * @since 2.2.11 + */ + (behavior: 'remove fields', fields: string[]): JQuery; + /** + * Adds error prompt to the field with the given identifier + */ + (behavior: 'add prompt', identifier: string, errors: string | string[]): JQuery; /** * Validates form and calls onSuccess or onFailure */ @@ -58,7 +95,7 @@ declare namespace SemanticUI { (behavior: 'setting', name: K, value?: undefined): FormSettings._Impl[K]; (behavior: 'setting', name: K, value: FormSettings._Impl[K]): JQuery; (behavior: 'setting', value: FormSettings): JQuery; - (settings?: FormSettings): JQuery; + (settings?: FormSettings | Form.Fields): JQuery; } /** @@ -96,6 +133,10 @@ declare namespace SemanticUI { Partial>; interface _Impl { + defaults: { + [name: string]: Form.Field; + }; + // region Form Settings /** @@ -255,6 +296,7 @@ declare namespace SemanticUI { namespace Form { interface Field { identifier: string; + optional?: boolean; rules: Rule[]; } @@ -263,6 +305,14 @@ declare namespace SemanticUI { prompt: string; } + interface Fields { + [name: string]: string | string[]; + } + + interface Rules { + rules: Rule[]; + } + type TextSettings = TextSettings.Param; namespace TextSettings { diff --git a/types/semantic-ui-form/semantic-ui-form-tests.ts b/types/semantic-ui-form/semantic-ui-form-tests.ts index 56293fc5b4..76b9b95968 100644 --- a/types/semantic-ui-form/semantic-ui-form-tests.ts +++ b/types/semantic-ui-form/semantic-ui-form-tests.ts @@ -1,3 +1,5 @@ +/* tslint:disable:only-arrow-functions */ + function test_form_static() { $.fn.form.settings.error!.method = 'method'; $.fn.form.settings.namespace = 'namespace'; @@ -12,6 +14,48 @@ function test_form() { const selector = '.ui.form'; $(selector).form('submit'); // $ExpectType JQuery $(selector).form('is valid'); // $ExpectType boolean + $(selector).form('add rule', 'field', 'rule'); // $ExpectType JQuery + $(selector).form('add rule', 'field', ['rule1', 'rule2']); // $ExpectType JQuery + // $ExpectType JQuery + $(selector).form('add rule', 'field', { + rules: [{ + type: 'type', + prompt: 'prompt' + }] + }); + $(selector).form('add field', 'field', 'rule'); // $ExpectType JQuery + $(selector).form('add field', 'field', ['rule1', 'rule2']); // $ExpectType JQuery + // $ExpectType JQuery + $(selector).form('add field', 'field', { + rules: [{ + type: 'type', + prompt: 'prompt' + }] + }); + // $ExpectType JQuery + $(selector).form('add fields', { + field1: 'rule', + field2: ['rule1', 'rule2'] + }); + // $ExpectType JQuery + $(selector).form('remove rule', 'field', { + type: 'type', + prompt: 'prompt' + }); + $(selector).form('remove field', 'field'); // $ExpectType JQuery + // $ExpectType JQuery + $(selector).form('remove rules', 'field', [{ + type: 'type', + prompt: 'prompt' + }]); + // $ExpectType JQuery + $(selector).form('remove rules', ['field1', 'field2'], [{ + type: 'type', + prompt: 'prompt' + }]); + $(selector).form('remove fields', ['field1', 'field2']); // $ExpectType JQuery + $(selector).form('add prompt', 'identifier', 'error'); // $ExpectType JQuery + $(selector).form('add prompt', 'identifier', ['error1', 'error2']); // $ExpectType JQuery $(selector).form('validate form'); // $ExpectType JQuery $(selector).form('get change event') === 'change event'; $(selector).form('get field', 'id'); // $ExpectType JQuery @@ -158,7 +202,70 @@ function test_form() { $(selector).form(); // $ExpectType JQuery $(selector).form('foo'); // $ExpectError - $(selector).form({ foo: 'bar' }); // $ExpectError + $(selector).form({ foo: 1 }); // $ExpectError +} + +function adding_rules_programmatically() { + { + // lets only validate username to start + $('.add.example .ui.form') + .form({ + username: ['empty', 'minLength[5]'] + }); + } + { + // lets toggle some validation based on button + $('.add.example .ui.positive.button') + .on('click', function() { + $('.add.example .ui.form') + // adding longform + .form('add rule', 'gender', { + rules: [ + { + type: 'empty', + prompt: 'Entering your gender is necessary' + } + ] + }) + // adding shorthand + .form('add rule', 'password', ['empty', 'minLength[5]']); + }); + } + { + $('.add.example .ui.negative.button') + .on('click', function() { + $('.add.example .ui.form') + // removing multiple at once + .form('remove fields', ['gender', 'password']); + }); + } +} + +function setting_site_defaults() { + { + $.fn.form.settings.defaults = { + email: { + identifier: 'email', + rules: [ + { + type: 'email', + prompt: 'Please enter a valid e-mail' + } + ] + }, + // this form doesn't have a cc email but it will not produce an error + ccEmail: { + identifier: 'cc-email', + optional: true, + rules: [ + { + type: 'email', + prompt: 'Please enter a valid second e-mail' + } + ] + }, + }; + } } import form = require('semantic-ui-form'); diff --git a/types/semantic-ui-modal/global.d.ts b/types/semantic-ui-modal/global.d.ts index 2e6efc4e1d..4a3d0ca57a 100644 --- a/types/semantic-ui-modal/global.d.ts +++ b/types/semantic-ui-modal/global.d.ts @@ -131,7 +131,7 @@ declare namespace SemanticUI { */ keyboardShortcuts: boolean; /** - * A vertical offset to allow for content outside of modal, for example a close button, to be centered. + * A vertical offset to allow for content outside of modal, for example a close button, to be centered. * * @default 0 */ diff --git a/types/semantic-ui-popup/global.d.ts b/types/semantic-ui-popup/global.d.ts index f9504e1780..185acb1053 100644 --- a/types/semantic-ui-popup/global.d.ts +++ b/types/semantic-ui-popup/global.d.ts @@ -50,6 +50,18 @@ declare namespace SemanticUI { * Repositions a popup */ (behavior: 'set position', position: string): JQuery; + /** + * @since 2.2.11 + */ + (behavior: 'bind clickaway'): JQuery; + /** + * @since 2.2.11 + */ + (behavior: 'bind touch close'): JQuery; + /** + * @since 2.2.11 + */ + (behavior: 'bind close on scroll'): JQuery; /** * Removes popup from the page and removes all events */ @@ -471,7 +483,8 @@ declare namespace SemanticUI { type Param = (Pick<_Impl, 'loading'> | Pick<_Impl, 'popup'> | Pick<_Impl, 'position'> | - Pick<_Impl, 'visible'>) & + Pick<_Impl, 'visible'> | + Pick<_Impl, 'popupVisible'>) & Partial>; interface _Impl { @@ -491,6 +504,10 @@ declare namespace SemanticUI { * @default 'visible' */ visible: string; + /** + * @since 2.2.11 + */ + popupVisible: string; } } diff --git a/types/semantic-ui-popup/semantic-ui-popup-tests.ts b/types/semantic-ui-popup/semantic-ui-popup-tests.ts index 9b00a9dba8..d8e852ef6c 100644 --- a/types/semantic-ui-popup/semantic-ui-popup-tests.ts +++ b/types/semantic-ui-popup/semantic-ui-popup-tests.ts @@ -20,6 +20,9 @@ function test_popup() { $(selector).popup('is hidden'); // $ExpectType boolean $(selector).popup('exists'); // $ExpectType boolean $(selector).popup('reposition'); // $ExpectType JQuery + $(selector).popup('bind clickaway'); // $ExpectType JQuery + $(selector).popup('bind touch close'); // $ExpectType JQuery + $(selector).popup('bind close on scroll'); // $ExpectType JQuery $(selector).popup('set position', 'position'); // $ExpectType JQuery $(selector).popup('destroy'); // $ExpectType JQuery $(selector).popup('setting', 'debug', undefined); // $ExpectType boolean @@ -116,7 +119,8 @@ function test_popup() { loading: 'loading', popup: 'popup', position: 'top', - visible: 'visible' + visible: 'visible', + popupVisible: 'popupVisible' }, error: { invalidPosition: 'invalidPosition', diff --git a/types/semantic-ui-sticky/global.d.ts b/types/semantic-ui-sticky/global.d.ts index 220e57a011..4a8496468d 100644 --- a/types/semantic-ui-sticky/global.d.ts +++ b/types/semantic-ui-sticky/global.d.ts @@ -24,6 +24,7 @@ declare namespace SemanticUI { namespace StickySettings { type Param = (Pick<_Impl, 'pushing'> | + Pick<_Impl, 'setSize'> | Pick<_Impl, 'jitter'> | Pick<_Impl, 'observeChanges'> | Pick<_Impl, 'context'> | @@ -55,6 +56,14 @@ declare namespace SemanticUI { * @default false */ pushing: boolean; + /** + * Sets size of fixed content to match its width before fixing to screen dynamically. + * This is used because fixed may display block or 100% width content differently than it appears before sticking. + * + * @default true + * @since 2.2.11 + */ + setSize: boolean; /** * Sticky container height will only be set if the difference between heights of container and context is larger than this jitter value. * diff --git a/types/semantic-ui-sticky/semantic-ui-sticky-tests.ts b/types/semantic-ui-sticky/semantic-ui-sticky-tests.ts index fefad8870a..8884b2c714 100644 --- a/types/semantic-ui-sticky/semantic-ui-sticky-tests.ts +++ b/types/semantic-ui-sticky/semantic-ui-sticky-tests.ts @@ -27,6 +27,7 @@ function test_sticky() { // $ExpectType JQuery $(selector).sticky({ pushing: false, + setSize: false, jitter: 4, observeChanges: true, context: $(),