@medyll/cssfabric 0.2.0 → 0.2.1-beta.2

package/dist/cssf/cssfLib.d.ts

@@ -0,0 +1,134 @@
+/** generated ! */
+import postcss from 'postcss';
+export interface CssfInterfaceT {
+    gutter: {
+        type: (decl: postcss.Declaration, ...value: CssfInterface['gutter']['type'][]) => void;
+        gap: (decl: postcss.Declaration, ...value: CssfInterface['gutter']['gap'][]) => void;
+        padding: (decl: postcss.Declaration, ...value: CssfInterface['gutter']['padding'][]) => void;
+    };
+    position: {
+        left: (decl: postcss.Declaration, ...value: CssfInterface['position']['left'][]) => void;
+        top: (decl: postcss.Declaration, ...value: CssfInterface['position']['top'][]) => void;
+        right: (decl: postcss.Declaration, ...value: CssfInterface['position']['right'][]) => void;
+        bottom: (decl: postcss.Declaration, ...value: CssfInterface['position']['bottom'][]) => void;
+        margin: (decl: postcss.Declaration, ...value: CssfInterface['position']['margin'][]) => void;
+    };
+    box: {
+        border: (decl: postcss.Declaration, ...value: CssfInterface['box']['border'][]) => void;
+        shadow: (decl: postcss.Declaration, ...value: CssfInterface['box']['shadow'][]) => void;
+        radius: (decl: postcss.Declaration, ...value: CssfInterface['box']['radius'][]) => void;
+        overflow: (decl: postcss.Declaration, ...value: CssfInterface['box']['overflow'][]) => void;
+    };
+    size: {
+        width: (decl: postcss.Declaration, ...value: CssfInterface['size']['width'][]) => void;
+        height: (decl: postcss.Declaration, ...value: CssfInterface['size']['height'][]) => void;
+        ratio: (decl: postcss.Declaration, ...value: CssfInterface['size']['ratio'][]) => void;
+    };
+    typography: {
+        font: (decl: postcss.Declaration, ...value: CssfInterface['typography']['font'][]) => void;
+        size: (decl: postcss.Declaration, ...value: CssfInterface['typography']['size'][]) => void;
+        style: (decl: postcss.Declaration, ...value: CssfInterface['typography']['style'][]) => void;
+        underline: (decl: postcss.Declaration, ...value: CssfInterface['typography']['underline'][]) => void;
+        shadow: (decl: postcss.Declaration, ...value: CssfInterface['typography']['shadow'][]) => void;
+    };
+    color: {
+        text: (decl: postcss.Declaration, ...value: CssfInterface['color']['text'][]) => void;
+        bg: (decl: postcss.Declaration, ...value: CssfInterface['color']['bg'][]) => void;
+        opacity: (decl: postcss.Declaration, ...value: CssfInterface['color']['opacity'][]) => void;
+    };
+    animate: {
+        transition: (decl: postcss.Declaration, ...value: CssfInterface['animate']['transition'][]) => void;
+        all: (decl: postcss.Declaration, ...value: CssfInterface['animate']['all'][]) => void;
+        duration: (decl: postcss.Declaration, ...value: CssfInterface['animate']['duration'][]) => void;
+        timing: (decl: postcss.Declaration, ...value: CssfInterface['animate']['timing'][]) => void;
+        delay: (decl: postcss.Declaration, ...value: CssfInterface['animate']['delay'][]) => void;
+    };
+}
+export interface CssfInterface {
+    gutter: {
+        type: 'flex' | 'grid';
+        gap: 'string';
+        padding: 'all' | ['top' | 'bottom'] | ['top' | 'bottom' | 'left' | 'right'];
+    };
+    position: {
+        left: 'string';
+        top: 'string';
+        right: 'string';
+        bottom: 'string';
+        margin: 'all' | ['top' | 'bottom'] | ['top' | 'bottom' | 'left' | 'right'];
+    };
+    box: {
+        border: 'all' | ['top' | 'bottom'] | ['top' | 'bottom' | 'left' | 'right'];
+        shadow: [];
+        radius: 'string' | 'string?' | 'string?' | 'string?';
+        overflow: ['visible | hidden' | ['x' | 'y']];
+    };
+    size: {
+        width: 'string' | 'min?' | 'max?';
+        height: 'string' | 'min?' | 'max?';
+        ratio: 'string , string?';
+    };
+    typography: {
+        font: 'string';
+        size: 'string';
+        style: 'bold' | 'italic' | 'normal' | 'string';
+        underline: 'none' | 'dotted' | 'dashed' | 'solid' | 'double' | 'wavy' | 'string';
+        shadow: 'string' | 'string?' | 'string?' | 'string?';
+    };
+    color: {
+        text: 'string';
+        bg: 'string';
+        opacity: 'string' | 'number';
+    };
+    animate: {
+        transition: ['duration' | 'timing' | 'delay'];
+        all: 'all' | 'none' | 'cssProp';
+        duration: 'string';
+        timing: 'string';
+        delay: 'string';
+    };
+}
+export declare class CssfClass {
+    gutter(decl: postcss.Declaration): {
+        type: (...args: CssfInterface['gutter']['type'][]) => ("flex" | "grid")[];
+        gap: (...args: CssfInterface['gutter']['gap'][]) => "string"[];
+        padding: (...args: CssfInterface['gutter']['padding'][]) => ("all" | ["top" | "bottom"] | ["top" | "bottom" | "left" | "right"])[];
+    };
+    position(decl: postcss.Declaration): {
+        left: (...args: CssfInterface['position']['left'][]) => "string"[];
+        top: (...args: CssfInterface['position']['top'][]) => "string"[];
+        right: (...args: CssfInterface['position']['right'][]) => "string"[];
+        bottom: (...args: CssfInterface['position']['bottom'][]) => "string"[];
+        margin: (...args: CssfInterface['position']['margin'][]) => ("all" | ["top" | "bottom"] | ["top" | "bottom" | "left" | "right"])[];
+    };
+    box(decl: postcss.Declaration): {
+        border: (...args: CssfInterface['box']['border'][]) => ("all" | ["top" | "bottom"] | ["top" | "bottom" | "left" | "right"])[];
+        shadow: (...args: CssfInterface['box']['shadow'][]) => [][];
+        radius: (...args: CssfInterface['box']['radius'][]) => ("string" | "string?")[];
+        overflow: (...args: CssfInterface['box']['overflow'][]) => ["visible | hidden" | ["x" | "y"]][];
+    };
+    size(decl: postcss.Declaration): {
+        width: (...args: CssfInterface['size']['width'][]) => ("string" | "min?" | "max?")[];
+        height: (...args: CssfInterface['size']['height'][]) => ("string" | "min?" | "max?")[];
+        ratio: (...args: CssfInterface['size']['ratio'][]) => "string , string?"[];
+    };
+    typography(decl: postcss.Declaration): {
+        font: (...args: CssfInterface['typography']['font'][]) => "string"[];
+        size: (...args: CssfInterface['typography']['size'][]) => "string"[];
+        style: (...args: CssfInterface['typography']['style'][]) => ("string" | "bold" | "italic" | "normal")[];
+        underline: (...args: CssfInterface['typography']['underline'][]) => ("string" | "none" | "dotted" | "dashed" | "solid" | "double" | "wavy")[];
+        shadow: (...args: CssfInterface['typography']['shadow'][]) => ("string" | "string?")[];
+    };
+    color(decl: postcss.Declaration): {
+        text: (...args: CssfInterface['color']['text'][]) => "string"[];
+        bg: (...args: CssfInterface['color']['bg'][]) => "string"[];
+        opacity: (...args: CssfInterface['color']['opacity'][]) => ("string" | "number")[];
+    };
+    animate(decl: postcss.Declaration): {
+        transition: (...args: CssfInterface['animate']['transition'][]) => ["duration" | "timing" | "delay"][];
+        all: (...args: CssfInterface['animate']['all'][]) => ("all" | "none" | "cssProp")[];
+        duration: (...args: CssfInterface['animate']['duration'][]) => "string"[];
+        timing: (...args: CssfInterface['animate']['timing'][]) => "string"[];
+        delay: (...args: CssfInterface['animate']['delay'][]) => "string"[];
+    };
+}

