@kizmann/nano-ui 1.0.0 → 1.0.2

package/src/slider/src/slider/slider.js

@@ -239,6 +239,10 @@ export default {
 
         onMousedown(event)
         {
+            if ( this.disabled ) {
+                return;
+            }
+
             if ( ! Arr.has([0, 1], event.which) ) {
                 return;
             }
@@ -357,6 +361,7 @@ export default {
     {
         let classList = [
             'n-slider',
+            'n-slider--' + this.type,
             'n-slider--' + this.size
         ];
 

package/src/slider/src/slider/slider.scss

@@ -39,6 +39,10 @@
     border-radius: 500px;
 }
 
+.n-disabled .n-slider__handle {
+    cursor: not-allowed;
+}
+
 .n-slider__handle span {
     pointer-events: none;
     position: absolute;

package/src/table/src/table/table.scss

@@ -50,8 +50,12 @@
 }
 
 .n-table .n-table__wrap {
-    margin-right: -1px;
-    margin-bottom: -1px;
+    //margin-right: -1px;
+    //margin-bottom: -1px;
+}
+
+.n-table__header {
+    margin-left: -1px;
 }
 
 .n-table .n-table__inner {

package/src/table/src/table-column/table-column.scss

@@ -22,7 +22,6 @@
 // Column
 
 .n-table__header .n-table-column {
-    margin-left: -1px;
     border-left: 1px solid transparent;
     border-right: 1px solid transparent;
 }

package/themes/macos/button/src/button/button.scss

@@ -5,6 +5,15 @@
     opacity: 0.7;
 }
 
+.n-button--default:not(.n-button--link) {
+    color: $color-foreground;
+    background: rgba($color-foreground, 0.05);
+}
+
+.n-button--default:not(.n-button--link):hover {
+    background: rgba($color-foreground, 0.15);
+}
+
 @each $color, $values in $colors {
 
     $-color-base: map.get($values, 'base');

package/themes/macos/radio/src/radio/radio.scss

@@ -12,7 +12,7 @@
 }
 
 .n-radio__radio span {
-    background: $color-black;
+    background: $color-foreground;
 }
 
 @each $color, $values in $colors {

package/themes/macos/root/vars-dark.scss

@@ -38,7 +38,7 @@ $color-warning:         #FFBF3F !default;
 $color-danger:          #F9536E !default;
 $color-info:            #4BD6F9 !default;
 
-$color-shadow:              color.mix($color-black, $color-primary, 80%) !default;
+$color-shadow:              #000 !default;
 
 
 $color-white-light:         $color-white !default;

package/themes/macos/root/vars-light.scss

@@ -38,7 +38,7 @@ $color-warning:         #FFBF3F !default;
 $color-danger:          #F9536E !default;
 $color-info:            #4BD6F9 !default;
 
-$color-shadow:              color.mix($color-black, $color-primary, 80%) !default;
+$color-shadow:              #000 !default;
 
 
 $color-white-light:         $color-white !default;

package/themes/macos/root/vars.scss

@@ -230,5 +230,4 @@ $colors-tags: (
         '16': color.mix($color-secondary, $color-warning, 65%),
         '17': color.mix($color-danger, $color-warning, 65%),
         '18': color.mix($color-success, $color-warning, 65%),
-        '19': color.mix($color-warning, $color-warning, 65%),
 ) !default;

package/themes/macos/scrollbar/src/scrollbar/scrollbar.scss

@@ -2,5 +2,5 @@
 
 .n-scrollbar-v:before,
 .n-scrollbar-h:before {
-    background: rgba($color-black, 0.3);
+    background: rgba($color-foreground, 0.4);
 }

package/themes/macos/select/src/select/select.scss

@@ -42,7 +42,7 @@
     }
 
     .n-select--#{$color} .n-select__item {
-        color: $color-foreground;
+        color: $color-white;
         background: $-color-base;
     }
 

package/themes/macos/slider/src/slider/slider.scss

@@ -1,21 +1,41 @@
+@use "sass:map";
 @import "../../../root/vars";
 
 .n-slider__bar {
     background: $color-gray-10;
 }
 
-.n-slider__range {
-    background: $color-primary;
+.n-slider.n-disabled .n-slider__range {
+    background: $color-gray-50;
 }
 
 .n-slider__handle {
     background: $color-white;
-    border: 6px solid $color-primary;
     box-shadow: 0 0 4px rgba($color-shadow, 0.15);
 }
 
+.n-slider.n-disabled .n-slider__handle {
+    border: 6px solid $color-gray-50;
+}
+
 .n-slider__handle span {
     color: $color-white;
     background: rgba($color-black, 0.8);
 }
 
+@each $color, $values in $colors {
+
+    $-color-base: map.get($values, 'base');
+    $-color-light: map.get($values, 'light');
+    $-color-dark: map.get($values, 'dark');
+
+    .n-slider--#{$color}:not(.n-disabled) .n-slider__range {
+        background: $-color-base;
+    }
+
+    .n-slider--#{$color}:not(.n-disabled) .n-slider__handle {
+        border: 6px solid $-color-base;
+    }
+
+}
+

package/themes/macos/tags/src/tags-item/tags-item.scss

@@ -9,7 +9,8 @@
     $-color-dark: map.get($values, 'dark');
 
     .n-tags-item--color-#{$color} {
-        color: color.mix($-color-dark, $color-black, 70%);
+        color: color.mix($-color-base, $color-foreground, 35%);
+        //color: color.mix($-color-dark, $color-black, 70%);
         background: rgba($-color-base, 0.25);
     }
     .n-tags-item--color-#{$color} i {
