@elementor/editor-styles 0.2.0

package/CHANGELOG.md

@@ -0,0 +1,19 @@
+# @elementor/editor-styles
+
+## 0.2.0
+
+### Minor Changes
+
+- 6cf7ba1: Change controls naming
+- e69bdae: Created the `editor-props` and `editor-styles` packages.
+
+### Patch Changes
+
+- 2b28089: Add classes prop context to support global classes
+- 036b439: Refactor styles context as preparation for global css classes
+- Updated dependencies [9abdfaf]
+- Updated dependencies [6cf7ba1]
+- Updated dependencies [e69bdae]
+- Updated dependencies [bf12c4d]
+  - @elementor/editor-responsive@0.12.2
+  - @elementor/editor-props@0.2.0

package/README.md

@@ -0,0 +1,4 @@
+# Editor Styles
+
+> [!WARNING]
+> This package is under development and not ready for production use.

package/dist/index.d.mts

@@ -0,0 +1,24 @@
+import { Props } from '@elementor/editor-props';
+import { BreakpointId } from '@elementor/editor-responsive';
+
+type StyleState = null | 'hover' | 'focus' | 'active' | 'visited' | 'disabled' | 'checked' | 'selected' | 'hidden' | 'visible';
+type StyleVariant = {
+    meta: {
+        breakpoint: null | BreakpointId;
+        state: StyleState;
+    };
+    props: Props;
+};
+type StyleType = 'class';
+type StyleDefinitionID = string;
+type StyleDefinition = {
+    id: StyleDefinitionID;
+    variants: StyleVariant[];
+    label?: string;
+    type: StyleType;
+};
+type StyleDefinitionsMap = Record<StyleDefinition['id'], StyleDefinition>;
+
+declare function generateId(prefix?: string, existingIds?: string[]): string;
+
+export { type StyleDefinition, type StyleDefinitionID, type StyleDefinitionsMap, type StyleVariant, generateId };

package/dist/index.d.ts

@@ -0,0 +1,24 @@
+import { Props } from '@elementor/editor-props';
+import { BreakpointId } from '@elementor/editor-responsive';
+
+type StyleState = null | 'hover' | 'focus' | 'active' | 'visited' | 'disabled' | 'checked' | 'selected' | 'hidden' | 'visible';
+type StyleVariant = {
+    meta: {
+        breakpoint: null | BreakpointId;
+        state: StyleState;
+    };
+    props: Props;
+};
+type StyleType = 'class';
+type StyleDefinitionID = string;
+type StyleDefinition = {
+    id: StyleDefinitionID;
+    variants: StyleVariant[];
+    label?: string;
+    type: StyleType;
+};
+type StyleDefinitionsMap = Record<StyleDefinition['id'], StyleDefinition>;
+
+declare function generateId(prefix?: string, existingIds?: string[]): string;
+
+export { type StyleDefinition, type StyleDefinitionID, type StyleDefinitionsMap, type StyleVariant, generateId };

package/dist/index.js

@@ -0,0 +1,39 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  generateId: () => generateId
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/generateId.ts
+function generateId(prefix = "", existingIds = []) {
+  let id;
+  do {
+    id = prefix + Math.random().toString(16).slice(2, 9);
+  } while (existingIds.includes(id));
+  return id;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  generateId
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/generateId.ts"],"sourcesContent":["// types\nexport * from './types';\n\n// utils\nexport { generateId } from './generateId';\n","export function generateId( prefix: string = '', existingIds: string[] = [] ) {\n\tlet id: string;\n\n\tdo {\n\t\tid = prefix + Math.random().toString( 16 ).slice( 2, 9 );\n\t} while ( existingIds.includes( id ) );\n\n\treturn id;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAO,SAAS,WAAY,SAAiB,IAAI,cAAwB,CAAC,GAAI;AAC7E,MAAI;AAEJ,KAAG;AACF,SAAK,SAAS,KAAK,OAAO,EAAE,SAAU,EAAG,EAAE,MAAO,GAAG,CAAE;AAAA,EACxD,SAAU,YAAY,SAAU,EAAG;AAEnC,SAAO;AACR;","names":[]}

package/dist/index.mjs

@@ -0,0 +1,12 @@
+// src/generateId.ts
+function generateId(prefix = "", existingIds = []) {
+  let id;
+  do {
+    id = prefix + Math.random().toString(16).slice(2, 9);
+  } while (existingIds.includes(id));
+  return id;
+}
+export {
+  generateId
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/generateId.ts"],"sourcesContent":["export function generateId( prefix: string = '', existingIds: string[] = [] ) {\n\tlet id: string;\n\n\tdo {\n\t\tid = prefix + Math.random().toString( 16 ).slice( 2, 9 );\n\t} while ( existingIds.includes( id ) );\n\n\treturn id;\n}\n"],"mappings":";AAAO,SAAS,WAAY,SAAiB,IAAI,cAAwB,CAAC,GAAI;AAC7E,MAAI;AAEJ,KAAG;AACF,SAAK,SAAS,KAAK,OAAO,EAAE,SAAU,EAAG,EAAE,MAAO,GAAG,CAAE;AAAA,EACxD,SAAU,YAAY,SAAU,EAAG;AAEnC,SAAO;AACR;","names":[]}

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@elementor/editor-styles",
+  "description": "This package contains the styles model for the Elementor editor",
+  "version": "0.2.0",
+  "private": false,
+  "author": "Elementor Team",
+  "homepage": "https://elementor.com/",
+  "license": "GPL-3.0-or-later",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/elementor/elementor-packages.git",
+    "directory": "packages/libs/editor-styles"
+  },
+  "bugs": {
+    "url": "https://github.com/elementor/elementor-packages/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "README.md",
+    "CHANGELOG.md",
+    "/dist",
+    "/src",
+    "!**/__tests__"
+  ],
+  "scripts": {
+    "build": "tsup --config=../../tsup.build.ts",
+    "dev": "tsup --config=../../tsup.dev.ts"
+  },
+  "dependencies": {
+    "@elementor/editor-props": "^0.2.0",
+    "@elementor/editor-responsive": "^0.12.2"
+  }
+}

package/src/generateId.ts

@@ -0,0 +1,9 @@
+export function generateId( prefix: string = '', existingIds: string[] = [] ) {
+	let id: string;
+
+	do {
+		id = prefix + Math.random().toString( 16 ).slice( 2, 9 );
+	} while ( existingIds.includes( id ) );
+
+	return id;
+}

package/src/index.ts

@@ -0,0 +1,5 @@
+// types
+export * from './types';
+
+// utils
+export { generateId } from './generateId';

package/src/types.ts

@@ -0,0 +1,35 @@
+import { Props } from '@elementor/editor-props';
+import { BreakpointId } from '@elementor/editor-responsive';
+
+type StyleState =
+	| null
+	| 'hover'
+	| 'focus'
+	| 'active'
+	| 'visited'
+	| 'disabled'
+	| 'checked'
+	| 'selected'
+	| 'hidden'
+	| 'visible';
+
+export type StyleVariant = {
+	meta: {
+		breakpoint: null | BreakpointId;
+		state: StyleState;
+	};
+	props: Props;
+};
+
+type StyleType = 'class';
+
+export type StyleDefinitionID = string;
+
+export type StyleDefinition = {
+	id: StyleDefinitionID;
+	variants: StyleVariant[];
+	label?: string;
+	type: StyleType;
+};
+
+export type StyleDefinitionsMap = Record< StyleDefinition[ 'id' ], StyleDefinition >;