From 8674ebd47f287afc741f51b5a6cb7e1d68b89740 Mon Sep 17 00:00:00 2001 From: Hardik Pithva Date: Fri, 20 May 2022 12:50:36 +0200 Subject: [PATCH] feat(helpers): add uuid method --- packages/accordion/package.json | 3 ++- packages/accordion/src/LionAccordion.js | 4 +--- packages/collapsible/package.json | 3 ++- packages/collapsible/src/LionCollapsible.js | 5 +---- packages/form-core/package.json | 1 + packages/form-core/src/FormControlMixin.js | 9 +-------- packages/helpers/index.js | 1 + packages/helpers/uuid/uuid.js | 9 +++++++++ packages/listbox/package.json | 3 ++- packages/listbox/src/ListboxMixin.js | 5 +---- packages/tabs/package.json | 3 ++- packages/tabs/src/LionTabs.js | 5 +---- 12 files changed, 24 insertions(+), 27 deletions(-) create mode 100644 packages/helpers/uuid/uuid.js diff --git a/packages/accordion/package.json b/packages/accordion/package.json index ce2f48b53..60a6b0040 100644 --- a/packages/accordion/package.json +++ b/packages/accordion/package.json @@ -36,7 +36,8 @@ "lion-accordion.js" ], "dependencies": { - "@lion/core": "^0.22.0" + "@lion/core": "^0.22.0", + "@lion/helpers": "^0.11.0" }, "keywords": [ "accordion", diff --git a/packages/accordion/src/LionAccordion.js b/packages/accordion/src/LionAccordion.js index 85da3cd36..22593c582 100644 --- a/packages/accordion/src/LionAccordion.js +++ b/packages/accordion/src/LionAccordion.js @@ -1,6 +1,6 @@ /* eslint-disable class-methods-use-this */ import { LitElement, css, html } from '@lion/core'; - +import { uuid } from '@lion/helpers'; /** * @typedef {Object} StoreEntry * @property {string} uid Unique ID for the entry @@ -11,8 +11,6 @@ import { LitElement, css, html } from '@lion/core'; * @property {(event: Event) => unknown} keydownHandler executed on keydown event */ -const uuid = () => Math.random().toString(36).substr(2, 10); - /** * # webcomponent * diff --git a/packages/collapsible/package.json b/packages/collapsible/package.json index 15fd7de9c..eb6779ff0 100644 --- a/packages/collapsible/package.json +++ b/packages/collapsible/package.json @@ -38,7 +38,8 @@ "demo/custom-collapsible.js" ], "dependencies": { - "@lion/core": "^0.22.0" + "@lion/core": "^0.22.0", + "@lion/helpers": "^0.11.0" }, "keywords": [ "collapsible", diff --git a/packages/collapsible/src/LionCollapsible.js b/packages/collapsible/src/LionCollapsible.js index 8be97e18b..b228e2935 100644 --- a/packages/collapsible/src/LionCollapsible.js +++ b/packages/collapsible/src/LionCollapsible.js @@ -1,8 +1,5 @@ import { LitElement, html, css } from '@lion/core'; -/** - * Generate random UUID - */ -const uuid = () => Math.random().toString(36).substr(2, 10); +import { uuid } from '@lion/helpers'; /** * `LionCollapsible` is a class for custom collapsible element (`` web component). * diff --git a/packages/form-core/package.json b/packages/form-core/package.json index 3a67dd001..7b492fe71 100644 --- a/packages/form-core/package.json +++ b/packages/form-core/package.json @@ -40,6 +40,7 @@ ], "dependencies": { "@lion/core": "^0.22.0", + "@lion/helpers": "^0.11.0", "@lion/localize": "^0.24.0" }, "keywords": [ diff --git a/packages/form-core/src/FormControlMixin.js b/packages/form-core/src/FormControlMixin.js index 7b5d18311..a8a2b7ecc 100644 --- a/packages/form-core/src/FormControlMixin.js +++ b/packages/form-core/src/FormControlMixin.js @@ -1,4 +1,5 @@ import { css, dedupeMixin, html, nothing, SlotMixin, DisabledMixin } from '@lion/core'; +import { uuid } from '@lion/helpers'; import { getAriaElementsInRightDomOrder } from './utils/getAriaElementsInRightDomOrder.js'; import { Unparseable } from './validate/Unparseable.js'; import { FormRegisteringMixin } from './registration/FormRegisteringMixin.js'; @@ -16,14 +17,6 @@ import { FormRegisteringMixin } from './registration/FormRegisteringMixin.js'; * @typedef {import('../types/FormControlMixinTypes.js').ModelValueEventDetails} ModelValueEventDetails */ -/** - * Generates random unique identifier (for dom elements) - * @param {string} prefix - */ -function uuid(prefix) { - return `${prefix}-${Math.random().toString(36).substr(2, 10)}`; -} - /** * #FormControlMixin : * diff --git a/packages/helpers/index.js b/packages/helpers/index.js index b00e4c480..286bf00ee 100644 --- a/packages/helpers/index.js +++ b/packages/helpers/index.js @@ -1,6 +1,7 @@ // Utilities export { renderLitAsNode } from './renderLitAsNode/src/renderLitAsNode.js'; export { sortEachDepth } from './sortEachDepth/src/sortEachDepth.js'; +export { uuid } from './uuid/uuid.js'; // Components export { SbActionLogger } from './sb-action-logger/src/SbActionLogger.js'; diff --git a/packages/helpers/uuid/uuid.js b/packages/helpers/uuid/uuid.js new file mode 100644 index 000000000..f9e92cee3 --- /dev/null +++ b/packages/helpers/uuid/uuid.js @@ -0,0 +1,9 @@ +/** + * Generates random unique identifier (for dom elements) + * @param {string} prefix + * @return {string} unique id + */ +export function uuid(prefix = '') { + const elementName = prefix.length > 1 ? `${prefix}-` : ''; + return `${elementName}${Math.random().toString(36).substr(2, 10)}`; +} diff --git a/packages/listbox/package.json b/packages/listbox/package.json index 9ba9fa3b9..9c7e2a50c 100644 --- a/packages/listbox/package.json +++ b/packages/listbox/package.json @@ -40,7 +40,8 @@ ], "dependencies": { "@lion/core": "^0.22.0", - "@lion/form-core": "^0.17.1" + "@lion/form-core": "^0.17.1", + "@lion/helpers": "^0.11.0" }, "keywords": [ "form", diff --git a/packages/listbox/src/ListboxMixin.js b/packages/listbox/src/ListboxMixin.js index 6548f0bd0..090bbb01a 100644 --- a/packages/listbox/src/ListboxMixin.js +++ b/packages/listbox/src/ListboxMixin.js @@ -1,5 +1,6 @@ import { css, dedupeMixin, html, ScopedElementsMixin, SlotMixin } from '@lion/core'; import { ChoiceGroupMixin, FormControlMixin, FormRegistrarMixin } from '@lion/form-core'; +import { uuid } from '@lion/helpers'; import { LionOptions } from './LionOptions.js'; // TODO: extract ListNavigationWithActiveDescendantMixin that can be reused in [role="menu"] @@ -51,10 +52,6 @@ function moveDefaultSlottablesToTarget(source, target) { }); } -function uuid() { - return Math.random().toString(36).substr(2, 10); -} - /** * @type {ListboxMixin} * @param {import('@open-wc/dedupe-mixin').Constructor} superclass diff --git a/packages/tabs/package.json b/packages/tabs/package.json index b11dd7ac3..b6bd42699 100644 --- a/packages/tabs/package.json +++ b/packages/tabs/package.json @@ -36,7 +36,8 @@ "lion-tabs.js" ], "dependencies": { - "@lion/core": "^0.22.0" + "@lion/core": "^0.22.0", + "@lion/helpers": "^0.11.0" }, "keywords": [ "lion", diff --git a/packages/tabs/src/LionTabs.js b/packages/tabs/src/LionTabs.js index 9be49617b..2918a2c22 100644 --- a/packages/tabs/src/LionTabs.js +++ b/packages/tabs/src/LionTabs.js @@ -1,4 +1,5 @@ import { css, html, LitElement } from '@lion/core'; +import { uuid } from '@lion/helpers'; /** * @typedef {Object} StoreEntry @@ -11,10 +12,6 @@ import { css, html, LitElement } from '@lion/core'; * @property {(event: Event) => unknown} keyupHandler executed on keyup event */ -function uuid() { - return Math.random().toString(36).substr(2, 10); -} - /** * @param {StoreEntry} options */