@mgdis/stencil-helpers 1.0.0

package/dist/locale/index.conf.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Define json object type
+ */
+export type ObjectType = Record<string, unknown>;
+//# sourceMappingURL=index.conf.d.ts.map

package/dist/locale/index.conf.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.conf.d.ts","sourceRoot":"","sources":["../../src/locale/index.conf.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC"}

package/dist/locale/index.d.ts

@@ -0,0 +1,86 @@
+import type { ObjectType } from './index.conf';
+/**
+ * Gets the date pattern based on the specified locale.
+ * @param locale - the locale to refer to
+ * @returns date pattern
+ * @example
+ * ```ts
+ * getLocaleDatePattern('fr') // 'dd/mm/yyyy'
+ * ```
+ */
+export declare const getLocaleDatePattern: (locale: string) => string;
+/**
+ * Formats a date object to a string with the pattern 'YYYY-MM-DD'.
+ * @param date - date to parse
+ * @returns string date with pattern 'YYYY-MM-DD'
+ * @example
+ * ```ts
+ * dateToString(new Date('2023-12-24')) // '2023-12-24'
+ * ```
+ */
+export declare const dateToString: (date: Date) => string | undefined;
+/**
+ * Format number to the locale currency
+ * @param number - number to format
+ * @param locale - locale to apply
+ * @param currency - currency to apply
+ * @returns formatted currency
+ * @example
+ * ```ts
+ * localeCurrency(1234567890.12, 'fr', 'EUR') // '1 234 567 890,12\xa0€'
+ * ```
+ */
+export declare const localeCurrency: (number: number, locale: string, currency: string) => string;
+/**
+ * Format number to locale
+ * @param number - number to format
+ * @param locale - locale to apply
+ * @returns formatted number
+ * @example
+ * ```ts
+ * localeNumber(1234567890.12, 'fr') // 1 234 567 890,12
+ * ```
+ */
+export declare const localeNumber: (number: number, locale: string) => string;
+/**
+ * Date RegExp, usefull to test if string is a follow the date pattern
+ * @example
+ * ```ts
+ * dateRegExp.test('mystring') // false
+ * dateRegExp.test('2020-12-31') // true
+ * ```
+ */
+export declare const dateRegExp: RegExp;
+/**
+ * Locale date format
+ * @param date - date to format
+ * @param locale - locale to apply
+ * @returns formatted date
+ * @example
+ * ```ts
+ * localeDate('2022-06-02', 'fr') // '02/06/2022'
+ * ```
+ */
+export declare const localeDate: (date: string | undefined, locale: string) => string;
+/**
+ * Get Intl object
+ * @param messages - locales to render in object format. `ex: { en: { porp: "test" }, fr: { porp: "test" }}`.
+ * @param defaultLocale - fallback locale to render. `ex: 'en'`.
+ * @returns from the element passed in return function you will get the matching messages object
+ * @example
+ * ```ts
+ * import en from './en/messages.json';
+ * import fr from './fr/messages.json';
+ * import { defineLocales } from '@mgdis/stencil-helpers';
+ *
+ * const defaultLocale = 'en';
+ * const messages = { en, fr };
+ *
+ * export const initLocales = defineLocales(messages, defaultLocale);
+ * ```
+ */
+export declare const defineLocales: (messages: ObjectType, defaultLocale: 'fr' | 'en' | string) => (element: HTMLElement) => {
+    locale: string;
+    messages: ObjectType;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/locale/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/locale/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C;;;;;;;;GAQG;AACH,eAAO,MAAM,oBAAoB,WAAY,MAAM,WAKlD,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY,SAAU,IAAI,KAAG,MAAM,GAAG,SAA6C,CAAC;AAwBjG;;;;;;;;;;GAUG;AACH,eAAO,MAAM,cAAc,WAAY,MAAM,UAAU,MAAM,YAAY,MAAM,KAAG,MAAuF,CAAC;AAE1K;;;;;;;;;GASG;AACH,eAAO,MAAM,YAAY,WAAY,MAAM,UAAU,MAAM,KAAG,MAAsD,CAAC;AAErH;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU,QAAkD,CAAC;AAE1E;;;;;;;;;GASG;AACH,eAAO,MAAM,UAAU,SAAU,MAAM,GAAG,SAAS,UAAU,MAAM,KAAG,MAKrE,CAAC;AAEF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,aAAa,aACb,UAAU,iBAAiB,IAAI,GAAG,IAAI,GAAG,MAAM,eAChD,WAAW;YAAa,MAAM;cAAY,UAAU;CACT,CAAC"}

package/dist/storybook/index.conf.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Define compents default args type
+ */
+export type ArgsType = {
+    [x: string]: unknown;
+};
+//# sourceMappingURL=index.conf.d.ts.map

package/dist/storybook/index.conf.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.conf.d.ts","sourceRoot":"","sources":["../../src/storybook/index.conf.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG;IAAE,CAAC,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CAAE,CAAC"}

package/dist/storybook/index.d.ts

@@ -0,0 +1,48 @@
+import type { VNode } from '@stencil/core';
+import { ArgsType } from './index.conf';
+/**
+ * Filter default argument on component argument to prevent them to be rendered
+ * @param args - all possible args with custom values
+ * @param defaultValues - component default args values
+ * @returns filtres args
+ * @example
+ * ```ts
+ * import { filterArgs } from '@mgdis/stencil-helpers';
+ * const Template = (args: MgBadgeType): HTMLElement => <mg-badge {...filterArgs(args, { variant: variants[0] })}></mg-badge>;
+ * ```
+ */
+export declare const filterArgs: <T>(args: T, defaultValues?: T | undefined) => T;
+/**
+ * Storybook stencil wrapper. Used to target element with `storybook-root` id and render virtual DOM inside.
+ * @param storyFn - storybook render function
+ * @param context - storybook context
+ * @returns rendered element
+ * @example
+ * ```ts
+ * // .storybook/preview.ts
+ * import { stencilWrapper } from '@mgdis/stencil-helpers';
+ * export const decorators: Preview['decorators'] = [stencilWrapper];
+ * ```
+ */
+export declare const stencilWrapper: (storyFn: (ctx: any) => void, context: ArgsType) => Element | undefined;
+/**
+ * Get story HTML from virtual DOM.
+ * Mainly used to render, component code exemple in stories.
+ * @param vitualNode - story virtual DOM
+ * @returns stringified rendered HTML
+ * @example
+ * ```ts
+ * // .storybook/preview.ts
+ * import { getStoryHTML } from '@mgdis/stencil-helpers';
+ *
+ * export const parameters: Preview['parameters'] = {
+ *   docs: {
+ *     extractArgTypes,
+ *     extractComponentDescription,
+ *     transformSource: (_, ctx) => getStoryHTML(ctx.originalStoryFn(ctx.args)),
+ *   },
+ * };
+ * ```
+ */
+export declare const getStoryHTML: ({ $tag$, $attrs$, $children$, $text$ }: VNode) => string;
+//# sourceMappingURL=index.d.ts.map

package/dist/storybook/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/storybook/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AA6CxC;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU,kDAgBtB,CAAC;AAEF;;;;;;;;;;;GAWG;AAEH,eAAO,MAAM,cAAc,kBAAmB,GAAG,KAAK,IAAI,WAAW,QAAQ,KAAG,OAAO,GAAG,SAqBzF,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,YAAY,2CAA4C,KAAK,KAAG,MAM5E,CAAC"}

package/dist/test/index.d.ts

@@ -0,0 +1,2 @@
+export * from './unit';
+//# sourceMappingURL=index.d.ts.map

package/dist/test/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/test/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}

