@policystudio/policy-studio-ui-vue 1.0.62 → 1.0.63

package/.github/workflows/deploy-storybook.yml

@@ -0,0 +1,47 @@
+name: Deploy Storybook
+on:
+  push:
+    branches:
+      - master
+
+permissions:
+  contents: read
+  pull-requests: write
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    timeout-minutes: 20
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Cache dependencies
+        uses: actions/cache@v2
+        with:
+          path: ~/.npm
+          key: npm-${{ hashFiles('package-lock.json') }}
+          restore-keys: npm-
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: ^14.0.0
+
+      - name: Install dependencies
+        run: npm install && npm install vercel@25.1.0 && npm install -g vercel@25.1.0
+
+      - name: Build storybook
+        run: npm run build-storybook && cp ./vercel.json storybook-static/
+
+      - name: Deploy Storybook into vercel
+        uses: amondnet/vercel-action@v25.1.0
+        with:
+          vercel-token: ${{ secrets.VERCEL_TOKEN }}
+          github-token: ${{ github.token }}
+          github-comment: false
+          vercel-org-id: ${{ secrets.VERCEL_TEAM_ID }}
+          vercel-project-id: ${{ secrets.VERCEL_STORYBOOK_PROJECT_ID }}
+          scope: ${{ secrets.VERCEL_TEAM_ID }}
+          working-directory: ./storybook-static
+          vercel-args: '--prod'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@policystudio/policy-studio-ui-vue",
-  "version": "1.0.62",
+  "version": "1.0.63",
   "description": "Policy Studio UI",
   "main": "src/index.js",
   "author": "Policy Studio Team",

package/src/components/chips/PsChips.vue

@@ -8,12 +8,12 @@
       :disabled="disabled"
       v-if="type != 'button'"
       :type="type"
-      :id="label"
+      :id="getInputId"
       :checked="checked"
     />
     <label
       :disabled="disabled"
-      :for="label"
+      :for="getInputId"
       :class="{'checked':checked && type === 'button'}"
     >
       <i v-if="icon" class="psui-el-chips-icon psui-el-chips-icon-prepend">{{ icon }}</i>
@@ -31,6 +31,7 @@
 
 <script>
 export const type = ['radio', 'checkbox', 'button']
+import { randomString } from '../../util/GeneralFunctions'
 
 export default {
   name: 'PsChips',
@@ -87,6 +88,13 @@ export default {
       type: Boolean,
       default: false
     },
+    /** 
+     * Add html attributes to the element input
+    */
+    inputAttrs: {
+      type: Object,
+      default: () => ({})
+    },
   },
   emits: ['click', 'change'],
   computed: {
@@ -97,6 +105,15 @@ export default {
         return 'status-resting'
       }
     },
+    getInputId() {
+      if (this?.inputAttrs?.id) {
+        return this.inputAttrs.id
+      } else if (this?.$attrs?.id) {
+        return this.$attrs.id
+      } else {
+        return randomString(16)
+      }
+    },
   },
   methods: {
     onClick() {

package/src/components/controls/PsCheckboxSimple.vue

@@ -1,7 +1,6 @@
 <template>
   <div 
     class='psui-el-checkbox' 
-    @click="$emit('click')" 
     :class="[getComponentClass, {'disabled':disabled}]"
     v-bind="getComponentAttrs"
     >
@@ -12,7 +11,7 @@
       :name="label"
       :id="getInputId"
       v-bind="inputAttrs"
-      @change="$emit('change')" 
+      @change="$emit('change')"
     />
     <label 
       :for="getInputId"

package/src/components/forms/PsInputTextArea.vue

@@ -7,9 +7,10 @@
         :autocapitalize="autocapitalize"
         :aria-required="required"
         :value="value"
-        @blur="onBlur"
-        @focus="onFocus"
-        @input="onInput"
+        @focus="onInputFocus"
+        @blur="onInputBlur"
+        @input="$emit('input', $event)"
+        @change="$emit('change', $event)"
         :rows="rows"
         :placeholder="placeholder"
         :readonly='disabled'
@@ -52,8 +53,8 @@ export default {
      * It sets aria-required property. eg: true or false.
      */
     required:{
-        type: Boolean,
-        default:true
+      type: Boolean,
+      default:true
     },
     /**
      * It sets the type of autocapitalize. See mdn web-doc for full information. default: sentences.
@@ -73,19 +74,18 @@ export default {
      * It disabled the textarea input. All mouse events are disabled.
      */
     disabled: {
-        type: Boolean,
-        default: false,
+      type: Boolean,
+      default: false,
     }
+  },
+  methods: {
+    onInputFocus($event) {
+      this.isFocus = true
+      this.$emit('focus', $event)
     },
-    methods: {
-    onBlur(){
-        this.$emit('blur', this.$event)
-    },
-    onFocus(){
-        this.$emit('focus',this.$event)
-    },
-    onInput(){
-        this.$emit('input', this.$event)
+    onInputBlur($event) {
+      this.isFocus = false
+      this.$emit('blur', $event)
     }
   }
 }

package/vercel.json

@@ -0,0 +1,11 @@
+{
+  "version": 2,
+  "public": false,
+  "github": {
+    "enabled": false
+  },
+  "rewrites": [
+    { "source": "/(.*)", "destination": "/index.html" },
+    { "source": "/:path*", "destination": "/index.html" }
+  ]
+}