@crowdstrike/tailwind-toucan-base 3.4.0 → 3.5.1
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.
- package/index.css +40 -0
- package/package.json +32 -47
- package/src/tailwind.config.js +1 -0
- package/toucan.css +40 -0
package/index.css
CHANGED
|
@@ -34120,6 +34120,11 @@ video {
|
|
|
34120
34120
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34121
34121
|
}
|
|
34122
34122
|
|
|
34123
|
+
.shadow-read-only-outline {
|
|
34124
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34125
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34126
|
+
}
|
|
34127
|
+
|
|
34123
34128
|
.shadow-2xl {
|
|
34124
34129
|
--tw-shadow: var(--elevation-2xl);
|
|
34125
34130
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34185,6 +34190,11 @@ video {
|
|
|
34185
34190
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34186
34191
|
}
|
|
34187
34192
|
|
|
34193
|
+
.hover\:shadow-read-only-outline:hover {
|
|
34194
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34195
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34196
|
+
}
|
|
34197
|
+
|
|
34188
34198
|
.hover\:shadow-2xl:hover {
|
|
34189
34199
|
--tw-shadow: var(--elevation-2xl);
|
|
34190
34200
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34250,6 +34260,11 @@ video {
|
|
|
34250
34260
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34251
34261
|
}
|
|
34252
34262
|
|
|
34263
|
+
.group:hover .group-hover\:shadow-read-only-outline {
|
|
34264
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34265
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34266
|
+
}
|
|
34267
|
+
|
|
34253
34268
|
.group:hover .group-hover\:shadow-2xl {
|
|
34254
34269
|
--tw-shadow: var(--elevation-2xl);
|
|
34255
34270
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34315,6 +34330,11 @@ video {
|
|
|
34315
34330
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34316
34331
|
}
|
|
34317
34332
|
|
|
34333
|
+
.focus\:shadow-read-only-outline:focus {
|
|
34334
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34335
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34336
|
+
}
|
|
34337
|
+
|
|
34318
34338
|
.focus\:shadow-2xl:focus {
|
|
34319
34339
|
--tw-shadow: var(--elevation-2xl);
|
|
34320
34340
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34380,6 +34400,11 @@ video {
|
|
|
34380
34400
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34381
34401
|
}
|
|
34382
34402
|
|
|
34403
|
+
.focus-within\:shadow-read-only-outline:focus-within {
|
|
34404
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34405
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34406
|
+
}
|
|
34407
|
+
|
|
34383
34408
|
.focus-within\:shadow-2xl:focus-within {
|
|
34384
34409
|
--tw-shadow: var(--elevation-2xl);
|
|
34385
34410
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34445,6 +34470,11 @@ video {
|
|
|
34445
34470
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34446
34471
|
}
|
|
34447
34472
|
|
|
34473
|
+
.focus-visible\:shadow-read-only-outline:focus-visible {
|
|
34474
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34475
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34476
|
+
}
|
|
34477
|
+
|
|
34448
34478
|
.focus-visible\:shadow-2xl:focus-visible {
|
|
34449
34479
|
--tw-shadow: var(--elevation-2xl);
|
|
34450
34480
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34510,6 +34540,11 @@ video {
|
|
|
34510
34540
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34511
34541
|
}
|
|
34512
34542
|
|
|
34543
|
+
.active\:shadow-read-only-outline:active {
|
|
34544
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34545
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34546
|
+
}
|
|
34547
|
+
|
|
34513
34548
|
.active\:shadow-2xl:active {
|
|
34514
34549
|
--tw-shadow: var(--elevation-2xl);
|
|
34515
34550
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34575,6 +34610,11 @@ video {
|
|
|
34575
34610
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34576
34611
|
}
|
|
34577
34612
|
|
|
34613
|
+
.disabled\:shadow-read-only-outline:disabled {
|
|
34614
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34615
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34616
|
+
}
|
|
34617
|
+
|
|
34578
34618
|
.disabled\:shadow-2xl:disabled {
|
|
34579
34619
|
--tw-shadow: var(--elevation-2xl);
|
|
34580
34620
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@crowdstrike/tailwind-toucan-base",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.5.1",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Tailwind preset for CrowdStrike's Toucan design system",
|
|
6
6
|
"repository": "https://github.com/CrowdStrike/tailwind-toucan-base",
|
|
@@ -36,42 +36,27 @@
|
|
|
36
36
|
]
|
|
37
37
|
}
|
|
38
38
|
},
|
|
39
|
-
"scripts": {
|
|
40
|
-
"start": "pnpm run build && npx http-server ./dist",
|
|
41
|
-
"build": "npm-run-all clean build:cdn build:alias build:preview build:theme-data",
|
|
42
|
-
"build:theme-data": "node ./build/theme-data.mjs",
|
|
43
|
-
"build:preview": "node ./build/preview/index.mjs",
|
|
44
|
-
"build:cdn": "NODE_ENV=production tailwind build -i ./build/input.css -o ./index.css -c ./build/tailwind.config.cdn.js",
|
|
45
|
-
"clean": "rm -f ./toucan.css ./index.css",
|
|
46
|
-
"build:alias": "cp index.css toucan.css",
|
|
47
|
-
"figma:export-styles": "figma-export use-config",
|
|
48
|
-
"test": "pnpm --filter='tests' exec vitest --coverage --run",
|
|
49
|
-
"lint:fix": "pnpm run lint:js --fix",
|
|
50
|
-
"lint:js": "eslint .",
|
|
51
|
-
"prepublishOnly": "pnpm build"
|
|
52
|
-
},
|
|
53
39
|
"dependencies": {
|
|
54
40
|
"tailwindcss": "^2.2.15"
|
|
55
41
|
},
|
|
56
42
|
"devDependencies": {
|
|
57
|
-
"@
|
|
43
|
+
"@changesets/changelog-github": "^0.4.8",
|
|
44
|
+
"@changesets/cli": "^2.26.1",
|
|
45
|
+
"@figma-export/cli": "4.6.0",
|
|
58
46
|
"@nullvoxpopuli/eslint-configs": "2.2.62",
|
|
59
|
-
"@
|
|
60
|
-
"
|
|
61
|
-
"
|
|
62
|
-
"autoprefixer": "^10.4.12",
|
|
63
|
-
"c8": "^7.12.0",
|
|
47
|
+
"@types/fs-extra": "^11.0.1",
|
|
48
|
+
"autoprefixer": "^10.4.14",
|
|
49
|
+
"c8": "^7.14.0",
|
|
64
50
|
"common-tags": "^1.8.2",
|
|
65
|
-
"eslint": "^8.
|
|
66
|
-
"execa": "^
|
|
67
|
-
"fs-extra": "^
|
|
51
|
+
"eslint": "^8.41.0",
|
|
52
|
+
"execa": "^7.1.1",
|
|
53
|
+
"fs-extra": "^11.1.1",
|
|
68
54
|
"npm-run-all": "^4.1.5",
|
|
69
|
-
"pnpm": "^
|
|
70
|
-
"postcss": "^8.4.
|
|
71
|
-
"semantic-release": "^19.0.5",
|
|
55
|
+
"pnpm": "^8.6.0",
|
|
56
|
+
"postcss": "^8.4.24",
|
|
72
57
|
"tailwind-config-viewer": "^1.7.2",
|
|
73
|
-
"typescript": "^
|
|
74
|
-
"vitest": "0.
|
|
58
|
+
"typescript": "^5.0.4",
|
|
59
|
+
"vitest": "0.31.2"
|
|
75
60
|
},
|
|
76
61
|
"engines": {
|
|
77
62
|
"node": ">=14.15.0"
|
|
@@ -79,24 +64,24 @@
|
|
|
79
64
|
"publishConfig": {
|
|
80
65
|
"access": "public"
|
|
81
66
|
},
|
|
82
|
-
"
|
|
83
|
-
"branches": [
|
|
84
|
-
"main",
|
|
85
|
-
"master"
|
|
86
|
-
],
|
|
87
|
-
"plugins": [
|
|
88
|
-
"@semantic-release/commit-analyzer",
|
|
89
|
-
"@semantic-release/release-notes-generator",
|
|
90
|
-
"@semantic-release/changelog",
|
|
91
|
-
"@semantic-release/npm",
|
|
92
|
-
"@semantic-release/github",
|
|
93
|
-
"@semantic-release/git"
|
|
94
|
-
]
|
|
95
|
-
},
|
|
96
|
-
"packageManager": "pnpm@7.13.5",
|
|
67
|
+
"packageManager": "pnpm@8.6.0",
|
|
97
68
|
"volta": {
|
|
98
|
-
"node": "16.
|
|
69
|
+
"node": "18.16.0",
|
|
99
70
|
"yarn": "1.22.19",
|
|
100
|
-
"npm": "
|
|
71
|
+
"npm": "9.6.7"
|
|
72
|
+
},
|
|
73
|
+
"scripts": {
|
|
74
|
+
"start": "pnpm run build && npx http-server ./dist",
|
|
75
|
+
"build": "npm-run-all clean build:cdn build:alias build:preview build:theme-data",
|
|
76
|
+
"build:theme-data": "node ./build/theme-data.mjs",
|
|
77
|
+
"build:preview": "node ./build/preview/index.mjs",
|
|
78
|
+
"build:cdn": "NODE_ENV=production tailwind build -i ./build/input.css -o ./index.css -c ./build/tailwind.config.cdn.js",
|
|
79
|
+
"clean": "rm -f ./toucan.css ./index.css",
|
|
80
|
+
"build:alias": "cp index.css toucan.css",
|
|
81
|
+
"figma:export-styles": "figma-export use-config",
|
|
82
|
+
"test": "pnpm --filter='tests' exec vitest --coverage --run",
|
|
83
|
+
"lint:fix": "pnpm run lint:js --fix",
|
|
84
|
+
"lint:js": "eslint .",
|
|
85
|
+
"release": "changeset publish"
|
|
101
86
|
}
|
|
102
|
-
}
|
|
87
|
+
}
|
package/src/tailwind.config.js
CHANGED
|
@@ -39,6 +39,7 @@ module.exports = {
|
|
|
39
39
|
'search-input': 'inset 0 0 0 1px var(--nav-text-secondary)',
|
|
40
40
|
'error-focus-outline':
|
|
41
41
|
'inset 0 0 0 2px var(--critical), 0 0 0 2px var(--surface-base), 0 0 0 4px var(--focus)',
|
|
42
|
+
'read-only-outline': 'inset 0 0 0 1px var(--disabled)',
|
|
42
43
|
...boxShadow,
|
|
43
44
|
},
|
|
44
45
|
|
package/toucan.css
CHANGED
|
@@ -34120,6 +34120,11 @@ video {
|
|
|
34120
34120
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34121
34121
|
}
|
|
34122
34122
|
|
|
34123
|
+
.shadow-read-only-outline {
|
|
34124
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34125
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34126
|
+
}
|
|
34127
|
+
|
|
34123
34128
|
.shadow-2xl {
|
|
34124
34129
|
--tw-shadow: var(--elevation-2xl);
|
|
34125
34130
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34185,6 +34190,11 @@ video {
|
|
|
34185
34190
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34186
34191
|
}
|
|
34187
34192
|
|
|
34193
|
+
.hover\:shadow-read-only-outline:hover {
|
|
34194
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34195
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34196
|
+
}
|
|
34197
|
+
|
|
34188
34198
|
.hover\:shadow-2xl:hover {
|
|
34189
34199
|
--tw-shadow: var(--elevation-2xl);
|
|
34190
34200
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34250,6 +34260,11 @@ video {
|
|
|
34250
34260
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34251
34261
|
}
|
|
34252
34262
|
|
|
34263
|
+
.group:hover .group-hover\:shadow-read-only-outline {
|
|
34264
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34265
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34266
|
+
}
|
|
34267
|
+
|
|
34253
34268
|
.group:hover .group-hover\:shadow-2xl {
|
|
34254
34269
|
--tw-shadow: var(--elevation-2xl);
|
|
34255
34270
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34315,6 +34330,11 @@ video {
|
|
|
34315
34330
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34316
34331
|
}
|
|
34317
34332
|
|
|
34333
|
+
.focus\:shadow-read-only-outline:focus {
|
|
34334
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34335
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34336
|
+
}
|
|
34337
|
+
|
|
34318
34338
|
.focus\:shadow-2xl:focus {
|
|
34319
34339
|
--tw-shadow: var(--elevation-2xl);
|
|
34320
34340
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34380,6 +34400,11 @@ video {
|
|
|
34380
34400
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34381
34401
|
}
|
|
34382
34402
|
|
|
34403
|
+
.focus-within\:shadow-read-only-outline:focus-within {
|
|
34404
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34405
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34406
|
+
}
|
|
34407
|
+
|
|
34383
34408
|
.focus-within\:shadow-2xl:focus-within {
|
|
34384
34409
|
--tw-shadow: var(--elevation-2xl);
|
|
34385
34410
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34445,6 +34470,11 @@ video {
|
|
|
34445
34470
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34446
34471
|
}
|
|
34447
34472
|
|
|
34473
|
+
.focus-visible\:shadow-read-only-outline:focus-visible {
|
|
34474
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34475
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34476
|
+
}
|
|
34477
|
+
|
|
34448
34478
|
.focus-visible\:shadow-2xl:focus-visible {
|
|
34449
34479
|
--tw-shadow: var(--elevation-2xl);
|
|
34450
34480
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34510,6 +34540,11 @@ video {
|
|
|
34510
34540
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34511
34541
|
}
|
|
34512
34542
|
|
|
34543
|
+
.active\:shadow-read-only-outline:active {
|
|
34544
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34545
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34546
|
+
}
|
|
34547
|
+
|
|
34513
34548
|
.active\:shadow-2xl:active {
|
|
34514
34549
|
--tw-shadow: var(--elevation-2xl);
|
|
34515
34550
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -34575,6 +34610,11 @@ video {
|
|
|
34575
34610
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34576
34611
|
}
|
|
34577
34612
|
|
|
34613
|
+
.disabled\:shadow-read-only-outline:disabled {
|
|
34614
|
+
--tw-shadow: inset 0 0 0 1px var(--disabled);
|
|
34615
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
34616
|
+
}
|
|
34617
|
+
|
|
34578
34618
|
.disabled\:shadow-2xl:disabled {
|
|
34579
34619
|
--tw-shadow: var(--elevation-2xl);
|
|
34580
34620
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|