package/dist/test/unit.conf.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Define MutationObserver setup function signature
+ */
+export type SetupMutationObserverMockParams = {
+    disconnect: MutationObserver['disconnect'];
+    observe: MutationObserver['observe'];
+    takeRecords: MutationObserver['takeRecords'];
+};
+/**
+ * Define ResizeObserver setup function signature
+ */
+export type setupResizeObserverMockParams = {
+    disconnect: ResizeObserver['disconnect'];
+    observe: ResizeObserver['observe'];
+};
+//# sourceMappingURL=unit.conf.d.ts.map

package/dist/test/unit.conf.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"unit.conf.d.ts","sourceRoot":"","sources":["../../src/test/unit.conf.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,MAAM,+BAA+B,GAAG;IAAE,UAAU,EAAE,gBAAgB,CAAC,YAAY,CAAC,CAAC;IAAC,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAAC,WAAW,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAA;CAAE,CAAC;AAEjL;;GAEG;AACH,MAAM,MAAM,6BAA6B,GAAG;IAAE,UAAU,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IAAC,OAAO,EAAE,cAAc,CAAC,SAAS,CAAC,CAAA;CAAE,CAAC"}

package/dist/test/unit.d.ts

@@ -0,0 +1,66 @@
+import type { SetupMutationObserverMockParams, setupResizeObserverMockParams } from './unit.conf';
+/**
+ * Utility function that mocks the `MutationObserver` API. Recommended to execute inside `beforeEach`.
+ * @param mutationObserverMock - Parameter that is sent to the `Object.defineProperty`
+ * overwrite method. `jest.fn()` mock functions can be passed here if the goal is to not only
+ * mock the mutation observer, but its methods.
+ * You can manually fire an intersection entry:
+ * @param mutationObserverMock - configuration object
+ * @returns Mocked MutationObserver
+ * @example
+ * ```
+ * let fireMo;
+ * setupMutationObserverMock({
+ *   observe: function () {
+ *     fireMo = this.cb;
+ *   },
+ * });
+ * ...
+ * fireMo([{ type: 'childList', addedNodes: [AMockElemenet, AnotherMockElemenet], target: yourMockElemenet }]);;
+ * ```
+ */
+export declare const setupMutationObserverMock: ({ disconnect, observe, takeRecords }: SetupMutationObserverMockParams) => typeof MutationObserver;
+/**
+ * Utility function that mocks the `ResizeObserver` API. Recommended to execute inside `beforeEach`.
+ * @param resizeObserverMock - Parameter that is sent to the `Object.defineProperty`
+ * overwrite method. `jest.fn()` mock functions can be passed here if the goal is to not only
+ * mock the resize observer, but its methods.
+ * You can manually fire an intersection entry:
+ * @param resizeObserverMock - configuration object
+ * @returns Mocked ResizeObserver
+ * @example
+ * ```
+ * let fireRo;
+ * setupResizeObserverMock({
+ *   observe: function () {
+ *     fireRo = this.cb;
+ *   },
+ * });
+ * ...
+ * fireRo([{
+ *  borderBoxSize: ResizeObserverSize[],
+ *  contentBoxSize: ResizeObserverSize[],
+ *  contentRect: DOMRectReadOnly,
+ *  devicePixelContentBoxSize: ResizeObserverSize[],
+ *  target: yourMockElemenet
+ * }]);;
+ * ```
+ */
+export declare const setupResizeObserverMock: ({ disconnect, observe }: setupResizeObserverMockParams) => typeof ResizeObserver;
+declare class MockCustomEvent extends Event {
+    /**
+     *
+     */
+    detail: any;
+}
+/**
+ * Utility function that mocks the `SubmitEvent` API. Recommended to execute inside `beforeEach`.
+ * @example
+ * ```
+ * setupSubmitEventMock();
+ * ```
+ * @returns custom event mock
+ */
+export declare const setupSubmitEventMock: () => typeof MockCustomEvent;
+export {};
+//# sourceMappingURL=unit.d.ts.map

