@stylexjs/shared 0.2.0-beta.25 → 0.2.0-beta.26

Sign up to get free protection for your applications and to get access to all the features.
@@ -117,13 +117,13 @@ declare const shorthands: {
117
117
  animationRange: (value: TStyleValue) => TReturn;
118
118
  background: (value: TStyleValue) => TReturn;
119
119
  backgroundPosition: (value: TStyleValue) => TReturn;
120
- border: (_rawValue: TStyleValue) => TReturn;
121
- borderInline: (_rawValue: TStyleValue) => TReturn;
122
- borderBlock: (_rawValue: TStyleValue) => TReturn;
123
- borderTop: (_rawValue: TStyleValue) => TReturn;
124
- borderInlineEnd: (_rawValue: TStyleValue) => TReturn;
125
- borderRight: (_rawValue: TStyleValue) => TReturn;
126
- borderBottom: (_rawValue: TStyleValue) => TReturn;
120
+ border: (rawValue: TStyleValue) => TReturn;
121
+ borderInline: (rawValue: TStyleValue) => TReturn;
122
+ borderBlock: (rawValue: TStyleValue) => TReturn;
123
+ borderTop: (rawValue: TStyleValue) => TReturn;
124
+ borderInlineEnd: (rawValue: TStyleValue) => TReturn;
125
+ borderRight: (rawValue: TStyleValue) => TReturn;
126
+ borderBottom: (rawValue: TStyleValue) => TReturn;
127
127
  borderInlineStart: (_rawValue: TStyleValue) => TReturn;
128
128
  borderLeft: (_rawValue: TStyleValue) => TReturn;
129
129
  borderInlineWidth: (rawValue: TStyleValue) => TReturn;
@@ -14,33 +14,15 @@ const shorthands = {
14
14
  animationRange: value => [['animationRange', value], ['animationRangeEnd', null], ['animationRangeStart', null]],
15
15
  background: value => [['background', value], ['backgroundAttachment', null], ['backgroundClip', null], ['backgroundColor', null], ['backgroundImage', null], ['backgroundOrigin', null], ...shorthands.backgroundPosition(null), ['backgroundRepeat', null], ['backgroundSize', null]],
16
16
  backgroundPosition: value => [['backgroundPosition', value], ['backgroundPositionX', null], ['backgroundPositionY', null]],
17
- border: _rawValue => {
18
- throw new Error('`border` shorthand is not supported. Use `borderWidth`, `borderStyle` and `borderColor` instead.');
19
- },
20
- borderInline: _rawValue => {
21
- throw new Error('`borderInline` shorthand is not supported. Use `borderInlineWidth`, `borderInlineStyle` and `borderInlineColor` instead.');
22
- },
23
- borderBlock: _rawValue => {
24
- throw new Error('`borderBlock` shorthand is not supported. Use `borderBlockWidth`, `borderBlockStyle` and `borderBlockColor` instead.');
25
- },
26
- borderTop: _rawValue => {
27
- throw new Error(['`borderTop` is not supported.', 'Use `borderTopWidth`, `borderTopStyle` and `borderTopColor`,'].join(' '));
28
- },
29
- borderInlineEnd: _rawValue => {
30
- throw new Error('`borderInlineEnd` shorthand is not supported. Use `borderInlineEndWidth`, `borderInlineEndStyle` and `borderInlineEndColor` instead.');
31
- },
32
- borderRight: _rawValue => {
33
- throw new Error('`borderRight` shorthand is not supported. Use `borderRightWidth`, `borderRightStyle` and `borderRightColor` instead.');
34
- },
35
- borderBottom: _rawValue => {
36
- throw new Error('`borderBottom` shorthand is not supported. Use `borderBottomWidth`, `borderBottomStyle` and `borderBottomColor` instead.');
37
- },
38
- borderInlineStart: _rawValue => {
39
- throw new Error('`borderInlineStart` shorthand is not supported. Use `borderInlineStartWidth`, `borderInlineStartStyle` and `borderInlineStartColor` instead.');
40
- },
41
- borderLeft: _rawValue => {
42
- throw new Error(['`borderLeft` is not supported.', 'You could use `borderLeftWidth`, `borderLeftStyle` and `borderLeftColor`,', 'but it is preferable to use `borderInlineStartWidth`, `borderInlineStartStyle` and `borderInlineStartColor`.'].join(' '));
43
- },
17
+ border: rawValue => [['border', rawValue], ...shorthands.borderWidth(null), ...shorthands.borderStyle(null), ...shorthands.borderColor(null)],
18
+ borderInline: rawValue => [['borderInline', rawValue], ...shorthands.borderInlineWidth(null), ...shorthands.borderInlineStyle(null), ...shorthands.borderInlineColor(null)],
19
+ borderBlock: rawValue => [['borderBlock', rawValue], ...shorthands.borderBlockWidth(null), ...shorthands.borderBlockStyle(null), ...shorthands.borderBlockColor(null)],
20
+ borderTop: rawValue => [['borderTop', rawValue], ['borderTopWidth', null], ['borderTopStyle', null], ['borderTopColor', null]],
21
+ borderInlineEnd: rawValue => [['borderInlineEnd', rawValue], ...shorthands.borderInlineEndWidth(null), ...shorthands.borderInlineEndStyle(null), ...shorthands.borderInlineEndColor(null)],
22
+ borderRight: rawValue => [['borderRight', rawValue], ...shorthands.borderRightWidth(null), ...shorthands.borderRightStyle(null), ...shorthands.borderRightColor(null)],
23
+ borderBottom: rawValue => [['borderBottom', rawValue], ['borderBottomWidth', null], ['borderBottomStyle', null], ['borderBottomColor', null]],
24
+ borderInlineStart: _rawValue => [['borderInlineStart', null], ...shorthands.borderInlineStartWidth(null), ...shorthands.borderInlineStartStyle(null), ...shorthands.borderInlineStartColor(null)],
25
+ borderLeft: _rawValue => [['borderLeft', null], ...shorthands.borderLeftWidth(null), ...shorthands.borderLeftStyle(null), ...shorthands.borderLeftColor(null)],
44
26
  borderInlineWidth: rawValue => [['borderInlineWidth', rawValue], ['borderInlineStartWidth', null], ['borderLeftWidth', null], ['borderInlineEndWidth', null], ['borderRightWidth', null]],
45
27
  borderInlineStyle: rawValue => [['borderInlineStyle', rawValue], ['borderInlineStartStyle', null], ['borderLeftStyle', null], ['borderInlineEndStyle', null], ['borderRightStyle', null]],
46
28
  borderInlineColor: rawValue => [['borderInlineColor', rawValue], ['borderInlineStartColor', null], ['borderLeftColor', null], ['borderInlineEndColor', null], ['borderRightColor', null]],
@@ -68,13 +68,13 @@ declare const shorthands: {
68
68
  animationRange: (value: TStyleValue) => TReturn,
69
69
  background: (value: TStyleValue) => TReturn,
70
70
  backgroundPosition: (value: TStyleValue) => TReturn,
71
- border: (_rawValue: TStyleValue) => TReturn,
72
- borderInline: (_rawValue: TStyleValue) => TReturn,
73
- borderBlock: (_rawValue: TStyleValue) => TReturn,
74
- borderTop: (_rawValue: TStyleValue) => TReturn,
75
- borderInlineEnd: (_rawValue: TStyleValue) => TReturn,
76
- borderRight: (_rawValue: TStyleValue) => TReturn,
77
- borderBottom: (_rawValue: TStyleValue) => TReturn,
71
+ border: (rawValue: TStyleValue) => TReturn,
72
+ borderInline: (rawValue: TStyleValue) => TReturn,
73
+ borderBlock: (rawValue: TStyleValue) => TReturn,
74
+ borderTop: (rawValue: TStyleValue) => TReturn,
75
+ borderInlineEnd: (rawValue: TStyleValue) => TReturn,
76
+ borderRight: (rawValue: TStyleValue) => TReturn,
77
+ borderBottom: (rawValue: TStyleValue) => TReturn,
78
78
  borderInlineStart: (_rawValue: TStyleValue) => TReturn,
79
79
  borderLeft: (_rawValue: TStyleValue) => TReturn,
80
80
  borderInlineWidth: (rawValue: TStyleValue) => TReturn,
@@ -10,7 +10,7 @@ var _normalizeValue = _interopRequireDefault(require("./utils/normalize-value"))
10
10
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
11
  function transformValue(key, rawValue) {
12
12
  const value = typeof rawValue === 'number' ? String(Math.round(rawValue * 10000) / 10000) + getNumberSuffix(key) : rawValue;
13
- if (key === 'content' && typeof value === 'string') {
13
+ if ((key === 'content' || key === 'hyphenateCharacter' || key === 'hyphenate-character') && typeof value === 'string') {
14
14
  const val = value.trim();
15
15
  if (val.match(/^attr\([a-zA-Z0-9-]+\)$/)) {
16
16
  return val;
@@ -32,7 +32,7 @@ function getNumberSuffix(key) {
32
32
  return suffix;
33
33
  }
34
34
  }
35
- const unitlessNumberProperties = new Set(['animationIterationCount', 'aspectRatio', 'borderImageOutset', 'borderImageSlice', 'borderImageWidth', 'columnCount', 'flex', 'flexGrow', 'flexPositive', 'flexShrink', 'flexOrder', 'gridRow', 'gridColumn', 'fontWeight', 'lineClamp', 'lineHeight', 'opacity', 'order', 'orphans', 'tabSize', 'widows', 'zIndex', 'fillOpacity', 'floodOpacity', 'stopOpacity', 'strokeDasharray', 'strokeDashoffset', 'strokeMiterlimit', 'strokeOpacity', 'strokeWidth', 'scale']);
35
+ const unitlessNumberProperties = new Set(['WebkitLineClamp', 'animationIterationCount', 'aspectRatio', 'borderImageOutset', 'borderImageSlice', 'borderImageWidth', 'counterSet', 'columnCount', 'flex', 'flexGrow', 'flexPositive', 'flexShrink', 'flexOrder', 'gridRow', 'gridColumn', 'fontWeight', 'hyphenateLimitChars', 'lineClamp', 'lineHeight', 'maskBorderOutset', 'maskBorderSlice', 'maskBorderWidth', 'opacity', 'order', 'orphans', 'tabSize', 'widows', 'zIndex', 'fillOpacity', 'floodOpacity', 'rotate', 'scale', 'stopOpacity', 'strokeDasharray', 'strokeDashoffset', 'strokeMiterlimit', 'strokeOpacity', 'strokeWidth', 'scale', 'mathDepth']);
36
36
  const numberPropertySuffixes = {
37
37
  animationDelay: 'ms',
38
38
  animationDuration: 'ms',
@@ -334,7 +334,6 @@ longHandLogical.add('inset-inline-end');
334
334
  longHandPhysical.add('right');
335
335
  longHandLogical.add('clear');
336
336
  longHandLogical.add('float');
337
- longHandLogical.add('overlay');
338
337
  longHandLogical.add('position');
339
338
  longHandLogical.add('z-index');
340
339
  longHandLogical.add('ruby-align');
@@ -364,14 +363,8 @@ longHandPhysical.add('scroll-padding-left');
364
363
  longHandLogical.add('scroll-padding-inline-end');
365
364
  longHandPhysical.add('scroll-padding-right');
366
365
  longHandLogical.add('scroll-snap-align');
367
- longHandLogical.add('scroll-snap-coordinate');
368
- longHandLogical.add('scroll-snap-destination');
369
- longHandLogical.add('scroll-snap-points-x');
370
- longHandLogical.add('scroll-snap-points-y');
371
366
  longHandLogical.add('scroll-snap-stop');
372
367
  shorthandsOfLonghands.add('scroll-snap-type');
373
- longHandLogical.add('scroll-snap-type-x');
374
- longHandLogical.add('scroll-snap-type-y');
375
368
  longHandLogical.add('scrollbar-color');
376
369
  longHandLogical.add('scrollbar-width');
377
370
  longHandLogical.add('shape-image-threshold');
@@ -416,7 +409,6 @@ longHandLogical.add('text-transform');
416
409
  longHandLogical.add('text-wrap');
417
410
  longHandLogical.add('white-space');
418
411
  longHandLogical.add('white-space-collapse');
419
- longHandLogical.add('white-space-trim');
420
412
  longHandLogical.add('word-break');
421
413
  longHandLogical.add('word-spacing');
422
414
  longHandLogical.add('word-wrap');
@@ -431,7 +423,6 @@ longHandLogical.add('transform-origin');
431
423
  longHandLogical.add('transform-style');
432
424
  longHandLogical.add('translate');
433
425
  shorthandsOfLonghands.add('transition');
434
- longHandLogical.add('transition-behavior');
435
426
  longHandLogical.add('transition-delay');
436
427
  longHandLogical.add('transition-duration');
437
428
  longHandLogical.add('transition-property');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stylexjs/shared",
3
- "version": "0.2.0-beta.25",
3
+ "version": "0.2.0-beta.26",
4
4
  "main": "lib/index.js",
5
5
  "repository": "https://www.github.com/facebook/stylex",
6
6
  "license": "MIT",
@@ -13,7 +13,7 @@
13
13
  "postcss-value-parser": "^4.1.0"
14
14
  },
15
15
  "devDependencies": {
16
- "@stylexjs/scripts": "0.2.0-beta.25"
16
+ "@stylexjs/scripts": "0.2.0-beta.26"
17
17
  },
18
18
  "jest": {
19
19
  "snapshotFormat": {