chore: init commit is the shit that makes me want to quit

7 files changed, 95 insertions, 0 deletions

diff --git a/.envrc b/.envrc
new file mode 100644
index 0000000..4a4726a
--- /dev/null
+++ b/.envrc
@@ -0,0 +1 @@
+use_nix
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..3c25e1e
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,3 @@
+node_modules/
+dist/
+*.log
diff --git a/default.nix b/default.nix
new file mode 100644
index 0000000..f36c12f
--- /dev/null
+++ b/default.nix
@@ -0,0 +1,4 @@
+with (import <nixpkgs> { });
+mkShell {
+  buildInputs = [ nodejs-18_x ];
+}
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..c1652d1
--- /dev/null
+++ b/package.json
@@ -0,0 +1,11 @@
+{
+  "name": "cssx",
+  "version": "0.0.0",
+  "main": "src/index.ts",
+  "repository": "__",
+  "author": "Akshay Nair <phenax5@gmail.com>",
+  "license": "MIT",
+  "devDependencies": {
+    "typescript": "^5.1.6"
+  }
+}
diff --git a/src/index.ts b/src/index.ts
new file mode 100644
index 0000000..37693ba
--- /dev/null
+++ b/src/index.ts
@@ -0,0 +1,47 @@
+const UNSET_PROPERTY_VALUE = '<unset>';
+
+const getPropertyValue = ($element: HTMLElement, prop: string) => {
+  const value = `${getComputedStyle($element).getPropertyValue(prop)}`.trim()
+  return !value || value === UNSET_PROPERTY_VALUE ? '' : value;
+};
+
+const getChildrenIds = ($element: HTMLElement) => {
+  const value = getPropertyValue($element, '--cssx-children')
+  return value.split(/\s*,\s*/g).filter(Boolean)
+}
+
+const handleEvents = ($element: HTMLElement) => {
+  const eventHandlers = {
+    click: '--cssx-on-click',
+    load: '--cssx-on-load',
+  }
+
+  Object.entries(eventHandlers).forEach(([event, property]) => {
+    const handlerExpr = getPropertyValue($element, property);
+    if (handlerExpr) {
+      // TODO: Parse onclick
+      console.log($element.id, event, handlerExpr);
+    }
+  });
+};
+
+let iters = 0;
+const manageElement = ($element: HTMLElement) => {
+  if (iters++ > 100) return; // to prevent infinite rec
+
+  handleEvents($element);
+
+  const $childrenRoot = Object.assign(document.createElement('div'), {
+    className: 'cssx-layer',
+  });
+  $element.appendChild($childrenRoot);
+
+  const childrenIds = getChildrenIds($element);
+  for (const id of childrenIds) {
+    const $child = Object.assign(document.createElement('div'), { id });
+    $childrenRoot.appendChild($child);
+    manageElement($child);
+  }
+}
+
+
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000..41c7199
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "include": ["src"]
+}
diff --git a/yarn.lock b/yarn.lock
new file mode 100644
index 0000000..39e776f
--- /dev/null
+++ b/yarn.lock
@@ -0,0 +1,8 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+typescript@^5.1.6:
+  version "5.1.6"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.1.6.tgz#02f8ac202b6dad2c0dd5e0913745b47a37998274"
+  integrity sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==