@@ -21,7 +22,8 @@
 @each $-tags-index, $-tags-color in $colors-tags {
 
     .n-tags-item--color-#{$-tags-index} {
-        background: rgba($-tags-color, 0.15);
+        color: color.mix($-tags-color, $color-foreground, 35%);
+        background: rgba($-tags-color, 0.25);
     }
     .n-tags-item--color-#{$-tags-index} i {
         color: rgba($-tags-color, 0.75);

package/.github/workflows/compile-deploy-publish.yml

@@ -1,65 +0,0 @@
-name: compile-deploy-publish
-
-on:
-  push:
-    branches:
-      - master
-
-jobs:
-  compile-deploy-publish:
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v3
-
-      - name: Set up Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: '16'
-
-      - name: Install dependencies
-        run: yarn install
-
-      - name: Build package
-        run: yarn build
-
-      - name: Deploy to GitHub Pages
-        uses: peaceiris/actions-gh-pages@v3
-        with:
-          github_token: ${{ secrets.GITHUB_TOKEN }}
-
-      - name: Get current version
-        id: get_version
-        run: |
-          version=$(node -p "require('./package.json').version")
-          echo "PACKAGE_VERSION=$version" >> $GITHUB_ENV
-
-      - name: Fetch all tags
-        run: git fetch --tags
-
-      - name: Check if tag already exists
-        id: check_tag
-        run: |
-          if git rev-parse "v$PACKAGE_VERSION" >/dev/null 2>&1; then
-            echo "Tag v$PACKAGE_VERSION already exists."
-            echo "exists=true" >> $GITHUB_OUTPUT
-          else
-            echo "Tag v$PACKAGE_VERSION does not exist yet."
-            echo "exists=false" >> $GITHUB_OUTPUT
-          fi
-
-      - name: Create and push tag
-        if: steps.check_tag.outputs.exists == 'false'
-        run: |
-          git config user.name "github-actions[bot]"
-          git config user.email "github-actions[bot]@users.noreply.github.com"
-          git tag v$PACKAGE_VERSION
-          git push origin v$PACKAGE_VERSION
-
-      - name: Set up .npmrc
-        run: echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" > ~/.npmrc
-
-      - name: Create and push tag
-        if: steps.check_tag.outputs.exists == 'false'
-        run: yarn publish --new-version $(node -p "require('./package.json').version") --non-interactive

package/assets/nano-ui-dark.svg

