@medyll/cssfabric 0.2.0 → 0.2.1-beta.2

package/dist/cssFabric/index.js

@@ -0,0 +1,341 @@
+import fsExtra from 'fs-extra';
+import { harmony } from 'simpler-color';
+import { colorConfig } from './config.js';
+import { CSSProperties } from './cssProperties.js';
+import { cssFabricSheet } from './cssFabricSheet.js';
+class CssFabricExport {
+    cssFabricModel;
+    exportPaths = {
+        css: './css-fabric.css',
+        json: './cssFabric.json'
+    };
+    constructor(cssFabricModel, exportPaths) {
+        this.cssFabricModel = cssFabricModel;
+        this.exportPaths = { ...exportPaths, ...this.exportPaths };
+        return this;
+    }
+    export(options) {
+        this.exportPaths = { ...this.exportPaths, ...options };
+        this.createCssFile();
+        this.createJsonModel();
+    }
+    createCssFile() {
+        // cssFabricBuilder.parseModel(cssCollection
+        fsExtra.writeFile(this.exportPaths.css, this.cssFabricModel.toString(), (err) => {
+            if (err) {
+                console.error(err);
+                return;
+            }
+            console.log('File created successfully.');
+        });
+    }
+    createJsonModel() {
+        fsExtra.writeFile(this.exportPaths.json, JSON.stringify(this.cssFabricModel), (err) => {
+            if (err) {
+                console.error(err);
+                return;
+            }
+            console.log('File created successfully.');
+        });
+    }
+}
+class CssFabricBuilder {
+    // defaultVariationSteps
+    cssFabricBuilderParams;
+    constructor() {
+        this.cssFabricBuilderParams = new CssFabricBuilderParams();
+    }
+    parseModel(json, parentKey = '') {
+        let css = parse(json, parentKey);
+        return `:root{\n${css}}`;
+        function parse(json, parentKey = '', titre = '') {
+            let css = '';
+            for (const key in json) {
+                if (typeof json[key] === 'object') {
+                    css += `\n/* ${key} */ `;
+                    //titre += `/* ----${key}--- */ `;
+                    css += parse(json[key], '', titre);
+                }
+                else {
+                    css += titre;
+                    css += `\n${parentKey}${key}: ${json[key]}`;
+                    titre = '';
+                }
+            }
+            return css;
+        }
+    }
+    createProgression(options, format = 'css') {
+        const { property, iteratorMask, propertyValue } = options;
+        const { presets } = options.steps ?? this.cssFabricBuilderParams.defaultVariationSteps;
+        let [from, to, increment] = options.steps.steps;
+        const [ease, trigger] = options.steps.ease;
+        if (presets) {
+            //sizeof prests becomes steps.
+            // cancels ease
+            if (presets) {
+                increment = to / presets.length;
+                options.steps.steps = [from, to, to / presets.length];
+            }
+        }
+        let css = '';
+        let cssKey = {};
+        for (let i = from; i <= to; i += i < trigger || i >= to - trigger ? increment / ease : increment) {
+            const iteratorTo = options.steps.reverseValue ? to - i : i;
+            const prop = `${property}-${i}`;
+            const content = propertyValue?.content[0]
+                ? `${propertyValue?.content[0].replace('##', propertyValue.content[1])} ${propertyValue?.apply}`
+                : '';
+            const newVal = `${iteratorMask.replace('##', iteratorTo.toString())}`;
+            css += `${prop}-${i}: ${content} ${newVal};\rn`;
+            cssKey[`${prop}`] = `${content} ${newVal}`;
+        }
+        return format === 'css' ? css : cssKey;
+    }
+    /**
+     * Dispatches elements based on the input mask.
+     *
+     * @template M - The type of the mask key.
+     * @template E - The type of the element.
+     * @template A - The type of the value.
+     *
+     * @param inputMask - The input mask.
+     * @param creatorFunction - The function to create the element based on the mask key.
+     * @param apply - The function to apply the value to the element.
+     */
+    dispatchHandleElements(inputMask, creatorFunction, apply) {
+        inputMask.forEach((maskKey, index) => {
+            const element = creatorFunction(inputMask[index], maskKey);
+            apply(element, inputMask[index]);
+        });
+    }
+    enqueue(callback, ...rest) {
+        const buildObject = (rootKeys, distributionKeys, index = 0) => {
+            if (index >= distributionKeys.length) {
+                return rootKeys.reduce((acc, key) => ({ ...acc, [key]: callback(key) }), {});
+            }
+            const currentDistribution = distributionKeys[index];
+            return rootKeys.reduce((acc, key) => {
+                const nestedObject = buildObject(currentDistribution, distributionKeys, index + 1);
+                return { ...acc, [key]: nestedObject };
+            }, {});
+        };
+        return buildObject(rest[0], rest.slice(1));
+    }
+    flattenIt(arr1, arr2, scope = 'color-') {
+        const legacy = {};
+        arr1.forEach((themeColor) => {
+            legacy[themeColor] = {};
+            arr2.forEach((props2) => {
+                if (!legacy[themeColor][props2])
+                    legacy[themeColor][props2] = {};
+                const tag = `${scope}${[themeColor, props2].join('-')}`;
+                legacy[themeColor][props2] = {
+                    [tag]: this.makeVariation(themeColor, props2)
+                        .replace('##', themeColor)
+                        .replace('{#vendor}', this.cssFabricBuilderParams.vendorName)
+                };
+            });
+        });
+        return legacy;
+    }
+    makeVariation(themeColor, variation) {
+        return this.cssFabricBuilderParams.variations?.[variation]
+            ? this.cssFabricBuilderParams.variations[variation]
+            : themeColor;
+    }
+    makeDefaultVariations(arr1, arr2, prefix, vendor = '--cssfab-') {
+        const out = {};
+        arr1.forEach((themeColor) => {
+            out[themeColor] = {};
+            arr2.forEach((props2) => {
+                out[themeColor][props2] = this.createProgression({
+                    property: `${vendor}${themeColor}-${props2}`,
+                    iteratorMask: `color-mix(in srgb, var(${prefix}${themeColor}) ${this.cssFabricBuilderParams.correspondances[props2]} ##%);`,
+                    steps: this.cssFabricBuilderParams.defaultVariationSteps
+                }, 'json');
+            });
+        });
+        return out;
+    }
+    mainRule(vars, prefix) {
+        const collect = {};
+        if (vars)
+            Object.keys(vars).forEach((key) => {
+                const val = vars[key];
+                collect[key] = { [`${prefix}${key}`]: `${val};` };
+            });
+        return collect;
+    }
+}
+// primary.presets
+class CssFabricBuilderParams {
+    vendorName = '--cssfab-';
+    variations = {
+        none: 'var({#vendor}-color-##);',
+        light: 'color-mix(in srgb, var({#vendor}-color-##) white ##%);',
+        lighter: 'color-mix(in srgb, var({#vendor}-color-##) white ##%);',
+        dark: 'color-mix(in srgb, var({#vendor}-color-##) black ##%);',
+        darker: 'color-mix(in srgb, var({#vendor}-color-##) black ##%);',
+        complement: 'color-mix(in srgb, var({#vendor}-color-##) black ##%);',
+        invert: 'color-mix(in srgb, var({#vendor}-color-##) black ##%);',
+        'alpha-low': 'color-mix(in srgb, var({#vendor}-color-##) transparent ##%);',
+        alpha: 'color-mix(in srgb, var({#vendor}-color-##) transparent ##%);',
+        'alpha-high': 'color-mix(in srgb, var({#vendor}-color-##) transparent ##%);'
+    };
+    defaultVariationSteps = {
+        steps: [0, 100, 10],
+        ease: [2, 20]
+    };
+    correspondances = {
+        lighten: 'white',
+        light: 'white',
+        lighter: 'white',
+        darken: 'black',
+        dark: 'black',
+        darker: 'black',
+        gray: '#333',
+        opacity: 'transparent',
+        'alpha-high': 'transparent',
+        'alpha-low': 'transparent',
+        alpha: 'transparent'
+    };
+    baseColors;
+    presets = [
+        'light',
+        'lighter',
+        'dark',
+        'darker',
+        'complement',
+        'invert',
+        'alpha-low',
+        'alpha',
+        'alpha-high'
+    ];
+    config = {};
+    constructor() {
+        this.baseColors = harmony('#9e3902');
+        this.config = this.deepMerge(colorConfig, { theme: harmony('#9e3902') });
+        return this;
+    }
+    setVariations(variations) {
+        this.variations = { ...this.variations, ...variations };
+    }
+    setDefaultVariationSteps(variationSteps) {
+        this.defaultVariationSteps = { ...this.defaultVariationSteps, ...variationSteps };
+    }
+    deepMerge(...objects) {
+        function objectMerge(target, source) {
+            for (const key of Object.keys(source)) {
+                const currenttarget = target[key];
+                const currentsource = source[key];
+                if (currenttarget) {
+                    const objectsource = typeof currentsource === 'object';
+                    const objecttarget = typeof currenttarget === 'object';
+                    if (objectsource && objecttarget) {
+                        void (Array.isArray(currenttarget) && Array.isArray(currentsource)
+                            ? void (target[key] = currenttarget.concat(currentsource))
+                            : void objectMerge(currenttarget, currentsource));
+                        continue;
+                    }
+                }
+                target[key] = currentsource;
+            }
+            return target;
+        }
+        return objects.reduce(function (prev, next) {
+            return { ...prev, ...objectMerge(prev, next) };
+        }, objects[0]);
+    }
+}
+var ModelConfigKeys;
+(function (ModelConfigKeys) {
+    ModelConfigKeys[ModelConfigKeys["base"] = 0] = "base";
+    ModelConfigKeys[ModelConfigKeys["palette"] = 1] = "palette";
+    ModelConfigKeys[ModelConfigKeys["presets"] = 2] = "presets";
+    ModelConfigKeys[ModelConfigKeys["status"] = 3] = "status";
+    ModelConfigKeys[ModelConfigKeys["out"] = 4] = "out";
+    ModelConfigKeys[ModelConfigKeys["gray"] = 5] = "gray";
+    ModelConfigKeys[ModelConfigKeys["out2"] = 6] = "out2";
+})(ModelConfigKeys || (ModelConfigKeys = {}));
+class CssFabric {
+    vendor = (fragment = '') => `${this.cssFabricBuilderParams.vendorName}${fragment}`;
+    cssFabricModel = {};
+    cssFabricBuilderParams;
+    cssFabricBuilder;
+    constructor() {
+        this.cssFabricBuilder = new CssFabricBuilder();
+        this.cssFabricBuilderParams = new CssFabricBuilderParams();
+    }
+    cleanModelKey(modelKey) {
+        return modelKey.replace(/'/g, '');
+    }
+    setParams(params) {
+        this.cssFabricBuilderParams = {
+            ...this.cssFabricBuilderParams,
+            ...params
+        };
+    }
+    createCssFabricVarsColors(...args) {
+        args.forEach((modelKey) => {
+            switch (this.cleanModelKey(modelKey)) {
+                case 'base':
+                    this.cssFabricModel.base = this.cssFabricBuilder.mainRule(this.cssFabricBuilderParams.config.theme, this.vendor());
+                    break;
+                case 'palette':
+                    this.cssFabricModel.palette = this.cssFabricBuilder.mainRule(this.cssFabricBuilderParams.config.palette, this.vendor('palette-'));
+                    break;
+                case 'presets':
+                    this.cssFabricModel.presets = this.cssFabricBuilder.flattenIt(['primary', 'secondary', 'tertiary', 'accent'], this.cssFabricBuilderParams.presets, this.vendor('presets-'));
+                    break;
+                case 'status':
+                    this.cssFabricModel.status = this.cssFabricBuilder.mainRule(this.cssFabricBuilderParams.config.status, this.vendor('status-'));
+                    break;
+                case 'out':
+                    // assombrir et rendre opaque  'primary', 'secondary', 'tertiary'
+                    this.cssFabricModel.out = this.cssFabricBuilder.makeDefaultVariations(['primary', 'secondary', 'tertiary'], ['lighten', 'darken', 'opacity'], this.vendor());
+                    break;
+                case 'gray':
+                    this.cssFabricModel.gray = this.cssFabricBuilder.createProgression({
+                        property: this.vendor(`color-gray`),
+                        iteratorMask: `color-mix(in srgb, ${this.vendor(`color-gray`)}  ${this.cssFabricBuilderParams.correspondances.gray} ##%);`,
+                        steps: this.cssFabricBuilderParams.defaultVariationSteps
+                    }, 'json');
+                    break;
+                case 'out2':
+                    // assombrir et rendre opaque  'primary', 'secondary', 'tertiary'
+                    this.cssFabricModel.out2 = this.cssFabricBuilder.makeDefaultVariations(['foreground', 'bg'], ['lighten', 'darken', 'opacity'], this.vendor());
+                    break;
+                default:
+                    console.log('default', modelKey);
+                    break;
+            }
+        });
+        return {
+            export: (options) => new CssFabricExport(this.cssFabricModel, options).export(options),
+            css: JSON.stringify(this.cssFabricModel)
+        };
+    }
+    cssFabricSheet() {
+        const cssP = new CSSProperties(cssFabricSheet /* , ['overflow'] */);
+        const cssF = cssP.generateCSS();
+        return {
+            export: (options) => new CssFabricExport(cssF, options).export(options),
+            css: cssF
+        };
+    }
+}
+// overflow , text-overflow, text-decoration
+export const cssFabric = new CssFabric();
+const styleSheet = cssFabric.cssFabricSheet();
+styleSheet.export({ css: './css-fabric-sheet.css', json: './cssFabric-sheet.json' });
+/* const model = cssFabric.createCssFabricVarsColors(
+    'base',
+    'palette',
+    'presets',
+    'status',
+    'out',
+    'gray',
+    'out2'
+);
+model.export({ css: './css-fabric.css', json: './cssFabric.json' }); */

package/dist/cssf/README.md

@@ -0,0 +1,197 @@
+# About css stuff
+
+- ## It's about css
+
+  It's about css and the way some revolutions did save the world.  
+   It's not about suffering, it's about emancipation, because being static is always a first start.  
+   And it's about css. And a bit about Tailwind. Because tailwind did save us.
+
+  #### lovy Granny
+
+  To learn me the little cssSheet redbook, my grandMa did the basis. She was born in 1480 and did work since her 14s at the W3C, her job was to set normes a normal way. She was a bit of a monster, but she was right.
+
+  #### complexity
+
+  And she was right with the method: keeping me with a clou transperçant my feet while repeating the declinations of cssRules was the way to make me strong. The feeling of css needs the knowledge of pain.
+
+  #### complexity and strength
+
+  Because if it's complex, you're strong!
+
+- ## It's not about Tailwind
+
+  But i kept having some secrets toughs : but what if the word was organized an organized way ?
+
+  **questions** : i know that a property which randomly target the outer or the inner of the concerned element is savagely cool, but what if not ? what if top was a position ? what if i want to setup the left and the right of the same border declaration ? what if verbosity was not the goal ? may i dream or did i dream ?  
+  **answers** : Because there were no problems, i decided to seek for a solution. And i did reach severals.
+
+  ### utility classes are right
+
+  Around 2005, i did my first utility css monster. Based on php, acronym of "best language ever", it made me the king of velocity. Year and babies after, a non impressioné colleague asked me a simple question :
+
+  ### Tailwind is right
+
+  He asked: do you know things about **Tailwind** ? Do you know it has a wild css coverage and a lot of pretty babies ?
+
+  - #### Humanity is a pretty monster
+
+    He revealed me also the existence of a "reseau social", called Twitter, so i headed to it and it was a 5 elements Lilo thing, the lagrimas revelation time. The humanity is seeking for a solution while css detonations do craters with border-radius-top-left properties. And people are fighting in their textual multi-verse, yelling to each others that tailwind is a master so why do you yell ?
+
+  - #### Tailwind is unsinkable
+
+    Humanity is a pretty and a monster, and css are born in this humanity nest. css is eradicating humanity and Tailwind is the anchor which prevents the word to sink. Working without utility classes is a time consuming task, obvious leading to the nearest of a delirium tremens : reporting this is not an information, this is a therapy.
+
+  - #### Css is a time traveling iceberg
+
+    But the fact is, Tailwind is the unsinkable boat, and css is the iceberg. Utility classes are a must, so why the anger ? Aren't we safe from the iceberg ? Each time we approach it, we defeat the risk with a re-implementation time loop, UnoCss being my favorite one.
+
+- ## It's a about the void
+
+  > There is no solution.
+
+  There are no solutions.  
+   The socle is the problem, here is the void:
+
+  ```css
+  ::void {
+  	position: absolute; /* a flow */
+  	width: 0; /* a size */
+  	top: -50px; /* a position */
+  	margin: -50px 20px; /* a position! **/
+  	gap: 20px; /* a gutter */
+  	padding: 20px; /* a gutter */
+  	display: inline; /* a flow */
+  	display: none; /* a state */
+  	display: flex; /* Inhaltsausrichtung ? */
+  	color: #000; /* a color */
+  	background-color: #fff; /* a color */
+  }
+  ```
+
+- ## It's about this time loop
+
+  Organization with Tailwind or other utility classes is mandatory for readability and maintainability. Because if you claim never going back to the code, then you'll have to admit the existence of fear.  
+   What is the point ?  
+   We love Tailwind, **Unocss** or others because they are global shorteners. You think, you write, bam !  
+   Let's get it with some words :
+
+  #### from tailwind utility verb
+
+  Bringing back the shortness to the '\<style>' tag is a meeting point : seeming **near standards**. Here, categorization means readability and **predictability**.
+
+  This could be the only way, this is mine since epoch:
+
+  ```scss
+  input {
+  	--at-apply: padding gap;
+  	--at-apply: width height;
+  	--at-apply: left top right bottom margin;
+  	--at-apply: border shadow radius;
+  	--at-apply: color bg;
+  	--at-apply: absolute fixed static sticky;
+  	&:hover {
+  		--at-apply: color bg;
+  	}
+  }
+  ```
+
+  #### to semantic css words
+
+  right, bottom, top and left are a position. and collide with position being a property.  
+   width and height are a size, a dimension, they should stick together.  
+   margin and padding seem friends, but concern the outer vs the inner of the element.  
+   utility needs semantics :
+
+  ```css
+  input {
+  	margin: padding gap;
+  	size: width height;
+  	position: left top right bottom middle center margin;
+  	box: border shadow radius;
+  	theme: color bg;
+  }
+  ```
+
+  #### with a single definition
+
+  thinking about css should be like a **pure function** : one though, same response.  
+   This is not the case: the mental model needs to be switched depending on the css rule.  
+   I mean, like working on **padding** and switching to **border** :
+
+  ```scss
+  /** css-verse reality border in the world of paddings */
+  :css-verse {
+  	.earth-606 {
+  		padding: 10px 5px 2px 3rem;
+  	}
+  	.reality {
+  		border: 1px 2px 4px none;
+  		border-color: red white orange blue;
+  		border-radius: 10px 20px;
+  	}
+  }
+  ```
+
+- ## It's about hoping
+
+  > hoping is having hope, but actively.
+
+  To implement this i need :
+
+  - a rule set: to decide the verbs
+  - a model: to ensure strict rules
+  - a parser : to walk trough the model
+  - a transformer : to render back the rules.
+
+  the needed mental strength :
+
+  - a guide: bringing active solidity
+  - a hole: there are some glitches to ditch in it, some properties to abandon, sadness to have
+  - a goal: the browser is not the goal, could it be ?
+
+  Let's start with something else : the guide to ensure consistency
+
+  ```typescript
+  /**
+   * cssGuide :
+   * transforms the model to a ts declaration file and an associated class methods.
+   */
+  export class CssGuide {
+  	cssfModelTypes: CssfModelTypes;
+  	interfaceName = 'CssfInterface';
+  	className = 'CssfCkass';
+
+  	constructor(cssfModel: CssfModelTypes) {
+  		this.cssfModelTypes = cssfModel;
+  	}
+
+  	generate(objModel: Record<string, any>) {
+  		const unify = (arr: string[] | string): string => {
+  			return
+  		};
+
+  		let meta = `imports;\n`;
+  		let interfaces = `export interface ${this.interfaceName} {\n`;
+  		let classMethods = `export class ${this.className} {\n`;
+
+  		for (const type of this.cssfModelTypes) {
+  			meta += `type ${val};\n`;
+  		}
+
+  		for (const [outerKey, value] of Object.entries(objModel)) {
+  			interfaces += `${outerKey}: {\n`;
+  			classMethods += `${outerKey}(decl: postcss.Declaration) {\n    return {\n`;
+
+  			for (const [key, val] of Object.entries(value)) {...}
+
+  			interfaces += '  };\n';
+  			classMethods += '    };\n  }\n';
+  		}
+
+  		interfaces += '}\n';
+  		classMethods += '}\n';
+
+  		return { meta, interfaces, classMethods };
+  	}
+  }
+  ```

package/{init/importCssVars.d.ts → dist/cssf/cssf.d.ts}

@@ -1 +1 @@
-export {};
+export {};

package/dist/cssf/cssf.js

@@ -0,0 +1,12 @@
+import fs from 'fs-extra';
+import { CssGuide } from './cssfGuide.js';
+import { cssfModelTypes, cssfModel } from './cssfModel.js';
+/* const processor = postcss([myPlugin]);
+
+processor.process('a { color: black; }').then((result) => {
+    console.log(result.css);
+}); */
+const cssGuide = new CssGuide(cssfModelTypes);
+const { meta, interfaces, classMethods, classTypes, transformerTypes } = cssGuide.generate(cssfModel);
+console.log(meta, interfaces, classMethods, classTypes, transformerTypes);
+fs.writeFileSync('src/lib/cssf/cssfLib.ts', meta + classTypes + transformerTypes + interfaces + classMethods);

package/dist/cssf/cssfGuide.d.ts

@@ -0,0 +1,14 @@
+import type { CssfModelTypes } from './cssfModel.js';
+export declare class CssGuide {
+    cssfModelTypes: CssfModelTypes;
+    interfaceName: string;
+    className: string;
+    constructor(cssfModel: CssfModelTypes);
+    generate(objModel: Record<string, Record<string, any>>): {
+        meta: string;
+        classTypes: string;
+        transformerTypes: string;
+        interfaces: string;
+        classMethods: string;
+    };
+}

package/dist/cssf/cssfGuide.js

@@ -0,0 +1,50 @@
+export class CssGuide {
+    cssfModelTypes;
+    interfaceName = 'CssfInterface';
+    className = 'CssfClass';
+    constructor(cssfModel) {
+        this.cssfModelTypes = cssfModel;
+    }
+    generate(objModel) {
+        const unify = (arr) => {
+            const rr = Array.isArray(arr) ? arr : [arr];
+            function isType(val) {
+                return val === 'string' || val === 'number';
+            }
+            return rr.map((item) => (Array.isArray(item) ? `[${unify(item)}]` : `'${item}'`)).join(' | ');
+        };
+        let meta = `/** generated ! */\nimport postcss from 'postcss';\n\n\n\n`;
+        let interfaces = `export interface ${this.interfaceName} {\n{{interfaces}}\n}`;
+        let transformerTypes = `export interface ${this.interfaceName}T {\n{{transformer}}\n}`;
+        let classMethods = `export class ${this.className} {\n{{methods}}\n}`;
+        let classTypes = `/** generated types */\n{{types}}\n`;
+        let collectClassMethods = '';
+        let collectInterfaces = '';
+        let collectTypes = '';
+        let collectTransformerTypes = '';
+        for (const type of this.cssfModelTypes) {
+            const val = type.includes('=') ? type : type + ' = string | number';
+            collectTypes += `type ${val};\n`;
+        }
+        for (const [outerKey, value] of Object.entries(objModel)) {
+            collectInterfaces += `  ${outerKey}: {\n`;
+            collectTransformerTypes += `  ${outerKey}: {\n`;
+            collectClassMethods += `  ${outerKey}(decl: postcss.Declaration) {\n    return {\n`;
+            for (const [key, val] of Object.entries(value)) {
+                collectInterfaces += `    ${key}: ${unify(val)};\n`;
+                collectTransformerTypes += `    ${key}: ( decl: postcss.Declaration, ...value: ${this.interfaceName}['${outerKey}']['${key}'][])=> void ;\n`;
+                collectClassMethods += `      ${key}: (...args: ${this.interfaceName}['${outerKey}']['${key}'][]) => {
+					return args;
+				},\n`;
+            }
+            collectInterfaces += '  };\n';
+            collectTransformerTypes += '  };\n';
+            collectClassMethods += '    };\n  }\n ';
+        }
+        classMethods = classMethods.replace('{{methods}}', collectClassMethods);
+        interfaces = interfaces.replace('{{interfaces}}', collectInterfaces);
+        transformerTypes = transformerTypes.replace('{{transformer}}', collectTransformerTypes);
+        classTypes = classTypes.replace('{{types}}', collectTypes);
+        return { meta, classTypes, transformerTypes, interfaces, classMethods };
+    }
+}