package/dist/test/unit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"unit.d.ts","sourceRoot":"","sources":["../../src/test/unit.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,+BAA+B,EAAE,6BAA6B,EAAE,MAAM,aAAa,CAAC;AAElG;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,yBAAyB,yCAA0C,+BAA+B,KAAG,uBAgCjH,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,uBAAuB,4BAA6B,6BAA6B,KAAG,qBAgChG,CAAC;AAEF,cAAM,eAAgB,SAAQ,KAAK;IACjC;;OAEG;IAEH,MAAM,EAAE,GAAG,CAAC;CACb;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,oBAAoB,QAAO,sBAYvC,CAAC"}

package/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@mgdis/stencil-helpers",
+  "version": "1.0.0",
+  "license": "ISC",
+  "author": "Nicolas Jouanno <jouanno-n@mgdis.fr>",
+  "maintainers": [
+    "Simon Duhem <duhem-s@mgdis.fr>",
+    "Nicolas Jouanno <jouanno-n@mgdis.fr>"
+  ],
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.umd.js",
+  "module": "./dist/index.es.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.umd.js"
+    }
+  },
+  "dependencies": {
+    "@stencil/core": "4.11.0"
+  },
+  "devDependencies": {
+    "@types/node": "20.11.6",
+    "@vitest/coverage-istanbul": "1.2.1",
+    "@vitest/coverage-v8": "1.2.1",
+    "typedoc": "0.25.7",
+    "typedoc-plugin-markdown": "3.17.1",
+    "typescript": "5.3.3",
+    "vite": "5.0.12",
+    "vite-plugin-dts": "3.7.2",
+    "vitest": "1.2.1",
+    "eslint-config-custom": "1.0.1",
+    "prettier-config": "1.0.1",
+    "tsconfig": "1.0.0"
+  },
+  "scripts": {
+    "build": "tsc --noEmit && vite build && typedoc",
+    "test": "vitest",
+    "coverage": "vitest run --coverage",
+    "lint": "pnpm lint:es && pnpm lint:prettier",
+    "lint:fix": "pnpm lint:es:fix && pnpm lint:prettier:fix",
+    "lint:es": "eslint '**/*.{ts,tsx}' --ignore-path ../../.gitignore",
+    "lint:es:fix": "eslint '**/*.{ts,tsx}' --fix --ignore-path ../../.gitignore",
+    "lint:prettier": "prettier --check '**/*.{js,ts,json}' --ignore-path ../../.gitignore",
+    "lint:prettier:fix": "prettier --write '**/*.{js,ts,json}' --ignore-path ../../.gitignore"
+  }
+}