@@ -1,19 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 140">
-  <defs>
-    <style>
-      .b {
-        fill: #ffffff;
-      }
-
-      .c {
-        fill: #d31f9d;
-      }
-    </style>
-  </defs>
-  <path class="b" d="M296.5034,107.1878c-19.0781,0-34.5996-15.8745-34.5996-35.3877s15.5215-35.387,34.5996-35.387,34.5989,15.8745,34.5989,35.387-15.5208,35.3877-34.5989,35.3877ZM296.5034,50.6632c-11.2207,0-20.3496,9.4819-20.3496,21.137s9.1289,21.1377,20.3496,21.1377,20.3489-9.4827,20.3489-21.1377-9.1282-21.137-20.3489-21.137Z"/>
-  <path class="b" d="M62.8857,36.4278c-9.9966,0-17.8507,3.4847-23.4836,8.8643l-2.7956-4.3571h-7.669v28.2469c-.0254.5649-.0399,1.1302-.0399,1.6953v34.7805h15v-34.7805c0-14.3555,10.229-19.4495,18.988-19.4495,10.5366,0,16.5798,7.0891,16.5798,19.4495v34.7805h15v-34.7805c0-20.6052-12.6907-34.4495-31.5798-34.4495Z"/>
-  <path class="b" d="M173.2802,40.9351h-7.669l-3.3257,5.1835c-6.2037-6.0084-14.5682-9.7054-23.7662-9.7054-19.0781,0-34.5989,15.8745-34.5989,35.387s15.5208,35.3877,34.5989,35.3877c8.9164,0,17.0548-3.4688,23.1961-9.1544l3.8958,6.0721h7.669v-63.1704ZM138.5193,92.9378c-11.2207,0-20.3489-9.4827-20.3489-21.1377s9.1282-21.137,20.3489-21.137,20.3496,9.4819,20.3496,21.137-9.1289,21.1377-20.3496,21.1377Z"/>
-  <path class="b" d="M221.4214,36.4278c-10.0105,0-17.8723,3.4943-23.5068,8.8863l-2.8096-4.3791h-7.669v29.783c-.0002.0531-.0034.1061-.0034.1592v33.2805h15v-33.2805c0-14.3555,10.229-19.4495,18.9888-19.4495,10.5359,0,16.5791,7.0891,16.5791,19.4495v33.2805h15v-33.2805c0-20.6052-12.6907-34.4495-31.5791-34.4495Z"/>
-  <rect class="c" x="276.3458" y="117.7933" width="40.8201" height="12"/>
-</svg>

package/assets/nano-ui-light.svg

@@ -1,19 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 140">
-  <defs>
-    <style>
-      .b {
-        fill: #111111;
-      }
-
-      .c {
-        fill: #d31f9d;
-      }
-    </style>
-  </defs>
-  <path class="b" d="M296.5034,107.1878c-19.0781,0-34.5996-15.8745-34.5996-35.3877s15.5215-35.387,34.5996-35.387,34.5989,15.8745,34.5989,35.387-15.5208,35.3877-34.5989,35.3877ZM296.5034,50.6632c-11.2207,0-20.3496,9.4819-20.3496,21.137s9.1289,21.1377,20.3496,21.1377,20.3489-9.4827,20.3489-21.1377-9.1282-21.137-20.3489-21.137Z"/>
-  <path class="b" d="M62.8857,36.4278c-9.9966,0-17.8507,3.4847-23.4836,8.8643l-2.7956-4.3571h-7.669v28.2469c-.0254.5649-.0399,1.1302-.0399,1.6953v34.7805h15v-34.7805c0-14.3555,10.229-19.4495,18.988-19.4495,10.5366,0,16.5798,7.0891,16.5798,19.4495v34.7805h15v-34.7805c0-20.6052-12.6907-34.4495-31.5798-34.4495Z"/>
-  <path class="b" d="M173.2802,40.9351h-7.669l-3.3257,5.1835c-6.2037-6.0084-14.5682-9.7054-23.7662-9.7054-19.0781,0-34.5989,15.8745-34.5989,35.387s15.5208,35.3877,34.5989,35.3877c8.9164,0,17.0548-3.4688,23.1961-9.1544l3.8958,6.0721h7.669v-63.1704ZM138.5193,92.9378c-11.2207,0-20.3489-9.4827-20.3489-21.1377s9.1282-21.137,20.3489-21.137,20.3496,9.4819,20.3496,21.137-9.1289,21.1377-20.3496,21.1377Z"/>
-  <path class="b" d="M221.4214,36.4278c-10.0105,0-17.8723,3.4943-23.5068,8.8863l-2.8096-4.3791h-7.669v29.783c-.0002.0531-.0034.1061-.0034.1592v33.2805h15v-33.2805c0-14.3555,10.229-19.4495,18.9888-19.4495,10.5359,0,16.5791,7.0891,16.5791,19.4495v33.2805h15v-33.2805c0-20.6052-12.6907-34.4495-31.5791-34.4495Z"/>
-  <rect class="c" x="276.3458" y="117.7933" width="40.8201" height="12"/>
-</svg>

package/assets/pico-js-dark.svg

