@canopytax/styleguide 0.0.46 → 1.1.2

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 (13) hide show
  1. package/README.md +9 -22
  2. package/package.json +128 -87
  3. package/.babelrc +0 -14
  4. package/.eslintrc +0 -4
  5. package/.fontcustom-manifest.json +0 -750
  6. package/fontcustom.yml +0 -96
  7. package/jest.json +0 -28
  8. package/module/module.js +0 -16718
  9. package/postcss.config.js +0 -5
  10. package/webpack.config.goat.js +0 -140
  11. package/webpack.config.js +0 -138
  12. package/webpack.config.module.js +0 -104
  13. package/yarn-error.log +0 -14384
package/README.md CHANGED
@@ -12,7 +12,7 @@ The primary components of the design system are
12
12
  ## Contributing
13
13
  See [Canopy's live storybook](https://storybook.canopytax.com/)
14
14
 
15
- Creating a new story is easy and can be done in any directory. Simply create a file with the extension `*.stories.js`
15
+ Creating a new story is easy and can be done in any directory. Simply create a file with the extension `*.story.(ts|js)`.
16
16
 
17
17
  If I am looking to create a story that will illustrate a new button, I might add a new file for it like so:
18
18
 
@@ -21,38 +21,25 @@ If I am looking to create a story that will illustrate a new button, I might add
21
21
  │ ├── button.component.js
22
22
  │ ├── button.stories.js
23
23
  ```
24
- In storybook's new Component Story Format ([CSF](https://storybook.js.org/docs/formats/component-story-format/)), stories are defined as ES modules. A default export marks the title and named exports introduce the story functions.
24
+ Stories are defined as ES modules. A default export marks the title and named exports introduce the story functions.
25
25
 
26
26
  ```js
27
- import React from 'react'
28
- import {CprButton} from 'canopy-styleguide'
27
+ import React from "react";
28
+ import { CpButton } from "@components";
29
29
 
30
30
  export default {
31
- title: 'Button',
32
- // including component will automagically fill docs around props
33
- component: CprButton,
31
+ title: "Button",
32
+ component: CpButton,
34
33
  }
35
34
 
36
- export const withEmojis = () => <CprButton>😀 😎 👍 💯</CprButton>
37
- export const withText = () => <CprButton>click me</CprBut>
35
+ export const withEmojis = () => <CpButton btnType="unstyled">😀 😎 👍 💯</CpButton>
36
+ export const withText = () => <CpButton btnType="unstyled">click me</CpButton>
38
37
  ```
39
38
 
40
39
  This will give us
41
40
 
42
41
  <img src='./img/Button.png' alt='storybook button example'>
43
42
 
44
- ## Addons we use
43
+ # GOAT (deprecated)
45
44
 
46
- ### [storysource](https://github.com/storybookjs/storybook/tree/next/addons/storysource): show stories source in the addon panel
47
-
48
- ### [knobs](https://github.com/storybookjs/storybook/tree/master/addons/knobs): edit props dynamically using the Storybook UI
49
-
50
- See [CprEmptyState](http://localhost:6006/?path=/story/cpremptystate--empty-state-knobs) for an example
51
-
52
-
53
- See [CSF](https://storybook.js.org/docs/formats/component-story-format/) docs and stories in this project for more
54
-
55
- [A useful recent (Jan 2020) blog post about storybook config](https://medium.com/storybookjs/declarative-storybook-configuration-49912f77b78)
56
-
57
- # GOAT (deprecating)
58
45
  [G.O.A.T website](https://goat.canopytax.com)
package/package.json CHANGED
@@ -1,118 +1,159 @@
1
1
  {
2
2
  "name": "@canopytax/styleguide",
3
- "version": "0.0.46",
3
+ "version": "1.1.2",
4
4
  "main": "module/module.js",
5
- "description": "Styleguide for Canopy",
5
+ "types": "module/module.d.ts",
6
+ "files": [
7
+ "module/"
8
+ ],
9
+ "description": "Component library for Canopy",
6
10
  "scripts": {
7
11
  "clean": "rimraf sofe build",
8
- "watch-tests": "jest --watch --config jest.json",
9
- "test": "jest --coverage --config jest.json",
10
- "lint": "eslint src",
11
- "start-goat": "webpack-dev-server --config webpack.config.goat.js --open",
12
- "goat": "webpack --config webpack.config.goat.js --mode production",
13
- "start": "webpack-dev-server --config webpack.config.js --port",
14
- "build": "webpack --config webpack.config.js --env.mode=production",
15
- "storybook": "start-storybook -p 6006",
16
- "build-storybook": "build-storybook -o storybook-build",
17
- "prepublishOnly": "yarn build-module",
18
- "build-module": "rimraf ./module && webpack --config webpack.config.module.js --env production"
12
+ "watch-tests": "jest --watch --config jest.config.js",
13
+ "test": "jest --coverage --config jest.config.js",
14
+ "eslint": "eslint src",
15
+ "lint": "yarn eslint && yarn type-check",
16
+ "start": "yarn prep && webpack serve --config webpack.config.js --port",
17
+ "build": "yarn prep && webpack --config webpack.config.js --env mode=production",
18
+ "build-storybook": "yarn prep && storybook build -o storybook-build",
19
+ "storybook": "yarn prep && storybook dev -p 6006",
20
+ "npm-publish": "npm publish --registry https://registry.npmjs.org --ignore-scripts",
21
+ "build:type-declarations": "tsc -p tsconfig.module.json",
22
+ "build:module": "rimraf ./module && yarn prep && webpack --config webpack.config.module.js && yarn build:type-declarations",
23
+ "prep": "node icons-build-types.js",
24
+ "type-check": "tsc --noEmit",
25
+ "type-check-watch": "tsc --noEmit --watch",
26
+ "postinstall": "husky && fe-ai",
27
+ "prepack": "pinst --disable",
28
+ "postpack": "pinst --enable"
19
29
  },
20
30
  "browserslist": [
21
31
  "extends browserslist-config-canopy"
22
32
  ],
23
33
  "devDependencies": {
24
- "@babel/core": "^7.11.1",
25
- "@babel/helper-regex": "^7.10.5",
26
- "@babel/plugin-proposal-class-properties": "^7.10.4",
27
- "@babel/plugin-syntax-dynamic-import": "^7.8.3",
28
- "@babel/plugin-transform-runtime": "^7.11.0",
29
- "@babel/preset-env": "^7.11.0",
30
- "@babel/preset-react": "^7.10.4",
31
- "@babel/runtime": "^7.11.2",
34
+ "@babel/cli": "^7.23.9",
35
+ "@babel/core": "^7.24.0",
36
+ "@babel/plugin-transform-runtime": "^7.24.0",
37
+ "@babel/preset-env": "^7.24.0",
38
+ "@babel/preset-react": "^7.23.3",
39
+ "@babel/preset-typescript": "^7.27.1",
40
+ "@babel/runtime": "^7.24.0",
41
+ "@canopytax/fe-ai-config": "^1.1.0",
32
42
  "@icoset/icoset": "^0.4.12",
33
43
  "@icoset/icoset-webpack-plugin": "^0.0.13",
34
- "@storybook/addon-actions": "^6.0.6",
35
- "@storybook/addon-docs": "^6.0.6",
36
- "@storybook/addon-knobs": "^6.0.6",
37
- "@storybook/addon-links": "^6.0.6",
38
- "@storybook/addon-storysource": "^6.0.6",
39
- "@storybook/addons": "^6.0.6",
40
- "@storybook/cli": "^6.0.6",
41
- "@storybook/preset-scss": "^1.0.2",
42
- "@storybook/react": "^6.0.6",
43
- "@testing-library/jest-dom": "^5.11.4",
44
- "@testing-library/react": "^10.4.8",
45
- "@testing-library/user-event": "^12.1.3",
46
- "@types/jest": "^26.0.9",
44
+ "@mdx-js/react": "^3.0.1",
45
+ "@storybook/addon-a11y": "^9.0.18",
46
+ "@storybook/addon-docs": "^9.0.18",
47
+ "@storybook/addon-links": "^9.0.18",
48
+ "@storybook/addon-styling": "^1.3.7",
49
+ "@storybook/addon-styling-webpack": "^2.0.0",
50
+ "@storybook/addon-webpack5-compiler-babel": "^3.0.6",
51
+ "@storybook/cli": "^9.0.18",
52
+ "@storybook/preset-scss": "1.0.3",
53
+ "@storybook/react-webpack5": "^9.0.18",
54
+ "@testing-library/dom": "^10.3.0",
55
+ "@testing-library/jest-dom": "^6.4.6",
56
+ "@testing-library/react": "^16.0.0",
57
+ "@testing-library/react-hooks": "^8.0.1",
58
+ "@testing-library/user-event": "^14.5.2",
59
+ "@types/eslint-plugin-jsx-a11y": "^6",
60
+ "@types/jest": "^29.1.2",
61
+ "@types/lodash": "^4.17.13",
62
+ "@types/luxon": "^3.4.2",
63
+ "@types/react": "^18",
64
+ "@types/react-dom": "^18",
65
+ "@types/react-router": "^5.1.20",
66
+ "@types/uuid": "^9.0.7",
67
+ "@types/validator": "^13.12.3",
47
68
  "autoprefixer": "^9.8.6",
48
- "babel-core": "^7.0.0-bridge.0",
49
- "babel-eslint": "^10.0.3",
50
- "babel-jest": "^26.3.0",
51
- "babel-loader": "^8.1.0",
52
- "babel-plugin-react-docgen": "^4.1.0",
53
- "browserslist-config-canopy": "^3.1.2",
54
- "canopy-sofe-extensions": "^3.0.2",
55
- "canopy-webpack-config": "^3.1.0",
69
+ "babel-jest": "^29.7.0",
70
+ "babel-loader": "^9.1.3",
71
+ "babel-plugin-react-docgen": "^4.2.1",
72
+ "browserslist-config-canopy": "^4.0.0",
73
+ "caniuse-lite": "^1.0.30001202",
74
+ "canopy-webpack-config": "^4.3.0",
56
75
  "css-loader": "^4.2.1",
57
- "custom-event-polyfill": "^1.0.7",
58
- "enzyme": "^3.11.0",
59
- "enzyme-adapter-react-16": "^1.15.4",
60
- "enzyme-to-json": "^3.4.4",
61
- "eslint": "^7.6.0",
62
- "eslint-config-canopy": "^2.3.0",
63
- "html-loader": "^1.1.0",
64
- "html-webpack-plugin": "^4.3.0",
65
- "husky": "^4.2.5",
76
+ "eslint": "^9.25.1",
77
+ "eslint-config-canopy": "^5.0.1",
78
+ "eslint-plugin-jsx-a11y": "^6.10.2",
79
+ "eslint-plugin-storybook": "9.0.18",
80
+ "husky": "^9.1.7",
66
81
  "identity-obj-proxy": "^3.0.0",
67
- "jest": "^26.4.0",
68
- "jest-cli": "^26.4.0",
69
- "kremling-babel-plugin": "^0.0.1",
70
- "kremling-loader": "^1.0.2",
82
+ "jest": "^29.5.0",
83
+ "jest-cli": "^29.2.0",
84
+ "jest-environment-jsdom": "^29.5.0",
85
+ "jest-jasmine2": "^29.2.0",
86
+ "kremling-babel-plugin": "^2.0.0",
87
+ "kremling-loader": "^3.0.2",
71
88
  "less": "^3.12.2",
72
- "less-loader": "^6.2.0",
89
+ "less-loader": "^11.1.3",
90
+ "lint-staged": "^15.5.1",
73
91
  "mini-css-extract-plugin": "^0.10.0",
74
- "postcss-custom-media": "^7.0.8",
75
- "postcss-loader": "^3.0.0",
76
- "precss": "^4.0.0",
77
- "raw-loader": "^4.0.1",
78
- "react-element-to-jsx-string": "^14.3.1",
79
- "react-highlight": "^0.12.0",
80
- "react-is": "^16.13.1",
81
- "react-router-dom": "5.2.0",
82
- "replace": "^1.1.5",
83
- "rework": "^1.0.1",
92
+ "pinst": "^3.0.0",
93
+ "postcss": "^8.4.27",
94
+ "postcss-loader": "^7.3.3",
95
+ "postcss-prefixer": "^3.0.0",
96
+ "prettier": "^3.5.3",
97
+ "react": "18.3.1",
98
+ "react-dom": "18.3.1",
99
+ "react-element-to-jsx-string": "^15.0.0",
100
+ "react-highlight": "^0.15.0",
101
+ "react-router-dom": "^6.30.2",
84
102
  "rimraf": "^3.0.2",
85
- "style-loader": "^1.2.1",
86
- "url-loader": "^4.1.0",
87
- "webpack": "^4.44.1",
88
- "webpack-bundle-analyzer": "^3.6.0",
89
- "webpack-cli": "^3.3.10",
90
- "webpack-dev-server": "^3.10.2"
103
+ "sass": "^1.81.0",
104
+ "sass-loader": "^16.0.3",
105
+ "semantic-release": "^24.2.3",
106
+ "storybook": "^9.1.17",
107
+ "storybook-dark-mode": "^4.0.1",
108
+ "style-loader": "^3.3.3",
109
+ "tailwindcss": "^3.4.3",
110
+ "tailwindcss-base-font-size": "^1.0.1",
111
+ "ts-loader": "^9.5.0",
112
+ "typescript": "^5.8.3",
113
+ "url-loader": "^4.1.1",
114
+ "webpack": "^5.88.2",
115
+ "webpack-bundle-analyzer": "^4.9.0",
116
+ "webpack-cli": "^5.1.4",
117
+ "webpack-dev-server": "^4.15.1"
91
118
  },
92
119
  "dependencies": {
93
- "@vvo/tzdb": "^5.4.0",
120
+ "@floating-ui/react": "^0.27.5",
121
+ "@hookform/resolvers": "^5.2.2",
122
+ "@tanstack/react-virtual": "^3.0.1",
123
+ "@tippyjs/react": "^4.2.4",
124
+ "@vvo/tzdb": "^6.71.1",
94
125
  "@webcomponents/custom-elements": "^1.4.2",
95
- "auto-trace": "^3.2.3",
96
- "chroma-js": "^2.1.0",
126
+ "auto-trace": "^3.3.2",
97
127
  "color": "^3.1.2",
98
128
  "dompurify": "^2.0.12",
99
- "kremling": "^2.0.2",
100
- "lodash": "^4.17.20",
129
+ "framer-motion": "^6.5.1",
130
+ "kremling": "^2.2.0",
131
+ "libphonenumber-js": "^1.9.14",
132
+ "lodash": "^4.17.21",
101
133
  "luxon": "^1.25.0",
102
134
  "moment": "^2.24.0",
103
135
  "moment-timezone": "^0.5.27",
104
136
  "prop-types": "^15.7.2",
105
- "react": "16.13.1",
106
- "react-dom": "16.13.1",
107
- "react-spring": "^8.0.27",
137
+ "react-calendar": "^6.0.0",
138
+ "react-hook-form": "^7.31.3",
139
+ "rxjs": "^7.5.5",
108
140
  "sanitize-html": "^1.27.3",
109
- "sass": "^1.28.0",
110
- "sass-loader": "^10.0.4",
111
- "single-spa": "^5.5.5"
141
+ "single-spa": "^5.5.5",
142
+ "tailwind-merge": "^3.4.0",
143
+ "tailwind-variants": "^1.0.0",
144
+ "uuid": "^8.3.2",
145
+ "validator": "^13.6.0",
146
+ "zod": "^4.1.12",
147
+ "zustand": "^5.0.3"
148
+ },
149
+ "packageManager": "yarn@4.1.0",
150
+ "lint-staged": {
151
+ "*.{js,ts,jsx,tsx,cjs,cts,mjs,mts,css,less,scss,md,mdx}": [
152
+ "prettier --write"
153
+ ]
112
154
  },
113
- "husky": {
114
- "hooks": {
115
- "pre-push": "yarn lint"
116
- }
155
+ "resolutions": {
156
+ "react": "18.3.1",
157
+ "react-dom": "18.3.1"
117
158
  }
118
159
  }
package/.babelrc DELETED
@@ -1,14 +0,0 @@
1
- {
2
- "presets": [
3
- "@babel/preset-react",
4
- ["@babel/preset-env", {
5
- "shippedProposals": true
6
- }]
7
- ],
8
- "plugins": [
9
- "@babel/plugin-syntax-dynamic-import",
10
- ["module:kremling-babel-plugin", {
11
- "namespace": "canopy-styleguide"
12
- }]
13
- ]
14
- }
package/.eslintrc DELETED
@@ -1,4 +0,0 @@
1
- {
2
- "extends": "canopy",
3
- "ignorePatterns": ["webpack.config.*"]
4
- }