@policystudio/policy-studio-ui-vue 1.0.15 → 1.0.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/.eslintrc.js +68 -0
  2. package/.storybook/main.js +2 -1
  3. package/dist/css/psui_styles.css +70643 -0
  4. package/package.json +13 -9
  5. package/src/assets/images/check-checkbox-button.svg +1 -0
  6. package/src/assets/images/radio-checked-button.svg +1 -0
  7. package/src/assets/scss/base.scss +29 -2
  8. package/src/assets/scss/tailwind.css +2233 -2736
  9. package/src/components/accordion/PsAccordion.vue +36 -0
  10. package/src/components/accordion/PsAccordionItem.vue +102 -0
  11. package/src/components/buttons/PsButton.vue +6 -3
  12. package/src/components/chips/PsChips.vue +146 -0
  13. package/src/components/controls/PsCheckbox.vue +3 -3
  14. package/src/components/controls/PsRadioButton.vue +11 -35
  15. package/src/components/controls/PsSlider.vue +13 -12
  16. package/src/components/controls/PsSwitch.vue +20 -19
  17. package/src/components/datatable/PsDataTable.vue +93 -0
  18. package/src/components/datatable/PsDataTableItem.vue +57 -0
  19. package/src/components/forms/PsDropdown.vue +196 -0
  20. package/src/components/forms/PsInput.vue +10 -6
  21. package/src/components/tabs/PsTabHeader.vue +20 -21
  22. package/src/components/ui/PsIcon.vue +65 -0
  23. package/src/index.js +37 -22
  24. package/src/stories/Accordion.stories.js +35 -0
  25. package/src/stories/Checkbox.stories.js +15 -8
  26. package/src/stories/Chips.stories.js +49 -0
  27. package/src/stories/Colors.stories.mdx +36 -35
  28. package/src/stories/Datatable.stories.js +43 -0
  29. package/src/stories/Dropdown.stories.js +34 -0
  30. package/src/stories/Input.stories.js +1 -0
  31. package/src/stories/RadioButton.stories.js +21 -5
  32. package/src/stories/Swith.stories.js +2 -2
  33. package/src/stories/Toggle.stories.js +24 -0
  34. package/src/util/GeneralFunctions.js +23 -0
  35. package/tailwind.config.js +18 -4
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@policystudio/policy-studio-ui-vue",
3
- "version": "1.0.15",
3
+ "version": "1.0.19",
4
4
  "description": "Policy Studio UI",
5
5
  "main": "src/index.js",
6
6
  "author": "Policy Studio Team",
@@ -8,8 +8,8 @@
8
8
  "scripts": {
9
9
  "storybook": "start-storybook -p 6006",
10
10
  "build-storybook": "build-storybook",
11
- "build:tailwind": "postcss src/assets/scss/base.scss -o src/assets/scss/tailwind.css",
12
- "publish": "npm run build:tailwind && npm publish"
11
+ "build-tailwind": "postcss src/assets/scss/base.scss -o src/assets/scss/tailwind.css && postcss src/assets/scss/base.scss -o dist/css/psui_styles.css",
12
+ "publish": "npm run build-tailwind && npm publish"
13
13
  },
14
14
  "keywords": [
15
15
  "vue",
@@ -18,12 +18,17 @@
18
18
  "license": "MIT",
19
19
  "devDependencies": {
20
20
  "@babel/core": "^7.16.0",
21
- "@storybook/addon-actions": "^6.3.12",
22
- "@storybook/addon-essentials": "^6.3.12",
23
- "@storybook/addon-links": "^6.3.12",
24
- "@storybook/vue": "^6.3.12",
21
+ "@babel/eslint-parser": "^7.16.5",
22
+ "@storybook/addon-actions": "^6.4.12",
23
+ "@storybook/addon-essentials": "^6.4.12",
24
+ "@storybook/addon-links": "^6.4.12",
25
+ "@storybook/addon-postcss": "^2.0.0",
26
+ "@storybook/vue": "^6.4.12",
25
27
  "autoprefixer": "^10.4.0",
26
28
  "babel-loader": "^8.2.3",
29
+ "eslint": "^8.6.0",
30
+ "eslint-plugin-storybook": "^0.5.5",
31
+ "eslint-plugin-vue": "^8.2.0",
27
32
  "postcss": "^8.3.11",
28
33
  "postcss-cli": "^9.0.2",
29
34
  "tailwindcss": "^1.9.6",
@@ -31,6 +36,5 @@
31
36
  "vue-loader": "^15.9.8",
32
37
  "vue-router": "^3.5.3",
33
38
  "vue-template-compiler": "^2.6.14"
34
- },
35
- "dependencies": {}
39
+ }
36
40
  }
package/src/assets/images/check-checkbox-button.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" height="16px" viewBox="0 0 24 24" width="16px" fill="#ffffff"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"/></svg>
package/src/assets/images/radio-checked-button.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#64b5ce"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"/><circle cx="12" cy="12" r="5"/></svg>
package/src/assets/scss/base.scss CHANGED
@@ -1,7 +1,7 @@
1
1
  @tailwind base;
2
2
  @tailwind components;
3
3
  @tailwind utilities;
4
- @import url('https://fonts.googleapis.com/icon?family=Material+Icons');
4
+ @import url('https://fonts.googleapis.com/icon?family=Material+Icons|Material+Icons+Round');
5
5
 
6
6
  *:focus {
7
7
  outline: none;
@@ -9,4 +9,31 @@
9
9
  html {
10
10
  -webkit-font-smoothing: antialiased;
11
11
  -moz-osx-font-smoothing: grayscale;
12
- }
12
+ }
13
+
14
+ .toggle-bg:after {
15
+ content: '';
16
+ @apply psui-absolute psui-bg-white psui-border-gray-40 psui-rounded-full psui-h-5 psui-w-5 psui-transition;
17
+ }
18
+ .toggle-bg:after + .ps-switch-small {
19
+ content: '';
20
+ @apply psui-absolute psui-bg-white psui-border-gray-40 psui-rounded-full psui-h-2 psui-w-2 psui-transition;
21
+ }
22
+
23
+ input:checked + .toggle-bg:after + .ps-switch-small {
24
+ transform: translateX(100%);
25
+ position: absolute;
26
+ left: 2px;
27
+ @apply border-white;
28
+ }
29
+
30
+ input:checked + .toggle-bg:after {
31
+ transform: translateX(100%);
32
+ position: absolute;
33
+ left: 4px;
34
+ @apply border-white;
35
+ }
36
+
37
+ input:checked + .toggle-bg {
38
+ @apply psui-bg-green-20 psui-border-green-20;
39
+ }