package/dist/cssf/cssfLib.js

@@ -0,0 +1,116 @@
+/** generated ! */
+import postcss from 'postcss';
+export class CssfClass {
+    gutter(decl) {
+        return {
+            type: (...args) => {
+                return args;
+            },
+            gap: (...args) => {
+                return args;
+            },
+            padding: (...args) => {
+                return args;
+            },
+        };
+    }
+    position(decl) {
+        return {
+            left: (...args) => {
+                return args;
+            },
+            top: (...args) => {
+                return args;
+            },
+            right: (...args) => {
+                return args;
+            },
+            bottom: (...args) => {
+                return args;
+            },
+            margin: (...args) => {
+                return args;
+            },
+        };
+    }
+    box(decl) {
+        return {
+            border: (...args) => {
+                return args;
+            },
+            shadow: (...args) => {
+                return args;
+            },
+            radius: (...args) => {
+                return args;
+            },
+            overflow: (...args) => {
+                return args;
+            },
+        };
+    }
+    size(decl) {
+        return {
+            width: (...args) => {
+                return args;
+            },
+            height: (...args) => {
+                return args;
+            },
+            ratio: (...args) => {
+                return args;
+            },
+        };
+    }
+    typography(decl) {
+        return {
+            font: (...args) => {
+                return args;
+            },
+            size: (...args) => {
+                return args;
+            },
+            style: (...args) => {
+                return args;
+            },
+            underline: (...args) => {
+                return args;
+            },
+            shadow: (...args) => {
+                return args;
+            },
+        };
+    }
+    color(decl) {
+        return {
+            text: (...args) => {
+                return args;
+            },
+            bg: (...args) => {
+                return args;
+            },
+            opacity: (...args) => {
+                return args;
+            },
+        };
+    }
+    animate(decl) {
+        return {
+            transition: (...args) => {
+                return args;
+            },
+            all: (...args) => {
+                return args;
+            },
+            duration: (...args) => {
+                return args;
+            },
+            timing: (...args) => {
+                return args;
+            },
+            delay: (...args) => {
+                return args;
+            },
+        };
+    }
+}

