From 8f4e8709eac8bca4c5ef336bc81ac41a6d21bf53 Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Fri, 16 Dec 2022 14:17:13 +0530 Subject: [PATCH 01/19] Webflow methods --- README.md | 331 ++++++++++++++++++++++++++++++++- src/webflow/WebflowElements.ts | 2 +- 2 files changed, 325 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index 64e649b..f56bb01 100644 --- a/README.md +++ b/README.md @@ -1,14 +1,331 @@ + + + +
+ + + + + + + +
+ + + + + # Typescript Utils + + + + Typescript utils for custom Webflow projects. This project contains different categories of utils that can be used in any project. + + + + All utils are fully tree shakeable and strongly typed. -Categories: + + + + +[![npm](https://img.shields.io/npm/dt/@finsweet/ts-utils)](https://www.npmjs.com/package/@finsweet/ts-utils) [![npm version](https://badge.fury.io/js/@finsweet%2Fts-utils.svg)](https://badge.fury.io/js/@finsweet%2Fts-utils) [![NPM](https://img.shields.io/npm/l/@finsweet/ts-utils)](https://www.npmjs.com/package/@finsweet/ts-utils) [![PRs Welcome](https://img.shields.io/badge/PRs-Welcome-green)](https://github.com/finsweet/ts-utils/pulls) [![dependencies](https://img.shields.io/badge/dependencies-none-brightgreen.svg)](https://github.com/finsweet/ts-utils/blob/master/package.json) + + + +### All available methods and features + + #### Webflow + +- [WEBFLOW_BREAKPOINTS](#WEBFLOW_BREAKPOINTS) +- [closeDropdown()](#closeDropdown()) +- [Css](#Css) +- [getCollectionElements()](#getCollectionElements()) +- [getCollectionListWrappers()](#getCollectionListWrappers()) +- [getCurrentBreakpoint()](#getCurrentBreakpoint()) +- [getPublishDate()](#getPublishDate()) +- [getSiteId()](#getSiteId()) +- [restartWebflow()](#restartWebflow()) + + + +#### `Breakpoints` +`WEBFLOW_BREAKPOINTS` is a Map that defines the default media queries for Webflow's breakpoints. + +List of default media queries that are already defined: + +| key (string) | value (string) | +| ------ | ------ | +| tiny | (max-width: 479px) | +| small | (max-width: 767px) | +| medium | (max-width: 991px) | +| main | (min-width: 992px) | + +Example: +```ts +import { WEBFLOW_BREAKPOINTS } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { +const breakpointMedium = WEBFLOW_BREAKPOINTS.get('medium'); + if (breakpointMedium) { + // Create a media condition that targets viewports at least 991px wide + const mediaQuery = window.matchMedia(breakpointMedium); + // Check if the media query is true + if (mediaQuery.matches) { + // do something! + } + } + } +``` + +#### `CloseDropdown()` +`closeDropdown()` closes a dropdown element + +| param | value | +| ------ | ------ | +| dropdownToggle: HTMLDivElement | Dropdown element | +| focusToggle?: Boolean | Focus dropdown | + +Example: +```ts +import { closeDropdown } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { +// Query the dropdown element +const dropdownEl = document.querySelector('#fs-dropdown') as HTMLDivElement; + +// Query the element that should trigger the dropdown close function +const closeDropdownEl = document.querySelector('#fs-close-dropdown') as HTMLButtonElement; + +// Bind an event listener to the close dropdown element to execute the function +closeDropdownEl.addEventListener('click', () => closeDropdown(dropdownEl)); +} +``` + +#### `Css` +This util contains constants for Webflow css classes linked to the native Webflow elements. + +List of available css classes groups +| constant | reference | +| ------ | ------ | +| CURRENT_CSS_CLASS | Current element(s) | +| RICH_TEXT_BLOCK_CSS_CLASS | Richtext element(s) | +| HTML_EMBED_CSS_CLASS | Embed element(s) | +| SLIDER_CSS_CLASSES | Slider element(s) | +| TABS_CSS_CLASSES | Tabs element(s) | +| NAVBAR_CSS_CLASSES | Navbar element(s) | +| CMS_CSS_CLASSES | Cms element(s) | +| FORM_CSS_CLASSES | Form element(s) | +| DROPDOWN_CSS_CLASSES | Dropdown element(s) | +| COMMERCE_CSS_CLASSES | E-Commerce element(s) | +| LIGHTBOX_CSS_CLASSES | Lightbox element(s) | + +Example: +```ts +import { SLIDER_CSS_CLASSES } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + +// Querying the slider nav element +const sliderNavEl = document.querySelector(`.${SLIDER_CSS_CLASSES.sliderNav}`); +} +``` + +#### `getCollectionElements()` +This util helps with selecting different elements inside `Collection List Wrapper` or the `Collection List` + +| param | value | +| ------ | ------ | +| reference: string or Element | The element or selector of the element | +| target: string | The requested element/elements | +| page: Document | The page document | + +Available targets: +| Targets | +| ------ | +| `wrapper` | +| `list` | +| `items` | +| `empty` | +| `pagination` | +| `next` | +| `previous` | +| `pageCount` | + +Example: +```ts +import { getCollectionElements } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + + // source of the page that has the collection + const pageSource = '/cms'; + + // fetching the page and getting the text + const pageData = await fetch(pageSource); + const pageText = await pageData.text(); + + // using dom parser to generate a document using page text + const parser = new DOMParser(); + const doc = parser.parseFromString(pageText, 'text/html'); + + // selector for our collection + const selector = '#fs-col-wrapper'; + + // fetching all the items in the collection wrapper using the getCollectionElements util + const list = await getCollectionElements(selector, 'items', doc); + + console.log(list); +}); +``` +Output: +``` +(4) [div.w-dyn-item, div.w-dyn-item, div.w-dyn-item, div.w-dyn-item] +``` + +#### `CollectionListWrappers()` +This util queries `Collection List Wrapper` elements and makes sure they are unique. + +| param | value | +| ------ | ------ | +| selectors: Array of strings | The selectors used for the query. If an empty array is provided, all `Collection List Wrapper` elements will be returned | +| page: Document | The document where to perform the query | + +Example: +```ts +import { getCollectionListWrappers } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + // source of the page that has the collection + const pageSource = '/cms'; + + // fetching the page and getting the text + const pageData = await fetch(pageSource); + const pageText = await pageData.text(); + + // using dom parser to generate a document using page text + const parser = new DOMParser(); + const doc = parser.parseFromString(pageText, 'text/html'); + + // selectors for our collection wrappers + const selectors = ['#fs-col-wrapper1', `#fs-col-wrapper2`, `#fs-col-wrapper3`]; + + // fetching a unqiue list of collection wrappers + const unqiueColWrappers = await getCollectionListWrappers(selectors, doc); + + console.log(unqiueColWrappers); +}); +``` + +Output: +``` +(3) [div#fs-col-wrapper1.w-dyn-list, div#fs-col-wrapper2.w-dyn-list, div#fs-col-wrapper3.w-dyn-list] +``` +#### `getCurrentBreakpoint()` +Checks the current breakpoint based on the window media. + +Please refer to [WEBFLOW_BREAKPOINTS](#WEBFLOW_BREAKPOINTS) for the defined breakpoints reference table. + +Example: +```ts +import { getCurrentBreakpoint } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + const currentBreakpoint = getCurrentBreakpoint(); + console.log(currentBreakpoint); +}); +``` + +Output: +``` +medium +``` + +#### `getPublishDate()` +Extracts the publish date of a Webflow site. + +Example: +```ts +import { getPublishDate } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + const lastPublishDate = getPublishDate(); + console.log(lastPublishDate); +}); +``` + +Output: +``` +Fri Dec 16 2022 11:48:06 GMT+0530 (India Standard Time) +``` + +#### `getSiteId()` +Extracts the Webflow Site ID of the website + +Example: +```ts +import { getSiteId } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + const siteId = getSiteId(); + console.log(siteId); +}); +``` + +Output: +``` +5f10844b0e20ffdd9de0fbea +``` + +#### `restartWebflow()` +Restarts the Webflow JS library. + +| param | value | +| ------ | ------ | +| modules?: Array of available module strings | If passed, only those modules will be restarted instead of the whole `Webflow` instance | + +| `Available modules` | +| ------ | +| `ix2` | +| `commerce` | +| `lottie` | +| `lightbox` | +| `slider` | +| `tabs` | + +Example: +```ts +import { cloneNode, restartWebflow } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + const image = document.querySelector('img'); + if (!image) return; + + // duplicating and appending the image element with an interaction + const newImage = cloneNode(image); + document.body.append(newImage); + + // restarting Webflow interactions to ensure that the interaction on new image element works + restartWebflow(); +}); +``` + + +### Contribute +PRs are welcomed to this project. If you wish to improve the Finsweet Typescript Utils library, add functionality or improve the docs please feel free to submit a PR. -- Animations: `@finsweet/ts-utils/animations` -- Components: `@finsweet/ts-utils/components` -- Helpers: `@finsweet/ts-utils/helpers` -- Type Guards: `@finsweet/ts-utils/type-guards` -- Types: `@finsweet/ts-utils/types` -- Webflow: `@finsweet/ts-utils/webflow` +### License +MIT © [Finsweet](https://github.com/finsweet) diff --git a/src/webflow/WebflowElements.ts b/src/webflow/WebflowElements.ts index 8e9d038..5301714 100644 --- a/src/webflow/WebflowElements.ts +++ b/src/webflow/WebflowElements.ts @@ -31,7 +31,7 @@ export type SliderDotElement = HTMLDivElement; */ export type TabsElement = HTMLDivElement; export type TabsMenuElement = HTMLDivElement; -export type TabLinkElement = HTMLDivElement; +export type TabLinkElement = HTMLLinkElement; export type TabsContentElement = HTMLDivElement; export type TabPaneElement = HTMLDivElement; From e92a89e80b1da38c10e54161a99f49e951f2cab4 Mon Sep 17 00:00:00 2001 From: yogesh Date: Fri, 16 Dec 2022 16:45:39 +0530 Subject: [PATCH 02/19] fixing reference link --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index f56bb01..7081fe8 100644 --- a/README.md +++ b/README.md @@ -251,7 +251,7 @@ Output: medium ``` -#### `getPublishDate()` +## getPublishDate() Extracts the publish date of a Webflow site. Example: From aee4e96c892fbb2f23e7cc868a56b9895367228a Mon Sep 17 00:00:00 2001 From: yogesh Date: Fri, 16 Dec 2022 17:04:43 +0530 Subject: [PATCH 03/19] fixing reference link --- README.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index 7081fe8..013e2d6 100644 --- a/README.md +++ b/README.md @@ -42,14 +42,14 @@ All utils are fully tree shakeable and strongly typed. #### Webflow - [WEBFLOW_BREAKPOINTS](#WEBFLOW_BREAKPOINTS) -- [closeDropdown()](#closeDropdown()) +- [closeDropdown()](#closeDropdown) - [Css](#Css) -- [getCollectionElements()](#getCollectionElements()) -- [getCollectionListWrappers()](#getCollectionListWrappers()) -- [getCurrentBreakpoint()](#getCurrentBreakpoint()) -- [getPublishDate()](#getPublishDate()) -- [getSiteId()](#getSiteId()) -- [restartWebflow()](#restartWebflow()) +- [getCollectionElements()](#getCollectionElements) +- [getCollectionListWrappers()](#getCollectionListWrappers) +- [getCurrentBreakpoint()](#getCurrentBreakpoint) +- [getPublishDate()](#getPublishDate) +- [getSiteId()](#getSiteId) +- [restartWebflow()](#restartWebflow) @@ -251,7 +251,7 @@ Output: medium ``` -## getPublishDate() +#### getPublishDate() Extracts the publish date of a Webflow site. Example: From ed34c47f2b12382fe1e99cec61c3dad6dab028b1 Mon Sep 17 00:00:00 2001 From: yogesh Date: Fri, 16 Dec 2022 17:27:43 +0530 Subject: [PATCH 04/19] fixing reference link --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 013e2d6..ebcbe1a 100644 --- a/README.md +++ b/README.md @@ -251,7 +251,7 @@ Output: medium ``` -#### getPublishDate() +### getPublishDate() Extracts the publish date of a Webflow site. Example: From 31979b4622c13f43cdd86902824f5ef0eff163d2 Mon Sep 17 00:00:00 2001 From: yogesh Date: Fri, 16 Dec 2022 17:29:31 +0530 Subject: [PATCH 05/19] fixing reference link --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index ebcbe1a..7d5c10d 100644 --- a/README.md +++ b/README.md @@ -251,7 +251,7 @@ Output: medium ``` -### getPublishDate() +#### `getPublishDate()` Extracts the publish date of a Webflow site. Example: From f0c3b6524fb83477e55172173f47f823982999cf Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Sat, 17 Dec 2022 16:19:29 +0530 Subject: [PATCH 06/19] adding new methods and formatting --- README.md | 97 ++++++++++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 86 insertions(+), 11 deletions(-) diff --git a/README.md b/README.md index 7d5c10d..3ee5284 100644 --- a/README.md +++ b/README.md @@ -50,7 +50,9 @@ All utils are fully tree shakeable and strongly typed. - [getPublishDate()](#getPublishDate) - [getSiteId()](#getSiteId) - [restartWebflow()](#restartWebflow) - + +#### Components +- [CopyJSONButton](#CopyJSONButton) #### `Breakpoints` @@ -58,7 +60,7 @@ All utils are fully tree shakeable and strongly typed. List of default media queries that are already defined: -| key (string) | value (string) | +| key (`string`) | value (`string`) | | ------ | ------ | | tiny | (max-width: 479px) | | small | (max-width: 767px) | @@ -88,8 +90,8 @@ const breakpointMedium = WEBFLOW_BREAKPOINTS.get('medium'); | param | value | | ------ | ------ | -| dropdownToggle: HTMLDivElement | Dropdown element | -| focusToggle?: Boolean | Focus dropdown | +| dropdownToggle: `HTMLDivElement` | Dropdown element | +| focusToggle?: `Boolean` | Focus dropdown | Example: ```ts @@ -143,9 +145,9 @@ This util helps with selecting different elements inside `Collection List Wrappe | param | value | | ------ | ------ | -| reference: string or Element | The element or selector of the element | -| target: string | The requested element/elements | -| page: Document | The page document | +| reference: `string | Element` | The element or selector of the element | +| target: `string` | The requested element/elements | +| page: `Document` | The page document | Available targets: | Targets | @@ -159,6 +161,10 @@ Available targets: | `previous` | | `pageCount` | +| Return value: `CollectionListWrapperElement | CollectionListElement | PaginationButtonElement | PageCountElement | CollectionItemElement[] | CollectionEmptyElement | null | undefined` | +| ------ | +| The specified collection element/elements. | + Example: ```ts import { getCollectionElements } from '@finsweet/ts-utils'; @@ -196,8 +202,12 @@ This util queries `Collection List Wrapper` elements and makes sure they are uni | param | value | | ------ | ------ | -| selectors: Array of strings | The selectors used for the query. If an empty array is provided, all `Collection List Wrapper` elements will be returned | -| page: Document | The document where to perform the query | +| selectors: `string[]` | The selectors used for the query. If an empty array is provided, all `Collection List Wrapper` elements will be returned | +| page: `Document` | The document where to perform the query | + +| Return value: `CollectionListWrapperElement[]` | +| ------ | +| A unique list of `Collection List Wrapper` elements. | Example: ```ts @@ -235,6 +245,10 @@ Checks the current breakpoint based on the window media. Please refer to [WEBFLOW_BREAKPOINTS](#WEBFLOW_BREAKPOINTS) for the defined breakpoints reference table. +| Return value: `String` | +| ------ | +| Breakpoint key matching media query value | + Example: ```ts import { getCurrentBreakpoint } from '@finsweet/ts-utils'; @@ -254,6 +268,10 @@ medium #### `getPublishDate()` Extracts the publish date of a Webflow site. +| Return value: `String` | +| ------ | +| Date object | + Example: ```ts import { getPublishDate } from '@finsweet/ts-utils'; @@ -273,6 +291,10 @@ Fri Dec 16 2022 11:48:06 GMT+0530 (India Standard Time) #### `getSiteId()` Extracts the Webflow Site ID of the website +| Return value: `String` | +| ------ | +| The id of the site | + Example: ```ts import { getSiteId } from '@finsweet/ts-utils'; @@ -294,9 +316,9 @@ Restarts the Webflow JS library. | param | value | | ------ | ------ | -| modules?: Array of available module strings | If passed, only those modules will be restarted instead of the whole `Webflow` instance | +| modules?: `WebflowModule[]` | If passed, only those modules will be restarted instead of the whole `Webflow` instance | -| `Available modules` | +| Available modules | | ------ | | `ix2` | | `commerce` | @@ -323,6 +345,59 @@ window.Webflow.push(async () => { }); ``` +#### `CopyJSONButton` +This util is used to copy the data of a Webflow component which can then be pasted into Webflow designer directly. + +| param | value | +| ------ | ------ | +| element: `HTMLElement` | The element to trigger the copy | +| copyData: `Record` | The JSON data of the element that needs to be copied | +| successText?: `string` | Text to showcase on successful copy | +| errorText?: `string` | Text to shocase when an error occurs while copying | +| successCSSClass?: `string` | Class to be added on the element on successful copy. | + +> How to get `copyData`? +> 1. Open your webflow designer +> 2. Paste this code in your dev tools console +> ```js +> document.addEventListener('copy', ({ clipboardData }) => { +> const webflowData = clipboardData.getData('application/json'); +> +> const type = 'text/plain'; +> const blob = new Blob([webflowData], { type }); +> const data = [ +> new ClipboardItem({ +> [type]: blob, +> }), +> ]; +> +> navigator.clipboard.write(data); +> console.log(webflowData); +> }); +> ``` +> 3. Now, select/click/focus on the Webflow component that you wish to copy the JSON data of. +> 4. Press `CTRL+C` or `CMD+C` +> 5. Check the console logs in the dev tools and copy the JSON data from there to further use it in your code as per your prefernece. + +Example: + +```ts +import { CopyJSONButton } from '@finsweet/ts-utils'; + +// The JSON data of the element to be copied +import copyData from './webflow-component.json'; + +window.Webflow ||= []; +window.Webflow.push(() => { + // The element to trigger the copy on click + const element = document.querySelector('#fs-trigger'); + if (!element) return; + + // Initializing the method + new CopyJSONButton({ element, copyData, successText: 'Copied! Paste in Webflow' }); +}); + +``` ### Contribute PRs are welcomed to this project. If you wish to improve the Finsweet Typescript Utils library, add functionality or improve the docs please feel free to submit a PR. From 0dd13a49e92ef8e43b219b7555e713fd7f069614 Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Mon, 19 Dec 2022 20:03:53 +0530 Subject: [PATCH 07/19] adding methods for components and type-gaurds --- README.md | 221 +++++++++++++++++++++++++++- src/components/DisplayController.ts | 2 +- 2 files changed, 221 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 3ee5284..eacff9f 100644 --- a/README.md +++ b/README.md @@ -53,7 +53,14 @@ All utils are fully tree shakeable and strongly typed. #### Components - [CopyJSONButton](#CopyJSONButton) - +- [Interaction](#Interaction) +- [DisplayController](#DisplayController) + +#### Type-gaurds +- [Instances](#Instances) +- [isKeyOf](#isKeyOf) +- [isFormField](#isFormField) +- [isNotEmpty](#isNotEmpty) #### `Breakpoints` `WEBFLOW_BREAKPOINTS` is a Map that defines the default media queries for Webflow's breakpoints. @@ -379,6 +386,21 @@ This util is used to copy the data of a Webflow component which can then be past > 4. Press `CTRL+C` or `CMD+C` > 5. Check the console logs in the dev tools and copy the JSON data from there to further use it in your code as per your prefernece. +##### Available methods: +- `updateCopyData()`: + Updates the JSON data to be copied. + + | param | value | + | ------ | ------ | + | newCopyData: `Record` | The new JSON data of the element to be copied | + +- `updateTextContent()`: + Updates the button's text content. + + | param | value | + | ------ | ------ | + | newText: `string` | The new text to be displayed | + Example: ```ts @@ -399,6 +421,203 @@ window.Webflow.push(() => { ``` +#### `Interaction` +This util acts as a controller for elements that have a Webflow Ix2 click interaction binded to it. + +| param | value | +| ------ | ------ | +| element: `HTMLElement | string` | Webflow element/ selector that has the Mouse Click interaction | +| duration?: `Number | Partial` | Optionally, the duration can be explicitly set so the trigger methods will return an awaitable Promise. | + +##### Available methods: +- `isActive()`: + Checks if the interaction is active. + | Return value: `Boolean` | + | ------ | + +- `isRunning()`: + Checks if the interaction is running. + | Return value: `Boolean` | + | ------ | + +- `untilFinished()`: + Returns a promise that fulfills when the current running interaction has finished + | Return value: `An awaitable Promise` | + | ------ | + +Example: +```ts +import { Interaction } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + // Trigger element that has a Mouse Click interaction + const triggerElement = document.querySelector('[fs-element="ix2-trigger"]') as HTMLElement; + + // Initializing Interaction + const interaction = new Interaction({ element: triggerElement, duration: 300 }); + + // This won't run because the first click hasn't been triggered yet. + interaction.trigger('second'); + + // Triggers the first click interaction, only when allowed. Returns a Promise that can be awaited. + await interaction.trigger('first'); + + // Returns if the first click has been fired. + interaction.isActive(); + + // Returns if the interaction is still running. + interaction.isRunning(); + + // Triggers the second click interaction, only when allowed. Returns a Promise that can be awaited. + interaction.trigger('second'); + + // Returns a Promise that resolves once the ongoing interaction (if triggered) finishes. + await interaction.untilFinished(); +}); +``` + +#### `DisplayController` +This util helps to show/hide an element using built-in fade animations or no animations at all. It also works with Webflow interactions. + +| param | value | +| ------ | ------ | +| element: `HTMLElement | string` | The main element | +| interaction?: `InteractionParams` | If the display must be controlled through a Webflow interaction | +| displayProperty?: `typeof DisplayController['displayProperties'][number];` | The display property of the element when displayed. Not applicable when interaction parameters ara passed to the instance, as it's assumed that the Webflow interaction will set the display property. Defaults to `block`. | +| noTransition?: `boolean` | If set to true, the element will be straight showed / hidden without any transition. | +| startsHidden?: `boolean` | If set to true, the element will be set to `display: none`. | + +| Available displayProperty options: | +| ------ | +| `block` | +| `flex` | +| `grid` | +| `inline-block` | +| `inline` | + +##### Available methods: +- `isVisible()`: + Checks if element is visible + + | Return value: `Boolean` | + | ------ | + +- `show()` + Displays the element + + | Return value: `An awaitable Promise` | + | ------ | + +- `hide()` + Hides the element + + | Return value: `An awaitable Promise` | + | ------ | + + +Example: +```ts +import { DisplayController } from '@finsweet/ts-utils'; + +const API_BASE = 'https://pokeapi.co/api/v2'; +const API_URI = '/pokemon/ditto'; +window.Webflow ||= []; +window.Webflow.push(async () => { + // Quering the target element, which in this case is a loader + const loadingElement = document.querySelector('#fs-loader') as HTMLElement; + + // Initialises DiplayController + const loadingDisplayController = new DisplayController({ + element: loadingElement, + displayProperty: 'block', + noTransition: true, + startsHidden: true, + }); + + // shows the loader while the API is fetching the data + loadingDisplayController.show(); + + // awaiting the API Promise + const pokemons = await fetch(API_BASE + API_URI); + + // hides the loader once the API is done fetching the data + loadingDisplayController.hide(); +}); +``` + +#### `Instances` +Type-gaurd for elements. + +| method | param | value | +| ------ | ------ | ------ | +| `isFile()` | target: `unknown` | target is a File | +| `isNode()` | target: `unknown` | target is a Node | +| `isElement()` | target: `unknown` | target is an Element | +| `isHTMLElement()` | target: `unknown` | target is a HTMLElement | +| `isHTMLInputElement()` | target: `unknown` | target is a HTMLInputElement | +| `isHTMLSelectElement()` | target: `unknown` | target is a HTMLSelectElement | +| `isHTMLTextAreaElement()` | target: `unknown` | target is a HTMLTextAreaElement | +| `isHTMLVideoElement()` | target: `unknown` | target is a HTMLVideoElement | +| `isHTMLAnchorElement()` | target: `unknown` | target is a HTMLAnchorElement | +| `isHTMLImageElement()` | target: `unknown` | target is a HTMLImageElement | +| `isHTMLOptionElement()` | target: `unknown` | target is a HTMLOptionElement | +| `isHTMLButtonElement()` | target: `unknown` | target is a HTMLButtonElement | + +| Return value: `Boolean` | +| ------ | + +#### `isKeyOf()` +Check if a key is included in a readonly array + +| param | value | +| ------ | ------ | +| key: `string` | The main element | +| source: `readonly T[]` | Readonly array of strings | + +| Return value: `Boolean` | +| ------ | + +Example +```ts + const keyToCheck = 'hello'; + + const arrayToCheck = ['hello', 'how', 'are', 'you']; + + const isKeyPresent = isKeyOf(keyToCheck, arrayToCheck); // true + ``` + +#### `isFormField()` +Checks if an element is a form field element + +| param | value | +| ------ | ------ | +| element: `Element | EventTarget | null` | element | + +| Return value: `Boolean` | +| ------ | + +#### `isNotEmpty()` +This util makes sure there are no `null` or `undefined` in the passed value. Useful for type safety when filtering empty elements from an array. + +| param | value | +| ------ | ------ | +| value: `T | null | undefined` | value to check | + +| Return value: `Boolean` | +| ------ | + +Example: + +```ts +const items = [1, null, 4, undefined, 8]; + +const filteredItemsError: number[] = items.filter((item) => value !== undefined && value !== null); // Type '(number | null | undefined)[]' is not assignable to type 'number[]'. + +const filteredItemsSuccess: number[] = items.filter(isNotEmpty); // Success! +``` + + ### Contribute PRs are welcomed to this project. If you wish to improve the Finsweet Typescript Utils library, add functionality or improve the docs please feel free to submit a PR. diff --git a/src/components/DisplayController.ts b/src/components/DisplayController.ts index 9ce227a..f7ef5cb 100644 --- a/src/components/DisplayController.ts +++ b/src/components/DisplayController.ts @@ -13,7 +13,7 @@ export interface DisplayControllerParams { element: HTMLElement | string; /** - * If the display must be controlled thorugh a Webflow interaction. + * If the display must be controlled through a Webflow interaction. */ interaction?: InteractionParams; From 4139189a6d3a8585b1fbb61a91b7b5b7bc87afeb Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Mon, 19 Dec 2022 20:05:18 +0530 Subject: [PATCH 08/19] typo fix --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index eacff9f..63db42c 100644 --- a/README.md +++ b/README.md @@ -58,9 +58,9 @@ All utils are fully tree shakeable and strongly typed. #### Type-gaurds - [Instances](#Instances) -- [isKeyOf](#isKeyOf) -- [isFormField](#isFormField) -- [isNotEmpty](#isNotEmpty) +- [isKeyOf()](#isKeyOf) +- [isFormField()](#isFormField) +- [isNotEmpty()](#isNotEmpty) #### `Breakpoints` `WEBFLOW_BREAKPOINTS` is a Map that defines the default media queries for Webflow's breakpoints. From c7c0a53ec0440c4f247f9609bb493fada58aa036 Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Mon, 19 Dec 2022 20:10:00 +0530 Subject: [PATCH 09/19] typo fix --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 63db42c..c7f08df 100644 --- a/README.md +++ b/README.md @@ -482,7 +482,7 @@ This util helps to show/hide an element using built-in fade animations or no ani | param | value | | ------ | ------ | -| element: `HTMLElement | string` | The main element | +| element: `HTMLElement string` | The main element | | interaction?: `InteractionParams` | If the display must be controlled through a Webflow interaction | | displayProperty?: `typeof DisplayController['displayProperties'][number];` | The display property of the element when displayed. Not applicable when interaction parameters ara passed to the instance, as it's assumed that the Webflow interaction will set the display property. Defaults to `block`. | | noTransition?: `boolean` | If set to true, the element will be straight showed / hidden without any transition. | @@ -602,7 +602,7 @@ This util makes sure there are no `null` or `undefined` in the passed value. Use | param | value | | ------ | ------ | -| value: `T | null | undefined` | value to check | +| value: `T` | null | undefined` | value to check | | Return value: `Boolean` | | ------ | From 99fbf4956f024c6ec9d724b2fe370d89ddb8136d Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Mon, 19 Dec 2022 20:10:32 +0530 Subject: [PATCH 10/19] typo fix --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index c7f08df..24f1438 100644 --- a/README.md +++ b/README.md @@ -482,7 +482,7 @@ This util helps to show/hide an element using built-in fade animations or no ani | param | value | | ------ | ------ | -| element: `HTMLElement string` | The main element | +| element: `HTMLElement | string` | The main element | | interaction?: `InteractionParams` | If the display must be controlled through a Webflow interaction | | displayProperty?: `typeof DisplayController['displayProperties'][number];` | The display property of the element when displayed. Not applicable when interaction parameters ara passed to the instance, as it's assumed that the Webflow interaction will set the display property. Defaults to `block`. | | noTransition?: `boolean` | If set to true, the element will be straight showed / hidden without any transition. | From f205780a07586d4430a9826e1eb039fbfd7a4dd1 Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Mon, 19 Dec 2022 20:10:48 +0530 Subject: [PATCH 11/19] typo fix --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 24f1438..349eacd 100644 --- a/README.md +++ b/README.md @@ -482,7 +482,7 @@ This util helps to show/hide an element using built-in fade animations or no ani | param | value | | ------ | ------ | -| element: `HTMLElement | string` | The main element | +| element: `HTMLElement / string` | The main element | | interaction?: `InteractionParams` | If the display must be controlled through a Webflow interaction | | displayProperty?: `typeof DisplayController['displayProperties'][number];` | The display property of the element when displayed. Not applicable when interaction parameters ara passed to the instance, as it's assumed that the Webflow interaction will set the display property. Defaults to `block`. | | noTransition?: `boolean` | If set to true, the element will be straight showed / hidden without any transition. | From c0b86f55e96d422a831ed41d1486391b9cdee010 Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Mon, 19 Dec 2022 20:14:03 +0530 Subject: [PATCH 12/19] typo fix --- README.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index 349eacd..1f87dd3 100644 --- a/README.md +++ b/README.md @@ -152,7 +152,7 @@ This util helps with selecting different elements inside `Collection List Wrappe | param | value | | ------ | ------ | -| reference: `string | Element` | The element or selector of the element | +| reference: `string / Element` | The element or selector of the element | | target: `string` | The requested element/elements | | page: `Document` | The page document | @@ -168,7 +168,7 @@ Available targets: | `previous` | | `pageCount` | -| Return value: `CollectionListWrapperElement | CollectionListElement | PaginationButtonElement | PageCountElement | CollectionItemElement[] | CollectionEmptyElement | null | undefined` | +| Return value: `CollectionListWrapperElement / CollectionListElement / PaginationButtonElement / PageCountElement / CollectionItemElement[] / CollectionEmptyElement / null / undefined` | | ------ | | The specified collection element/elements. | @@ -204,7 +204,7 @@ Output: (4) [div.w-dyn-item, div.w-dyn-item, div.w-dyn-item, div.w-dyn-item] ``` -#### `CollectionListWrappers()` +#### `getCollectionListWrappers()` This util queries `Collection List Wrapper` elements and makes sure they are unique. | param | value | @@ -426,8 +426,8 @@ This util acts as a controller for elements that have a Webflow Ix2 click intera | param | value | | ------ | ------ | -| element: `HTMLElement | string` | Webflow element/ selector that has the Mouse Click interaction | -| duration?: `Number | Partial` | Optionally, the duration can be explicitly set so the trigger methods will return an awaitable Promise. | +| element: `HTMLElement / string` | Webflow element/ selector that has the Mouse Click interaction | +| duration?: `Number / Partial` | Optionally, the duration can be explicitly set so the trigger methods will return an awaitable Promise. | ##### Available methods: - `isActive()`: @@ -592,7 +592,7 @@ Checks if an element is a form field element | param | value | | ------ | ------ | -| element: `Element | EventTarget | null` | element | +| element: `Element / EventTarget / null` | element | | Return value: `Boolean` | | ------ | @@ -602,7 +602,7 @@ This util makes sure there are no `null` or `undefined` in the passed value. Use | param | value | | ------ | ------ | -| value: `T` | null | undefined` | value to check | +| value: `T / null / undefined` | value to check | | Return value: `Boolean` | | ------ | From 6f6da37139483874ed434ce427d0893bed6674ed Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Fri, 23 Dec 2022 23:09:36 +0530 Subject: [PATCH 13/19] adding utils for types --- README.md | 109 +++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 108 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 1f87dd3..773bd21 100644 --- a/README.md +++ b/README.md @@ -61,6 +61,18 @@ All utils are fully tree shakeable and strongly typed. - [isKeyOf()](#isKeyOf) - [isFormField()](#isFormField) - [isNotEmpty()](#isNotEmpty) +- [Primitives](#Primitives) + +#### Types +- [FormField](#FormField) +- [MapEntries](#MapEntries) +- [PartialExcept](#PartialExcept) +- [PickPartial](#PickPartial) +- [PickRequired](#PickRequired) +- [RequiredExcept](#RequiredExcept) +- [UnionToIntersection](#UnionToIntersection) + + #### `Breakpoints` `WEBFLOW_BREAKPOINTS` is a Map that defines the default media queries for Webflow's breakpoints. @@ -547,7 +559,7 @@ window.Webflow.push(async () => { ``` #### `Instances` -Type-gaurd for elements. +Type-gaurd methods for elements. | method | param | value | | ------ | ------ | ------ | @@ -617,6 +629,101 @@ const filteredItemsError: number[] = items.filter((item) => value !== undefined const filteredItemsSuccess: number[] = items.filter(isNotEmpty); // Success! ``` +#### `Primitives` +Type-gaurd methods for primitives + +| method | param | value | +| ------ | ------ | ------ | +| `isString()` | value: `unknown` | type of value is a string | +| `isNumber()` | value: `unknown` | type of value is a number | +| `isBigint()` | value: `unknown` | type of value is a bigint | +| `isBoolean()` | value: `unknown` | type of value is a boolean | +| `isSymbol()` | value: `unknown` | type of value is a symbol | +| `isUndefined()` | value: `unknown` | type of value is undefined | +| `isNull()` | value: `unknown` | type of value is null | +| `isFunction()` | value: `unknown` | type of value is a function | +| `isObject()` | value: `unknown` | type of value is an object | + +| Return value: `Boolean` | +| ------ | + +#### `FormField` +`FormField` is the Form Field element on Webflow + +#### `MapEntries` +`MapEntries` converts a `Map` type to its equivalent when performing `[...map.entries()]`. + +Example: +```typescript +const map: MapType = new Map(['key', 'value']); +// Same type as MapEntries +const entries = [...map.entries()]; +typeof entries === MapEntries +``` + +#### `PartialExcept` +Using the `PartialExcept` helper the picked keys will become Required and the rest of the interface will become Partial. + +Example: +```ts +type Obj = { + a: 1, + b: 2, + c: 3, +}; + +type NewObj = PartialExcept; +// NewObj looks like: +// { a?: 1, b: 2, c?: 3 } +``` + +#### `PickPartial` +Using the `PickPartial` the picked keys will become Partial and the rest of the interface will stay the same. + +Example: +```ts +type Obj = { + a: 1, + b: 2, + c: 3, +}; + +type NewObj = PickPartial; +// NewObj looks like: +// { a: 1, b?: 2, c: 3 } +``` + +#### `PickRequired` +Using the `PickRequired` the picked keys will become required and the rest of the interface will stay the same. + +Example: +```ts +type Obj = { + a: 1, + b?: 2, + c?: 3, +}; + +type NewObj = PickRequired; +// NewObj looks like: +// { a: 1, b: 2, c?: 3 } +``` + +#### `RequiredExcept` +Using `RequiredExcept` the picked keys will become Partial and the rest of the interface will become Required. + +Example +```ts +type Obj = { + a?: 1, + b?: 2, + c?: 3, +}; + +type NewObj = RequiredExcept; +// NewObj looks like: +// { a: 1, b?: 2, c: 3 } +``` ### Contribute PRs are welcomed to this project. If you wish to improve the Finsweet Typescript Utils library, add functionality or improve the docs please feel free to submit a PR. From 2c9969c143f943df566e8fdd8f1d8c9f5e67f367 Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Mon, 26 Dec 2022 17:57:31 +0530 Subject: [PATCH 14/19] adding helper utils --- README.md | 384 +++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 383 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 773bd21..67297a6 100644 --- a/README.md +++ b/README.md @@ -72,7 +72,32 @@ All utils are fully tree shakeable and strongly typed. - [RequiredExcept](#RequiredExcept) - [UnionToIntersection](#UnionToIntersection) - +#### Helpers +- [addListener()](#addListener) +- [clearFormField()](#clearFormField) +- [cloneNode()](#cloneNode) +- [extractCommaSeparatedValues()](#extractCommaSeparatedValues) +- [extractNumberSuffix()](#extractNumberSuffix) +- [findTextNode()](#findTextNode) +- [getAllParents()](#getAllParents) +- [getDistanceFromTop()](#getDistanceFromTop) +- [getFormFieldValue()](#getFormFieldValue) +- [getHiddenParent()](#getHiddenParent) +- [getObjectEntries()](#getObjectEntries) +- [getObjectKeys()](#getObjectKeys) +- [isScrollable()](#isScrollable) +- [isVisible()](#isVisible) +- [noop()](#noop) +- [queryElement()](#queryElement) +- [removeChildElements()](#removeChildElements) +- [removeSpaces()](#removeSpaces) +- [removeTrailingSlash()](#removeTrailingSlash) +- [sameValues()](#sameValues) +- [selectInputElement()](#selectInputElement) +- [setFormFieldValue()](#setFormFieldValue) +- [simulateEvent()](#simulateEvent) +- [throwError()](#throwError) +- [wait()](#wait) #### `Breakpoints` `WEBFLOW_BREAKPOINTS` is a Map that defines the default media queries for Webflow's breakpoints. @@ -725,6 +750,363 @@ type NewObj = RequiredExcept; // { a: 1, b?: 2, c: 3 } ``` +#### `UnionToIntersection` +`UnionToIntersection` converts a union like `Interface1 | Interface2` to an intersection `Interface1 & Interface2`. + +#### `addListener()` +This util adds an event listener to an element. + +| param | value | +| ------ | ------ | +| target: `TargetInterface / null / undefined` | Target element | +| type: `Type` | The name of the event | +| listener: `Listener` | The function to run when the event occurs | +| options: `boolean / AddEventListenerOptions` | Available options (https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#options) | + +| Return value: `function` | +| ------ | +| A callback to remove the event listener from the element. | + + +Example: + +```ts +import { addListener } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + const targetElement = document.querySelector('#fs-target') as HTMLButtonElement; + + // The callback removes the element from the event listener + const listenerFunction = addListener(targetElement, 'click', () => console.log('I was clicked!')); + + // Remove listener + listenerFunction(); +}); +``` + +#### `clearFormField()` +This util clears the form field's value and emits an input and changed event. If the field is a checkbox or a radio, it will unselect it. + +| param | value | +| ------ | ------ | +| field: `FormField` | The `FormField` to clear | +| omitEvents: `AllowedEvent / AllowedEvent[]` | By default, events are dispatched from the `FormField`. In some cases, these events might collide with other logic of the system. You can omit certain events from being dispatched by passing them in an array. | + +| List of `AllowedEvent` | +| ------ | +| `DOMContentLoaded` | +| `fullscreenchange` | +| `fullscreenerror` | +| `pointerlockchange` | +| `readystatechange` | +| `visibilitychange` | + +Example: +```ts +import { clearFormField } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + const formFieldEl = document.querySelector('#fs-field') as HTMLInputElement; + + // Clearing form field and omitting "visibilitychange" event to be dispatched upon clearing form field + clearFormField(formFieldEl, 'visibilitychange'); +}); +``` + +#### `cloneNode()` +This util helps you deep clone a node that has the same type as the original one + +| param | value | +| ------ | ------ | +| node: `T extends Node` | The node to clone | + +| Return value: `T` | +| ------ | +| The cloned node. | + +Example +```ts +import { cloneNode } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + // querying a template element to clone + const imageTemplate = document.querySelector('#fs-image') as HTMLImageElement; + + // using the cloneNode util to make a copy of the template element + const newImage = cloneNode(imageTemplate); +}); +``` + +#### `extractCommaSeparatedValues()` +This util converts a string of comma separated values to an array of values. + +| param | value | +| ------ | ------ | +| string: `string` | Comma separated string | +| compareSource?: `undefined` | Acts as a type guard for making sure the extracted values match the compared source | +| defaultValue?: `undefined` | Is set when there is no matching results after comparing with the source | +| filterEmpty?: `undefined` | Defines if empty values should be filtered out of the returned array. Defaults to `true` | + +| Return value: `string[]` | +| ------ | +| An array of strings that were originally seperated by a comma | + +Example: +```ts + const targetString = 'valueone, valuetwo, valuethree';\ + + const resultString = extractCommaSeparatedValues(targetString); + // resultString is ["valueone", "valuetwo", "valuethree"] +``` + +#### `extractNumberSuffix()` +This util returns the number value that is suffixed in a string + +| param | value | +| ------ | ------ | +| string: `string` | The string to extract | + +| Return value: `number / undefined` | +| ------ | +| The resulted number extracted from the string, if found | + +Example: +```ts + const string = 'click-2'; + const string2 = 'click'; + + extractNumberSuffix(string); + // 2 + + extractNumberSuffix(string2); + // undefined +``` + +#### `findTextNode()` +This util finds the first child text node of an element + +| param | value | +| ------ | ------ | +| element: `HTMLElement` | The element to search into | + +| Return value: `ChildNode | undefined` | +| ------ | +| The first child node text element, if found | + +Example: +```ts +import { findTextNode } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + const parentElement = document.querySelector('#fs-parent') as HTMLElement; + +// The node of the first child text element inside the parent + const childTextNode = findTextNode(parentElement); +}); +``` + +#### `getAllParents()` +This util extracts a list of all parents of an element, excepting the `` and `` tags + +| param | value | +| ------ | ------ | +| element: `Element` | The target element | + +| Return value: `HTMLElement[]` | +| ------ | +| The first child node text element, if found | + +#### `getDistanceFromTop()` +This util gets the distance between an element and the top of the window + +| param | value | +| ------ | ------ | +| element: `Element` | The target element | + +| Return value: `number` | +| ------ | +| The distance in pixels | + +#### `getFormFieldValue()` +This util gets the value of a given input element + +| param | value | +| ------ | ------ | +| input: `FormField` | input element | + +| Return value: `string` | +| ------ | +| The input field value | + +#### `getHiddenParent()` +This util finds the first hidden parent element, or the element itself (if hidden). +If the element is already visible, the function returns `undefined`. + +| param | value | +| ------ | ------ | +| element: `HTMLElement` | The reference element | + +| Return value: `HTMLElement | undefined` | +| ------ | +| Hidden parent element, if found. | + +#### `getObjectEntries()` +A typesafe util for `Object.entries()` + +| param | value | +| ------ | ------ | +| object: `Object` | The object | + +| Return value: `Entry[]` | +| ------ | + +#### `getObjectKeys()` +A util to get the keys of an object with inferred typing. + +| param | value | +| ------ | ------ | +| object: `Object` | The object | + +| Return value: `string` | +| ------ | + +#### `getObjectKeys()` +This util checks if an element is scrollable. + +| param | value | +| ------ | ------ | +| element: `Element` | The target element | + +| Return value: `Boolean` | +| ------ | + +#### `isVisible()` +This util checks if an element is visible. + +| param | value | +| ------ | ------ | +| element: `HTMLElement` | The target element | + +| Return value: `Boolean` | +| ------ | + +#### `noop()` +This util, well, does nothing. It is a no operation function. It literally, does nothing. + +#### `queryElement()` +This util queries an element and make sure it's the correct type + +| param | value | +| ------ | ------ | +| selector: `string` | Selector string | +| instance: `Instance` | Instance target of the element type i.e HTMLElement | +| scope: `ParentNode` | The scope context where to query. Defaults to document | +| element: `HTMLElement` | The target element | + +#### `removeChildElements()` +This util removes all child elements from a parent element + +| param | value | +| ------ | ------ | +| element: `Element` | Parent element | +| selector?: `string` | Optional: only remove the elements that match this selector | + +#### `removeSpaces()` +This util removes all the spaces of a string. + +| param | value | +| ------ | ------ | +| string: `string` | The string | + +| Return value: `string` | +| ------ | +| The string without spaces. i.e "The quick brown foThequickbrownfox" |x" => " + +#### `removeTrailingSlash()` +Compares if two arrays have the same exact values. + +| param | value | +| ------ | ------ | +| value: `string` | The value to mutate. | + +cc +| A new string without a trailing slash. | + +``` + This: + https://www.finsweet.com/attributes/attractions/capri-island/ + + Becomes: + https://www.finsweet.com/attributes/attractions/capri-island +``` + +#### `sameValues()` +This util compares if two arrays have the same exact values. + +| param | value | +| ------ | ------ | +| array1: `unkown[]` | First array. | +| array2: `unkown[]` | Second array. | + +| Return value: `Boolean` | +| ------ | + +#### `setFormFieldValue()` +With the help of this util you can set a value to a `FormField` element and emit `click`, `input` and `change` Events. + +| param | value | +| ------ | ------ | +| element: `element` | The value to mutate. | +| value: `boolean / string` | `boolean` for Checkboxes and Radios, `string` for the rest. | + +#### `simulateEvent()` +This util dispatches a custom event that bubbles from the target. + +| param | value | +| ------ | ------ | +| target: `EventTarget` | The element where the event will originate. | +| target: `AllowedEvent | Array` | The element where the event will originate. | + +| List of `AllowedEvent` | +| ------ | +| `w-close` | +| `DOMContentLoaded` | +| `fullscreenchange` | +| `fullscreenerror` | +| `pointerlockchange` | +| `readystatechange` | +| `visibilitychange` | + +| Return value: `Boolean` | +| ------ | +| True if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise. | + +#### `throwError()` +This util displays an alert and throw an exception. + +| param | value | +| ------ | ------ | +| message: `string` | Error message | + +| Return value: `T` | +| ------ | +| The generic argument to assure type safety when querying DOM Elements. | + +#### `wait()` +This util returns an awaitable promise for waiting X time. + +| param | value | +| ------ | ------ | +| time: `number` | Time in ms | + +| Return value: `Promise` | +| ------ | +| Awaitable promise for waiting X time. | + ### Contribute PRs are welcomed to this project. If you wish to improve the Finsweet Typescript Utils library, add functionality or improve the docs please feel free to submit a PR. From 2011b8ee9845ae9f80903d2d39f2eab846c11369 Mon Sep 17 00:00:00 2001 From: ayezinzu <59067019+ayezinzu@users.noreply.github.com> Date: Tue, 27 Dec 2022 15:45:44 +0530 Subject: [PATCH 15/19] adding new methods --- README.md | 91 +++++++++++++++++++++++++- src/helpers/extractNumberFromString.ts | 12 ++++ src/helpers/index.ts | 3 + src/type-guards/instances.ts | 48 ++++++++++++++ src/webflow/index.ts | 2 + src/webflow/populateSelectOptions.ts | 16 +++++ src/webflow/removeSelectOptions.ts | 13 ++++ 7 files changed, 183 insertions(+), 2 deletions(-) create mode 100644 src/helpers/extractNumberFromString.ts create mode 100644 src/webflow/populateSelectOptions.ts create mode 100644 src/webflow/removeSelectOptions.ts diff --git a/README.md b/README.md index 67297a6..86151cb 100644 --- a/README.md +++ b/README.md @@ -35,7 +35,23 @@ All utils are fully tree shakeable and strongly typed. [![npm](https://img.shields.io/npm/dt/@finsweet/ts-utils)](https://www.npmjs.com/package/@finsweet/ts-utils) [![npm version](https://badge.fury.io/js/@finsweet%2Fts-utils.svg)](https://badge.fury.io/js/@finsweet%2Fts-utils) [![NPM](https://img.shields.io/npm/l/@finsweet/ts-utils)](https://www.npmjs.com/package/@finsweet/ts-utils) [![PRs Welcome](https://img.shields.io/badge/PRs-Welcome-green)](https://github.com/finsweet/ts-utils/pulls) [![dependencies](https://img.shields.io/badge/dependencies-none-brightgreen.svg)](https://github.com/finsweet/ts-utils/blob/master/package.json) - + +### Installation + +#### Npm +```bash +npm install @finsweet/ts-utils +``` + +#### Yarn +```bash +yard add @finsweet/ts-utils +``` + +#### Pnpm +```bash +pnpm install @finsweet/ts-utils +``` ### All available methods and features @@ -50,6 +66,8 @@ All utils are fully tree shakeable and strongly typed. - [getPublishDate()](#getPublishDate) - [getSiteId()](#getSiteId) - [restartWebflow()](#restartWebflow) +- [populateSelectOptions()](#populateSelectOptions) +- [removeSelectOptions()](#removeSelectOptions) #### Components - [CopyJSONButton](#CopyJSONButton) @@ -93,11 +111,11 @@ All utils are fully tree shakeable and strongly typed. - [removeSpaces()](#removeSpaces) - [removeTrailingSlash()](#removeTrailingSlash) - [sameValues()](#sameValues) -- [selectInputElement()](#selectInputElement) - [setFormFieldValue()](#setFormFieldValue) - [simulateEvent()](#simulateEvent) - [throwError()](#throwError) - [wait()](#wait) +- [extractNumberFromString()](#extractNumberFromString) #### `Breakpoints` `WEBFLOW_BREAKPOINTS` is a Map that defines the default media queries for Webflow's breakpoints. @@ -389,6 +407,64 @@ window.Webflow.push(async () => { }); ``` +#### `populateSelectOptions()` +This util helps to populate the options for a select element. + +| param | value | +| ------ | ------ | +| selectElement: `HTMLSelectElement` | The select element to populate. | +| options: `string[] / (readonly [string, string])[]` | The options to populate. Accepts either a single Array of values, or an Array with [text, value] tuples. | + +Example: + +```ts +import { populateSelectOptions } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + // quering select element + const selectEl = document.querySelector('#fs-select') as HTMLSelectElement; + const selectElWithValue = document.querySelector('#fs-select-value') as HTMLSelectElement; + // declaring select options + const selectOptions = ['prime', 'pro', 'max']; + + // If we wish to set particular values for the options, then we can declare the options in the following manner + const selectOptionsWithValue = [ + ['prime', '100'], + ['pro', '50'], + ['max', '25'], + ]; + // using the util to populate the select options + populateSelectOptions(selectEl, selectOptions); + + // select options with particular values + populateSelectOptions(selectEl, selectOptionsWithValue); +}); + +``` + +#### `removeSelectOptions()` +This util removes all the options from an HTMLSelectElement. + +| param | value | +| ------ | ------ | +| selectElement: `HTMLSelectElement` | The select element. | +| preserveEmpty: `boolean` | If set to true, any option without a value (like a placeholder option) will be preserved. Default is false. | + +Example: +```ts +import { removeSelectOptions } from '@finsweet/ts-utils'; + +window.Webflow ||= []; +window.Webflow.push(async () => { + // quering select element + const selectEl = document.querySelector('#fs-select') as HTMLSelectElement; + + // using the removeSelectOptions util to remove options from the select element + removeSelectOptions(selectEl); +}); +``` + #### `CopyJSONButton` This util is used to copy the data of a Webflow component which can then be pasted into Webflow designer directly. @@ -1107,6 +1183,17 @@ This util returns an awaitable promise for waiting X time. | ------ | | Awaitable promise for waiting X time. | +#### `extractNumberFromString()` +This util converts a string to a number, removing any invalid symbols like `$` or `,`. If the function is not able to extract a valid number from the string, it will return `null`. + +| param | value | +| ------ | ------ | +| value: `string` | A string number. | + +| Return value: `number \ null` | +| ------ | +| The valid number value. | + ### Contribute PRs are welcomed to this project. If you wish to improve the Finsweet Typescript Utils library, add functionality or improve the docs please feel free to submit a PR. diff --git a/src/helpers/extractNumberFromString.ts b/src/helpers/extractNumberFromString.ts new file mode 100644 index 0000000..9aa107f --- /dev/null +++ b/src/helpers/extractNumberFromString.ts @@ -0,0 +1,12 @@ +/** + * Converts a string to a number, removing any invalid symbols like `$` or `,`. + * If the function is not able to extract a valid number from the string, it will return `null`. + * + * @param value A string number. + * @returns The valid number value. + */ +export const extractNumberFromString = (value: string) => { + const number = parseFloat(value.replace(/[^0-9.-]+/g, '')); + + return isNaN(number) ? null : number; +}; \ No newline at end of file diff --git a/src/helpers/index.ts b/src/helpers/index.ts index 2704a9b..8d6a583 100644 --- a/src/helpers/index.ts +++ b/src/helpers/index.ts @@ -1,3 +1,5 @@ +import { extractNumberFromString } from './extractNumberFromString'; + export { addListener } from './addListener'; export { clearFormField } from './clearFormField'; export { cloneNode } from './cloneNode'; @@ -23,3 +25,4 @@ export { setFormFieldValue } from './setFormFieldValue'; export { simulateEvent } from './simulateEvent'; export { throwError } from './throwError'; export { wait } from './wait'; +export {extractNumberFromString} from './extractNumberFromString'; diff --git a/src/type-guards/instances.ts b/src/type-guards/instances.ts index 2e4425c..21f249b 100644 --- a/src/type-guards/instances.ts +++ b/src/type-guards/instances.ts @@ -1,28 +1,76 @@ +/** + * @returns `true` if the target is an instance of File type. + * @param target + */ export const isFile = (target: unknown): target is File => target instanceof File; +/** + * @returns `true` if the target is an instance of Node type. + * @param target + */ export const isNode = (target: unknown): target is Node => target instanceof Node; +/** + * @returns `true` if the target is an instance of Element type. + * @param target + */ export const isElement = (target: unknown): target is Element => target instanceof Element; +/** + * @returns `true` if the target is an instance of HTMLElement type. + * @param target + */ export const isHTMLElement = (target: unknown): target is HTMLElement => target instanceof HTMLElement; +/** + * @returns `true` if the target is an instance of HTMLInputElement type. + * @param target + */ export const isHTMLInputElement = (target: unknown): target is HTMLInputElement => target instanceof HTMLInputElement; +/** + * @returns `true` if the target is an instance of HTMLSelectElement type. + * @param target + */ export const isHTMLSelectElement = (target: unknown): target is HTMLSelectElement => target instanceof HTMLSelectElement; +/** + * @returns `true` if the target is an instance of HTMLTextAreaElement type. + * @param target + */ export const isHTMLTextAreaElement = (target: unknown): target is HTMLTextAreaElement => target instanceof HTMLTextAreaElement; +/** + * @returns `true` if the target is an instance of HTMLVideoElement type. + * @param target + */ export const isHTMLVideoElement = (target: unknown): target is HTMLVideoElement => target instanceof HTMLVideoElement; +/** + * @returns `true` if the target is an instance of HTMLAnchorElement type. + * @param target + */ export const isHTMLAnchorElement = (target: unknown): target is HTMLAnchorElement => target instanceof HTMLAnchorElement; +/** + * @returns `true` if the target is an instance of HTMLImageElement type. + * @param target + */ export const isHTMLImageElement = (target: unknown): target is HTMLImageElement => target instanceof HTMLImageElement; +/** + * @returns `true` if the target is an instance of HTMLOptionElement type. + * @param target + */ export const isHTMLOptionElement = (target: unknown): target is HTMLOptionElement => target instanceof HTMLOptionElement; +/** + * @returns `true` if the target is an instance of HTMLButtonElement type. + * @param target + */ export const isHTMLButtonElement = (target: unknown): target is HTMLButtonElement => target instanceof HTMLButtonElement; diff --git a/src/webflow/index.ts b/src/webflow/index.ts index a842d5e..b0da833 100644 --- a/src/webflow/index.ts +++ b/src/webflow/index.ts @@ -7,5 +7,7 @@ export { getCurrentBreakpoint } from './getCurrentBreakpoint'; export { getPublishDate } from './getPublishDate'; export { getSiteId } from './getSiteId'; export { restartWebflow } from './restartWebflow'; +export {populateSelectOptions } from './populateSelectOptions'; +export {removeSelectOptions } from './removeSelectOptions'; export * from './Webflow'; export * from './WebflowElements'; diff --git a/src/webflow/populateSelectOptions.ts b/src/webflow/populateSelectOptions.ts new file mode 100644 index 0000000..2670a92 --- /dev/null +++ b/src/webflow/populateSelectOptions.ts @@ -0,0 +1,16 @@ +/** + * Populates the options for a select element. + * @param selectElement The select element to populate. + * @param options The options to populate. Accepts either a single Array of values, or an Array with [text, value] tuples. + */ +export const populateSelectOptions = ( + selectElement: HTMLSelectElement, + options: string[] | (readonly [string, string])[] +) => { + for (const option of options) { + const [text, value] = typeof option === 'string' ? [option, option] : option; + const optionElement = new Option(text, value); + + selectElement.options.add(optionElement); + } +}; \ No newline at end of file diff --git a/src/webflow/removeSelectOptions.ts b/src/webflow/removeSelectOptions.ts new file mode 100644 index 0000000..db63b6e --- /dev/null +++ b/src/webflow/removeSelectOptions.ts @@ -0,0 +1,13 @@ +/** + * Removes all the options from an HTMLSelectElement. + * @param selectElement + * @param preserveEmpty If set to true, any option without a value (like a placeholder option) will be preserved. + */ +export const removeSelectOptions = ({ options }: HTMLSelectElement, preserveEmpty = false) => { + for (const option of [...options]) { + if (preserveEmpty && !option.value) { + continue; + } + option.remove(); + } +}; \ No newline at end of file From 057d85474371ffd8965d1e9a1a7e364d624309c3 Mon Sep 17 00:00:00 2001 From: Alex Iglesias Date: Wed, 11 Jan 2023 20:05:13 +0100 Subject: [PATCH 16/19] chore: updated dependencies and breaking changes of developer-starter --- .vscode/extensions.json | 3 + .vscode/settings.json | 6 + package.json | 20 +- pnpm-lock.yaml | 967 +++++++++++++++------------------------- renovate.json | 6 - 5 files changed, 373 insertions(+), 629 deletions(-) create mode 100644 .vscode/extensions.json create mode 100644 .vscode/settings.json delete mode 100644 renovate.json diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100644 index 0000000..1d7ac85 --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,3 @@ +{ + "recommendations": ["dbaeumer.vscode-eslint", "esbenp.prettier-vscode"] +} diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..124dc6d --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,6 @@ +{ + "editor.formatOnSave": true, + "editor.codeActionsOnSave": { + "source.fixAll.eslint": true + } +} diff --git a/package.json b/package.json index 78ff9f0..cfc8d38 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "scripts": { "build": "tsc", "lint": "eslint --ignore-path .gitignore ./src && prettier --check ./src", + "lint:fix": "eslint --ignore-path .gitignore ./src --fix", "check": "tsc --noEmit", "format": "prettier --write ./src", "release": "changeset publish", @@ -39,16 +40,15 @@ }, "homepage": "https://github.com/finsweet/ts-utils#readme", "devDependencies": { - "@changesets/changelog-git": "^0.1.13", - "@changesets/cli": "^2.25.0", - "@finsweet/eslint-config": "^1.1.5", - "@typescript-eslint/eslint-plugin": "^5.40.1", - "@typescript-eslint/parser": "^5.40.1", - "@trivago/prettier-plugin-sort-imports": "^4.0.0", - "eslint": "^8.25.0", - "eslint-config-prettier": "^8.5.0", + "@changesets/changelog-git": "^0.1.14", + "@changesets/cli": "^2.26.0", + "@finsweet/eslint-config": "^2.0.0", + "@typescript-eslint/eslint-plugin": "^5.48.1", + "@typescript-eslint/parser": "^5.48.1", + "eslint": "^8.31.0", + "eslint-config-prettier": "^8.6.0", "eslint-plugin-prettier": "^4.2.1", - "prettier": "^2.7.1", - "typescript": "^4.8.4" + "prettier": "^2.8.2", + "typescript": "^4.9.4" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9f32531..42ced9a 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,41 +1,31 @@ lockfileVersion: 5.4 specifiers: - '@changesets/changelog-git': ^0.1.13 - '@changesets/cli': ^2.25.0 - '@finsweet/eslint-config': ^1.1.5 - '@trivago/prettier-plugin-sort-imports': ^4.0.0 - '@typescript-eslint/eslint-plugin': ^5.40.1 - '@typescript-eslint/parser': ^5.40.1 - eslint: ^8.25.0 - eslint-config-prettier: ^8.5.0 + '@changesets/changelog-git': ^0.1.14 + '@changesets/cli': ^2.26.0 + '@finsweet/eslint-config': ^2.0.0 + '@typescript-eslint/eslint-plugin': ^5.48.1 + '@typescript-eslint/parser': ^5.48.1 + eslint: ^8.31.0 + eslint-config-prettier: ^8.6.0 eslint-plugin-prettier: ^4.2.1 - prettier: ^2.7.1 - typescript: ^4.8.4 + prettier: ^2.8.2 + typescript: ^4.9.4 devDependencies: - '@changesets/changelog-git': 0.1.13 - '@changesets/cli': 2.25.0 - '@finsweet/eslint-config': 1.1.5_rzhhkabrluhdzyesbuurigqf3u - '@trivago/prettier-plugin-sort-imports': 4.0.0_prettier@2.7.1 - '@typescript-eslint/eslint-plugin': 5.40.1_ukgdydjtebaxmxfqp5v5ulh64y - '@typescript-eslint/parser': 5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q - eslint: 8.25.0 - eslint-config-prettier: 8.5.0_eslint@8.25.0 - eslint-plugin-prettier: 4.2.1_hvbqyfstm4urdpm6ffpwfka4e4 - prettier: 2.7.1 - typescript: 4.8.4 + '@changesets/changelog-git': 0.1.14 + '@changesets/cli': 2.26.0 + '@finsweet/eslint-config': 2.0.0_puoiliissvzurc6i5kvdxsghbu + '@typescript-eslint/eslint-plugin': 5.48.1_3jon24igvnqaqexgwtxk6nkpse + '@typescript-eslint/parser': 5.48.1_iukboom6ndih5an6iafl45j2fe + eslint: 8.31.0 + eslint-config-prettier: 8.6.0_eslint@8.31.0 + eslint-plugin-prettier: 4.2.1_iu5s7nk6dw7o3tajefwfiqfmge + prettier: 2.8.2 + typescript: 4.9.4 packages: - /@ampproject/remapping/2.2.0: - resolution: {integrity: sha512-qRmjj8nj9qmLTQXXmaR1cck3UXSRMPrbsLJAasZpF+t3riI71BXed5ebIOYwQntykeZuhjsdweEc9BxH5Jc26w==} - engines: {node: '>=6.0.0'} - dependencies: - '@jridgewell/gen-mapping': 0.1.1 - '@jridgewell/trace-mapping': 0.3.17 - dev: true - /@babel/code-frame/7.18.6: resolution: {integrity: sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==} engines: {node: '>=6.9.0'} @@ -43,148 +33,11 @@ packages: '@babel/highlight': 7.18.6 dev: true - /@babel/compat-data/7.19.4: - resolution: {integrity: sha512-CHIGpJcUQ5lU9KrPHTjBMhVwQG6CQjxfg36fGXl3qk/Gik1WwWachaXFuo0uCWJT/mStOKtcbFJCaVLihC1CMw==} - engines: {node: '>=6.9.0'} - dev: true - - /@babel/core/7.17.8: - resolution: {integrity: sha512-OdQDV/7cRBtJHLSOBqqbYNkOcydOgnX59TZx4puf41fzcVtN3e/4yqY8lMQsK+5X2lJtAdmA+6OHqsj1hBJ4IQ==} - engines: {node: '>=6.9.0'} - dependencies: - '@ampproject/remapping': 2.2.0 - '@babel/code-frame': 7.18.6 - '@babel/generator': 7.19.5 - '@babel/helper-compilation-targets': 7.19.3_@babel+core@7.17.8 - '@babel/helper-module-transforms': 7.19.0 - '@babel/helpers': 7.19.4 - '@babel/parser': 7.19.4 - '@babel/template': 7.18.10 - '@babel/traverse': 7.19.4 - '@babel/types': 7.19.4 - convert-source-map: 1.9.0 - debug: 4.3.4 - gensync: 1.0.0-beta.2 - json5: 2.2.1 - semver: 6.3.0 - transitivePeerDependencies: - - supports-color - dev: true - - /@babel/generator/7.17.7: - resolution: {integrity: sha512-oLcVCTeIFadUoArDTwpluncplrYBmTCCZZgXCbgNGvOBBiSDDK3eWO4b/+eOTli5tKv1lg+a5/NAXg+nTcei1w==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/types': 7.19.4 - jsesc: 2.5.2 - source-map: 0.5.7 - dev: true - - /@babel/generator/7.19.5: - resolution: {integrity: sha512-DxbNz9Lz4aMZ99qPpO1raTbcrI1ZeYh+9NR9qhfkQIbFtVEqotHojEBxHzmxhVONkGt6VyrqVQcgpefMy9pqcg==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/types': 7.19.4 - '@jridgewell/gen-mapping': 0.3.2 - jsesc: 2.5.2 - dev: true - - /@babel/helper-compilation-targets/7.19.3_@babel+core@7.17.8: - resolution: {integrity: sha512-65ESqLGyGmLvgR0mst5AdW1FkNlj9rQsCKduzEoEPhBCDFGXvz2jW6bXFG6i0/MrV2s7hhXjjb2yAzcPuQlLwg==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0 - dependencies: - '@babel/compat-data': 7.19.4 - '@babel/core': 7.17.8 - '@babel/helper-validator-option': 7.18.6 - browserslist: 4.21.4 - semver: 6.3.0 - dev: true - - /@babel/helper-environment-visitor/7.18.9: - resolution: {integrity: sha512-3r/aACDJ3fhQ/EVgFy0hpj8oHyHpQc+LPtJoY9SzTThAsStm4Ptegq92vqKoE3vD706ZVFWITnMnxucw+S9Ipg==} - engines: {node: '>=6.9.0'} - dev: true - - /@babel/helper-function-name/7.19.0: - resolution: {integrity: sha512-WAwHBINyrpqywkUH0nTnNgI5ina5TFn85HKS0pbPDfxFfhyR/aNQEn4hGi1P1JyT//I0t4OgXUlofzWILRvS5w==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/template': 7.18.10 - '@babel/types': 7.19.4 - dev: true - - /@babel/helper-hoist-variables/7.18.6: - resolution: {integrity: sha512-UlJQPkFqFULIcyW5sbzgbkxn2FKRgwWiRexcuaR8RNJRy8+LLveqPjwZV/bwrLZCN0eUHD/x8D0heK1ozuoo6Q==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/types': 7.19.4 - dev: true - - /@babel/helper-module-imports/7.18.6: - resolution: {integrity: sha512-0NFvs3VkuSYbFi1x2Vd6tKrywq+z/cLeYC/RJNFrIX/30Bf5aiGYbtvGXolEktzJH8o5E5KJ3tT+nkxuuZFVlA==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/types': 7.19.4 - dev: true - - /@babel/helper-module-transforms/7.19.0: - resolution: {integrity: sha512-3HBZ377Fe14RbLIA+ac3sY4PTgpxHVkFrESaWhoI5PuyXPBBX8+C34qblV9G89ZtycGJCmCI/Ut+VUDK4bltNQ==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/helper-environment-visitor': 7.18.9 - '@babel/helper-module-imports': 7.18.6 - '@babel/helper-simple-access': 7.19.4 - '@babel/helper-split-export-declaration': 7.18.6 - '@babel/helper-validator-identifier': 7.19.1 - '@babel/template': 7.18.10 - '@babel/traverse': 7.19.4 - '@babel/types': 7.19.4 - transitivePeerDependencies: - - supports-color - dev: true - - /@babel/helper-simple-access/7.19.4: - resolution: {integrity: sha512-f9Xq6WqBFqaDfbCzn2w85hwklswz5qsKlh7f08w4Y9yhJHpnNC0QemtSkK5YyOY8kPGvyiwdzZksGUhnGdaUIg==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/types': 7.19.4 - dev: true - - /@babel/helper-split-export-declaration/7.18.6: - resolution: {integrity: sha512-bde1etTx6ZyTmobl9LLMMQsaizFVZrquTEHOqKeQESMKo4PlObf+8+JA25ZsIpZhT/WEd39+vOdLXAFG/nELpA==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/types': 7.19.4 - dev: true - - /@babel/helper-string-parser/7.19.4: - resolution: {integrity: sha512-nHtDoQcuqFmwYNYPz3Rah5ph2p8PFeFCsZk9A/48dPc/rGocJ5J3hAAZ7pb76VWX3fZKu+uEr/FhH5jLx7umrw==} - engines: {node: '>=6.9.0'} - dev: true - /@babel/helper-validator-identifier/7.19.1: resolution: {integrity: sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==} engines: {node: '>=6.9.0'} dev: true - /@babel/helper-validator-option/7.18.6: - resolution: {integrity: sha512-XO7gESt5ouv/LRJdrVjkShckw6STTaB7l9BrpBaAHDeF5YZT+01PCwmR0SJHnkW6i8OwW/EVWRShfi4j2x+KQw==} - engines: {node: '>=6.9.0'} - dev: true - - /@babel/helpers/7.19.4: - resolution: {integrity: sha512-G+z3aOx2nfDHwX/kyVii5fJq+bgscg89/dJNWpYeKeBv3v9xX8EIabmx1k6u9LS04H7nROFVRVK+e3k0VHp+sw==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/template': 7.18.10 - '@babel/traverse': 7.19.4 - '@babel/types': 7.19.4 - transitivePeerDependencies: - - supports-color - dev: true - /@babel/highlight/7.18.6: resolution: {integrity: sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g==} engines: {node: '>=6.9.0'} @@ -194,144 +47,66 @@ packages: js-tokens: 4.0.0 dev: true - /@babel/parser/7.18.9: - resolution: {integrity: sha512-9uJveS9eY9DJ0t64YbIBZICtJy8a5QrDEVdiLCG97fVLpDTpGX7t8mMSb6OWw6Lrnjqj4O8zwjELX3dhoMgiBg==} - engines: {node: '>=6.0.0'} - hasBin: true - dependencies: - '@babel/types': 7.19.4 - dev: true - - /@babel/parser/7.19.4: - resolution: {integrity: sha512-qpVT7gtuOLjWeDTKLkJ6sryqLliBaFpAtGeqw5cs5giLldvh+Ch0plqnUMKoVAUS6ZEueQQiZV+p5pxtPitEsA==} - engines: {node: '>=6.0.0'} - hasBin: true - dependencies: - '@babel/types': 7.19.4 - dev: true - - /@babel/runtime/7.19.4: - resolution: {integrity: sha512-EXpLCrk55f+cYqmHsSR+yD/0gAIMxxA9QK9lnQWzhMCvt+YmoBN7Zx94s++Kv0+unHk39vxNO8t+CMA2WSS3wA==} - engines: {node: '>=6.9.0'} - dependencies: - regenerator-runtime: 0.13.10 - dev: true - - /@babel/template/7.18.10: - resolution: {integrity: sha512-TI+rCtooWHr3QJ27kJxfjutghu44DLnasDMwpDqCXVTal9RLp3RSYNh4NdBrRP2cQAoG9A8juOQl6P6oZG4JxA==} + /@babel/runtime/7.20.7: + resolution: {integrity: sha512-UF0tvkUtxwAgZ5W/KrkHf0Rn0fdnLDU9ScxBrEVNUprE/MzirjK4MJUX1/BVDv00Sv8cljtukVK1aky++X1SjQ==} engines: {node: '>=6.9.0'} dependencies: - '@babel/code-frame': 7.18.6 - '@babel/parser': 7.19.4 - '@babel/types': 7.19.4 + regenerator-runtime: 0.13.11 dev: true - /@babel/traverse/7.17.3: - resolution: {integrity: sha512-5irClVky7TxRWIRtxlh2WPUUOLhcPN06AGgaQSB8AEwuyEBgJVuJ5imdHm5zxk8w0QS5T+tDfnDxAlhWjpb7cw==} - engines: {node: '>=6.9.0'} + /@changesets/apply-release-plan/6.1.3: + resolution: {integrity: sha512-ECDNeoc3nfeAe1jqJb5aFQX7CqzQhD2klXRez2JDb/aVpGUbX673HgKrnrgJRuQR/9f2TtLoYIzrGB9qwD77mg==} dependencies: - '@babel/code-frame': 7.18.6 - '@babel/generator': 7.19.5 - '@babel/helper-environment-visitor': 7.18.9 - '@babel/helper-function-name': 7.19.0 - '@babel/helper-hoist-variables': 7.18.6 - '@babel/helper-split-export-declaration': 7.18.6 - '@babel/parser': 7.19.4 - '@babel/types': 7.19.4 - debug: 4.3.4 - globals: 11.12.0 - transitivePeerDependencies: - - supports-color - dev: true - - /@babel/traverse/7.19.4: - resolution: {integrity: sha512-w3K1i+V5u2aJUOXBFFC5pveFLmtq1s3qcdDNC2qRI6WPBQIDaKFqXxDEqDO/h1dQ3HjsZoZMyIy6jGLq0xtw+g==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/code-frame': 7.18.6 - '@babel/generator': 7.19.5 - '@babel/helper-environment-visitor': 7.18.9 - '@babel/helper-function-name': 7.19.0 - '@babel/helper-hoist-variables': 7.18.6 - '@babel/helper-split-export-declaration': 7.18.6 - '@babel/parser': 7.19.4 - '@babel/types': 7.19.4 - debug: 4.3.4 - globals: 11.12.0 - transitivePeerDependencies: - - supports-color - dev: true - - /@babel/types/7.17.0: - resolution: {integrity: sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/helper-validator-identifier': 7.19.1 - to-fast-properties: 2.0.0 - dev: true - - /@babel/types/7.19.4: - resolution: {integrity: sha512-M5LK7nAeS6+9j7hAq+b3fQs+pNfUtTGq+yFFfHnauFA8zQtLRfmuipmsKDKKLuyG+wC8ABW43A153YNawNTEtw==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/helper-string-parser': 7.19.4 - '@babel/helper-validator-identifier': 7.19.1 - to-fast-properties: 2.0.0 - dev: true - - /@changesets/apply-release-plan/6.1.1: - resolution: {integrity: sha512-LaQiP/Wf0zMVR0HNrLQAjz3rsNsr0d/RlnP6Ef4oi8VafOwnY1EoWdK4kssuUJGgNgDyHpomS50dm8CU3D7k7g==} - dependencies: - '@babel/runtime': 7.19.4 - '@changesets/config': 2.2.0 + '@babel/runtime': 7.20.7 + '@changesets/config': 2.3.0 '@changesets/get-version-range-type': 0.3.2 - '@changesets/git': 1.5.0 - '@changesets/types': 5.2.0 + '@changesets/git': 2.0.0 + '@changesets/types': 5.2.1 '@manypkg/get-packages': 1.1.3 detect-indent: 6.1.0 fs-extra: 7.0.1 lodash.startcase: 4.4.0 outdent: 0.5.0 - prettier: 2.7.1 + prettier: 2.8.2 resolve-from: 5.0.0 semver: 5.7.1 dev: true - /@changesets/assemble-release-plan/5.2.2: - resolution: {integrity: sha512-B1qxErQd85AeZgZFZw2bDKyOfdXHhG+X5S+W3Da2yCem8l/pRy4G/S7iOpEcMwg6lH8q2ZhgbZZwZ817D+aLuQ==} + /@changesets/assemble-release-plan/5.2.3: + resolution: {integrity: sha512-g7EVZCmnWz3zMBAdrcKhid4hkHT+Ft1n0mLussFMcB1dE2zCuwcvGoy9ec3yOgPGF4hoMtgHaMIk3T3TBdvU9g==} dependencies: - '@babel/runtime': 7.19.4 + '@babel/runtime': 7.20.7 '@changesets/errors': 0.1.4 - '@changesets/get-dependents-graph': 1.3.4 - '@changesets/types': 5.2.0 + '@changesets/get-dependents-graph': 1.3.5 + '@changesets/types': 5.2.1 '@manypkg/get-packages': 1.1.3 semver: 5.7.1 dev: true - /@changesets/changelog-git/0.1.13: - resolution: {integrity: sha512-zvJ50Q+EUALzeawAxax6nF2WIcSsC5PwbuLeWkckS8ulWnuPYx8Fn/Sjd3rF46OzeKA8t30loYYV6TIzp4DIdg==} + /@changesets/changelog-git/0.1.14: + resolution: {integrity: sha512-+vRfnKtXVWsDDxGctOfzJsPhaCdXRYoe+KyWYoq5X/GqoISREiat0l3L8B0a453B2B4dfHGcZaGyowHbp9BSaA==} dependencies: - '@changesets/types': 5.2.0 + '@changesets/types': 5.2.1 dev: true - /@changesets/cli/2.25.0: - resolution: {integrity: sha512-Svu5KD2enurVHGEEzCRlaojrHjVYgF9srmMP9VQSy9c1TspX6C9lDPpulsSNIjYY9BuU/oiWpjBgR7RI9eQiAA==} + /@changesets/cli/2.26.0: + resolution: {integrity: sha512-0cbTiDms+ICTVtEwAFLNW0jBNex9f5+fFv3I771nBvdnV/mOjd1QJ4+f8KtVSOrwD9SJkk9xbDkWFb0oXd8d1Q==} hasBin: true dependencies: - '@babel/runtime': 7.19.4 - '@changesets/apply-release-plan': 6.1.1 - '@changesets/assemble-release-plan': 5.2.2 - '@changesets/changelog-git': 0.1.13 - '@changesets/config': 2.2.0 + '@babel/runtime': 7.20.7 + '@changesets/apply-release-plan': 6.1.3 + '@changesets/assemble-release-plan': 5.2.3 + '@changesets/changelog-git': 0.1.14 + '@changesets/config': 2.3.0 '@changesets/errors': 0.1.4 - '@changesets/get-dependents-graph': 1.3.4 - '@changesets/get-release-plan': 3.0.15 - '@changesets/git': 1.5.0 + '@changesets/get-dependents-graph': 1.3.5 + '@changesets/get-release-plan': 3.0.16 + '@changesets/git': 2.0.0 '@changesets/logger': 0.0.5 - '@changesets/pre': 1.0.13 - '@changesets/read': 0.5.8 - '@changesets/types': 5.2.0 - '@changesets/write': 0.2.1 + '@changesets/pre': 1.0.14 + '@changesets/read': 0.5.9 + '@changesets/types': 5.2.1 + '@changesets/write': 0.2.3 '@manypkg/get-packages': 1.1.3 '@types/is-ci': 3.0.0 '@types/semver': 6.2.3 @@ -353,13 +128,13 @@ packages: tty-table: 4.1.6 dev: true - /@changesets/config/2.2.0: - resolution: {integrity: sha512-GGaokp3nm5FEDk/Fv2PCRcQCOxGKKPRZ7prcMqxEr7VSsG75MnChQE8plaW1k6V8L2bJE+jZWiRm19LbnproOw==} + /@changesets/config/2.3.0: + resolution: {integrity: sha512-EgP/px6mhCx8QeaMAvWtRrgyxW08k/Bx2tpGT+M84jEdX37v3VKfh4Cz1BkwrYKuMV2HZKeHOh8sHvja/HcXfQ==} dependencies: '@changesets/errors': 0.1.4 - '@changesets/get-dependents-graph': 1.3.4 + '@changesets/get-dependents-graph': 1.3.5 '@changesets/logger': 0.0.5 - '@changesets/types': 5.2.0 + '@changesets/types': 5.2.1 '@manypkg/get-packages': 1.1.3 fs-extra: 7.0.1 micromatch: 4.0.5 @@ -371,25 +146,25 @@ packages: extendable-error: 0.1.7 dev: true - /@changesets/get-dependents-graph/1.3.4: - resolution: {integrity: sha512-+C4AOrrFY146ydrgKOo5vTZfj7vetNu1tWshOID+UjPUU9afYGDXI8yLnAeib1ffeBXV3TuGVcyphKpJ3cKe+A==} + /@changesets/get-dependents-graph/1.3.5: + resolution: {integrity: sha512-w1eEvnWlbVDIY8mWXqWuYE9oKhvIaBhzqzo4ITSJY9hgoqQ3RoBqwlcAzg11qHxv/b8ReDWnMrpjpKrW6m1ZTA==} dependencies: - '@changesets/types': 5.2.0 + '@changesets/types': 5.2.1 '@manypkg/get-packages': 1.1.3 chalk: 2.4.2 fs-extra: 7.0.1 semver: 5.7.1 dev: true - /@changesets/get-release-plan/3.0.15: - resolution: {integrity: sha512-W1tFwxE178/en+zSj/Nqbc3mvz88mcdqUMJhRzN1jDYqN3QI4ifVaRF9mcWUU+KI0gyYEtYR65tour690PqTcA==} + /@changesets/get-release-plan/3.0.16: + resolution: {integrity: sha512-OpP9QILpBp1bY2YNIKFzwigKh7Qe9KizRsZomzLe6pK8IUo8onkAAVUD8+JRKSr8R7d4+JRuQrfSSNlEwKyPYg==} dependencies: - '@babel/runtime': 7.19.4 - '@changesets/assemble-release-plan': 5.2.2 - '@changesets/config': 2.2.0 - '@changesets/pre': 1.0.13 - '@changesets/read': 0.5.8 - '@changesets/types': 5.2.0 + '@babel/runtime': 7.20.7 + '@changesets/assemble-release-plan': 5.2.3 + '@changesets/config': 2.3.0 + '@changesets/pre': 1.0.14 + '@changesets/read': 0.5.9 + '@changesets/types': 5.2.1 '@manypkg/get-packages': 1.1.3 dev: true @@ -397,14 +172,15 @@ packages: resolution: {integrity: sha512-SVqwYs5pULYjYT4op21F2pVbcrca4qA/bAA3FmFXKMN7Y+HcO8sbZUTx3TAy2VXulP2FACd1aC7f2nTuqSPbqg==} dev: true - /@changesets/git/1.5.0: - resolution: {integrity: sha512-Xo8AT2G7rQJSwV87c8PwMm6BAc98BnufRMsML7m7Iw8Or18WFvFmxqG5aOL5PBvhgq9KrKvaeIBNIymracSuHg==} + /@changesets/git/2.0.0: + resolution: {integrity: sha512-enUVEWbiqUTxqSnmesyJGWfzd51PY4H7mH9yUw0hPVpZBJ6tQZFMU3F3mT/t9OJ/GjyiM4770i+sehAn6ymx6A==} dependencies: - '@babel/runtime': 7.19.4 + '@babel/runtime': 7.20.7 '@changesets/errors': 0.1.4 - '@changesets/types': 5.2.0 + '@changesets/types': 5.2.1 '@manypkg/get-packages': 1.1.3 is-subdir: 1.2.0 + micromatch: 4.0.5 spawndamnit: 2.0.0 dev: true @@ -414,31 +190,31 @@ packages: chalk: 2.4.2 dev: true - /@changesets/parse/0.3.15: - resolution: {integrity: sha512-3eDVqVuBtp63i+BxEWHPFj2P1s3syk0PTrk2d94W9JD30iG+OER0Y6n65TeLlY8T2yB9Fvj6Ev5Gg0+cKe/ZUA==} + /@changesets/parse/0.3.16: + resolution: {integrity: sha512-127JKNd167ayAuBjUggZBkmDS5fIKsthnr9jr6bdnuUljroiERW7FBTDNnNVyJ4l69PzR57pk6mXQdtJyBCJKg==} dependencies: - '@changesets/types': 5.2.0 + '@changesets/types': 5.2.1 js-yaml: 3.14.1 dev: true - /@changesets/pre/1.0.13: - resolution: {integrity: sha512-jrZc766+kGZHDukjKhpBXhBJjVQMied4Fu076y9guY1D3H622NOw8AQaLV3oQsDtKBTrT2AUFjt9Z2Y9Qx+GfA==} + /@changesets/pre/1.0.14: + resolution: {integrity: sha512-dTsHmxQWEQekHYHbg+M1mDVYFvegDh9j/kySNuDKdylwfMEevTeDouR7IfHNyVodxZXu17sXoJuf2D0vi55FHQ==} dependencies: - '@babel/runtime': 7.19.4 + '@babel/runtime': 7.20.7 '@changesets/errors': 0.1.4 - '@changesets/types': 5.2.0 + '@changesets/types': 5.2.1 '@manypkg/get-packages': 1.1.3 fs-extra: 7.0.1 dev: true - /@changesets/read/0.5.8: - resolution: {integrity: sha512-eYaNfxemgX7f7ELC58e7yqQICW5FB7V+bd1lKt7g57mxUrTveYME+JPaBPpYx02nP53XI6CQp6YxnR9NfmFPKw==} + /@changesets/read/0.5.9: + resolution: {integrity: sha512-T8BJ6JS6j1gfO1HFq50kU3qawYxa4NTbI/ASNVVCBTsKquy2HYwM9r7ZnzkiMe8IEObAJtUVGSrePCOxAK2haQ==} dependencies: - '@babel/runtime': 7.19.4 - '@changesets/git': 1.5.0 + '@babel/runtime': 7.20.7 + '@changesets/git': 2.0.0 '@changesets/logger': 0.0.5 - '@changesets/parse': 0.3.15 - '@changesets/types': 5.2.0 + '@changesets/parse': 0.3.16 + '@changesets/types': 5.2.1 chalk: 2.4.2 fs-extra: 7.0.1 p-filter: 2.1.0 @@ -448,29 +224,29 @@ packages: resolution: {integrity: sha512-LDQvVDv5Kb50ny2s25Fhm3d9QSZimsoUGBsUioj6MC3qbMUCuC8GPIvk/M6IvXx3lYhAs0lwWUQLb+VIEUCECw==} dev: true - /@changesets/types/5.2.0: - resolution: {integrity: sha512-km/66KOqJC+eicZXsm2oq8A8bVTSpkZJ60iPV/Nl5Z5c7p9kk8xxh6XGRTlnludHldxOOfudhnDN2qPxtHmXzA==} + /@changesets/types/5.2.1: + resolution: {integrity: sha512-myLfHbVOqaq9UtUKqR/nZA/OY7xFjQMdfgfqeZIBK4d0hA6pgxArvdv8M+6NUzzBsjWLOtvApv8YHr4qM+Kpfg==} dev: true - /@changesets/write/0.2.1: - resolution: {integrity: sha512-KUd49nt2fnYdGixIqTi1yVE1nAoZYUMdtB3jBfp77IMqjZ65hrmZE5HdccDlTeClZN0420ffpnfET3zzeY8pdw==} + /@changesets/write/0.2.3: + resolution: {integrity: sha512-Dbamr7AIMvslKnNYsLFafaVORx4H0pvCA2MHqgtNCySMe1blImEyAEOzDmcgKAkgz4+uwoLz7demIrX+JBr/Xw==} dependencies: - '@babel/runtime': 7.19.4 - '@changesets/types': 5.2.0 + '@babel/runtime': 7.20.7 + '@changesets/types': 5.2.1 fs-extra: 7.0.1 human-id: 1.0.2 - prettier: 2.7.1 + prettier: 2.8.2 dev: true - /@eslint/eslintrc/1.3.3: - resolution: {integrity: sha512-uj3pT6Mg+3t39fvLrj8iuCIJ38zKO9FpGtJ4BBJebJhEwjoT+KLVNCcHT5QC9NGRIEi7fZ0ZR8YRb884auB4Lg==} + /@eslint/eslintrc/1.4.1: + resolution: {integrity: sha512-XXrH9Uarn0stsyldqDYq8r++mROmWRI1xKMXa640Bb//SY1+ECYX6VzT6Lcx5frD0V30XieqJ0oX9I2Xj5aoMA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dependencies: ajv: 6.12.6 debug: 4.3.4 - espree: 9.4.0 - globals: 13.17.0 - ignore: 5.2.0 + espree: 9.4.1 + globals: 13.19.0 + ignore: 5.2.4 import-fresh: 3.3.0 js-yaml: 4.1.0 minimatch: 3.1.2 @@ -479,28 +255,30 @@ packages: - supports-color dev: true - /@finsweet/eslint-config/1.1.5_rzhhkabrluhdzyesbuurigqf3u: - resolution: {integrity: sha512-ukW0qLMhup26nCjLwLKv+b6p4OjJ682zxUkCcqwzTvz1OoVqOphFOdFlnfcFUbZDQhPyv5N8LN5U+vwP6ejvow==} + /@finsweet/eslint-config/2.0.0_puoiliissvzurc6i5kvdxsghbu: + resolution: {integrity: sha512-8zy0E+3nOvdy0v6PSum3uWscWrhQJHp+jlA13wm9S3xhT39TzDKENVmxBZdB3OiY+myg+HSdPTL/XkUUP8KI6A==} peerDependencies: - '@typescript-eslint/eslint-plugin': ^5.27.0 - '@typescript-eslint/parser': ^5.27.0 - eslint: ^8.16.0 + '@typescript-eslint/eslint-plugin': ^5.46.1 + '@typescript-eslint/parser': ^5.46.1 + eslint: ^8.29.0 eslint-config-prettier: ^8.5.0 - eslint-plugin-prettier: ^4.0.0 - prettier: ^2.6.2 - typescript: ^4.7.2 - dependencies: - '@typescript-eslint/eslint-plugin': 5.40.1_ukgdydjtebaxmxfqp5v5ulh64y - '@typescript-eslint/parser': 5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q - eslint: 8.25.0 - eslint-config-prettier: 8.5.0_eslint@8.25.0 - eslint-plugin-prettier: 4.2.1_hvbqyfstm4urdpm6ffpwfka4e4 - prettier: 2.7.1 - typescript: 4.8.4 - dev: true - - /@humanwhocodes/config-array/0.10.7: - resolution: {integrity: sha512-MDl6D6sBsaV452/QSdX+4CXIjZhIcI0PELsxUjk4U828yd58vk3bTIvk/6w5FY+4hIy9sLW0sfrV7K7Kc++j/w==} + eslint-plugin-prettier: ^4.2.1 + eslint-plugin-simple-import-sort: ^8.0.0 + prettier: ^2.8.1 + typescript: ^4.9.4 + dependencies: + '@typescript-eslint/eslint-plugin': 5.48.1_3jon24igvnqaqexgwtxk6nkpse + '@typescript-eslint/parser': 5.48.1_iukboom6ndih5an6iafl45j2fe + eslint: 8.31.0 + eslint-config-prettier: 8.6.0_eslint@8.31.0 + eslint-plugin-prettier: 4.2.1_iu5s7nk6dw7o3tajefwfiqfmge + eslint-plugin-simple-import-sort: 8.0.0_eslint@8.31.0 + prettier: 2.8.2 + typescript: 4.9.4 + dev: true + + /@humanwhocodes/config-array/0.11.8: + resolution: {integrity: sha512-UybHIJzJnR5Qc/MsD9Kr+RpO2h+/P1GhOwdiLPXK5TWk5sgTdu88bTD9UP+CKbPPh5Rni1u0GjAdYQLemG8g+g==} engines: {node: '>=10.10.0'} dependencies: '@humanwhocodes/object-schema': 1.2.1 @@ -519,48 +297,10 @@ packages: resolution: {integrity: sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==} dev: true - /@jridgewell/gen-mapping/0.1.1: - resolution: {integrity: sha512-sQXCasFk+U8lWYEe66WxRDOE9PjVz4vSM51fTu3Hw+ClTpUSQb718772vH3pyS5pShp6lvQM7SxgIDXXXmOX7w==} - engines: {node: '>=6.0.0'} - dependencies: - '@jridgewell/set-array': 1.1.2 - '@jridgewell/sourcemap-codec': 1.4.14 - dev: true - - /@jridgewell/gen-mapping/0.3.2: - resolution: {integrity: sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A==} - engines: {node: '>=6.0.0'} - dependencies: - '@jridgewell/set-array': 1.1.2 - '@jridgewell/sourcemap-codec': 1.4.14 - '@jridgewell/trace-mapping': 0.3.17 - dev: true - - /@jridgewell/resolve-uri/3.1.0: - resolution: {integrity: sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==} - engines: {node: '>=6.0.0'} - dev: true - - /@jridgewell/set-array/1.1.2: - resolution: {integrity: sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==} - engines: {node: '>=6.0.0'} - dev: true - - /@jridgewell/sourcemap-codec/1.4.14: - resolution: {integrity: sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==} - dev: true - - /@jridgewell/trace-mapping/0.3.17: - resolution: {integrity: sha512-MCNzAp77qzKca9+W/+I0+sEpaUnZoeasnghNeVc41VZCEKaCH73Vq3BZZ/SzWIgrqE4H4ceI+p+b6C0mHf9T4g==} - dependencies: - '@jridgewell/resolve-uri': 3.1.0 - '@jridgewell/sourcemap-codec': 1.4.14 - dev: true - /@manypkg/find-root/1.1.0: resolution: {integrity: sha512-mki5uBvhHzO8kYYix/WRy2WX8S3B5wdVSc9D6KcU5lQNglP2yt58/VfLuAK49glRXChosY8ap2oJ1qgma3GUVA==} dependencies: - '@babel/runtime': 7.19.4 + '@babel/runtime': 7.20.7 '@types/node': 12.20.55 find-up: 4.1.0 fs-extra: 8.1.0 @@ -569,7 +309,7 @@ packages: /@manypkg/get-packages/1.1.3: resolution: {integrity: sha512-fo+QhuU3qE/2TQMQmbVMqaQ6EWbMhi4ABWP+O4AM1NqPBuy0OrApV5LO6BrrgnhtAHS2NH6RrVk9OL181tTi8A==} dependencies: - '@babel/runtime': 7.19.4 + '@babel/runtime': 7.20.7 '@changesets/types': 4.1.0 '@manypkg/find-root': 1.1.0 fs-extra: 8.1.0 @@ -595,31 +335,13 @@ packages: engines: {node: '>= 8'} dependencies: '@nodelib/fs.scandir': 2.1.5 - fastq: 1.13.0 - dev: true - - /@trivago/prettier-plugin-sort-imports/4.0.0_prettier@2.7.1: - resolution: {integrity: sha512-Tyuk5ZY4a0e2MNFLdluQO9F6d1awFQYXVVujEPFfvKPPXz8DADNHzz73NMhwCSXGSuGGZcA/rKOyZBrxVNMxaA==} - peerDependencies: - '@vue/compiler-sfc': 3.x - prettier: 2.x - dependencies: - '@babel/core': 7.17.8 - '@babel/generator': 7.17.7 - '@babel/parser': 7.18.9 - '@babel/traverse': 7.17.3 - '@babel/types': 7.17.0 - javascript-natural-sort: 0.7.1 - lodash: 4.17.21 - prettier: 2.7.1 - transitivePeerDependencies: - - supports-color + fastq: 1.15.0 dev: true /@types/is-ci/3.0.0: resolution: {integrity: sha512-Q0Op0hdWbYd1iahB+IFNQcWXFq4O0Q5MwQP7uN0souuQ4rPg1vEYcnIOfr1gY+M+6rc8FGoRaBO1mOOvL29sEQ==} dependencies: - ci-info: 3.5.0 + ci-info: 3.7.1 dev: true /@types/json-schema/7.0.11: @@ -642,12 +364,12 @@ packages: resolution: {integrity: sha512-KQf+QAMWKMrtBMsB8/24w53tEsxllMj6TuA80TT/5igJalLI/zm0L3oXRbIAl4Ohfc85gyHX/jhMwsVkmhLU4A==} dev: true - /@types/semver/7.3.12: - resolution: {integrity: sha512-WwA1MW0++RfXmCr12xeYOOC5baSC9mSb0ZqCquFzKhcoF4TvHu5MKOuXsncgZcpVFhB1pXd5hZmM0ryAoCp12A==} + /@types/semver/7.3.13: + resolution: {integrity: sha512-21cFJr9z3g5dW8B0CVI9g2O9beqaThGQ6ZFBqHfwhzLDKUxaqTIy3vnfah/UPkfOiF2pLq+tGz+W8RyCskuslw==} dev: true - /@typescript-eslint/eslint-plugin/5.40.1_ukgdydjtebaxmxfqp5v5ulh64y: - resolution: {integrity: sha512-FsWboKkWdytGiXT5O1/R9j37YgcjO8MKHSUmWnIEjVaz0krHkplPnYi7mwdb+5+cs0toFNQb0HIrN7zONdIEWg==} + /@typescript-eslint/eslint-plugin/5.48.1_3jon24igvnqaqexgwtxk6nkpse: + resolution: {integrity: sha512-9nY5K1Rp2ppmpb9s9S2aBiF3xo5uExCehMDmYmmFqqyxgenbHJ3qbarcLt4ITgaD6r/2ypdlcFRdcuVPnks+fQ==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: '@typescript-eslint/parser': ^5.0.0 @@ -657,23 +379,24 @@ packages: typescript: optional: true dependencies: - '@typescript-eslint/parser': 5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q - '@typescript-eslint/scope-manager': 5.40.1 - '@typescript-eslint/type-utils': 5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q - '@typescript-eslint/utils': 5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q + '@typescript-eslint/parser': 5.48.1_iukboom6ndih5an6iafl45j2fe + '@typescript-eslint/scope-manager': 5.48.1 + '@typescript-eslint/type-utils': 5.48.1_iukboom6ndih5an6iafl45j2fe + '@typescript-eslint/utils': 5.48.1_iukboom6ndih5an6iafl45j2fe debug: 4.3.4 - eslint: 8.25.0 - ignore: 5.2.0 + eslint: 8.31.0 + ignore: 5.2.4 + natural-compare-lite: 1.4.0 regexpp: 3.2.0 semver: 7.3.8 - tsutils: 3.21.0_typescript@4.8.4 - typescript: 4.8.4 + tsutils: 3.21.0_typescript@4.9.4 + typescript: 4.9.4 transitivePeerDependencies: - supports-color dev: true - /@typescript-eslint/parser/5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q: - resolution: {integrity: sha512-IK6x55va5w4YvXd4b3VrXQPldV9vQTxi5ov+g4pMANsXPTXOcfjx08CRR1Dfrcc51syPtXHF5bgLlMHYFrvQtg==} + /@typescript-eslint/parser/5.48.1_iukboom6ndih5an6iafl45j2fe: + resolution: {integrity: sha512-4yg+FJR/V1M9Xoq56SF9Iygqm+r5LMXvheo6DQ7/yUWynQ4YfCRnsKuRgqH4EQ5Ya76rVwlEpw4Xu+TgWQUcdA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 @@ -682,26 +405,26 @@ packages: typescript: optional: true dependencies: - '@typescript-eslint/scope-manager': 5.40.1 - '@typescript-eslint/types': 5.40.1 - '@typescript-eslint/typescript-estree': 5.40.1_typescript@4.8.4 + '@typescript-eslint/scope-manager': 5.48.1 + '@typescript-eslint/types': 5.48.1 + '@typescript-eslint/typescript-estree': 5.48.1_typescript@4.9.4 debug: 4.3.4 - eslint: 8.25.0 - typescript: 4.8.4 + eslint: 8.31.0 + typescript: 4.9.4 transitivePeerDependencies: - supports-color dev: true - /@typescript-eslint/scope-manager/5.40.1: - resolution: {integrity: sha512-jkn4xsJiUQucI16OLCXrLRXDZ3afKhOIqXs4R3O+M00hdQLKR58WuyXPZZjhKLFCEP2g+TXdBRtLQ33UfAdRUg==} + /@typescript-eslint/scope-manager/5.48.1: + resolution: {integrity: sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dependencies: - '@typescript-eslint/types': 5.40.1 - '@typescript-eslint/visitor-keys': 5.40.1 + '@typescript-eslint/types': 5.48.1 + '@typescript-eslint/visitor-keys': 5.48.1 dev: true - /@typescript-eslint/type-utils/5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q: - resolution: {integrity: sha512-DLAs+AHQOe6n5LRraXiv27IYPhleF0ldEmx6yBqBgBLaNRKTkffhV1RPsjoJBhVup2zHxfaRtan8/YRBgYhU9Q==} + /@typescript-eslint/type-utils/5.48.1_iukboom6ndih5an6iafl45j2fe: + resolution: {integrity: sha512-Hyr8HU8Alcuva1ppmqSYtM/Gp0q4JOp1F+/JH5D1IZm/bUBrV0edoewQZiEc1r6I8L4JL21broddxK8HAcZiqQ==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: eslint: '*' @@ -710,23 +433,23 @@ packages: typescript: optional: true dependencies: - '@typescript-eslint/typescript-estree': 5.40.1_typescript@4.8.4 - '@typescript-eslint/utils': 5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q + '@typescript-eslint/typescript-estree': 5.48.1_typescript@4.9.4 + '@typescript-eslint/utils': 5.48.1_iukboom6ndih5an6iafl45j2fe debug: 4.3.4 - eslint: 8.25.0 - tsutils: 3.21.0_typescript@4.8.4 - typescript: 4.8.4 + eslint: 8.31.0 + tsutils: 3.21.0_typescript@4.9.4 + typescript: 4.9.4 transitivePeerDependencies: - supports-color dev: true - /@typescript-eslint/types/5.40.1: - resolution: {integrity: sha512-Icg9kiuVJSwdzSQvtdGspOlWNjVDnF3qVIKXdJ103o36yRprdl3Ge5cABQx+csx960nuMF21v8qvO31v9t3OHw==} + /@typescript-eslint/types/5.48.1: + resolution: {integrity: sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dev: true - /@typescript-eslint/typescript-estree/5.40.1_typescript@4.8.4: - resolution: {integrity: sha512-5QTP/nW5+60jBcEPfXy/EZL01qrl9GZtbgDZtDPlfW5zj/zjNrdI2B5zMUHmOsfvOr2cWqwVdWjobCiHcedmQA==} + /@typescript-eslint/typescript-estree/5.48.1_typescript@4.9.4: + resolution: {integrity: sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: typescript: '*' @@ -734,56 +457,56 @@ packages: typescript: optional: true dependencies: - '@typescript-eslint/types': 5.40.1 - '@typescript-eslint/visitor-keys': 5.40.1 + '@typescript-eslint/types': 5.48.1 + '@typescript-eslint/visitor-keys': 5.48.1 debug: 4.3.4 globby: 11.1.0 is-glob: 4.0.3 semver: 7.3.8 - tsutils: 3.21.0_typescript@4.8.4 - typescript: 4.8.4 + tsutils: 3.21.0_typescript@4.9.4 + typescript: 4.9.4 transitivePeerDependencies: - supports-color dev: true - /@typescript-eslint/utils/5.40.1_z4bbprzjrhnsfa24uvmcbu7f5q: - resolution: {integrity: sha512-a2TAVScoX9fjryNrW6BZRnreDUszxqm9eQ9Esv8n5nXApMW0zeANUYlwh/DED04SC/ifuBvXgZpIK5xeJHQ3aw==} + /@typescript-eslint/utils/5.48.1_iukboom6ndih5an6iafl45j2fe: + resolution: {integrity: sha512-SmQuSrCGUOdmGMwivW14Z0Lj8dxG1mOFZ7soeJ0TQZEJcs3n5Ndgkg0A4bcMFzBELqLJ6GTHnEU+iIoaD6hFGA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 dependencies: '@types/json-schema': 7.0.11 - '@types/semver': 7.3.12 - '@typescript-eslint/scope-manager': 5.40.1 - '@typescript-eslint/types': 5.40.1 - '@typescript-eslint/typescript-estree': 5.40.1_typescript@4.8.4 - eslint: 8.25.0 + '@types/semver': 7.3.13 + '@typescript-eslint/scope-manager': 5.48.1 + '@typescript-eslint/types': 5.48.1 + '@typescript-eslint/typescript-estree': 5.48.1_typescript@4.9.4 + eslint: 8.31.0 eslint-scope: 5.1.1 - eslint-utils: 3.0.0_eslint@8.25.0 + eslint-utils: 3.0.0_eslint@8.31.0 semver: 7.3.8 transitivePeerDependencies: - supports-color - typescript dev: true - /@typescript-eslint/visitor-keys/5.40.1: - resolution: {integrity: sha512-A2DGmeZ+FMja0geX5rww+DpvILpwo1OsiQs0M+joPWJYsiEFBLsH0y1oFymPNul6Z5okSmHpP4ivkc2N0Cgfkw==} + /@typescript-eslint/visitor-keys/5.48.1: + resolution: {integrity: sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dependencies: - '@typescript-eslint/types': 5.40.1 + '@typescript-eslint/types': 5.48.1 eslint-visitor-keys: 3.3.0 dev: true - /acorn-jsx/5.3.2_acorn@8.8.0: + /acorn-jsx/5.3.2_acorn@8.8.1: resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==} peerDependencies: acorn: ^6.0.0 || ^7.0.0 || ^8.0.0 dependencies: - acorn: 8.8.0 + acorn: 8.8.1 dev: true - /acorn/8.8.0: - resolution: {integrity: sha512-QOxyigPVrpZ2GXT+PFyZTl6TtOFc5egxHIP9IlQ+RbupQuX4RkT/Bee4/kQuC02Xkzg84JcT7oLYtDIQxp+v7w==} + /acorn/8.8.1: + resolution: {integrity: sha512-7zFpHzhnqYKrkYdUjF1HI1bzd0VygEGX8lFk4k5zVMqHEoES+P+7TKI+EvLO9WVMJ8eekdO0aDEK044xTXwPPA==} engines: {node: '>=0.4.0'} hasBin: true dev: true @@ -836,13 +559,13 @@ packages: engines: {node: '>=8'} dev: true - /array.prototype.flat/1.3.0: - resolution: {integrity: sha512-12IUEkHsAhA4DY5s0FPgNXIdc8VRSqD9Zp78a5au9abH/SOBrsp082JOWFNTjkMozh8mqcdiKuaLGhPeYztxSw==} + /array.prototype.flat/1.3.1: + resolution: {integrity: sha512-roTU0KWIOmJ4DRLmwKd19Otg0/mT3qPNt0Qb3GWW8iObuZXxrjB/pzn0R3hqpRSWg4HCwqx+0vwOnWnvlOyeIA==} engines: {node: '>= 0.4'} dependencies: call-bind: 1.0.2 define-properties: 1.1.4 - es-abstract: 1.20.4 + es-abstract: 1.21.1 es-shim-unscopables: 1.0.0 dev: true @@ -851,6 +574,11 @@ packages: engines: {node: '>=0.10.0'} dev: true + /available-typed-arrays/1.0.5: + resolution: {integrity: sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==} + engines: {node: '>= 0.4'} + dev: true + /balanced-match/1.0.2: resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==} dev: true @@ -882,17 +610,6 @@ packages: wcwidth: 1.0.1 dev: true - /browserslist/4.21.4: - resolution: {integrity: sha512-CBHJJdDmgjl3daYjN5Cp5kbTf1mUhZoS+beLklHIvkOWscs83YAhLlF3Wsh/lciQYAcbBJgTOD44VtG31ZM4Hw==} - engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} - hasBin: true - dependencies: - caniuse-lite: 1.0.30001421 - electron-to-chromium: 1.4.284 - node-releases: 2.0.6 - update-browserslist-db: 1.0.10_browserslist@4.21.4 - dev: true - /call-bind/1.0.2: resolution: {integrity: sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==} dependencies: @@ -919,10 +636,6 @@ packages: engines: {node: '>=6'} dev: true - /caniuse-lite/1.0.30001421: - resolution: {integrity: sha512-Sw4eLbgUJAEhjLs1Fa+mk45sidp1wRn5y6GtDpHGBaNJ9OCDJaVh2tIaWWUnGfuXfKf1JCBaIarak3FkVAvEeA==} - dev: true - /chalk/2.4.2: resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==} engines: {node: '>=4'} @@ -944,8 +657,9 @@ packages: resolution: {integrity: sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==} dev: true - /ci-info/3.5.0: - resolution: {integrity: sha512-yH4RezKOGlOhxkmhbeNuC4eYZKAUsEaGtBuBzDDP1eFUKiccDWzBABxBfOx31IDwDIXMTxWuwAxUGModvkbuVw==} + /ci-info/3.7.1: + resolution: {integrity: sha512-4jYS4MOAaCIStSRwiuxc4B8MYhIe676yO1sYGzARnjXkWpmzZMMYxY6zu8WYWDhSuth5zhrQ1rhNSibyyvv4/w==} + engines: {node: '>=8'} dev: true /cliui/6.0.0: @@ -995,10 +709,6 @@ packages: resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=} dev: true - /convert-source-map/1.9.0: - resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==} - dev: true - /cross-spawn/5.1.0: resolution: {integrity: sha512-pTgQJ5KC0d2hcY8eyL1IzlBPYjTkyH72XRZPnLyKus2mBfNjQs3klqbJU2VILqZryAZUt9JOb3h/mWMy23/f5A==} dependencies: @@ -1050,8 +760,8 @@ packages: ms: 2.1.2 dev: true - /decamelize-keys/1.1.0: - resolution: {integrity: sha512-ocLWuYzRPoS9bfiSdDd3cxvrzovVMZnRDVEzAs+hWIVXGDbHxWMECij2OBuyB/An0FFW/nLuq6Kv1i/YC5Qfzg==} + /decamelize-keys/1.1.1: + resolution: {integrity: sha512-WiPxgEirIV0/eIOMcnFBA3/IJZAZqKnwAwWyvvdi4lsr1WCN22nhdf/3db3DoZcUjTV2SqfzIwNyp6y2xs3nmg==} engines: {node: '>=0.10.0'} dependencies: decamelize: 1.2.0 @@ -1100,10 +810,6 @@ packages: esutils: 2.0.3 dev: true - /electron-to-chromium/1.4.284: - resolution: {integrity: sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA==} - dev: true - /emoji-regex/8.0.0: resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==} dev: true @@ -1121,34 +827,52 @@ packages: is-arrayish: 0.2.1 dev: true - /es-abstract/1.20.4: - resolution: {integrity: sha512-0UtvRN79eMe2L+UNEF1BwRe364sj/DXhQ/k5FmivgoSdpM90b8Jc0mDzKMGo7QS0BVbOP/bTwBKNnDc9rNzaPA==} + /es-abstract/1.21.1: + resolution: {integrity: sha512-QudMsPOz86xYz/1dG1OuGBKOELjCh99IIWHLzy5znUB6j8xG2yMA7bfTV86VSqKF+Y/H08vQPR+9jyXpuC6hfg==} engines: {node: '>= 0.4'} dependencies: + available-typed-arrays: 1.0.5 call-bind: 1.0.2 + es-set-tostringtag: 2.0.1 es-to-primitive: 1.2.1 function-bind: 1.1.1 function.prototype.name: 1.1.5 get-intrinsic: 1.1.3 get-symbol-description: 1.0.0 + globalthis: 1.0.3 + gopd: 1.0.1 has: 1.0.3 has-property-descriptors: 1.0.0 + has-proto: 1.0.1 has-symbols: 1.0.3 - internal-slot: 1.0.3 + internal-slot: 1.0.4 + is-array-buffer: 3.0.1 is-callable: 1.2.7 is-negative-zero: 2.0.2 is-regex: 1.1.4 is-shared-array-buffer: 1.0.2 is-string: 1.0.7 + is-typed-array: 1.1.10 is-weakref: 1.0.2 object-inspect: 1.12.2 object-keys: 1.1.1 object.assign: 4.1.4 regexp.prototype.flags: 1.4.3 safe-regex-test: 1.0.0 - string.prototype.trimend: 1.0.5 - string.prototype.trimstart: 1.0.5 + string.prototype.trimend: 1.0.6 + string.prototype.trimstart: 1.0.6 + typed-array-length: 1.0.4 unbox-primitive: 1.0.2 + which-typed-array: 1.1.9 + dev: true + + /es-set-tostringtag/2.0.1: + resolution: {integrity: sha512-g3OMbtlwY3QewlqAiMLI47KywjWZoEytKr8pf6iTC8uJq5bIAH52Z9pnQ8pVL6whrCto53JZDuUIsifGeLorTg==} + engines: {node: '>= 0.4'} + dependencies: + get-intrinsic: 1.1.3 + has: 1.0.3 + has-tostringtag: 1.0.0 dev: true /es-shim-unscopables/1.0.0: @@ -1181,16 +905,16 @@ packages: engines: {node: '>=10'} dev: true - /eslint-config-prettier/8.5.0_eslint@8.25.0: - resolution: {integrity: sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==} + /eslint-config-prettier/8.6.0_eslint@8.31.0: + resolution: {integrity: sha512-bAF0eLpLVqP5oEVUFKpMA+NnRFICwn9X8B5jrR9FcqnYBuPbqWEjTEspPWMj5ye6czoSLDweCzSo3Ko7gGrZaA==} hasBin: true peerDependencies: eslint: '>=7.0.0' dependencies: - eslint: 8.25.0 + eslint: 8.31.0 dev: true - /eslint-plugin-prettier/4.2.1_hvbqyfstm4urdpm6ffpwfka4e4: + /eslint-plugin-prettier/4.2.1_iu5s7nk6dw7o3tajefwfiqfmge: resolution: {integrity: sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ==} engines: {node: '>=12.0.0'} peerDependencies: @@ -1201,12 +925,20 @@ packages: eslint-config-prettier: optional: true dependencies: - eslint: 8.25.0 - eslint-config-prettier: 8.5.0_eslint@8.25.0 - prettier: 2.7.1 + eslint: 8.31.0 + eslint-config-prettier: 8.6.0_eslint@8.31.0 + prettier: 2.8.2 prettier-linter-helpers: 1.0.0 dev: true + /eslint-plugin-simple-import-sort/8.0.0_eslint@8.31.0: + resolution: {integrity: sha512-bXgJQ+lqhtQBCuWY/FUWdB27j4+lqcvXv5rUARkzbeWLwea+S5eBZEQrhnO+WgX3ZoJHVj0cn943iyXwByHHQw==} + peerDependencies: + eslint: '>=5.0.0' + dependencies: + eslint: 8.31.0 + dev: true + /eslint-scope/5.1.1: resolution: {integrity: sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==} engines: {node: '>=8.0.0'} @@ -1223,13 +955,13 @@ packages: estraverse: 5.3.0 dev: true - /eslint-utils/3.0.0_eslint@8.25.0: + /eslint-utils/3.0.0_eslint@8.31.0: resolution: {integrity: sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==} engines: {node: ^10.0.0 || ^12.0.0 || >= 14.0.0} peerDependencies: eslint: '>=5' dependencies: - eslint: 8.25.0 + eslint: 8.31.0 eslint-visitor-keys: 2.1.0 dev: true @@ -1243,14 +975,15 @@ packages: engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dev: true - /eslint/8.25.0: - resolution: {integrity: sha512-DVlJOZ4Pn50zcKW5bYH7GQK/9MsoQG2d5eDH0ebEkE8PbgzTTmtt/VTH9GGJ4BfeZCpBLqFfvsjX35UacUL83A==} + /eslint/8.31.0: + resolution: {integrity: sha512-0tQQEVdmPZ1UtUKXjX7EMm9BlgJ08G90IhWh0PKDCb3ZLsgAOHI8fYSIzYVZej92zsgq+ft0FGsxhJ3xo2tbuA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} hasBin: true dependencies: - '@eslint/eslintrc': 1.3.3 - '@humanwhocodes/config-array': 0.10.7 + '@eslint/eslintrc': 1.4.1 + '@humanwhocodes/config-array': 0.11.8 '@humanwhocodes/module-importer': 1.0.1 + '@nodelib/fs.walk': 1.2.8 ajv: 6.12.6 chalk: 4.1.2 cross-spawn: 7.0.3 @@ -1258,23 +991,23 @@ packages: doctrine: 3.0.0 escape-string-regexp: 4.0.0 eslint-scope: 7.1.1 - eslint-utils: 3.0.0_eslint@8.25.0 + eslint-utils: 3.0.0_eslint@8.31.0 eslint-visitor-keys: 3.3.0 - espree: 9.4.0 + espree: 9.4.1 esquery: 1.4.0 esutils: 2.0.3 fast-deep-equal: 3.1.3 file-entry-cache: 6.0.1 find-up: 5.0.0 glob-parent: 6.0.2 - globals: 13.17.0 - globby: 11.1.0 + globals: 13.19.0 grapheme-splitter: 1.0.4 - ignore: 5.2.0 + ignore: 5.2.4 import-fresh: 3.3.0 imurmurhash: 0.1.4 is-glob: 4.0.3 - js-sdsl: 4.1.5 + is-path-inside: 3.0.3 + js-sdsl: 4.2.0 js-yaml: 4.1.0 json-stable-stringify-without-jsonify: 1.0.1 levn: 0.4.1 @@ -1290,12 +1023,12 @@ packages: - supports-color dev: true - /espree/9.4.0: - resolution: {integrity: sha512-DQmnRpLj7f6TgN/NYb0MTzJXL+vJF9h3pHy4JhCIs3zwcgez8xmGg3sXHcEO97BrmO2OSvCwMdfdlyl+E9KjOw==} + /espree/9.4.1: + resolution: {integrity: sha512-XwctdmTO6SIvCzd9810yyNzIrOrqNYV9Koizx4C/mRhf9uq0o4yHoCEU/670pOxOL/MSraektvSAji79kX90Vg==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dependencies: - acorn: 8.8.0 - acorn-jsx: 5.3.2_acorn@8.8.0 + acorn: 8.8.1 + acorn-jsx: 5.3.2_acorn@8.8.1 eslint-visitor-keys: 3.3.0 dev: true @@ -1374,8 +1107,8 @@ packages: resolution: {integrity: sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==} dev: true - /fastq/1.13.0: - resolution: {integrity: sha512-YpkpUnK8od0o1hmeSc7UUs/eB/vIPWJYjKck2QKIzAf71Vm1AAQ3EbuZB3g2JIy+pg+ERD0vqI79KyZiB2e2Nw==} + /fastq/1.15.0: + resolution: {integrity: sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==} dependencies: reusify: 1.0.4 dev: true @@ -1429,6 +1162,12 @@ packages: resolution: {integrity: sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==} dev: true + /for-each/0.3.3: + resolution: {integrity: sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==} + dependencies: + is-callable: 1.2.7 + dev: true + /fs-extra/7.0.1: resolution: {integrity: sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==} engines: {node: '>=6 <7 || >=8'} @@ -1461,7 +1200,7 @@ packages: dependencies: call-bind: 1.0.2 define-properties: 1.1.4 - es-abstract: 1.20.4 + es-abstract: 1.21.1 functions-have-names: 1.2.3 dev: true @@ -1469,11 +1208,6 @@ packages: resolution: {integrity: sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==} dev: true - /gensync/1.0.0-beta.2: - resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} - engines: {node: '>=6.9.0'} - dev: true - /get-caller-file/2.0.5: resolution: {integrity: sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==} engines: {node: 6.* || 8.* || >= 10.*} @@ -1520,18 +1254,20 @@ packages: path-is-absolute: 1.0.1 dev: true - /globals/11.12.0: - resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==} - engines: {node: '>=4'} - dev: true - - /globals/13.17.0: - resolution: {integrity: sha512-1C+6nQRb1GwGMKm2dH/E7enFAMxGTmGI7/dEdhy/DNelv85w9B72t3uc5frtMNXIbzrarJJ/lTCjcaZwbLJmyw==} + /globals/13.19.0: + resolution: {integrity: sha512-dkQ957uSRWHw7CFXLUtUHQI3g3aWApYhfNR2O6jn/907riyTYKVBmxYVROkBcY614FSSeSJh7Xm7SrUWCxvJMQ==} engines: {node: '>=8'} dependencies: type-fest: 0.20.2 dev: true + /globalthis/1.0.3: + resolution: {integrity: sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA==} + engines: {node: '>= 0.4'} + dependencies: + define-properties: 1.1.4 + dev: true + /globby/11.1.0: resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==} engines: {node: '>=10'} @@ -1539,11 +1275,17 @@ packages: array-union: 2.1.0 dir-glob: 3.0.1 fast-glob: 3.2.12 - ignore: 5.2.0 + ignore: 5.2.4 merge2: 1.4.1 slash: 3.0.0 dev: true + /gopd/1.0.1: + resolution: {integrity: sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==} + dependencies: + get-intrinsic: 1.1.3 + dev: true + /graceful-fs/4.2.10: resolution: {integrity: sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA==} dev: true @@ -1577,6 +1319,11 @@ packages: get-intrinsic: 1.1.3 dev: true + /has-proto/1.0.1: + resolution: {integrity: sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==} + engines: {node: '>= 0.4'} + dev: true + /has-symbols/1.0.3: resolution: {integrity: sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==} engines: {node: '>= 0.4'} @@ -1611,8 +1358,8 @@ packages: safer-buffer: 2.1.2 dev: true - /ignore/5.2.0: - resolution: {integrity: sha512-CmxgYGiEPCLhfLnpPp1MoRmifwEIOgjcHXxOBjv7mY96c+eWScsOP9c112ZyLdWHi0FxHjI+4uVhKYp/gcdRmQ==} + /ignore/5.2.4: + resolution: {integrity: sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==} engines: {node: '>= 4'} dev: true @@ -1645,8 +1392,8 @@ packages: resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==} dev: true - /internal-slot/1.0.3: - resolution: {integrity: sha512-O0DB1JC/sPyZl7cIo78n5dR7eUSwwpYPiXRhTzNxZVAMUuB8vlnRFyLxdrVToks6XPLVnFfbzaVd5WLjhgg+vA==} + /internal-slot/1.0.4: + resolution: {integrity: sha512-tA8URYccNzMo94s5MQZgH8NB/XTa6HsOo0MLfXTKKEnHVVdegzaQoFZ7Jp44bdvLvY2waT5dc+j5ICEswhi7UQ==} engines: {node: '>= 0.4'} dependencies: get-intrinsic: 1.1.3 @@ -1654,6 +1401,14 @@ packages: side-channel: 1.0.4 dev: true + /is-array-buffer/3.0.1: + resolution: {integrity: sha512-ASfLknmY8Xa2XtB4wmbz13Wu202baeA18cJBCeCy0wXUHZF0IPyVEXqKEcd+t2fNSLLL1vC6k7lxZEojNbISXQ==} + dependencies: + call-bind: 1.0.2 + get-intrinsic: 1.1.3 + is-typed-array: 1.1.10 + dev: true + /is-arrayish/0.2.1: resolution: {integrity: sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==} dev: true @@ -1681,11 +1436,11 @@ packages: resolution: {integrity: sha512-ZYvCgrefwqoQ6yTyYUbQu64HsITZ3NfKX1lzaEYdkTDcfKzzCI/wthRRYKkdjHKFVgNiXKAKm65Zo1pk2as/QQ==} hasBin: true dependencies: - ci-info: 3.5.0 + ci-info: 3.7.1 dev: true - /is-core-module/2.10.0: - resolution: {integrity: sha512-Erxj2n/LDAZ7H8WNJXd9tw38GYM3dv8rk8Zcs+jJuxYTW7sozH+SS8NtrSjVL1/vpLvWi1hxy96IzjJ3EHTJJg==} + /is-core-module/2.11.0: + resolution: {integrity: sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==} dependencies: has: 1.0.3 dev: true @@ -1731,6 +1486,11 @@ packages: engines: {node: '>=0.12.0'} dev: true + /is-path-inside/3.0.3: + resolution: {integrity: sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==} + engines: {node: '>=8'} + dev: true + /is-plain-obj/1.1.0: resolution: {integrity: sha512-yvkRyxmFKEOQ4pNXCmJG5AEQNlXJS5LaONXo5/cLdTZdWvsZ1ioJEonLGAosKlMWE8lwUy/bJzMjcw8az73+Fg==} engines: {node: '>=0.10.0'} @@ -1771,6 +1531,17 @@ packages: has-symbols: 1.0.3 dev: true + /is-typed-array/1.1.10: + resolution: {integrity: sha512-PJqgEHiWZvMpaFZ3uTc8kHPM4+4ADTlDniuQL7cU/UDA0Ql7F70yGfHph3cLNe+c9toaigv+DFzTJKhc2CtO6A==} + engines: {node: '>= 0.4'} + dependencies: + available-typed-arrays: 1.0.5 + call-bind: 1.0.2 + for-each: 0.3.3 + gopd: 1.0.1 + has-tostringtag: 1.0.0 + dev: true + /is-weakref/1.0.2: resolution: {integrity: sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==} dependencies: @@ -1786,12 +1557,8 @@ packages: resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==} dev: true - /javascript-natural-sort/0.7.1: - resolution: {integrity: sha512-nO6jcEfZWQXDhOiBtG2KvKyEptz7RVbpGP4vTD2hLBdmNQSsCiicO2Ioinv6UI4y9ukqnBpy+XZ9H6uLNgJTlw==} - dev: true - - /js-sdsl/4.1.5: - resolution: {integrity: sha512-08bOAKweV2NUC1wqTtf3qZlnpOX/R2DU9ikpjOHs0H+ibQv3zpncVQg6um4uYtRtrwIX8M4Nh3ytK4HGlYAq7Q==} + /js-sdsl/4.2.0: + resolution: {integrity: sha512-dyBIzQBDkCqCu+0upx25Y2jGdbTGxE9fshMsCdK0ViOongpV+n5tXRcZY9v7CaVQ79AGS9KA1KHtojxiM7aXSQ==} dev: true /js-tokens/4.0.0: @@ -1813,12 +1580,6 @@ packages: argparse: 2.0.1 dev: true - /jsesc/2.5.2: - resolution: {integrity: sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==} - engines: {node: '>=4'} - hasBin: true - dev: true - /json-parse-even-better-errors/2.3.1: resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==} dev: true @@ -1831,12 +1592,6 @@ packages: resolution: {integrity: sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==} dev: true - /json5/2.2.1: - resolution: {integrity: sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==} - engines: {node: '>=6'} - hasBin: true - dev: true - /jsonfile/4.0.0: resolution: {integrity: sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==} optionalDependencies: @@ -1897,10 +1652,6 @@ packages: resolution: {integrity: sha512-+WKqsK294HMSc2jEbNgpHpd0JfIBhp7rEV4aqXWqFr6AlXov+SlcgB1Fv01y2kGe3Gc8nMW7VA0SrGuSkRfIEg==} dev: true - /lodash/4.17.21: - resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==} - dev: true - /lru-cache/4.1.5: resolution: {integrity: sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==} dependencies: @@ -1931,7 +1682,7 @@ packages: dependencies: '@types/minimist': 1.2.2 camelcase-keys: 6.2.2 - decamelize-keys: 1.1.0 + decamelize-keys: 1.1.1 hard-rejection: 2.1.0 minimist-options: 4.1.0 normalize-package-data: 2.5.0 @@ -1984,12 +1735,12 @@ packages: resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==} dev: true - /natural-compare/1.4.0: - resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==} + /natural-compare-lite/1.4.0: + resolution: {integrity: sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==} dev: true - /node-releases/2.0.6: - resolution: {integrity: sha512-PiVXnNuFm5+iYkLBNeq5211hvO38y63T0i2KKh2KnUs3RpzJ+JtODFjkD8yjLwnDkTYF1eKXheUwdssR+NRZdg==} + /natural-compare/1.4.0: + resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==} dev: true /normalize-package-data/2.5.0: @@ -2133,10 +1884,6 @@ packages: engines: {node: '>=8'} dev: true - /picocolors/1.0.0: - resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} - dev: true - /picomatch/2.3.1: resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==} engines: {node: '>=8.6'} @@ -2176,8 +1923,8 @@ packages: fast-diff: 1.2.0 dev: true - /prettier/2.7.1: - resolution: {integrity: sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==} + /prettier/2.8.2: + resolution: {integrity: sha512-BtRV9BcncDyI2tsuS19zzhzoxD8Dh8LiCx7j7tHzrkz8GFXAexeWFdi22mjE1d16dftH2qNaytVxqiRTGlMfpw==} engines: {node: '>=10.13.0'} hasBin: true dev: true @@ -2186,8 +1933,8 @@ packages: resolution: {integrity: sha512-b/YwNhb8lk1Zz2+bXXpS/LK9OisiZZ1SNsSLxN1x2OXVEhW2Ckr/7mWE5vrC1ZTiJlD9g19jWszTmJsB+oEpFQ==} dev: true - /punycode/2.1.1: - resolution: {integrity: sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==} + /punycode/2.2.0: + resolution: {integrity: sha512-LN6QV1IJ9ZhxWTNdktaPClrNfp8xdSAYS0Zk2ddX7XsXZAxckMHPCBcHRo0cTcEIgYPRiGEkmji3Idkh2yFtYw==} engines: {node: '>=6'} dev: true @@ -2237,8 +1984,8 @@ packages: strip-indent: 3.0.0 dev: true - /regenerator-runtime/0.13.10: - resolution: {integrity: sha512-KepLsg4dU12hryUO7bp/axHAKvwGOCV0sGloQtpagJ12ai+ojVDqkeGSiRX1zlq+kjIMZ1t7gpze+26QqtdGqw==} + /regenerator-runtime/0.13.11: + resolution: {integrity: sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==} dev: true /regexp.prototype.flags/1.4.3: @@ -2278,7 +2025,7 @@ packages: resolution: {integrity: sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==} hasBin: true dependencies: - is-core-module: 2.10.0 + is-core-module: 2.11.0 path-parse: 1.0.7 supports-preserve-symlinks-flag: 1.0.0 dev: true @@ -2318,11 +2065,6 @@ packages: hasBin: true dev: true - /semver/6.3.0: - resolution: {integrity: sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==} - hasBin: true - dev: true - /semver/7.3.8: resolution: {integrity: sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==} engines: {node: '>=10'} @@ -2381,7 +2123,7 @@ packages: engines: {node: '>=6'} hasBin: true dependencies: - array.prototype.flat: 1.3.0 + array.prototype.flat: 1.3.1 breakword: 1.0.5 grapheme-splitter: 1.0.4 strip-ansi: 6.0.1 @@ -2389,11 +2131,6 @@ packages: yargs: 15.4.1 dev: true - /source-map/0.5.7: - resolution: {integrity: sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==} - engines: {node: '>=0.10.0'} - dev: true - /spawndamnit/2.0.0: resolution: {integrity: sha512-j4JKEcncSjFlqIwU5L/rp2N5SIPsdxaRsIv678+TZxZ0SRDJTm8JrxJMjE/XuiEZNEir3S8l0Fa3Ke339WI4qA==} dependencies: @@ -2442,20 +2179,20 @@ packages: strip-ansi: 6.0.1 dev: true - /string.prototype.trimend/1.0.5: - resolution: {integrity: sha512-I7RGvmjV4pJ7O3kdf+LXFpVfdNOxtCW/2C8f6jNiW4+PQchwxkCDzlk1/7p+Wl4bqFIZeF47qAHXLuHHWKAxog==} + /string.prototype.trimend/1.0.6: + resolution: {integrity: sha512-JySq+4mrPf9EsDBEDYMOb/lM7XQLulwg5R/m1r0PXEFqrV0qHvl58sdTilSXtKOflCsK2E8jxf+GKC0T07RWwQ==} dependencies: call-bind: 1.0.2 define-properties: 1.1.4 - es-abstract: 1.20.4 + es-abstract: 1.21.1 dev: true - /string.prototype.trimstart/1.0.5: - resolution: {integrity: sha512-THx16TJCGlsN0o6dl2o6ncWUsdgnLRSA23rRE5pyGBw/mLr3Ej/R2LaqCtgP8VNMGZsvMWnf9ooZPyY2bHvUFg==} + /string.prototype.trimstart/1.0.6: + resolution: {integrity: sha512-omqjMDaY92pbn5HOX7f9IccLA+U1tA9GvtU4JrodiXFfYB7jPzzHpRzpglLAjtUV6bB557zwClJezTqnAiYnQA==} dependencies: call-bind: 1.0.2 define-properties: 1.1.4 - es-abstract: 1.20.4 + es-abstract: 1.21.1 dev: true /strip-ansi/6.0.1: @@ -2517,11 +2254,6 @@ packages: os-tmpdir: 1.0.2 dev: true - /to-fast-properties/2.0.0: - resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==} - engines: {node: '>=4'} - dev: true - /to-regex-range/5.0.1: resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==} engines: {node: '>=8.0'} @@ -2538,14 +2270,14 @@ packages: resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==} dev: true - /tsutils/3.21.0_typescript@4.8.4: + /tsutils/3.21.0_typescript@4.9.4: resolution: {integrity: sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==} engines: {node: '>= 6'} peerDependencies: typescript: '>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta' dependencies: tslib: 1.14.1 - typescript: 4.8.4 + typescript: 4.9.4 dev: true /tty-table/4.1.6: @@ -2559,7 +2291,7 @@ packages: smartwrap: 2.0.2 strip-ansi: 6.0.1 wcwidth: 1.0.1 - yargs: 17.6.0 + yargs: 17.6.2 dev: true /type-check/0.4.0: @@ -2589,8 +2321,16 @@ packages: engines: {node: '>=8'} dev: true - /typescript/4.8.4: - resolution: {integrity: sha512-QCh+85mCy+h0IGff8r5XWzOVSbBO+KfeYrMQh7NJ58QujwcE22u+NUSmUxqF+un70P9GXKxa2HCNiTTMJknyjQ==} + /typed-array-length/1.0.4: + resolution: {integrity: sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==} + dependencies: + call-bind: 1.0.2 + for-each: 0.3.3 + is-typed-array: 1.1.10 + dev: true + + /typescript/4.9.4: + resolution: {integrity: sha512-Uz+dTXYzxXXbsFpM86Wh3dKCxrQqUcVMxwU54orwlJjOpO3ao8L7j5lH+dWfTwgCwIuM9GQ2kvVotzYJMXTBZg==} engines: {node: '>=4.2.0'} hasBin: true dev: true @@ -2609,21 +2349,10 @@ packages: engines: {node: '>= 4.0.0'} dev: true - /update-browserslist-db/1.0.10_browserslist@4.21.4: - resolution: {integrity: sha512-OztqDenkfFkbSG+tRxBeAnCVPckDBcvibKd35yDONx6OU8N7sqgwc7rCbkJ/WcYtVRZ4ba68d6byhC21GFh7sQ==} - hasBin: true - peerDependencies: - browserslist: '>= 4.21.0' - dependencies: - browserslist: 4.21.4 - escalade: 3.1.1 - picocolors: 1.0.0 - dev: true - /uri-js/4.4.1: resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==} dependencies: - punycode: 2.1.1 + punycode: 2.2.0 dev: true /validate-npm-package-license/3.0.4: @@ -2661,6 +2390,18 @@ packages: path-exists: 4.0.0 dev: true + /which-typed-array/1.1.9: + resolution: {integrity: sha512-w9c4xkx6mPidwp7180ckYWfMmvxpjlZuIudNtDf4N/tTAUB8VJbX25qZoAsrtGuYNnGw3pa0AXgbGKRB8/EceA==} + engines: {node: '>= 0.4'} + dependencies: + available-typed-arrays: 1.0.5 + call-bind: 1.0.2 + for-each: 0.3.3 + gopd: 1.0.1 + has-tostringtag: 1.0.0 + is-typed-array: 1.1.10 + dev: true + /which/1.3.1: resolution: {integrity: sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==} hasBin: true @@ -2750,8 +2491,8 @@ packages: yargs-parser: 18.1.3 dev: true - /yargs/17.6.0: - resolution: {integrity: sha512-8H/wTDqlSwoSnScvV2N/JHfLWOKuh5MVla9hqLjK3nsfyy6Y4kDSYSvkU5YCUEPOSnRXfIyx3Sq+B/IWudTo4g==} + /yargs/17.6.2: + resolution: {integrity: sha512-1/9UrdHjDZc0eOU0HxOHoS78C69UD3JRMvzlJ7S79S2nTaWRA/whGCTV8o9e/N/1Va9YIV7Q4sOxD8VV4pCWOw==} engines: {node: '>=12'} dependencies: cliui: 8.0.1 diff --git a/renovate.json b/renovate.json deleted file mode 100644 index 39a2b6e..0000000 --- a/renovate.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "$schema": "https://docs.renovatebot.com/renovate-schema.json", - "extends": [ - "config:base" - ] -} From 9a04e6a1dc988aad54d3bfe92c102442b197bd96 Mon Sep 17 00:00:00 2001 From: Alex Iglesias Date: Wed, 11 Jan 2023 20:06:24 +0100 Subject: [PATCH 17/19] fix eslint issues --- src/components/Debug.ts | 2 +- src/components/DisplayController.ts | 8 ++++---- src/helpers/clearFormField.ts | 5 ++--- src/helpers/extractNumberFromString.ts | 2 +- src/helpers/index.ts | 4 +--- src/helpers/setFormFieldValue.ts | 3 +-- src/type-guards/instances.ts | 8 ++++---- src/type-guards/isKeyOf.ts | 2 +- src/types/index.ts | 2 +- src/webflow/getCollectionElements.ts | 3 +-- src/webflow/getCollectionListWrappers.ts | 3 +-- src/webflow/getCurrentBreakpoint.ts | 3 +-- src/webflow/index.ts | 4 ++-- src/webflow/populateSelectOptions.ts | 2 +- src/webflow/removeSelectOptions.ts | 2 +- src/webflow/restartWebflow.ts | 1 - 16 files changed, 23 insertions(+), 31 deletions(-) diff --git a/src/components/Debug.ts b/src/components/Debug.ts index ba95774..d5e2c59 100644 --- a/src/components/Debug.ts +++ b/src/components/Debug.ts @@ -10,7 +10,7 @@ export class Debug { public static alert(text: string, type: 'info'): void; public static alert(text: string, type: 'error'): T; - public static alert(text: string, type: typeof alertTypes[number]): T | void { + public static alert(text: string, type: (typeof alertTypes)[number]): T | void { if (this.alertsActivated) window.alert(text); if (type === 'error') throw new Error(text); } diff --git a/src/components/DisplayController.ts b/src/components/DisplayController.ts index f7ef5cb..8745115 100644 --- a/src/components/DisplayController.ts +++ b/src/components/DisplayController.ts @@ -1,9 +1,9 @@ -import type { InteractionParams } from './Interaction'; -import { Interaction } from './Interaction'; import { fadeIn, fadeOut } from '../animations/fade'; -import { isVisible } from '../helpers/isVisible'; import { queryElement } from '../helpers'; +import { isVisible } from '../helpers/isVisible'; import { Debug } from '.'; +import type { InteractionParams } from './Interaction'; +import { Interaction } from './Interaction'; // Types export interface DisplayControllerParams { @@ -22,7 +22,7 @@ export interface DisplayControllerParams { * Not applicable when interaction parameters ara passed to the instance, as it's assumed that the Webflow interaction will set the display property. * Defaults to `block`. */ - displayProperty?: typeof DisplayController['displayProperties'][number]; + displayProperty?: (typeof DisplayController)['displayProperties'][number]; /** * If set to true, the element will be straitgh showed / hidden without any transition. diff --git a/src/helpers/clearFormField.ts b/src/helpers/clearFormField.ts index b04fa33..19e18cb 100644 --- a/src/helpers/clearFormField.ts +++ b/src/helpers/clearFormField.ts @@ -1,9 +1,8 @@ +import { isHTMLInputElement } from '../type-guards'; +import type { FormField } from '../types'; import { FORM_CSS_CLASSES } from '../webflow/css'; import { simulateEvent } from './simulateEvent'; -import type { FormField } from '../types'; -import { isHTMLInputElement } from '../type-guards'; - const { radioInput: radioInputCSSClass, checkboxOrRadioFocus: focusCSSClass, diff --git a/src/helpers/extractNumberFromString.ts b/src/helpers/extractNumberFromString.ts index 9aa107f..655313d 100644 --- a/src/helpers/extractNumberFromString.ts +++ b/src/helpers/extractNumberFromString.ts @@ -9,4 +9,4 @@ export const extractNumberFromString = (value: string) => { const number = parseFloat(value.replace(/[^0-9.-]+/g, '')); return isNaN(number) ? null : number; -}; \ No newline at end of file +}; diff --git a/src/helpers/index.ts b/src/helpers/index.ts index 8d6a583..2e8e8e2 100644 --- a/src/helpers/index.ts +++ b/src/helpers/index.ts @@ -1,9 +1,8 @@ -import { extractNumberFromString } from './extractNumberFromString'; - export { addListener } from './addListener'; export { clearFormField } from './clearFormField'; export { cloneNode } from './cloneNode'; export { extractCommaSeparatedValues } from './extractCommaSeparatedValues'; +export { extractNumberFromString } from './extractNumberFromString'; export { extractNumberSuffix } from './extractNumberSuffix'; export { findTextNode } from './findTextNode'; export { getAllParents } from './getAllParents'; @@ -25,4 +24,3 @@ export { setFormFieldValue } from './setFormFieldValue'; export { simulateEvent } from './simulateEvent'; export { throwError } from './throwError'; export { wait } from './wait'; -export {extractNumberFromString} from './extractNumberFromString'; diff --git a/src/helpers/setFormFieldValue.ts b/src/helpers/setFormFieldValue.ts index 52b12d5..24823f1 100644 --- a/src/helpers/setFormFieldValue.ts +++ b/src/helpers/setFormFieldValue.ts @@ -1,7 +1,6 @@ -import { simulateEvent } from '.'; - import type { FormField } from '..'; import { isHTMLInputElement } from '..'; +import { simulateEvent } from '.'; /** * Sets a value to a FormField element and emits `click`, `input` and `change` Events. diff --git a/src/type-guards/instances.ts b/src/type-guards/instances.ts index 21f249b..90967f5 100644 --- a/src/type-guards/instances.ts +++ b/src/type-guards/instances.ts @@ -38,14 +38,14 @@ export const isHTMLSelectElement = (target: unknown): target is HTMLSelectElemen /** * @returns `true` if the target is an instance of HTMLTextAreaElement type. * @param target - */ + */ export const isHTMLTextAreaElement = (target: unknown): target is HTMLTextAreaElement => target instanceof HTMLTextAreaElement; /** * @returns `true` if the target is an instance of HTMLVideoElement type. * @param target - */ + */ export const isHTMLVideoElement = (target: unknown): target is HTMLVideoElement => target instanceof HTMLVideoElement; /** @@ -58,7 +58,7 @@ export const isHTMLAnchorElement = (target: unknown): target is HTMLAnchorElemen /** * @returns `true` if the target is an instance of HTMLImageElement type. * @param target - */ + */ export const isHTMLImageElement = (target: unknown): target is HTMLImageElement => target instanceof HTMLImageElement; /** @@ -71,6 +71,6 @@ export const isHTMLOptionElement = (target: unknown): target is HTMLOptionElemen /** * @returns `true` if the target is an instance of HTMLButtonElement type. * @param target - */ + */ export const isHTMLButtonElement = (target: unknown): target is HTMLButtonElement => target instanceof HTMLButtonElement; diff --git a/src/type-guards/isKeyOf.ts b/src/type-guards/isKeyOf.ts index f54a33f..310672c 100644 --- a/src/type-guards/isKeyOf.ts +++ b/src/type-guards/isKeyOf.ts @@ -7,4 +7,4 @@ export const isKeyOf = ( key: string | null | undefined, source: readonly T[] -): key is typeof source[number] => !!key && source.includes(key); +): key is (typeof source)[number] => !!key && source.includes(key); diff --git a/src/types/index.ts b/src/types/index.ts index 66e5083..440a21e 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -1,3 +1,4 @@ +export * as Greenhouse from './apis/Greenhouse'; export type { Entry } from './Entry'; export type { FormField } from './FormField'; export type { Instance } from './Instance'; @@ -6,4 +7,3 @@ export type { PartialExcept } from './PartialExcept'; export type { PickPartial } from './PickPartial'; export type { PickRequired } from './PickRequired'; export type { RequiredExcept } from './RequiredExcept'; -export * as Greenhouse from './apis/Greenhouse'; diff --git a/src/webflow/getCollectionElements.ts b/src/webflow/getCollectionElements.ts index e9ea1c0..7b883e9 100644 --- a/src/webflow/getCollectionElements.ts +++ b/src/webflow/getCollectionElements.ts @@ -1,5 +1,3 @@ -import { CMS_CSS_CLASSES } from '.'; - import type { CollectionEmptyElement, CollectionItemElement, @@ -9,6 +7,7 @@ import type { PaginationButtonElement, PaginationWrapperElement, } from '..'; +import { CMS_CSS_CLASSES } from '.'; const { wrapper, list, paginationWrapper, paginationNext, paginationPrevious, emptyState, pageCount } = CMS_CSS_CLASSES; diff --git a/src/webflow/getCollectionListWrappers.ts b/src/webflow/getCollectionListWrappers.ts index 8b69367..64734dc 100644 --- a/src/webflow/getCollectionListWrappers.ts +++ b/src/webflow/getCollectionListWrappers.ts @@ -1,6 +1,5 @@ -import { CMS_CSS_CLASSES, getCollectionElements } from '.'; - import type { CollectionListWrapperElement } from '..'; +import { CMS_CSS_CLASSES, getCollectionElements } from '.'; /** * Queries `Collection List Wrapper` elements and makes sure they are unique. diff --git a/src/webflow/getCurrentBreakpoint.ts b/src/webflow/getCurrentBreakpoint.ts index 3d0d370..d8a5016 100644 --- a/src/webflow/getCurrentBreakpoint.ts +++ b/src/webflow/getCurrentBreakpoint.ts @@ -1,6 +1,5 @@ -import { WEBFLOW_BREAKPOINTS } from './breakpoints'; - import type { WebflowBreakpoint } from './breakpoints'; +import { WEBFLOW_BREAKPOINTS } from './breakpoints'; /** * Checks the current breakpoint based on the window media. diff --git a/src/webflow/index.ts b/src/webflow/index.ts index b0da833..0e3799a 100644 --- a/src/webflow/index.ts +++ b/src/webflow/index.ts @@ -6,8 +6,8 @@ export { getCollectionListWrappers } from './getCollectionListWrappers'; export { getCurrentBreakpoint } from './getCurrentBreakpoint'; export { getPublishDate } from './getPublishDate'; export { getSiteId } from './getSiteId'; +export { populateSelectOptions } from './populateSelectOptions'; +export { removeSelectOptions } from './removeSelectOptions'; export { restartWebflow } from './restartWebflow'; -export {populateSelectOptions } from './populateSelectOptions'; -export {removeSelectOptions } from './removeSelectOptions'; export * from './Webflow'; export * from './WebflowElements'; diff --git a/src/webflow/populateSelectOptions.ts b/src/webflow/populateSelectOptions.ts index 2670a92..fb02dc4 100644 --- a/src/webflow/populateSelectOptions.ts +++ b/src/webflow/populateSelectOptions.ts @@ -13,4 +13,4 @@ export const populateSelectOptions = ( selectElement.options.add(optionElement); } -}; \ No newline at end of file +}; diff --git a/src/webflow/removeSelectOptions.ts b/src/webflow/removeSelectOptions.ts index db63b6e..d7be5f5 100644 --- a/src/webflow/removeSelectOptions.ts +++ b/src/webflow/removeSelectOptions.ts @@ -10,4 +10,4 @@ export const removeSelectOptions = ({ options }: HTMLSelectElement, preserveEmpt } option.remove(); } -}; \ No newline at end of file +}; diff --git a/src/webflow/restartWebflow.ts b/src/webflow/restartWebflow.ts index 82e619f..2763417 100644 --- a/src/webflow/restartWebflow.ts +++ b/src/webflow/restartWebflow.ts @@ -1,5 +1,4 @@ import { getSiteId } from '.'; - import type { WebflowModule } from './Webflow'; /** From 2a052fd6b4d6e1d2bbf9a6b1e77746df471fa4b2 Mon Sep 17 00:00:00 2001 From: Alex Iglesias Date: Wed, 11 Jan 2023 20:09:11 +0100 Subject: [PATCH 18/19] format README + update license --- README.md | 745 +++++++++++++++++++++++++++++------------------------- 1 file changed, 406 insertions(+), 339 deletions(-) diff --git a/README.md b/README.md index 86151cb..31a9204 100644 --- a/README.md +++ b/README.md @@ -1,61 +1,40 @@ - - -
- - - -
- - - - # Typescript Utils - - - - Typescript utils for custom Webflow projects. This project contains different categories of utils that can be used in any project. - - - - All utils are fully tree shakeable and strongly typed. - - - - [![npm](https://img.shields.io/npm/dt/@finsweet/ts-utils)](https://www.npmjs.com/package/@finsweet/ts-utils) [![npm version](https://badge.fury.io/js/@finsweet%2Fts-utils.svg)](https://badge.fury.io/js/@finsweet%2Fts-utils) [![NPM](https://img.shields.io/npm/l/@finsweet/ts-utils)](https://www.npmjs.com/package/@finsweet/ts-utils) [![PRs Welcome](https://img.shields.io/badge/PRs-Welcome-green)](https://github.com/finsweet/ts-utils/pulls) [![dependencies](https://img.shields.io/badge/dependencies-none-brightgreen.svg)](https://github.com/finsweet/ts-utils/blob/master/package.json) - -### Installation +### Installation #### Npm + ```bash npm install @finsweet/ts-utils ``` #### Yarn + ```bash yard add @finsweet/ts-utils ``` #### Pnpm + ```bash pnpm install @finsweet/ts-utils ``` ### All available methods and features - #### Webflow +#### Webflow - [WEBFLOW_BREAKPOINTS](#WEBFLOW_BREAKPOINTS) - [closeDropdown()](#closeDropdown) @@ -70,11 +49,13 @@ pnpm install @finsweet/ts-utils - [removeSelectOptions()](#removeSelectOptions) #### Components + - [CopyJSONButton](#CopyJSONButton) - [Interaction](#Interaction) - [DisplayController](#DisplayController) #### Type-gaurds + - [Instances](#Instances) - [isKeyOf()](#isKeyOf) - [isFormField()](#isFormField) @@ -82,6 +63,7 @@ pnpm install @finsweet/ts-utils - [Primitives](#Primitives) #### Types + - [FormField](#FormField) - [MapEntries](#MapEntries) - [PartialExcept](#PartialExcept) @@ -91,6 +73,7 @@ pnpm install @finsweet/ts-utils - [UnionToIntersection](#UnionToIntersection) #### Helpers + - [addListener()](#addListener) - [clearFormField()](#clearFormField) - [cloneNode()](#cloneNode) @@ -118,18 +101,20 @@ pnpm install @finsweet/ts-utils - [extractNumberFromString()](#extractNumberFromString) #### `Breakpoints` + `WEBFLOW_BREAKPOINTS` is a Map that defines the default media queries for Webflow's breakpoints. -List of default media queries that are already defined: +List of default media queries that are already defined: -| key (`string`) | value (`string`) | -| ------ | ------ | -| tiny | (max-width: 479px) | -| small | (max-width: 767px) | -| medium | (max-width: 991px) | -| main | (min-width: 992px) | +| key (`string`) | value (`string`) | +| -------------- | ------------------ | +| tiny | (max-width: 479px) | +| small | (max-width: 767px) | +| medium | (max-width: 991px) | +| main | (min-width: 992px) | Example: + ```ts import { WEBFLOW_BREAKPOINTS } from '@finsweet/ts-utils'; @@ -148,14 +133,16 @@ const breakpointMedium = WEBFLOW_BREAKPOINTS.get('medium'); ``` #### `CloseDropdown()` + `closeDropdown()` closes a dropdown element -| param | value | -| ------ | ------ | +| param | value | +| -------------------------------- | ---------------- | | dropdownToggle: `HTMLDivElement` | Dropdown element | -| focusToggle?: `Boolean` | Focus dropdown | +| focusToggle?: `Boolean` | Focus dropdown | Example: + ```ts import { closeDropdown } from '@finsweet/ts-utils'; @@ -173,12 +160,13 @@ closeDropdownEl.addEventListener('click', () => closeDropdown(dropdownEl)); ``` #### `Css` + This util contains constants for Webflow css classes linked to the native Webflow elements. List of available css classes groups | constant | reference | | ------ | ------ | -| CURRENT_CSS_CLASS | Current element(s) | +| CURRENT_CSS_CLASS | Current element(s) | | RICH_TEXT_BLOCK_CSS_CLASS | Richtext element(s) | | HTML_EMBED_CSS_CLASS | Embed element(s) | | SLIDER_CSS_CLASSES | Slider element(s) | @@ -191,6 +179,7 @@ List of available css classes groups | LIGHTBOX_CSS_CLASSES | Lightbox element(s) | Example: + ```ts import { SLIDER_CSS_CLASSES } from '@finsweet/ts-utils'; @@ -203,17 +192,18 @@ const sliderNavEl = document.querySelector(`.${SLIDER_CSS_CLASSES.sliderNav}`); ``` #### `getCollectionElements()` + This util helps with selecting different elements inside `Collection List Wrapper` or the `Collection List` -| param | value | -| ------ | ------ | +| param | value | +| ----------------------------- | -------------------------------------- | | reference: `string / Element` | The element or selector of the element | -| target: `string` | The requested element/elements | -| page: `Document` | The page document | +| target: `string` | The requested element/elements | +| page: `Document` | The page document | -Available targets: +Available targets: | Targets | -| ------ | +| ------ | | `wrapper` | | `list` | | `items` | @@ -224,16 +214,16 @@ Available targets: | `pageCount` | | Return value: `CollectionListWrapperElement / CollectionListElement / PaginationButtonElement / PageCountElement / CollectionItemElement[] / CollectionEmptyElement / null / undefined` | -| ------ | -| The specified collection element/elements. | +| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| The specified collection element/elements. | Example: + ```ts import { getCollectionElements } from '@finsweet/ts-utils'; window.Webflow ||= []; window.Webflow.push(async () => { - // source of the page that has the collection const pageSource = '/cms'; @@ -250,28 +240,32 @@ window.Webflow.push(async () => { // fetching all the items in the collection wrapper using the getCollectionElements util const list = await getCollectionElements(selector, 'items', doc); - + console.log(list); }); ``` -Output: + +Output: + ``` (4) [div.w-dyn-item, div.w-dyn-item, div.w-dyn-item, div.w-dyn-item] ``` #### `getCollectionListWrappers()` + This util queries `Collection List Wrapper` elements and makes sure they are unique. -| param | value | -| ------ | ------ | +| param | value | +| --------------------- | ------------------------------------------------------------------------------------------------------------------------ | | selectors: `string[]` | The selectors used for the query. If an empty array is provided, all `Collection List Wrapper` elements will be returned | -| page: `Document` | The document where to perform the query | +| page: `Document` | The document where to perform the query | -| Return value: `CollectionListWrapperElement[]` | -| ------ | +| Return value: `CollectionListWrapperElement[]` | +| ---------------------------------------------------- | | A unique list of `Collection List Wrapper` elements. | Example: + ```ts import { getCollectionListWrappers } from '@finsweet/ts-utils'; @@ -293,25 +287,29 @@ window.Webflow.push(async () => { // fetching a unqiue list of collection wrappers const unqiueColWrappers = await getCollectionListWrappers(selectors, doc); - + console.log(unqiueColWrappers); }); ``` Output: + ``` (3) [div#fs-col-wrapper1.w-dyn-list, div#fs-col-wrapper2.w-dyn-list, div#fs-col-wrapper3.w-dyn-list] ``` + #### `getCurrentBreakpoint()` + Checks the current breakpoint based on the window media. Please refer to [WEBFLOW_BREAKPOINTS](#WEBFLOW_BREAKPOINTS) for the defined breakpoints reference table. -| Return value: `String` | -| ------ | +| Return value: `String` | +| ----------------------------------------- | | Breakpoint key matching media query value | Example: + ```ts import { getCurrentBreakpoint } from '@finsweet/ts-utils'; @@ -323,18 +321,21 @@ window.Webflow.push(async () => { ``` Output: + ``` medium ``` #### `getPublishDate()` + Extracts the publish date of a Webflow site. | Return value: `String` | -| ------ | -| Date object | +| ---------------------- | +| Date object | Example: + ```ts import { getPublishDate } from '@finsweet/ts-utils'; @@ -346,18 +347,21 @@ window.Webflow.push(async () => { ``` Output: + ``` Fri Dec 16 2022 11:48:06 GMT+0530 (India Standard Time) ``` #### `getSiteId()` + Extracts the Webflow Site ID of the website | Return value: `String` | -| ------ | -| The id of the site | +| ---------------------- | +| The id of the site | Example: + ```ts import { getSiteId } from '@finsweet/ts-utils'; @@ -369,27 +373,30 @@ window.Webflow.push(async () => { ``` Output: + ``` 5f10844b0e20ffdd9de0fbea ``` #### `restartWebflow()` + Restarts the Webflow JS library. -| param | value | -| ------ | ------ | +| param | value | +| --------------------------- | --------------------------------------------------------------------------------------- | | modules?: `WebflowModule[]` | If passed, only those modules will be restarted instead of the whole `Webflow` instance | | Available modules | -| ------ | -| `ix2` | -| `commerce` | -| `lottie` | -| `lightbox` | -| `slider` | -| `tabs` | +| ----------------- | +| `ix2` | +| `commerce` | +| `lottie` | +| `lightbox` | +| `slider` | +| `tabs` | Example: + ```ts import { cloneNode, restartWebflow } from '@finsweet/ts-utils'; @@ -408,11 +415,12 @@ window.Webflow.push(async () => { ``` #### `populateSelectOptions()` + This util helps to populate the options for a select element. -| param | value | -| ------ | ------ | -| selectElement: `HTMLSelectElement` | The select element to populate. | +| param | value | +| --------------------------------------------------- | -------------------------------------------------------------------------------------------------------- | +| selectElement: `HTMLSelectElement` | The select element to populate. | | options: `string[] / (readonly [string, string])[]` | The options to populate. Accepts either a single Array of values, or an Array with [text, value] tuples. | Example: @@ -440,18 +448,19 @@ window.Webflow.push(async () => { // select options with particular values populateSelectOptions(selectEl, selectOptionsWithValue); }); - ``` #### `removeSelectOptions()` + This util removes all the options from an HTMLSelectElement. -| param | value | -| ------ | ------ | -| selectElement: `HTMLSelectElement` | The select element. | -| preserveEmpty: `boolean` | If set to true, any option without a value (like a placeholder option) will be preserved. Default is false. | +| param | value | +| ---------------------------------- | ----------------------------------------------------------------------------------------------------------- | +| selectElement: `HTMLSelectElement` | The select element. | +| preserveEmpty: `boolean` | If set to true, any option without a value (like a placeholder option) will be preserved. Default is false. | Example: + ```ts import { removeSelectOptions } from '@finsweet/ts-utils'; @@ -466,55 +475,60 @@ window.Webflow.push(async () => { ``` #### `CopyJSONButton` + This util is used to copy the data of a Webflow component which can then be pasted into Webflow designer directly. -| param | value | -| ------ | ------ | -| element: `HTMLElement` | The element to trigger the copy | +| param | value | +| ----------------------------------- | ---------------------------------------------------- | +| element: `HTMLElement` | The element to trigger the copy | | copyData: `Record` | The JSON data of the element that needs to be copied | -| successText?: `string` | Text to showcase on successful copy | -| errorText?: `string` | Text to shocase when an error occurs while copying | -| successCSSClass?: `string` | Class to be added on the element on successful copy. | +| successText?: `string` | Text to showcase on successful copy | +| errorText?: `string` | Text to shocase when an error occurs while copying | +| successCSSClass?: `string` | Class to be added on the element on successful copy. | > How to get `copyData`? +> > 1. Open your webflow designer > 2. Paste this code in your dev tools console +> > ```js > document.addEventListener('copy', ({ clipboardData }) => { -> const webflowData = clipboardData.getData('application/json'); +> const webflowData = clipboardData.getData('application/json'); > -> const type = 'text/plain'; -> const blob = new Blob([webflowData], { type }); -> const data = [ -> new ClipboardItem({ -> [type]: blob, -> }), -> ]; +> const type = 'text/plain'; +> const blob = new Blob([webflowData], { type }); +> const data = [ +> new ClipboardItem({ +> [type]: blob, +> }), +> ]; > -> navigator.clipboard.write(data); -> console.log(webflowData); +> navigator.clipboard.write(data); +> console.log(webflowData); > }); > ``` +> > 3. Now, select/click/focus on the Webflow component that you wish to copy the JSON data of. -> 4. Press `CTRL+C` or `CMD+C` -> 5. Check the console logs in the dev tools and copy the JSON data from there to further use it in your code as per your prefernece. +> 4. Press `CTRL+C` or `CMD+C` +> 5. Check the console logs in the dev tools and copy the JSON data from there to further use it in your code as per your prefernece. ##### Available methods: -- `updateCopyData()`: - Updates the JSON data to be copied. - | param | value | - | ------ | ------ | - | newCopyData: `Record` | The new JSON data of the element to be copied | - +- `updateCopyData()`: + Updates the JSON data to be copied. + + | param | value | + | -------------------------------------- | --------------------------------------------- | + | newCopyData: `Record` | The new JSON data of the element to be copied | + - `updateTextContent()`: - Updates the button's text content. + Updates the button's text content. - | param | value | - | ------ | ------ | - | newText: `string` | The new text to be displayed | + | param | value | + | ----------------- | ---------------------------- | + | newText: `string` | The new text to be displayed | -Example: +Example: ```ts import { CopyJSONButton } from '@finsweet/ts-utils'; @@ -531,34 +545,36 @@ window.Webflow.push(() => { // Initializing the method new CopyJSONButton({ element, copyData, successText: 'Copied! Paste in Webflow' }); }); - ``` #### `Interaction` -This util acts as a controller for elements that have a Webflow Ix2 click interaction binded to it. -| param | value | -| ------ | ------ | -| element: `HTMLElement / string` | Webflow element/ selector that has the Mouse Click interaction | -| duration?: `Number / Partial` | Optionally, the duration can be explicitly set so the trigger methods will return an awaitable Promise. | +This util acts as a controller for elements that have a Webflow Ix2 click interaction binded to it. + +| param | value | +| ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------- | +| element: `HTMLElement / string` | Webflow element/ selector that has the Mouse Click interaction | +| duration?: `Number / Partial` | Optionally, the duration can be explicitly set so the trigger methods will return an awaitable Promise. | ##### Available methods: -- `isActive()`: - Checks if the interaction is active. - | Return value: `Boolean` | - | ------ | -- `isRunning()`: - Checks if the interaction is running. - | Return value: `Boolean` | - | ------ | +- `isActive()`: + Checks if the interaction is active. + | Return value: `Boolean` | + | ------ | + +- `isRunning()`: + Checks if the interaction is running. + | Return value: `Boolean` | + | ------ | - `untilFinished()`: - Returns a promise that fulfills when the current running interaction has finished - | Return value: `An awaitable Promise` | - | ------ | + Returns a promise that fulfills when the current running interaction has finished + | Return value: `An awaitable Promise` | + | ------ | + +Example: -Example: ```ts import { Interaction } from '@finsweet/ts-utils'; @@ -591,45 +607,47 @@ window.Webflow.push(async () => { ``` #### `DisplayController` + This util helps to show/hide an element using built-in fade animations or no animations at all. It also works with Webflow interactions. -| param | value | -| ------ | ------ | -| element: `HTMLElement / string` | The main element | -| interaction?: `InteractionParams` | If the display must be controlled through a Webflow interaction | +| param | value | +| -------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| element: `HTMLElement / string` | The main element | +| interaction?: `InteractionParams` | If the display must be controlled through a Webflow interaction | | displayProperty?: `typeof DisplayController['displayProperties'][number];` | The display property of the element when displayed. Not applicable when interaction parameters ara passed to the instance, as it's assumed that the Webflow interaction will set the display property. Defaults to `block`. | -| noTransition?: `boolean` | If set to true, the element will be straight showed / hidden without any transition. | -| startsHidden?: `boolean` | If set to true, the element will be set to `display: none`. | +| noTransition?: `boolean` | If set to true, the element will be straight showed / hidden without any transition. | +| startsHidden?: `boolean` | If set to true, the element will be set to `display: none`. | | Available displayProperty options: | -| ------ | -| `block` | -| `flex` | -| `grid` | -| `inline-block` | -| `inline` | +| ---------------------------------- | +| `block` | +| `flex` | +| `grid` | +| `inline-block` | +| `inline` | ##### Available methods: + - `isVisible()`: - Checks if element is visible + Checks if element is visible - | Return value: `Boolean` | - | ------ | + | Return value: `Boolean` | + | ----------------------- | - `show()` - Displays the element + Displays the element - | Return value: `An awaitable Promise` | - | ------ | + | Return value: `An awaitable Promise` | + | ------------------------------------ | - `hide()` - Hides the element + Hides the element + + | Return value: `An awaitable Promise` | + | ------------------------------------ | + +Example: - | Return value: `An awaitable Promise` | - | ------ | - - -Example: ```ts import { DisplayController } from '@finsweet/ts-utils'; @@ -660,65 +678,70 @@ window.Webflow.push(async () => { ``` #### `Instances` + Type-gaurd methods for elements. -| method | param | value | -| ------ | ------ | ------ | -| `isFile()` | target: `unknown` | target is a File | -| `isNode()` | target: `unknown` | target is a Node | -| `isElement()` | target: `unknown` | target is an Element | -| `isHTMLElement()` | target: `unknown` | target is a HTMLElement | -| `isHTMLInputElement()` | target: `unknown` | target is a HTMLInputElement | -| `isHTMLSelectElement()` | target: `unknown` | target is a HTMLSelectElement | -| `isHTMLTextAreaElement()` | target: `unknown` | target is a HTMLTextAreaElement | -| `isHTMLVideoElement()` | target: `unknown` | target is a HTMLVideoElement | -| `isHTMLAnchorElement()` | target: `unknown` | target is a HTMLAnchorElement | -| `isHTMLImageElement()` | target: `unknown` | target is a HTMLImageElement | -| `isHTMLOptionElement()` | target: `unknown` | target is a HTMLOptionElement | -| `isHTMLButtonElement()` | target: `unknown` | target is a HTMLButtonElement | +| method | param | value | +| ------------------------- | ----------------- | ------------------------------- | +| `isFile()` | target: `unknown` | target is a File | +| `isNode()` | target: `unknown` | target is a Node | +| `isElement()` | target: `unknown` | target is an Element | +| `isHTMLElement()` | target: `unknown` | target is a HTMLElement | +| `isHTMLInputElement()` | target: `unknown` | target is a HTMLInputElement | +| `isHTMLSelectElement()` | target: `unknown` | target is a HTMLSelectElement | +| `isHTMLTextAreaElement()` | target: `unknown` | target is a HTMLTextAreaElement | +| `isHTMLVideoElement()` | target: `unknown` | target is a HTMLVideoElement | +| `isHTMLAnchorElement()` | target: `unknown` | target is a HTMLAnchorElement | +| `isHTMLImageElement()` | target: `unknown` | target is a HTMLImageElement | +| `isHTMLOptionElement()` | target: `unknown` | target is a HTMLOptionElement | +| `isHTMLButtonElement()` | target: `unknown` | target is a HTMLButtonElement | | Return value: `Boolean` | -| ------ | +| ----------------------- | #### `isKeyOf()` + Check if a key is included in a readonly array -| param | value | -| ------ | ------ | -| key: `string` | The main element | -| source: `readonly T[]` | Readonly array of strings | +| param | value | +| ---------------------- | ------------------------- | +| key: `string` | The main element | +| source: `readonly T[]` | Readonly array of strings | | Return value: `Boolean` | -| ------ | +| ----------------------- | Example + ```ts - const keyToCheck = 'hello'; +const keyToCheck = 'hello'; - const arrayToCheck = ['hello', 'how', 'are', 'you']; +const arrayToCheck = ['hello', 'how', 'are', 'you']; - const isKeyPresent = isKeyOf(keyToCheck, arrayToCheck); // true - ``` +const isKeyPresent = isKeyOf(keyToCheck, arrayToCheck); // true +``` #### `isFormField()` + Checks if an element is a form field element -| param | value | -| ------ | ------ | +| param | value | +| --------------------------------------- | ------- | | element: `Element / EventTarget / null` | element | | Return value: `Boolean` | -| ------ | +| ----------------------- | #### `isNotEmpty()` + This util makes sure there are no `null` or `undefined` in the passed value. Useful for type safety when filtering empty elements from an array. -| param | value | -| ------ | ------ | +| param | value | +| ----------------------------- | -------------- | | value: `T / null / undefined` | value to check | | Return value: `Boolean` | -| ------ | +| ----------------------- | Example: @@ -731,119 +754,132 @@ const filteredItemsSuccess: number[] = items.filter(isNotEmpty); // Success! ``` #### `Primitives` + Type-gaurd methods for primitives -| method | param | value | -| ------ | ------ | ------ | -| `isString()` | value: `unknown` | type of value is a string | -| `isNumber()` | value: `unknown` | type of value is a number | -| `isBigint()` | value: `unknown` | type of value is a bigint | -| `isBoolean()` | value: `unknown` | type of value is a boolean | -| `isSymbol()` | value: `unknown` | type of value is a symbol | -| `isUndefined()` | value: `unknown` | type of value is undefined | -| `isNull()` | value: `unknown` | type of value is null | -| `isFunction()` | value: `unknown` | type of value is a function | -| `isObject()` | value: `unknown` | type of value is an object | +| method | param | value | +| --------------- | ---------------- | --------------------------- | +| `isString()` | value: `unknown` | type of value is a string | +| `isNumber()` | value: `unknown` | type of value is a number | +| `isBigint()` | value: `unknown` | type of value is a bigint | +| `isBoolean()` | value: `unknown` | type of value is a boolean | +| `isSymbol()` | value: `unknown` | type of value is a symbol | +| `isUndefined()` | value: `unknown` | type of value is undefined | +| `isNull()` | value: `unknown` | type of value is null | +| `isFunction()` | value: `unknown` | type of value is a function | +| `isObject()` | value: `unknown` | type of value is an object | | Return value: `Boolean` | -| ------ | +| ----------------------- | #### `FormField` + `FormField` is the Form Field element on Webflow #### `MapEntries` + `MapEntries` converts a `Map` type to its equivalent when performing `[...map.entries()]`. -Example: +Example: + ```typescript const map: MapType = new Map(['key', 'value']); // Same type as MapEntries -const entries = [...map.entries()]; -typeof entries === MapEntries +const entries = [...map.entries()]; +typeof entries === MapEntries; ``` #### `PartialExcept` + Using the `PartialExcept` helper the picked keys will become Required and the rest of the interface will become Partial. -Example: +Example: + ```ts type Obj = { - a: 1, - b: 2, - c: 3, + a: 1; + b: 2; + c: 3; }; -type NewObj = PartialExcept; +type NewObj = PartialExcept; // NewObj looks like: // { a?: 1, b: 2, c?: 3 } ``` #### `PickPartial` + Using the `PickPartial` the picked keys will become Partial and the rest of the interface will stay the same. -Example: +Example: + ```ts type Obj = { - a: 1, - b: 2, - c: 3, + a: 1; + b: 2; + c: 3; }; -type NewObj = PickPartial; +type NewObj = PickPartial; // NewObj looks like: // { a: 1, b?: 2, c: 3 } ``` #### `PickRequired` + Using the `PickRequired` the picked keys will become required and the rest of the interface will stay the same. -Example: +Example: + ```ts type Obj = { - a: 1, - b?: 2, - c?: 3, + a: 1; + b?: 2; + c?: 3; }; -type NewObj = PickRequired; +type NewObj = PickRequired; // NewObj looks like: // { a: 1, b: 2, c?: 3 } ``` #### `RequiredExcept` + Using `RequiredExcept` the picked keys will become Partial and the rest of the interface will become Required. Example + ```ts type Obj = { - a?: 1, - b?: 2, - c?: 3, + a?: 1; + b?: 2; + c?: 3; }; -type NewObj = RequiredExcept; +type NewObj = RequiredExcept; // NewObj looks like: // { a: 1, b?: 2, c: 3 } ``` #### `UnionToIntersection` + `UnionToIntersection` converts a union like `Interface1 | Interface2` to an intersection `Interface1 & Interface2`. #### `addListener()` + This util adds an event listener to an element. -| param | value | -| ------ | ------ | -| target: `TargetInterface / null / undefined` | Target element | -| type: `Type` | The name of the event | -| listener: `Listener` | The function to run when the event occurs | +| param | value | +| -------------------------------------------- | --------------------------------------------------------------------------------------------------------- | +| target: `TargetInterface / null / undefined` | Target element | +| type: `Type` | The name of the event | +| listener: `Listener` | The function to run when the event occurs | | options: `boolean / AddEventListenerOptions` | Available options (https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#options) | -| Return value: `function` | -| ------ | +| Return value: `function` | +| --------------------------------------------------------- | | A callback to remove the event listener from the element. | - Example: ```ts @@ -862,23 +898,25 @@ window.Webflow.push(async () => { ``` #### `clearFormField()` + This util clears the form field's value and emits an input and changed event. If the field is a checkbox or a radio, it will unselect it. -| param | value | -| ------ | ------ | -| field: `FormField` | The `FormField` to clear | +| param | value | +| ------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| field: `FormField` | The `FormField` to clear | | omitEvents: `AllowedEvent / AllowedEvent[]` | By default, events are dispatched from the `FormField`. In some cases, these events might collide with other logic of the system. You can omit certain events from being dispatched by passing them in an array. | | List of `AllowedEvent` | -| ------ | -| `DOMContentLoaded` | -| `fullscreenchange` | -| `fullscreenerror` | -| `pointerlockchange` | -| `readystatechange` | -| `visibilitychange` | +| ---------------------- | +| `DOMContentLoaded` | +| `fullscreenchange` | +| `fullscreenerror` | +| `pointerlockchange` | +| `readystatechange` | +| `visibilitychange` | Example: + ```ts import { clearFormField } from '@finsweet/ts-utils'; @@ -892,17 +930,19 @@ window.Webflow.push(async () => { ``` #### `cloneNode()` + This util helps you deep clone a node that has the same type as the original one -| param | value | -| ------ | ------ | +| param | value | +| ---------------------- | ----------------- | | node: `T extends Node` | The node to clone | | Return value: `T` | -| ------ | -| The cloned node. | +| ----------------- | +| The cloned node. | Example + ```ts import { cloneNode } from '@finsweet/ts-utils'; @@ -917,62 +957,68 @@ window.Webflow.push(async () => { ``` #### `extractCommaSeparatedValues()` + This util converts a string of comma separated values to an array of values. -| param | value | -| ------ | ------ | -| string: `string` | Comma separated string | -| compareSource?: `undefined` | Acts as a type guard for making sure the extracted values match the compared source | -| defaultValue?: `undefined` | Is set when there is no matching results after comparing with the source | -| filterEmpty?: `undefined` | Defines if empty values should be filtered out of the returned array. Defaults to `true` | +| param | value | +| --------------------------- | ---------------------------------------------------------------------------------------- | +| string: `string` | Comma separated string | +| compareSource?: `undefined` | Acts as a type guard for making sure the extracted values match the compared source | +| defaultValue?: `undefined` | Is set when there is no matching results after comparing with the source | +| filterEmpty?: `undefined` | Defines if empty values should be filtered out of the returned array. Defaults to `true` | -| Return value: `string[]` | -| ------ | +| Return value: `string[]` | +| ------------------------------------------------------------- | | An array of strings that were originally seperated by a comma | Example: + ```ts const targetString = 'valueone, valuetwo, valuethree';\ - + const resultString = extractCommaSeparatedValues(targetString); // resultString is ["valueone", "valuetwo", "valuethree"] ``` #### `extractNumberSuffix()` + This util returns the number value that is suffixed in a string -| param | value | -| ------ | ------ | +| param | value | +| ---------------- | --------------------- | | string: `string` | The string to extract | -| Return value: `number / undefined` | -| ------ | +| Return value: `number / undefined` | +| ------------------------------------------------------- | | The resulted number extracted from the string, if found | Example: + ```ts - const string = 'click-2'; - const string2 = 'click'; +const string = 'click-2'; +const string2 = 'click'; - extractNumberSuffix(string); - // 2 +extractNumberSuffix(string); +// 2 - extractNumberSuffix(string2); - // undefined +extractNumberSuffix(string2); +// undefined ``` #### `findTextNode()` + This util finds the first child text node of an element -| param | value | -| ------ | ------ | +| param | value | +| ---------------------- | -------------------------- | | element: `HTMLElement` | The element to search into | -| Return value: `ChildNode | undefined` | -| ------ | +| Return value: `ChildNode | undefined` | +| ------------------------------------------- | ---------- | | The first child node text element, if found | Example: + ```ts import { findTextNode } from '@finsweet/ts-utils'; @@ -980,133 +1026,146 @@ window.Webflow ||= []; window.Webflow.push(async () => { const parentElement = document.querySelector('#fs-parent') as HTMLElement; -// The node of the first child text element inside the parent + // The node of the first child text element inside the parent const childTextNode = findTextNode(parentElement); }); ``` #### `getAllParents()` + This util extracts a list of all parents of an element, excepting the `` and `` tags -| param | value | -| ------ | ------ | +| param | value | +| ------------------ | ------------------ | | element: `Element` | The target element | -| Return value: `HTMLElement[]` | -| ------ | +| Return value: `HTMLElement[]` | +| ------------------------------------------- | | The first child node text element, if found | #### `getDistanceFromTop()` + This util gets the distance between an element and the top of the window -| param | value | -| ------ | ------ | +| param | value | +| ------------------ | ------------------ | | element: `Element` | The target element | | Return value: `number` | -| ------ | +| ---------------------- | | The distance in pixels | #### `getFormFieldValue()` + This util gets the value of a given input element -| param | value | -| ------ | ------ | +| param | value | +| ------------------ | ------------- | | input: `FormField` | input element | | Return value: `string` | -| ------ | -| The input field value | +| ---------------------- | +| The input field value | #### `getHiddenParent()` + This util finds the first hidden parent element, or the element itself (if hidden). If the element is already visible, the function returns `undefined`. -| param | value | -| ------ | ------ | +| param | value | +| ---------------------- | --------------------- | | element: `HTMLElement` | The reference element | -| Return value: `HTMLElement | undefined` | -| ------ | +| Return value: `HTMLElement | undefined` | +| -------------------------------- | ---------- | | Hidden parent element, if found. | #### `getObjectEntries()` + A typesafe util for `Object.entries()` -| param | value | -| ------ | ------ | +| param | value | +| ---------------- | ---------- | | object: `Object` | The object | | Return value: `Entry[]` | -| ------ | +| -------------------------- | #### `getObjectKeys()` + A util to get the keys of an object with inferred typing. -| param | value | -| ------ | ------ | +| param | value | +| ---------------- | ---------- | | object: `Object` | The object | | Return value: `string` | -| ------ | +| ---------------------- | #### `getObjectKeys()` + This util checks if an element is scrollable. -| param | value | -| ------ | ------ | +| param | value | +| ------------------ | ------------------ | | element: `Element` | The target element | | Return value: `Boolean` | -| ------ | +| ----------------------- | #### `isVisible()` + This util checks if an element is visible. -| param | value | -| ------ | ------ | +| param | value | +| ---------------------- | ------------------ | | element: `HTMLElement` | The target element | | Return value: `Boolean` | -| ------ | +| ----------------------- | #### `noop()` -This util, well, does nothing. It is a no operation function. It literally, does nothing. + +This util, well, does nothing. It is a no operation function. It literally, does nothing. #### `queryElement()` + This util queries an element and make sure it's the correct type -| param | value | -| ------ | ------ | -| selector: `string` | Selector string | -| instance: `Instance` | Instance target of the element type i.e HTMLElement | -| scope: `ParentNode` | The scope context where to query. Defaults to document | -| element: `HTMLElement` | The target element | +| param | value | +| ----------------------- | ------------------------------------------------------ | +| selector: `string` | Selector string | +| instance: `Instance` | Instance target of the element type i.e HTMLElement | +| scope: `ParentNode` | The scope context where to query. Defaults to document | +| element: `HTMLElement` | The target element | #### `removeChildElements()` + This util removes all child elements from a parent element -| param | value | -| ------ | ------ | -| element: `Element` | Parent element | +| param | value | +| ------------------- | ----------------------------------------------------------- | +| element: `Element` | Parent element | | selector?: `string` | Optional: only remove the elements that match this selector | #### `removeSpaces()` + This util removes all the spaces of a string. -| param | value | -| ------ | ------ | +| param | value | +| ---------------- | ---------- | | string: `string` | The string | -| Return value: `string` | -| ------ | -| The string without spaces. i.e "The quick brown foThequickbrownfox" |x" => " +| Return value: `string` | +| ------------------------------------------------------------------- | ------- | +| The string without spaces. i.e "The quick brown foThequickbrownfox" | x" => " | #### `removeTrailingSlash()` + Compares if two arrays have the same exact values. - -| param | value | -| ------ | ------ | + +| param | value | +| --------------- | -------------------- | | value: `string` | The value to mutate. | cc @@ -1115,87 +1174,95 @@ cc ``` This: https://www.finsweet.com/attributes/attractions/capri-island/ - + Becomes: https://www.finsweet.com/attributes/attractions/capri-island ``` #### `sameValues()` + This util compares if two arrays have the same exact values. -| param | value | -| ------ | ------ | -| array1: `unkown[]` | First array. | +| param | value | +| ------------------ | ------------- | +| array1: `unkown[]` | First array. | | array2: `unkown[]` | Second array. | | Return value: `Boolean` | -| ------ | +| ----------------------- | #### `setFormFieldValue()` + With the help of this util you can set a value to a `FormField` element and emit `click`, `input` and `change` Events. -| param | value | -| ------ | ------ | -| element: `element` | The value to mutate. | -| value: `boolean / string` | `boolean` for Checkboxes and Radios, `string` for the rest. | +| param | value | +| ------------------------- | ----------------------------------------------------------- | +| element: `element` | The value to mutate. | +| value: `boolean / string` | `boolean` for Checkboxes and Radios, `string` for the rest. | #### `simulateEvent()` + This util dispatches a custom event that bubbles from the target. -| param | value | -| ------ | ------ | +| param | value | +| --------------------- | ------------------------------------------- | ------------------------------------------- | | target: `EventTarget` | The element where the event will originate. | -| target: `AllowedEvent | Array` | The element where the event will originate. | +| target: `AllowedEvent | Array` | The element where the event will originate. | | List of `AllowedEvent` | -| ------ | -| `w-close` | -| `DOMContentLoaded` | -| `fullscreenchange` | -| `fullscreenerror` | -| `pointerlockchange` | -| `readystatechange` | -| `visibilitychange` | - -| Return value: `Boolean` | -| ------ | +| ---------------------- | +| `w-close` | +| `DOMContentLoaded` | +| `fullscreenchange` | +| `fullscreenerror` | +| `pointerlockchange` | +| `readystatechange` | +| `visibilitychange` | + +| Return value: `Boolean` | +| ------------------------------------------------------------------------------------------------------------------------------- | | True if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise. | #### `throwError()` + This util displays an alert and throw an exception. -| param | value | -| ------ | ------ | +| param | value | +| ----------------- | ------------- | | message: `string` | Error message | -| Return value: `T` | -| ------ | +| Return value: `T` | +| ---------------------------------------------------------------------- | | The generic argument to assure type safety when querying DOM Elements. | #### `wait()` + This util returns an awaitable promise for waiting X time. -| param | value | -| ------ | ------ | +| param | value | +| -------------- | ---------- | | time: `number` | Time in ms | -| Return value: `Promise` | -| ------ | +| Return value: `Promise` | +| ------------------------------------- | | Awaitable promise for waiting X time. | #### `extractNumberFromString()` + This util converts a string to a number, removing any invalid symbols like `$` or `,`. If the function is not able to extract a valid number from the string, it will return `null`. -| param | value | -| ------ | ------ | +| param | value | +| --------------- | ---------------- | | value: `string` | A string number. | | Return value: `number \ null` | -| ------ | -| The valid number value. | +| ----------------------------- | +| The valid number value. | ### Contribute + PRs are welcomed to this project. If you wish to improve the Finsweet Typescript Utils library, add functionality or improve the docs please feel free to submit a PR. ### License -MIT © [Finsweet](https://github.com/finsweet) + +ISC © [Finsweet](https://github.com/finsweet) From 59ac38c7ef25e083c7d8ba50d5de5f30ab76a8f4 Mon Sep 17 00:00:00 2001 From: Alex Iglesias Date: Wed, 11 Jan 2023 20:10:06 +0100 Subject: [PATCH 19/19] added changeset --- .changeset/moody-shirts-rule.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/moody-shirts-rule.md diff --git a/.changeset/moody-shirts-rule.md b/.changeset/moody-shirts-rule.md new file mode 100644 index 0000000..8e194a1 --- /dev/null +++ b/.changeset/moody-shirts-rule.md @@ -0,0 +1,5 @@ +--- +'@finsweet/ts-utils': patch +--- + +docs: Added new README.md with detailed explanation of all utils