@atlaskit/css 0.14.3 → 0.15.0
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/CHANGELOG.md +19 -0
- package/codemods/0.5.2-primitives-emotion-to-compiled/style-maps.partial.tsx +2 -32
- package/dist/cjs/index.js +6 -5
- package/dist/es2019/index.js +6 -7
- package/dist/esm/index.js +6 -6
- package/dist/types/index.d.ts +9 -6
- package/dist/types-ts4.5/index.d.ts +9 -8
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,24 @@
|
|
|
1
1
|
# @atlaskit/css
|
|
2
2
|
|
|
3
|
+
## 0.15.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`d65b31774de31`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d65b31774de31) -
|
|
8
|
+
Removed deprecated border radius and border width tokens from CSS type.
|
|
9
|
+
|
|
10
|
+
### Patch Changes
|
|
11
|
+
|
|
12
|
+
- Updated dependencies
|
|
13
|
+
|
|
14
|
+
## 0.14.4
|
|
15
|
+
|
|
16
|
+
### Patch Changes
|
|
17
|
+
|
|
18
|
+
- [`9d6e4b66e81f9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9d6e4b66e81f9) -
|
|
19
|
+
Internal changes.
|
|
20
|
+
- Updated dependencies
|
|
21
|
+
|
|
3
22
|
## 0.14.3
|
|
4
23
|
|
|
5
24
|
### Patch Changes
|
|
@@ -1256,27 +1256,18 @@ export type Layer = keyof typeof layerMap;
|
|
|
1256
1256
|
|
|
1257
1257
|
/**
|
|
1258
1258
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
1259
|
-
* @codegen <<SignedSource::
|
|
1259
|
+
* @codegen <<SignedSource::dc59452c62abcdabe4029b664d7037e1>>
|
|
1260
1260
|
* @codegenId border
|
|
1261
1261
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
1262
1262
|
* @codegenParams ["width", "radius"]
|
|
1263
|
-
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::
|
|
1263
|
+
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-shape.tsx <<SignedSource::c4d3b4472a9cb61697f29cba3433c11f>>
|
|
1264
1264
|
*/
|
|
1265
1265
|
export const borderWidthMap: {
|
|
1266
1266
|
'border.width': 'var(--ds-border-width)';
|
|
1267
|
-
'border.width.0': 'var(--ds-border-width-0)';
|
|
1268
|
-
'border.width.indicator': 'var(--ds-border-width-indicator)';
|
|
1269
|
-
'border.width.outline': 'var(--ds-border-width-outline)';
|
|
1270
1267
|
'border.width.selected': 'var(--ds-border-width-selected)';
|
|
1271
1268
|
'border.width.focused': 'var(--ds-border-width-focused)';
|
|
1272
1269
|
} = {
|
|
1273
1270
|
'border.width': token('border.width', '1px'),
|
|
1274
|
-
// @deprecated
|
|
1275
|
-
'border.width.0': token('border.width.0', '0px'),
|
|
1276
|
-
// @deprecated
|
|
1277
|
-
'border.width.indicator': token('border.width.indicator', '3px'),
|
|
1278
|
-
// @deprecated
|
|
1279
|
-
'border.width.outline': token('border.width.outline', '2px'),
|
|
1280
1271
|
'border.width.selected': token('border.width.selected', '2px'),
|
|
1281
1272
|
'border.width.focused': token('border.width.focused', '2px'),
|
|
1282
1273
|
};
|
|
@@ -1291,13 +1282,6 @@ export const borderRadiusMap: {
|
|
|
1291
1282
|
'radius.xlarge': 'var(--ds-radius-xlarge)';
|
|
1292
1283
|
'radius.full': 'var(--ds-radius-full)';
|
|
1293
1284
|
'radius.tile': 'var(--ds-radius-tile)';
|
|
1294
|
-
'border.radius': 'var(--ds-border-radius)';
|
|
1295
|
-
'border.radius.050': 'var(--ds-border-radius-050)';
|
|
1296
|
-
'border.radius.100': 'var(--ds-border-radius-100)';
|
|
1297
|
-
'border.radius.200': 'var(--ds-border-radius-200)';
|
|
1298
|
-
'border.radius.300': 'var(--ds-border-radius-300)';
|
|
1299
|
-
'border.radius.400': 'var(--ds-border-radius-400)';
|
|
1300
|
-
'border.radius.circle': 'var(--ds-border-radius-circle)';
|
|
1301
1285
|
} = {
|
|
1302
1286
|
'radius.xsmall': token('radius.xsmall', '2px'),
|
|
1303
1287
|
'radius.small': token('radius.small', '3px'),
|
|
@@ -1306,20 +1290,6 @@ export const borderRadiusMap: {
|
|
|
1306
1290
|
'radius.xlarge': token('radius.xlarge', '12px'),
|
|
1307
1291
|
'radius.full': token('radius.full', '9999px'),
|
|
1308
1292
|
'radius.tile': token('radius.tile', '25%'),
|
|
1309
|
-
// @deprecated
|
|
1310
|
-
'border.radius': token('border.radius', '3px'),
|
|
1311
|
-
// @deprecated
|
|
1312
|
-
'border.radius.050': token('border.radius.050', '2px'),
|
|
1313
|
-
// @deprecated
|
|
1314
|
-
'border.radius.100': token('border.radius.100', '3px'),
|
|
1315
|
-
// @deprecated
|
|
1316
|
-
'border.radius.200': token('border.radius.200', '8px'),
|
|
1317
|
-
// @deprecated
|
|
1318
|
-
'border.radius.300': token('border.radius.300', '12px'),
|
|
1319
|
-
// @deprecated
|
|
1320
|
-
'border.radius.400': token('border.radius.400', '16px'),
|
|
1321
|
-
// @deprecated
|
|
1322
|
-
'border.radius.circle': token('border.radius.circle', '9999px'),
|
|
1323
1293
|
};
|
|
1324
1294
|
|
|
1325
1295
|
export type BorderRadius = keyof typeof borderRadiusMap;
|
package/dist/cjs/index.js
CHANGED
|
@@ -16,11 +16,12 @@ var React = _interopRequireWildcard(require("react"));
|
|
|
16
16
|
var _runtime = require("@compiled/react/runtime");
|
|
17
17
|
var _react2 = require("@compiled/react");
|
|
18
18
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
19
|
-
var
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
19
|
+
var strictApi = (0, _react2.createStrictAPI)();
|
|
20
|
+
var css = exports.css = strictApi.css;
|
|
21
|
+
var cssMap = exports.cssMap = strictApi.cssMap;
|
|
22
|
+
strictApi.cssMap;
|
|
23
|
+
var cx = exports.cx = strictApi.cx;
|
|
24
|
+
var XCSSProp = strictApi.XCSSProp;
|
|
24
25
|
|
|
25
26
|
// This is to mitigate local TS error TS2315: Type 'StrictXCSSProp' is not generic.
|
|
26
27
|
// Currently for some reason tsc is generating malformed .d.ts in local dev environment, below change fixes it
|
package/dist/es2019/index.js
CHANGED
|
@@ -3,13 +3,12 @@ import * as React from 'react';
|
|
|
3
3
|
import { ax, ix } from "@compiled/react/runtime";
|
|
4
4
|
import { createStrictAPI } from '@compiled/react';
|
|
5
5
|
export { jsx } from '@compiled/react';
|
|
6
|
-
const
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
export { css, cssMap, cx };
|
|
6
|
+
const strictApi = createStrictAPI();
|
|
7
|
+
export const css = strictApi.css;
|
|
8
|
+
export const cssMap = strictApi.cssMap;
|
|
9
|
+
strictApi.cssMap;
|
|
10
|
+
export const cx = strictApi.cx;
|
|
11
|
+
const XCSSProp = strictApi.XCSSProp;
|
|
13
12
|
|
|
14
13
|
// This is to mitigate local TS error TS2315: Type 'StrictXCSSProp' is not generic.
|
|
15
14
|
// Currently for some reason tsc is generating malformed .d.ts in local dev environment, below change fixes it
|
package/dist/esm/index.js
CHANGED
|
@@ -3,12 +3,12 @@ import * as React from 'react';
|
|
|
3
3
|
import { ax, ix } from "@compiled/react/runtime";
|
|
4
4
|
import { createStrictAPI } from '@compiled/react';
|
|
5
5
|
export { jsx } from '@compiled/react';
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
6
|
+
var strictApi = createStrictAPI();
|
|
7
|
+
export var css = strictApi.css;
|
|
8
|
+
export var cssMap = strictApi.cssMap;
|
|
9
|
+
strictApi.cssMap;
|
|
10
|
+
export var cx = strictApi.cx;
|
|
11
|
+
var XCSSProp = strictApi.XCSSProp;
|
|
12
12
|
|
|
13
13
|
// This is to mitigate local TS error TS2315: Type 'StrictXCSSProp' is not generic.
|
|
14
14
|
// Currently for some reason tsc is generating malformed .d.ts in local dev environment, below change fixes it
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
|
-
import { type CSSPseudos, type StrictCSSProperties, type XCSSAllProperties, type XCSSAllPseudos } from '@compiled/react';
|
|
2
|
-
export { jsx } from '@compiled/react';
|
|
1
|
+
import { createStrictAPI, type CSSPseudos, type StrictCSSProperties, type XCSSAllProperties, type XCSSAllPseudos } from '@compiled/react';
|
|
3
2
|
import { type DesignTokenStyles } from '@atlaskit/tokens/css-type-schema';
|
|
3
|
+
export { jsx } from '@compiled/react';
|
|
4
4
|
type MediaQuery = '(min-width: 30rem)' | '(min-width: 48rem)' | '(min-width: 64rem)' | '(min-width: 90rem)' | '(min-width: 110.5rem)' | 'not all and (min-width: 30rem)' | 'not all and (min-width: 48rem)' | 'not all and (min-width: 64rem)' | 'not all and (min-width: 90rem)' | 'not all and (min-width: 110.5rem)' | '(min-width: 0rem) and (max-width: 29.99rem)' | '(min-width: 30rem) and (max-width: 47.99rem)' | '(min-width: 48rem) and (max-width: 63.99rem)' | '(min-width: 64rem) and (max-width: 89.99rem)' | '(min-width: 90rem) and (max-width: 110.49rem)' | '(prefers-reduced-motion: reduce)' | 'screen and (forced-colors: active), screen and (-ms-high-contrast: active)';
|
|
5
|
-
declare const
|
|
6
|
-
|
|
7
|
-
}
|
|
8
|
-
export
|
|
5
|
+
declare const strictApi: ReturnType<typeof createStrictAPI<DesignTokenStyles, {
|
|
6
|
+
media: MediaQuery;
|
|
7
|
+
}>>;
|
|
8
|
+
export declare const css: typeof strictApi.css;
|
|
9
|
+
export declare const cssMap: typeof strictApi.cssMap;
|
|
10
|
+
export declare const cx: typeof strictApi.cx;
|
|
11
|
+
declare const XCSSProp: typeof strictApi.XCSSProp;
|
|
9
12
|
export type { XCSSAllProperties, XCSSAllPseudos };
|
|
10
13
|
type LocalXCSSProp<TAllowedProperties extends keyof StrictCSSProperties, TAllowedPseudos extends CSSPseudos, TRequiredProperties extends {
|
|
11
14
|
requiredProperties: TAllowedProperties;
|
|
@@ -1,13 +1,14 @@
|
|
|
1
|
-
import { type CSSPseudos, type StrictCSSProperties, type XCSSAllProperties, type XCSSAllPseudos } from '@compiled/react';
|
|
2
|
-
export { jsx } from '@compiled/react';
|
|
1
|
+
import { createStrictAPI, type CSSPseudos, type StrictCSSProperties, type XCSSAllProperties, type XCSSAllPseudos } from '@compiled/react';
|
|
3
2
|
import { type DesignTokenStyles } from '@atlaskit/tokens/css-type-schema';
|
|
3
|
+
export { jsx } from '@compiled/react';
|
|
4
4
|
type MediaQuery = '(min-width: 30rem)' | '(min-width: 48rem)' | '(min-width: 64rem)' | '(min-width: 90rem)' | '(min-width: 110.5rem)' | 'not all and (min-width: 30rem)' | 'not all and (min-width: 48rem)' | 'not all and (min-width: 64rem)' | 'not all and (min-width: 90rem)' | 'not all and (min-width: 110.5rem)' | '(min-width: 0rem) and (max-width: 29.99rem)' | '(min-width: 30rem) and (max-width: 47.99rem)' | '(min-width: 48rem) and (max-width: 63.99rem)' | '(min-width: 64rem) and (max-width: 89.99rem)' | '(min-width: 90rem) and (max-width: 110.49rem)' | '(prefers-reduced-motion: reduce)' | 'screen and (forced-colors: active), screen and (-ms-high-contrast: active)';
|
|
5
|
-
declare const
|
|
6
|
-
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
export
|
|
5
|
+
declare const strictApi: ReturnType<typeof createStrictAPI<DesignTokenStyles, {
|
|
6
|
+
media: MediaQuery;
|
|
7
|
+
}>>;
|
|
8
|
+
export declare const css: typeof strictApi.css;
|
|
9
|
+
export declare const cssMap: typeof strictApi.cssMap;
|
|
10
|
+
export declare const cx: typeof strictApi.cx;
|
|
11
|
+
declare const XCSSProp: typeof strictApi.XCSSProp;
|
|
11
12
|
export type { XCSSAllProperties, XCSSAllPseudos };
|
|
12
13
|
type LocalXCSSProp<TAllowedProperties extends keyof StrictCSSProperties, TAllowedPseudos extends CSSPseudos, TRequiredProperties extends {
|
|
13
14
|
requiredProperties: TAllowedProperties;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/css",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.15.0",
|
|
4
4
|
"description": "Style components backed by Atlassian Design System design tokens powered by Compiled CSS-in-JS.",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
],
|
|
45
45
|
"atlaskit:src": "src/index.tsx",
|
|
46
46
|
"dependencies": {
|
|
47
|
-
"@atlaskit/tokens": "^6.
|
|
47
|
+
"@atlaskit/tokens": "^6.5.0",
|
|
48
48
|
"@babel/runtime": "^7.0.0",
|
|
49
49
|
"@compiled/react": "^0.18.3"
|
|
50
50
|
},
|
|
@@ -53,9 +53,9 @@
|
|
|
53
53
|
},
|
|
54
54
|
"devDependencies": {
|
|
55
55
|
"@af/visual-regression": "workspace:^",
|
|
56
|
-
"@atlaskit/button": "^23.
|
|
56
|
+
"@atlaskit/button": "^23.5.0",
|
|
57
57
|
"@atlaskit/ds-lib": "^5.1.0",
|
|
58
|
-
"@atlaskit/primitives": "^
|
|
58
|
+
"@atlaskit/primitives": "^15.0.0",
|
|
59
59
|
"@emotion/react": "^11.7.1",
|
|
60
60
|
"@testing-library/react": "^13.4.0",
|
|
61
61
|
"@types/jscodeshift": "^0.11.0",
|