quasar-ui-danx-legacy 0.3.56-legacy

package/.eslintrc.cjs

@@ -0,0 +1,37 @@
+module.exports = {
+    root: true,
+
+    parser: "vue-eslint-parser",
+    parserOptions: {
+        ecmaVersion: "latest",
+        sourceType: "module",
+        parser: "@typescript-eslint/parser",
+        project: "./tsconfig.json", // Specify it only for TypeScript files
+        extraFileExtensions: [".vue"]
+    },
+
+    env: {
+        node: true,
+        browser: true,
+        "vue/setup-compiler-macros": true
+    },
+
+    extends: [
+        "eslint:recommended",
+        "plugin:vue/vue3-recommended", // Priority C: Recommended
+        "plugin:@typescript-eslint/recommended"
+    ],
+
+    plugins: [
+        "vue",
+        "@typescript-eslint",
+        "import"
+    ],
+
+    rules: {
+        "prefer-promise-reject-errors": "off",
+        "no-debugger":
+            process.env.NODE_ENV === "production" ? "error" : "off",
+        "import/extensions": ["error", "never"]
+    }
+};

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) Dan <dan@flytedesk.com>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1,156 @@
+# Component Danx
+
+[![npm](https://img.shields.io/npm/v/quasar-ui-danx.svg?label=quasar-ui-danx)](https://www.npmjs.com/package/quasar-ui-danx)
+[![npm](https://img.shields.io/npm/dt/quasar-ui-danx.svg)](https://www.npmjs.com/package/quasar-ui-danx)
+
+**Compatible with Quasar UI v2 and Vue 3**.
+
+# Component Danx
+
+> Component and function library built on Quasar + Vue 3
+
+# Usage
+
+```vue
+
+<template>
+  <ActionTable
+      label="Danx"
+      name="danx"
+      v-model:quasar-pagination="quasarPagination"
+      v-model:selected-rows="selectedRows"
+      :columns="columns"
+  />
+</template>
+<script setup>
+  import 'quasar-ui-danx/dist/index.css';
+  import { ActionTable, useTableColumns, useListControls } from 'quasar-ui-danx';
+
+  const { columns } = useTableColumns([{ name: 'name', label: 'Name' }, { name: 'age', label: 'Age' }]);
+  const { quasarPagination, selectedRows } = useListControls({});
+</script>
+```
+
+# Setup
+
+```bash
+yarn create vue # Follow instructions for settings up new Vue App
+yarn add quasar-ui-danx quasar
+yarn add -D sass vite-svg-loader tailwindcss eslint eslint-plugin-import autoprefixer
+```
+
+### Setup PHPStorm
+
+* Disable Typescript language service
+* Setup node_modules directory as a library
+* Configure `tsconfig.json`
+
+```json
+{
+  "include": [
+    "node_modules/quasar-ui-danx/**/*"
+  ]
+}
+```
+
+* Configure `vite.config.ts`
+
+```ts
+export default ({ command }) => {
+    // For development w/ HMR, load the danx library + styles directly from the directory
+    // NOTE: These are the paths relative to the mounted quasar-ui-danx directory inside the mva docker container
+    const danx = (command === "serve" ? {
+        "quasar-ui-danx": resolve(__dirname, "../quasar-ui-danx/ui/src"),
+        "quasar-ui-danx-styles": resolve(__dirname, "../quasar-ui-danx/src/styles/index.scss")
+    } : {
+        // Import from quasar-ui-danx module for production
+        "quasar-ui-danx-styles": "quasar-ui-danx/dist/style.css"
+    });
+
+    return defineConfig({
+        resolve: {
+            alias: {
+                ...danx
+            }
+        },
+    });
+}
+```
+
+* Add node_modules as a library in PHPStorm
+    * Settings -> Directories -> Add
+    * Create a new directory w/ name node_modules and set the directory to the node_modules directory in your project
+* Symlink Danx UI library
+    * FOR LOCAL DEVELOPMENT ONLY: if you plan on updating Danx UI
+        * Symlinking the danx UI library allows for better integration w/ PHPStorm + tailwindcss + HMR w/ vite.
+            * NOTE: Setting this up w/ `npm link` or trying to modify tsconfig.json / vite.config.ts only can be quite
+              challenging to get everything configured correctly. I found this to be the best solution.
+    * copy/paste and run `./danx-local.sh`
+        * (recommended) Configure yarn / npm to always run this after updating packages
+            * Add `{"scripts: {..., "postinstall": "./danx-local.sh"}}` to your package.json
+    * (or manually symlink node_modules/quasar-ui-danx to ../../quasar-ui-danx/ui/src)
+        * Directory structure of your project relative to quasar-ui-danx:
+
+```
+- parent-directory
+  - your-app
+    - tsconfig.json
+    - vite.config.ts
+    - src
+    - node_modules
+      - quasar-ui-danx -> (symlink) ../../quasar-ui-danx/ui/src
+  - quasar-ui-danx
+    - ui
+      - src
+      - tests
+```
+
+### Setup Tailwind
+
+Initialize config files for tailwind
+NOTE: vite will automatically pick up the postcss.config.js file, no need to manually configure anything
+
+```
+npx tailwindcss init -p
+```
+
+* Rename tailwind.config.js to tailwind.config.ts
+* Setup your tailwind.config.ts:
+    * Make any changes to the colors object
+
+```ts
+/** @type {import('tailwindcss').Config} */
+export const colors = {}
+
+export default {
+    content: [],
+    theme: {
+        extend: {
+            colors
+        }
+    },
+    plugins: []
+}
+```
+
+# Developing
+
+```bash
+# start dev in SPA mode
+$ yarn dev
+```
+
+# Building package
+
+```bash
+$ yarn build
+```
+
+# Adding Testing Components
+
+in the `ui/dev/src/pages` you can add Vue files to test your component/directive. When using `yarn dev` to build the UI,
+any pages in that location will automatically be picked up by dynamic routing and added to the test page.
+
+# License
+
+MIT (c) Dan <dan@flytedesk.com>

package/danx-local.sh

@@ -0,0 +1,15 @@
+#!/bin/bash
+
+set +x
+
+# Resolve path to quasar-ui-danx (can be up 1 or 2 directories)
+# shellcheck disable=SC2046
+DANX_PATH="$(realpath $(find ../.. -maxdepth 2 -type d -name "quasar-ui-danx" | head -n 1))/ui/src"
+MODULE_PATH="$(pwd)/node_modules/quasar-ui-danx"
+
+# symlink ../quasar-ui-danx to node_modules/quasar-ui-danx if the directory exists
+if [ -d "$DANX_PATH" ]; then
+  rm -rf node_modules/quasar-ui-danx
+  ln -s "$DANX_PATH" "$MODULE_PATH"
+  printf "Symlinked $DANX_PATH --> $MODULE_PATH\n"
+fi