@solfacil/girassol 0.1.11 → 0.2.0

package/dist/windi.config.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("windicss/types/interfaces").FullConfig;
+declare const _default: import("vite-plugin-windicss").WindiCssOptions;
 export default _default;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@solfacil/girassol",
   "description": "Girassol design system",
-  "version": "0.1.11",
+  "version": "0.2.0",
   "authors": [
     {
       "name": "Kevin Martin",
@@ -57,31 +57,31 @@
     "pre-commit": "./.husky/run-staged-tests.js"
   },
   "dependencies": {
-    "@vueuse/core": "^8.6.0",
+    "@vueuse/core": "^8.7.5",
     "gluegun": "latest",
     "vue": "^3.2.37"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.25.1",
-    "@babel/core": "^7.18.2",
-    "@babel/preset-env": "^7.18.2",
-    "@commitlint/cli": "^17.0.2",
-    "@commitlint/config-conventional": "^17.0.2",
-    "@iconify/json": "^2.1.58",
-    "@storybook/addon-a11y": "^6.5.8",
-    "@storybook/addon-actions": "^6.5.8",
-    "@storybook/addon-essentials": "^6.5.8",
-    "@storybook/addon-links": "^6.5.8",
-    "@storybook/builder-vite": "^0.1.36",
-    "@storybook/theming": "^6.5.8",
-    "@storybook/vue3": "^6.5.8",
+    "@antfu/eslint-config": "^0.25.2",
+    "@babel/core": "^7.18.6",
+    "@babel/preset-env": "^7.18.6",
+    "@commitlint/cli": "^17.0.3",
+    "@commitlint/config-conventional": "^17.0.3",
+    "@iconify/json": "^2.1.70",
+    "@storybook/addon-a11y": "^6.5.9",
+    "@storybook/addon-actions": "^6.5.9",
+    "@storybook/addon-essentials": "^6.5.9",
+    "@storybook/addon-links": "^6.5.9",
+    "@storybook/builder-vite": "^0.1.38",
+    "@storybook/theming": "^6.5.9",
+    "@storybook/vue3": "^6.5.9",
     "@testing-library/jest-dom": "^5.16.4",
-    "@testing-library/user-event": "^14.2.0",
+    "@testing-library/user-event": "^14.2.1",
     "@testing-library/vue": "^6.6.0",
-    "@types/jest-axe": "^3.5.3",
+    "@types/jest-axe": "^3.5.4",
     "@types/node": "^17.0.41",
-    "@typescript-eslint/eslint-plugin": "^5.27.1",
-    "@typescript-eslint/parser": "^5.27.1",
+    "@typescript-eslint/eslint-plugin": "^5.30.0",
+    "@typescript-eslint/parser": "^5.30.0",
     "@vitejs/plugin-vue": "^2.3.3",
     "babel-loader": "^8.2.5",
     "c8": "^7.11.3",
@@ -89,31 +89,31 @@
     "commitizen": "^4.2.4",
     "copyfiles": "^2.4.1",
     "critters": "^0.0.16",
-    "eslint": "^8.17.0",
+    "eslint": "^8.18.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-html": "^6.2.0",
-    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-vue": "^8.7.1",
     "eslint-plugin-vuejs-accessibility": "^1.2.0",
     "husky": "^8.0.1",
     "jest-axe": "^5.0.1",
-    "jsdom": "^19.0.0",
+    "jsdom": "^20.0.0",
     "sass": "^1.50.0",
-    "storybook-addon-designs": "^6.2.1",
-    "stylelint": "^14.9.0",
+    "storybook-addon-designs": "^6.3.1",
+    "stylelint": "^14.9.1",
     "stylelint-config-prettier": "^9.0.3",
     "stylelint-config-property-sort-order-smacss": "^9.0.0",
     "stylelint-order": "^5.0.0",
     "ts-node": "^10.8.1",
-    "typescript": "^4.6.3",
-    "unplugin-icons": "^0.14.3",
+    "typescript": "^4.7.4",
+    "unplugin-icons": "^0.14.7",
     "vite": "^2.9.13",
-    "vite-plugin-inspect": "^0.5.0",
-    "vite-plugin-windicss": "^1.8.4",
+    "vite-plugin-inspect": "^0.5.1",
+    "vite-plugin-windicss": "^1.8.6",
     "vitest": "^0.16.0",
     "vue-loader": "^17.0.0",
-    "vue-tsc": "^0.34.15",
-    "windicss": "^3.5.4"
+    "vue-tsc": "^0.38.2",
+    "windicss": "^3.5.6"
   },
   "repository": {
     "type": "git",

package/theme/solfacil/borders.ts

@@ -4,7 +4,8 @@ export default {
     sm: '0.25rem',
     md: '0.5rem',
     lg: '1rem',
-    full: '40rem',
+    full: '80rem',
+
     half: '50%',
     fully: '100%',
   },

package/theme/solfacil/colors.ts

@@ -1,43 +1,56 @@
 export default {
   brand: {
     primary: {
-      light: '#FFF8EB',
-      medium: '#FFCD70',
-      pure: '#FFB01F',
+      medium: '#BFFF00',
+      light: '#EFFFC1',
+      pure: '#00B569',
+      dark: '#008859',
     },
   },
-
+  highlight: {
+    pure: '#8250DF',
+    light: '#E6DCF9',
+    medium: '#C0A7EF',
+    dark: '#342059',
+  },
   neutral: {
     low: {
-      light: '#8f8f8f',
-      medium: '#525252',
-      pure: '#292929',
+      pure: '#000000',
+      light: '#888888',
+      medium: '#555555',
+      dark: '#222222',
     },
-
     high: {
-      light: '#FFFFFF',
-      medium: '#F5F5F5',
-      pure: '#E0E0E0',
+      pure: '#ffffff',
+      light: '#F5f5f5',
+      medium: '#e0e0e0',
+      dark: '#cccccc',
     },
   },
-
   feedback: {
     positive: {
-      light: '#eefbf6',
-      medium: '#8ae5bf',
-      pure: '#47d79a',
+      pure: '#1CA36F',
+      light: '#D2EDE2',
+      medium: '#8DD1B7',
+      dark: '#0B412C',
+    },
+    warning: {
+      pure: '#FFB300',
+      light: '#FFF0CC',
+      medium: '#FFD97F',
+      dark: '#664800',
     },
-
     informative: {
-      light: '#ebf8ff',
-      medium: '#70cbff',
-      pure: '#1faeff',
+      pure: '#1976D2',
+      light: '#D1E4F6',
+      medium: '#8CBAE8',
+      dark: '#0A2F54',
     },
-
     negative: {
-      light: '#ffebeb',
-      medium: '#ff7470',
-      pure: '#ff251f',
+      pure: '#D0382D',
+      light: '#F6D7D5',
+      medium: '#E79B96',
+      dark: '#531612',
     },
   },
 }

package/theme/solfacil/effects.ts

@@ -1,15 +1,17 @@
 export default {
-  opacity:  {
+  opacity: {
     'DEFAULT': 1,
 
     strong: 0.8,
+    intense: 0.6,
     moderate: 0.32,
     weak: 0.16,
   },
 
   boxShadow: {
-    soft: '0px 8px 16px rgba(41, 41, 41, 0.08)',
-    medium: '0px 12px 24px rgba(41, 41, 41, 0.16)',
-    large: '0px 16px 64px rgba(41, 41, 41, 0.24)',
+    weak: '0px 4px 8px rgba(41, 41, 41, 0.08)',
+    moderate: '0px 8px 24px rgba(41, 41, 41, 0.16)',
+    intense: '0px 16px 32px rgba(41, 41, 41, 0.24)',
+    strong: '0px 16px 48px rgba(41, 41, 41, 0.24)',
   },
 }

package/theme/solfacil/typography.ts

@@ -1,10 +1,8 @@
 export default {
   fontFamily: {
     sans: ['"Lato"', 'sans-serif'],
-    
     base: ['"Lato"', 'sans-serif'],
-    highlight: ['"Rubik"'],
-    code: ['"Roboto Slab", "serif"'],
+    title: ['"Rubik"'],
   },
 
   fontSize: {
@@ -21,7 +19,7 @@ export default {
     '2xl': '3.5rem',
     '3xl': '4rem',
     'mega': '4.5rem',
-    'giga': '5.5rem',
+    'giga': '5rem',
   },
 
   lineHeight: {

package/windi.config.ts

@@ -4,13 +4,43 @@ import typography from 'windicss/plugin/typography'
 
 import { borders, colors, effects, misc, spacing, typography as typos, utilities } from './theme/solfacil/'
 
+function range(size: number, startAt = 1) {
+  return Array.from(Array(size).keys()).map(i => i + startAt)
+}
+
 export default defineConfig({
   darkMode: 'class',
   attributify: false,
   extract: {
-    include: ['index.html', 'src/**/*'],
+    include: ['index.html', 'src/**/*', '*.mdx', '*.vue'],
   },
 
+  safelist: [
+    'p-nano',
+    'p-micro',
+    'p-3xs',
+    'p-2xs',
+    'p-xs',
+    'p-sm',
+    'p-md',
+    'p-lg',
+    'm-nano',
+    'm-micro',
+    'm-3xs',
+    'm-2xs',
+    'm-xs',
+    'm-sm',
+    'm-md',
+    'm-lg',
+    range(30).map(i => `grid-rows-${i}`),
+    range(30).map(i => `grid-cols-${i}`),
+    range(10).map(i => `gap-${i}`),
+    range(30).map(i => `row-start-${i}`),
+    range(30).map(i => `col-start-${i}`),
+    range(30).map(i => `row-span-${i}`),
+    range(30).map(i => `col-span-${i}`),
+  ],
+
   plugins: [
     typography(),
     utilities.outlinesForFocus,