package/dist/cssf/cssfModel.d.ts

@@ -0,0 +1,8 @@
+export type CssfModelTypes = typeof cssfModelTypes;
+export type cssfModelRoot = Record<string, cssfModelDeclaration>;
+export type cssfModelDeclaration = Record<string, any>;
+export declare const cssfModelTypes: string[];
+/**
+ * Display property of the outer element
+ */
+export declare const cssfModel: cssfModelRoot;

package/dist/cssf/cssfModel.js

@@ -0,0 +1,59 @@
+export const cssfModelTypes = [
+    'all',
+    'top',
+    'bottom',
+    'left',
+    'right',
+    'cssProp=CSSPropertyRule',
+    'overflow=string'
+];
+/**
+ * Display property of the outer element
+ */
+export const cssfModel = {
+    /* outer: {
+        flow: ['absolute', 'fixed', 'static', 'relative']
+    }, */
+    gutter: {
+        type: ['flex', 'grid'],
+        gap: 'string',
+        padding: ['all', ['top', 'bottom'], ['top', 'bottom', 'left', 'right']]
+    },
+    position: {
+        left: 'string',
+        top: 'string',
+        right: 'string',
+        bottom: 'string',
+        margin: ['all', ['top', 'bottom'], ['top', 'bottom', 'left', 'right']]
+    },
+    box: {
+        border: ['all', ['top', 'bottom'], ['top', 'bottom', 'left', 'right']],
+        shadow: [[]],
+        radius: ['string', 'string?', 'string?', 'string?'],
+        overflow: [['visible | hidden', ['x', 'y']]]
+    },
+    size: {
+        width: ['string', 'min?', 'max?'],
+        height: ['string', 'min?', 'max?'],
+        ratio: ['string , string?']
+    },
+    typography: {
+        font: 'string',
+        size: 'string',
+        style: ['bold', 'italic', 'normal', 'string'],
+        underline: ['none', 'dotted', 'dashed', 'solid', 'double', 'wavy', 'string'],
+        shadow: ['string', 'string?', 'string?', 'string?']
+    },
+    color: {
+        text: 'string',
+        bg: 'string',
+        opacity: ['string', 'number']
+    },
+    animate: {
+        transition: [['duration', 'timing', 'delay']],
+        all: ['all', 'none', 'cssProp'],
+        duration: 'string',
+        timing: 'string',
+        delay: 'string'
+    }
+};

package/dist/cssf/cssfPlugin.d.ts

