@policystudio/policy-studio-ui-vue 1.0.37 → 1.0.40

package/.github/workflows/release-package.yml

@@ -0,0 +1,78 @@
+name: Release and publish package
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  tagging:
+    name: Creates tag when version bump
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+        with:
+          ref: master
+
+      - name: Check version changes
+        uses: EndBug/version-check@v1
+        id: check
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          file-url: https://unpkg.com/@policystudio/policy-studio-ui-vue@1.0.39/package.json
+          static-checking: localIsNew
+
+      - name: Version update detected
+        if: steps.check.outputs.changed == 'true'
+        run: 'echo "Version change found! New version: ${{ steps.check.outputs.version }} (${{ steps.check.outputs.type }})"'
+
+      - name: Create tag
+        if: steps.check.outputs.changed == 'true'
+        uses: actions/github-script@v5
+        with:
+          script: |
+            github.rest.git.createRef({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              ref: 'refs/tags/v${{ steps.check.outputs.version }}',
+              sha: context.sha
+            })
+
+  release:
+    name: Creates release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Create Release
+        id: create_release
+        uses: actions/create-release@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          tag_name: ${{ github.ref }}
+          release_name: ${{ github.ref }}
+          draft: false
+          prerelease: false
+
+  publish:
+    name: Publish NPM.js package
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.x'
+          registry-url: 'https://registry.npmjs.org'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Publish to npm.js
+        run: npm publish
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPMJS_TOKEN }}

package/dist/css/psui_styles.css

@@ -18309,6 +18309,10 @@ html {
   border-radius: 1.5rem;
 }
 
+.psui-el-switch.disabled {
+    pointer-events: none;
+  }
+
 .psui-el-switch.size-big{
     width: 46px;
     height: 24px;
@@ -18723,9 +18727,6 @@ html {
   --text-opacity: 1;
   color: #798490;
   color: rgba(121, 132, 144, var(--text-opacity));
-  --bg-opacity: 1;
-  background-color: #F3F6F9;
-  background-color: rgba(243, 246, 249, var(--bg-opacity));
 }
 
 .psui-el-checkbox.disabled .psui-el-checkmark {
@@ -18774,7 +18775,7 @@ html {
       display: flex;
       cursor: pointer;
       align-items: center;
-      height: 18px;
+      height: 100%;
     }
 
 .psui-el-checkbox.size-small .psui-el-checkmark span {
@@ -18823,7 +18824,7 @@ html {
       display: flex;
       cursor: pointer;
       align-items: center;
-      height: 24px;
+      height: 100%;
     }
 
 .psui-el-checkbox.size-big .psui-el-checkmark span {

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@policystudio/policy-studio-ui-vue",
-  "version": "1.0.37",
+  "version": "1.0.40",
   "description": "Policy Studio UI",
   "main": "src/index.js",
   "author": "Policy Studio Team",
-  "url": "https://bitbucket.org/policy-studio/policy-studio-ui-vue",
+  "url": "https://github.com/Policy-Studio/policy-studio-ui-vue",
   "license": "MIT",
   "keywords": [
     "vue",

package/src/assets/scss/components/PsCheckbox.scss

@@ -1,7 +1,7 @@
 @layer components {
         
         .psui-el-checkbox {
-            @apply psui-relative psui-text-gray-50 psui-bg-gray-10;    
+            @apply psui-relative psui-text-gray-50;    
         
         &.disabled {
             .psui-el-checkmark {
@@ -38,7 +38,7 @@
             }
             .psui-el-checkmark {
                 @apply psui-flex psui-cursor-pointer psui-items-center;
-                height: 18px;
+                height: 100%;
 
                 span {
                     margin-left: 8px;
@@ -77,7 +77,7 @@
             }
             .psui-el-checkmark {
                     @apply psui-flex psui-cursor-pointer psui-items-center;
-                    height: 24px;
+                    height: 100%;
                     
                     span {
                         margin-left: 8px;

package/src/assets/scss/components/PsSwitch.scss

@@ -1,6 +1,10 @@
 @layer components {
     .psui-el-switch {
         @apply psui-relative psui-inline-block psui-rounded-3xl;
+
+            &.disabled {
+                pointer-events: none;
+            }
             &.size-big{
                 width: 46px;
                 height: 24px;  

package/src/components/controls/PsCheckbox.vue

@@ -28,7 +28,7 @@ export default {
      * It sets the value which should be monitored.
     */
     inputValue: {
-      type: String,
+      type: [String, Boolean],
     },
     value:{
       type: Array

package/src/components/controls/PsSwitch.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class='psui-el-switch' :class="getComponentClass" @click="change()">
+  <div class='psui-el-switch' :class="[getComponentClass, {'disabled':disabled}]" @click="change()">
       <input type="checkbox" :checked="value" />
       <label class='psui-el-switch-button' :class="[getToggleClass]" />
   </div>
@@ -23,6 +23,13 @@ export default {
     value:{
       type: Boolean,
     },
+    /**
+     * It sets disabling mode.
+     */
+    disabled:{
+      type: Boolean,
+      default: false
+    },
     /**
     * It sets the size of the switch button. eg: small and big.
      */

package/src/components/forms/PsInput.vue

@@ -6,7 +6,7 @@
     <div 
       class="psui-el-input-wrapper"
       @mouseenter="$emit('mouseenter',$event)" 
-      @mouseleave="$emit('mouseenter',$event)" 
+      @mouseleave="$emit('mouseleave',$event)" 
     >
     
       <div v-if="$slots.prepend" class="psui-el-input-prepend">
@@ -133,12 +133,10 @@ export default {
   },
   methods: {
     onInputFocus($event) {
-      console.log('focus')
       this.isFocus = true
       this.$emit('focus', $event)
     },
     onInputBlur($event) {
-      console.log('blur')
       this.isFocus = false
       this.$emit('blur', $event)
     }

package/src/stories/Switch.stories.js

@@ -22,8 +22,8 @@ const Template = (args, { argTypes }) => ({
       </div>
       <div style='display: flex; gap: 10px; flex-direction: column;'>
         <span>Disable</span>
-        <PsSwitch v-bind="$props" v-model="dt" label='Switch1'   size='big'/>
-        <PsSwitch v-bind="$props" v-model="dt" label='Switch2' size='small'/>
+        <PsSwitch v-bind="$props" v-model="dt" label='Switch1' disabled size='big'/>
+        <PsSwitch v-bind="$props" v-model="dt" label='Switch2' disabled size='small'/>
       </div>
       <div style='display: flex; gap: 10px; flex-direction: column;'>
       <span>Enable</span>