@@ -1,19 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 140">
-  <defs>
-    <style>
-      .b {
-        fill: #ffffff;
-      }
-
-      .c {
-        fill: #ecd408;
-      }
-    </style>
-  </defs>
-  <path class="b" d="M271.224,106.9426c-19.0781,0-34.5996-15.8745-34.5996-35.3877s15.5215-35.387,34.5996-35.387,34.5989,15.8745,34.5989,35.387-15.5208,35.3877-34.5989,35.3877ZM271.224,50.4179c-11.2207,0-20.3496,9.4819-20.3496,21.137s9.1289,21.1377,20.3496,21.1377,20.3489-9.4827,20.3489-21.1377-9.1282-21.137-20.3489-21.137Z"/>
-  <path class="b" d="M54.1858,129.9574h14.25v-29.608c5.7433,4.3386,12.8305,6.9182,20.5022,6.9182,19.0781,0,34.5989-15.8745,34.5989-35.3877s-15.5208-35.387-34.5989-35.387c-9.1979,0-17.5625,3.697-23.7662,9.7054l-3.3257-5.1835h-7.669l.0087,88.9426ZM88.9381,93.0176c-11.2207,0-20.3496-9.4827-20.3496-21.1377s9.1289-21.137,20.3496-21.137,20.3489,9.4819,20.3489,21.137-9.1282,21.1377-20.3489,21.1377Z"/>
-  <path class="b" d="M216.8944,84.305c-3.7149,5.1465-9.6156,8.4975-16.2708,8.4975-11.2207,0-20.3496-9.4827-20.3496-21.1377s9.1289-21.137,20.3496-21.137c5.742,0,10.9258,2.4932,14.629,6.4798,3.3409-2.1117,8.2575-5.2152,12.1845-7.6765-6.3495-7.9596-16.0095-13.0533-26.8135-13.0533-19.0781,0-34.5996,15.8745-34.5996,35.387s15.5215,35.3877,34.5996,35.3877c11.3617,0,21.4601-5.6315,27.7716-14.3073l-11.5008-8.4402Z"/>
-  <polygon class="b" points="142.1523 36.8857 136.9992 42.7734 136.9992 105.8322 153.4992 105.8322 153.4992 36.8857 142.1523 36.8857"/>
-  <rect class="c" x="251.148" y="117.8746" width="40.8201" height="12"/>
-</svg>

package/assets/pico-js-light.svg

@@ -1,19 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 140">
-  <defs>
-    <style>
-      .b {
-        fill: #111111;
-      }
-
-      .c {
-        fill: #ecd408;
-      }
-    </style>
-  </defs>
-  <path class="b" d="M271.224,106.9426c-19.0781,0-34.5996-15.8745-34.5996-35.3877s15.5215-35.387,34.5996-35.387,34.5989,15.8745,34.5989,35.387-15.5208,35.3877-34.5989,35.3877ZM271.224,50.4179c-11.2207,0-20.3496,9.4819-20.3496,21.137s9.1289,21.1377,20.3496,21.1377,20.3489-9.4827,20.3489-21.1377-9.1282-21.137-20.3489-21.137Z"/>
-  <path class="b" d="M54.1858,129.9574h14.25v-29.608c5.7433,4.3386,12.8305,6.9182,20.5022,6.9182,19.0781,0,34.5989-15.8745,34.5989-35.3877s-15.5208-35.387-34.5989-35.387c-9.1979,0-17.5625,3.697-23.7662,9.7054l-3.3257-5.1835h-7.669l.0087,88.9426ZM88.9381,93.0176c-11.2207,0-20.3496-9.4827-20.3496-21.1377s9.1289-21.137,20.3496-21.137,20.3489,9.4819,20.3489,21.137-9.1282,21.1377-20.3489,21.1377Z"/>
-  <path class="b" d="M216.8944,84.305c-3.7149,5.1465-9.6156,8.4975-16.2708,8.4975-11.2207,0-20.3496-9.4827-20.3496-21.1377s9.1289-21.137,20.3496-21.137c5.742,0,10.9258,2.4932,14.629,6.4798,3.3409-2.1117,8.2575-5.2152,12.1845-7.6765-6.3495-7.9596-16.0095-13.0533-26.8135-13.0533-19.0781,0-34.5996,15.8745-34.5996,35.387s15.5215,35.3877,34.5996,35.3877c11.3617,0,21.4601-5.6315,27.7716-14.3073l-11.5008-8.4402Z"/>
-  <polygon class="b" points="142.1523 36.8857 136.9992 42.7734 136.9992 105.8322 153.4992 105.8322 153.4992 36.8857 142.1523 36.8857"/>
-  <rect class="c" x="251.148" y="117.8746" width="40.8201" height="12"/>
-</svg>

package/babel.config.js

@@ -1,17 +0,0 @@
-module.exports = function (api) {
-
-    api.cache(true);
-
-    const presets = [
-        '@babel/preset-env'
-    ];
-
-    const plugins= [
-        "@vue/babel-plugin-jsx",
-        "@babel/plugin-proposal-class-properties",
-        "@babel/plugin-proposal-object-rest-spread",
-        "@babel/plugin-proposal-export-default-from"
-    ];
-
-    return { presets,  plugins };
-};