@@ -0,0 +1,3 @@
+import postcss from 'postcss';
+export declare const myPlugin: () => (root: postcss.Root) => void;
+export declare const cssfProcessor: postcss.Processor;

package/dist/cssf/cssfPlugin.js

@@ -0,0 +1,37 @@
+import postcss from 'postcss';
+import { CssfClass } from './cssfLib.js';
+export const myPlugin = () => (root) => {
+    const cssfClass = new CssfClass();
+    root.walkDecls((decl) => {
+        const parent = decl?.parent?.selector;
+        const value = decl.value;
+        const prop = decl.prop;
+        const method = cssfClass?.[parent];
+        if (method) {
+            console.log(method(decl)?.[prop](value));
+        }
+        //decl.prop = 'my-fed-' + decl.prop;
+        // if (decl?.parent) decl.parent.append({ prop: 'my-prefix-' + decl.prop, value: decl.value });
+    });
+};
+export const cssfProcessor = postcss([myPlugin()]);
+cssfProcessor
+    .process(`{
+			
+			element {
+				position: top() left() right() bottom() margin();		
+				box: border() shadow() radius() overflow( x auto, y hidden);	
+				gutter: type() gap() padding();
+				size: width() height() ratio();
+				typography: font() size() style() underline() shadow();
+				color: text() bg() opacity();
+				animate: transition() all() duration() timing() delay();
+			}
+			 
+			  
+			 
+
+		`)
+    .then((result) => {
+    console.log(result.css);
+});

package/dist/cssf/cssfTransformer.d.ts

@@ -0,0 +1,2 @@
+import type { CssfInterfaceT } from './cssfLib.js';
+export declare const cssfTransformer: CssfInterfaceT;

package/dist/cssf/cssfTransformer.js

@@ -0,0 +1,100 @@
+export const cssfTransformer = {
+    gutter: {
+        type: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        gap: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        padding: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        }
+    },
+    position: {
+        left: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        top: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        right: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        bottom: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        margin: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        }
+    },
+    box: {
+        border: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        shadow: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        radius: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        overflow: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        }
+    },
+    size: {
+        width: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        height: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        ratio: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        }
+    },
+    typography: {
+        font: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        size: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        style: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        underline: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        shadow: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        }
+    },
+    color: {
+        text: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        bg: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        opacity: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        }
+    },
+    animate: {
+        transition: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        all: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        duration: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        timing: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        },
+        delay: function (decl, ...value) {
+            throw new Error('Function not implemented.');
+        }
+    }
+};

package/dist/cssf/index.d.ts

@@ -0,0 +1,6 @@
+export * from './cssf.js';
+export * from './cssfGuide.js';
+export * from './cssfLib.js';
+export * from './cssfModel.js';
+export * from './cssfPlugin.js';
+export * from './cssfTransformer.js';

package/dist/cssf/index.js

@@ -0,0 +1,7 @@
+// Reexport of entry components
+export * from './cssf.js';
+export * from './cssfGuide.js';
+export * from './cssfLib.js';
+export * from './cssfModel.js';
+export * from './cssfPlugin.js';
+export * from './cssfTransformer.js';

package/dist/cssfVsCode/.vscode/launch.json

@@ -0,0 +1,17 @@
+// A launch configuration that launches the extension inside a new window
+// Use IntelliSense to learn about possible attributes.
+// Hover to view descriptions of existing attributes.
+// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+{
+	"version": "0.2.0",
+    "configurations": [
+        {
+            "name": "Extension",
+            "type": "extensionHost",
+            "request": "launch",
+            "args": [
+                "--extensionDevelopmentPath=${workspaceFolder}"
+            ]
+        }
+    ]
+}

package/dist/cssfVsCode/.vscodeignore

@@ -0,0 +1,4 @@
+.vscode/**
+.vscode-test/**
+.gitignore
+vsc-extension-quickstart.md

package/dist/cssfVsCode/CHANGELOG.md

@@ -0,0 +1,9 @@
+# Change Log
+
+All notable changes to the "cssf" extension will be documented in this file.
+
+Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how to structure this file.
+
+## [Unreleased]
+
+- Initial release

package/dist/cssfVsCode/README.md

@@ -0,0 +1,65 @@
+# cssf README
+
+This is the README for your extension "cssf". After writing up a brief description, we recommend including the following sections.
+
+## Features
+
+Describe specific features of your extension including screenshots of your extension in action. Image paths are relative to this README file.
+
+For example if there is an image subfolder under your extension project workspace:
+
+\!\[feature X\]\(images/feature-x.png\)
+
+> Tip: Many popular extensions utilize animations. This is an excellent way to show off your extension! We recommend short, focused animations that are easy to follow.
+
+## Requirements
+
+If you have any requirements or dependencies, add a section describing those and how to install and configure them.
+
+## Extension Settings
+
+Include if your extension adds any VS Code settings through the `contributes.configuration` extension point.
+
+For example:
+
+This extension contributes the following settings:
+
+* `myExtension.enable`: Enable/disable this extension.
+* `myExtension.thing`: Set to `blah` to do something.
+
+## Known Issues
+
+Calling out known issues can help limit users opening duplicate issues against your extension.
+
+## Release Notes
+
+Users appreciate release notes as you update your extension.
+
+### 1.0.0
+
+Initial release of ...
+
+### 1.0.1
+
+Fixed issue #.
+
+### 1.1.0
+
+Added features X, Y, and Z.
+
+---
+
+## Working with Markdown
+
+You can author your README using Visual Studio Code. Here are some useful editor keyboard shortcuts:
+
+* Split the editor (`Cmd+\` on macOS or `Ctrl+\` on Windows and Linux).
+* Toggle preview (`Shift+Cmd+V` on macOS or `Shift+Ctrl+V` on Windows and Linux).
+* Press `Ctrl+Space` (Windows, Linux, macOS) to see a list of Markdown snippets.
+
+## For more information
+
+* [Visual Studio Code's Markdown Support](http://code.visualstudio.com/docs/languages/markdown)
+* [Markdown Syntax Reference](https://help.github.com/articles/markdown-basics/)
+
+**Enjoy!**

package/dist/cssfVsCode/language-configuration.json

@@ -0,0 +1,36 @@
+{
+    "comments": {
+        "lineComment": "//",
+        "blockComment": [ "/*", "*/" ]
+    },
+    "brackets": [
+    ["{", "}"],
+    ["[", "]"],
+    ["(", ")"]
+  ],
+  "autoClosingPairs": [
+    { "open": "{", "close": "}", "notIn": ["string", "comment"] },
+    { "open": "[", "close": "]", "notIn": ["string", "comment"] },
+    { "open": "(", "close": ")", "notIn": ["string", "comment"] },
+    { "open": "\"", "close": "\"", "notIn": ["string", "comment"] },
+    { "open": "'", "close": "'", "notIn": ["string", "comment"] }
+  ],
+  "surroundingPairs": [
+    ["{", "}"],
+    ["[", "]"],
+    ["(", ")"],
+    ["\"", "\""],
+    ["'", "'"]
+  ],
+  "folding": {
+    "markers": {
+      "start": "^\\s*\\/\\*\\s*#region\\b\\s*(.*?)\\s*\\*\\/",
+      "end": "^\\s*\\/\\*\\s*#endregion\\b.*\\*\\/"
+    }
+  },
+  "indentationRules": {
+    "increaseIndentPattern": "(^.*\\{[^}]*$)",
+    "decreaseIndentPattern": "^\\s*\\}"
+  },
+  "wordPattern": "(#?-?\\d*\\.\\d\\w*%?)|(::?[\\w-]*(?=[^,{;]*[,{]))|(([@#.!])?[\\w-?]+%?|[@#!.])"
+}

package/dist/cssfVsCode/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "cssf",
+  "displayName": "cssFabric",
+  "description": "loop cool",
+  "version": "0.0.1",
+  "engines": {
+    "vscode": "^1.87.0"
+  },
+  "categories": [
+    "Programming Languages"
+  ],
+  "contributes": {
+    "languages": [
+      {
+        "id": "cssf",
+        "aliases": [
+          "CSSF",
+          "cssf"
+        ],
+        "extensions": [
+          ".cssf"
+        ],
+        "mimetypes": [
+          "text/css"
+        ],
+        "configuration": "./language-configuration.json"
+      }
+    ],
+    "grammars": [
+      {
+        "language": "cssf",
+        "scopeName": "source.cssf",
+        "path": "./syntaxes/cssf.tmLanguage.json",
+        "tokenTypes": {
+          "meta.function.url string.quoted": "other"
+        }
+      }
+    ]
+  }
+}