@atlaskit/primitives 3.1.0 → 4.0.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 +16 -0
- package/constellation/text/code.mdx +1 -1
- package/constellation/text/examples.mdx +3 -3
- package/constellation/text/usage.mdx +2 -4
- package/dist/cjs/components/anchor.js +4 -2
- package/dist/cjs/components/bleed.js +3 -2
- package/dist/cjs/components/box.js +5 -5
- package/dist/cjs/components/flex.js +3 -2
- package/dist/cjs/components/grid.js +3 -2
- package/dist/cjs/components/inline.js +8 -3
- package/dist/cjs/components/pressable.js +5 -1
- package/dist/cjs/components/stack.js +8 -3
- package/dist/cjs/components/text.js +2 -5
- package/dist/cjs/xcss/style-maps.partial.js +8 -39
- package/dist/cjs/xcss/xcss.js +52 -14
- package/dist/es2019/components/anchor.js +4 -2
- package/dist/es2019/components/bleed.js +3 -2
- package/dist/es2019/components/box.js +5 -5
- package/dist/es2019/components/flex.js +3 -2
- package/dist/es2019/components/grid.js +3 -2
- package/dist/es2019/components/inline.js +8 -3
- package/dist/es2019/components/pressable.js +5 -1
- package/dist/es2019/components/stack.js +8 -3
- package/dist/es2019/components/text.js +2 -6
- package/dist/es2019/xcss/style-maps.partial.js +7 -38
- package/dist/es2019/xcss/xcss.js +38 -8
- package/dist/esm/components/anchor.js +4 -2
- package/dist/esm/components/bleed.js +3 -2
- package/dist/esm/components/box.js +5 -5
- package/dist/esm/components/flex.js +3 -2
- package/dist/esm/components/grid.js +3 -2
- package/dist/esm/components/inline.js +8 -3
- package/dist/esm/components/pressable.js +5 -1
- package/dist/esm/components/stack.js +8 -3
- package/dist/esm/components/text.js +2 -6
- package/dist/esm/xcss/style-maps.partial.js +7 -38
- package/dist/esm/xcss/xcss.js +52 -10
- package/dist/types/components/flex.d.ts +2 -2
- package/dist/types/components/grid.d.ts +3 -3
- package/dist/types/components/pressable.d.ts +1 -1
- package/dist/types/components/stack.d.ts +1 -1
- package/dist/types/components/text.d.ts +12 -23
- package/dist/types/components/types.d.ts +3 -2
- package/dist/types/xcss/style-maps.partial.d.ts +9 -49
- package/dist/types/xcss/xcss.d.ts +11 -5
- package/dist/types-ts4.5/components/flex.d.ts +2 -2
- package/dist/types-ts4.5/components/grid.d.ts +3 -3
- package/dist/types-ts4.5/components/pressable.d.ts +1 -1
- package/dist/types-ts4.5/components/stack.d.ts +1 -1
- package/dist/types-ts4.5/components/text.d.ts +12 -23
- package/dist/types-ts4.5/components/types.d.ts +3 -2
- package/dist/types-ts4.5/xcss/style-maps.partial.d.ts +9 -49
- package/dist/types-ts4.5/xcss/xcss.d.ts +11 -5
- package/package.json +3 -2
- package/scripts/codegen-styles.tsx +1 -1
- package/scripts/typography-codegen-template.tsx +34 -56
|
@@ -63,5 +63,5 @@ declare const UNSAFE_PRESSABLE: React.ForwardRefExoticComponent<Pick<Omit<BoxPro
|
|
|
63
63
|
* Additional information to be included in the `context` of analytics events that come from pressable.
|
|
64
64
|
*/
|
|
65
65
|
analyticsContext?: Record<string, any> | undefined;
|
|
66
|
-
}, "padding" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "backgroundColor" | "color" | "translate" | "
|
|
66
|
+
}, "padding" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "backgroundColor" | "color" | "translate" | "hidden" | "key" | "value" | "children" | "form" | "slot" | "title" | "name" | "type" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "testId" | "xcss" | "data-testid" | "isDisabled" | "interactionName" | "componentName" | "analyticsContext"> & React.RefAttributes<HTMLButtonElement>>;
|
|
67
67
|
export default UNSAFE_PRESSABLE;
|
|
@@ -58,7 +58,7 @@ declare const Stack: import("react").MemoExoticComponent<import("react").Forward
|
|
|
58
58
|
/**
|
|
59
59
|
* Used to align children along the block axis (typically vertical).
|
|
60
60
|
*/
|
|
61
|
-
alignBlock?: "
|
|
61
|
+
alignBlock?: "center" | "stretch" | "end" | "start" | undefined;
|
|
62
62
|
/**
|
|
63
63
|
* Used to align children along the inline axis (typically horizontal).
|
|
64
64
|
*/
|
|
@@ -1,30 +1,9 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { FC, ReactNode } from 'react';
|
|
3
|
-
import {
|
|
3
|
+
import { BodyFont, FontWeight, TextColor } from '../xcss/style-maps.partial';
|
|
4
4
|
import type { BasePrimitiveProps } from './types';
|
|
5
5
|
declare const asAllowlist: readonly ["span", "p", "strong", "em"];
|
|
6
6
|
type AsElement = (typeof asAllowlist)[number];
|
|
7
|
-
type TextPropsBody = {
|
|
8
|
-
/**
|
|
9
|
-
* Text variant.
|
|
10
|
-
*/
|
|
11
|
-
variant?: BodyText;
|
|
12
|
-
/**
|
|
13
|
-
* The number of lines to limit the provided text to. Text will be truncated with an ellipsis.
|
|
14
|
-
*
|
|
15
|
-
* When `maxLines={1}`, `wordBreak` defaults to `break-all` to match the behaviour of `text-overflow: ellipsis`.
|
|
16
|
-
*
|
|
17
|
-
* Only available for `body` text variants.
|
|
18
|
-
*/
|
|
19
|
-
maxLines?: number;
|
|
20
|
-
};
|
|
21
|
-
type TextPropsUi = {
|
|
22
|
-
/**
|
|
23
|
-
* Text variant.
|
|
24
|
-
*/
|
|
25
|
-
variant: UiText;
|
|
26
|
-
maxLines?: never;
|
|
27
|
-
};
|
|
28
7
|
type TextPropsBase = {
|
|
29
8
|
/**
|
|
30
9
|
* HTML tag to be rendered. Defaults to `span`.
|
|
@@ -44,16 +23,26 @@ type TextPropsBase = {
|
|
|
44
23
|
* The [HTML `id` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id).
|
|
45
24
|
*/
|
|
46
25
|
id?: string;
|
|
26
|
+
/**
|
|
27
|
+
* The number of lines to limit the provided text to. Text will be truncated with an ellipsis.
|
|
28
|
+
*
|
|
29
|
+
* When `maxLines={1}`, `wordBreak` defaults to `break-all` to match the behaviour of `text-overflow: ellipsis`.
|
|
30
|
+
*/
|
|
31
|
+
maxLines?: number;
|
|
47
32
|
/**
|
|
48
33
|
* The [HTML `text-align` attribute](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align).
|
|
49
34
|
*/
|
|
50
35
|
textAlign?: TextAlign;
|
|
36
|
+
/**
|
|
37
|
+
* Text variant.
|
|
38
|
+
*/
|
|
39
|
+
variant?: BodyFont;
|
|
51
40
|
/**
|
|
52
41
|
* The [HTML `font-weight` attribute](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight).
|
|
53
42
|
*/
|
|
54
43
|
weight?: FontWeight;
|
|
55
44
|
};
|
|
56
|
-
export type TextProps = TextPropsBase & Omit<BasePrimitiveProps, 'xcss'
|
|
45
|
+
export type TextProps = TextPropsBase & Omit<BasePrimitiveProps, 'xcss'>;
|
|
57
46
|
type TextAlign = keyof typeof textAlignMap;
|
|
58
47
|
declare const textAlignMap: {
|
|
59
48
|
center: import("@emotion/react").SerializedStyles;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { CSSProperties } from 'react';
|
|
2
|
+
import type { StrictXCSSProp, XCSSAllProperties, XCSSAllPseudos } from '@atlaskit/css';
|
|
2
3
|
import type { XCSS } from '../xcss/xcss';
|
|
3
4
|
export type BasePrimitiveProps = {
|
|
4
5
|
/**
|
|
@@ -11,9 +12,9 @@ export type BasePrimitiveProps = {
|
|
|
11
12
|
*/
|
|
12
13
|
'data-testid'?: never;
|
|
13
14
|
/**
|
|
14
|
-
* Apply a subset of permitted styles
|
|
15
|
+
* Apply a subset of permitted styles powered by Atlassian Design System design tokens.
|
|
15
16
|
*/
|
|
16
|
-
xcss?: XCSS | Array<XCSS | false | undefined>;
|
|
17
|
+
xcss?: XCSS | Array<XCSS | false | undefined> | StrictXCSSProp<XCSSAllProperties, XCSSAllPseudos>;
|
|
17
18
|
/**
|
|
18
19
|
* Accessible role.
|
|
19
20
|
*/
|
|
@@ -515,24 +515,19 @@ export type BorderRadius = keyof typeof borderRadiusMap;
|
|
|
515
515
|
*/
|
|
516
516
|
/**
|
|
517
517
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
518
|
-
* @codegen <<SignedSource::
|
|
518
|
+
* @codegen <<SignedSource::76c411b57ce0b5e8faa09cb692065229>>
|
|
519
519
|
* @codegenId typography
|
|
520
520
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
521
521
|
* @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight", "body", "ui"]
|
|
522
522
|
* @codegenDependency ../../scripts/codegen-file-templates/dimensions.tsx <<SignedSource::0cd422575c3f2a3784eeef767abe71f4>>
|
|
523
523
|
* @codegenDependency ../../scripts/codegen-file-templates/layer.tsx <<SignedSource::79d24a1e558f12d671c06a7609f90dc1>>
|
|
524
524
|
*/
|
|
525
|
-
export declare const
|
|
526
|
-
|
|
527
|
-
'
|
|
528
|
-
'
|
|
529
|
-
'font.size.200': "var(--ds-font-size-200)";
|
|
530
|
-
'font.size.300': "var(--ds-font-size-300)";
|
|
531
|
-
'font.size.400': "var(--ds-font-size-400)";
|
|
532
|
-
'font.size.500': "var(--ds-font-size-500)";
|
|
533
|
-
'font.size.600': "var(--ds-font-size-600)";
|
|
525
|
+
export declare const bodyFontMap: {
|
|
526
|
+
body: "var(--ds-font-body)";
|
|
527
|
+
'body.large': "var(--ds-font-body-large)";
|
|
528
|
+
'body.small': "var(--ds-font-body-small)";
|
|
534
529
|
};
|
|
535
|
-
export type
|
|
530
|
+
export type BodyFont = keyof typeof bodyFontMap;
|
|
536
531
|
export declare const fontWeightMap: {
|
|
537
532
|
bold: "var(--ds-font-weight-bold)";
|
|
538
533
|
medium: "var(--ds-font-weight-medium)";
|
|
@@ -541,36 +536,10 @@ export declare const fontWeightMap: {
|
|
|
541
536
|
};
|
|
542
537
|
export type FontWeight = keyof typeof fontWeightMap;
|
|
543
538
|
export declare const fontFamilyMap: {
|
|
544
|
-
'font.family.body': "var(--ds-font-family-body)";
|
|
545
539
|
'font.family.brand.body': "var(--ds-font-family-brand-body)";
|
|
546
540
|
'font.family.brand.heading': "var(--ds-font-family-brand-heading)";
|
|
547
|
-
'font.family.code': "var(--ds-font-family-code)";
|
|
548
|
-
'font.family.heading': "var(--ds-font-family-heading)";
|
|
549
|
-
'font.family.monospace': "var(--ds-font-family-monospace)";
|
|
550
|
-
'font.family.sans': "var(--ds-font-family-sans)";
|
|
551
541
|
};
|
|
552
542
|
export type FontFamily = keyof typeof fontFamilyMap;
|
|
553
|
-
export declare const lineHeightMap: {
|
|
554
|
-
'font.lineHeight.1': "var(--ds-font-lineHeight-1)";
|
|
555
|
-
'font.lineHeight.100': "var(--ds-font-lineHeight-100)";
|
|
556
|
-
'font.lineHeight.200': "var(--ds-font-lineHeight-200)";
|
|
557
|
-
'font.lineHeight.300': "var(--ds-font-lineHeight-300)";
|
|
558
|
-
'font.lineHeight.400': "var(--ds-font-lineHeight-400)";
|
|
559
|
-
'font.lineHeight.500': "var(--ds-font-lineHeight-500)";
|
|
560
|
-
'font.lineHeight.600': "var(--ds-font-lineHeight-600)";
|
|
561
|
-
};
|
|
562
|
-
export type LineHeight = keyof typeof lineHeightMap;
|
|
563
|
-
export declare const bodyTextMap: {
|
|
564
|
-
body: "var(--ds-font-body)";
|
|
565
|
-
'body.large': "var(--ds-font-body-large)";
|
|
566
|
-
'body.small': "var(--ds-font-body-small)";
|
|
567
|
-
};
|
|
568
|
-
export type BodyText = keyof typeof bodyTextMap;
|
|
569
|
-
export declare const uiTextMap: {
|
|
570
|
-
ui: "var(--ds-font-ui)";
|
|
571
|
-
'ui.small': "var(--ds-font-ui-small)";
|
|
572
|
-
};
|
|
573
|
-
export type UiText = keyof typeof uiTextMap;
|
|
574
543
|
/**
|
|
575
544
|
* @codegenEnd
|
|
576
545
|
*/
|
|
@@ -671,32 +640,23 @@ type SpacingToken = keyof typeof positiveSpaceMap;
|
|
|
671
640
|
type BackgroundColorToken = keyof typeof backgroundColorMap;
|
|
672
641
|
type SurfaceColorToken = keyof typeof surfaceColorMap;
|
|
673
642
|
type TextColorToken = keyof typeof textColorMap;
|
|
674
|
-
type FontSizeToken = keyof typeof fontSizeMap;
|
|
675
643
|
type FontWeightToken = keyof typeof fontWeightMap;
|
|
676
644
|
type FontFamilyToken = keyof typeof fontFamilyMap;
|
|
677
|
-
type
|
|
678
|
-
type BodyTextToken = keyof typeof bodyTextMap;
|
|
679
|
-
type UITextToken = keyof typeof uiTextMap;
|
|
645
|
+
type BodyFontToken = keyof typeof bodyFontMap;
|
|
680
646
|
type SpacingStyleMap = Record<SpacingProperty, Record<SpacingToken, SerializedStyles>>;
|
|
681
647
|
type BackgroundColorStyleMap = Record<BackgroundColorToken, SerializedStyles>;
|
|
682
648
|
type SurfaceColorStyleMap = Record<SurfaceColorToken, SerializedStyles>;
|
|
683
649
|
type TextColorStyleMap = Record<TextColorToken, SerializedStyles>;
|
|
684
|
-
type FontSizeStyleMap = Record<FontSizeToken, SerializedStyles>;
|
|
685
650
|
type FontWeightStyleMap = Record<FontWeightToken, SerializedStyles>;
|
|
686
651
|
type FontFamilyStyleMap = Record<FontFamilyToken, SerializedStyles>;
|
|
687
|
-
type
|
|
688
|
-
type BodyTextStyleMap = Record<BodyTextToken, SerializedStyles>;
|
|
689
|
-
type UITextStyleMap = Record<UITextToken, SerializedStyles>;
|
|
652
|
+
type FontStyleMap = Record<BodyFontToken, SerializedStyles>;
|
|
690
653
|
export declare const paddingStylesMap: SpacingStyleMap;
|
|
691
654
|
export declare const spaceStylesMap: SpacingStyleMap;
|
|
692
655
|
export declare const backgroundColorStylesMap: BackgroundColorStyleMap;
|
|
693
656
|
export declare const textColorStylesMap: TextColorStyleMap;
|
|
694
|
-
export declare const fontSizeStylesMap: FontSizeStyleMap;
|
|
695
657
|
export declare const fontWeightStylesMap: FontWeightStyleMap;
|
|
696
658
|
export declare const fontFamilyStylesMap: FontFamilyStyleMap;
|
|
697
|
-
export declare const
|
|
698
|
-
export declare const bodyTextStylesMap: BodyTextStyleMap;
|
|
699
|
-
export declare const uiTextStylesMap: UITextStyleMap;
|
|
659
|
+
export declare const fontStylesMap: FontStyleMap;
|
|
700
660
|
export declare const surfaceColorStylesMap: SurfaceColorStyleMap;
|
|
701
661
|
export declare const isSurfaceColorToken: (color: unknown) => color is "elevation.surface" | "elevation.surface.hovered" | "elevation.surface.pressed" | "elevation.surface.overlay" | "elevation.surface.overlay.hovered" | "elevation.surface.overlay.pressed" | "elevation.surface.raised" | "elevation.surface.raised.hovered" | "elevation.surface.raised.pressed" | "elevation.surface.sunken";
|
|
702
662
|
export {};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { css as cssEmotion } from '@emotion/react';
|
|
2
1
|
import type { CSSPropertiesWithMultiValues, SerializedStyles } from '@emotion/serialize';
|
|
3
2
|
import type * as CSS from 'csstype';
|
|
3
|
+
import type { StrictXCSSProp, XCSSAllProperties, XCSSAllPseudos } from '@atlaskit/css';
|
|
4
4
|
import type { MediaQuery } from '../responsive/types';
|
|
5
5
|
import { TokenisedProps } from './style-maps.partial';
|
|
6
6
|
export declare const tokensMap: {
|
|
@@ -1627,11 +1627,17 @@ export declare const tokensMap: {
|
|
|
1627
1627
|
};
|
|
1628
1628
|
declare const uniqueSymbol: unique symbol;
|
|
1629
1629
|
/**
|
|
1630
|
-
*
|
|
1631
|
-
*
|
|
1630
|
+
* Picks out runtime XCSS objects and build-time XCSS strings. This is needed
|
|
1631
|
+
* to supported both Emotion and Compiled styles until we've fully migrated
|
|
1632
|
+
* to Compiled.
|
|
1633
|
+
*
|
|
1634
|
+
* @private
|
|
1635
|
+
* @deprecated
|
|
1632
1636
|
*/
|
|
1633
|
-
|
|
1634
|
-
|
|
1637
|
+
export declare const parseXcss: (args: XCSS | (XCSS | false | undefined)[] | undefined | StrictXCSSProp<XCSSAllProperties, XCSSAllPseudos>) => {
|
|
1638
|
+
emotion?: SerializedStyles[];
|
|
1639
|
+
static?: string;
|
|
1640
|
+
};
|
|
1635
1641
|
type AllMedia = MediaQuery | '@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)' | '@media (prefers-color-scheme: dark)' | '@media (prefers-color-scheme: light)' | '@media (prefers-reduced-motion: reduce)';
|
|
1636
1642
|
type CSSMediaQueries = {
|
|
1637
1643
|
[MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
|
|
@@ -100,11 +100,11 @@ declare const Flex: import("react").MemoExoticComponent<import("react").ForwardR
|
|
|
100
100
|
/**
|
|
101
101
|
* Used to align children along the main axis.
|
|
102
102
|
*/
|
|
103
|
-
justifyContent?: "space-around" | "space-between" | "space-evenly" | "stretch" | "
|
|
103
|
+
justifyContent?: "center" | "space-around" | "space-between" | "space-evenly" | "stretch" | "end" | "start" | undefined;
|
|
104
104
|
/**
|
|
105
105
|
* Used to align children along the cross axis.
|
|
106
106
|
*/
|
|
107
|
-
alignItems?: "
|
|
107
|
+
alignItems?: "center" | "stretch" | "end" | "start" | "baseline" | undefined;
|
|
108
108
|
/**
|
|
109
109
|
* Represents the space between each child.
|
|
110
110
|
*/
|
|
@@ -136,11 +136,11 @@ declare const Grid: import("react").MemoExoticComponent<import("react").ForwardR
|
|
|
136
136
|
/**
|
|
137
137
|
* Used to align children along the inline axis.
|
|
138
138
|
*/
|
|
139
|
-
justifyContent?: "space-around" | "space-between" | "space-evenly" | "stretch" | "
|
|
139
|
+
justifyContent?: "center" | "space-around" | "space-between" | "space-evenly" | "stretch" | "end" | "start" | undefined;
|
|
140
140
|
/**
|
|
141
141
|
* Used to align the grid along the inline axis.
|
|
142
142
|
*/
|
|
143
|
-
justifyItems?: "
|
|
143
|
+
justifyItems?: "center" | "stretch" | "end" | "start" | undefined;
|
|
144
144
|
/**
|
|
145
145
|
* Used to align children along the block axis.
|
|
146
146
|
*/
|
|
@@ -148,7 +148,7 @@ declare const Grid: import("react").MemoExoticComponent<import("react").ForwardR
|
|
|
148
148
|
/**
|
|
149
149
|
* Used to align the grid along the block axis.
|
|
150
150
|
*/
|
|
151
|
-
alignContent?: "space-around" | "space-between" | "space-evenly" | "stretch" | "
|
|
151
|
+
alignContent?: "center" | "space-around" | "space-between" | "space-evenly" | "stretch" | "end" | "start" | undefined;
|
|
152
152
|
/**
|
|
153
153
|
* Represents the space between each column.
|
|
154
154
|
*/
|
|
@@ -63,5 +63,5 @@ declare const UNSAFE_PRESSABLE: React.ForwardRefExoticComponent<Pick<Omit<BoxPro
|
|
|
63
63
|
* Additional information to be included in the `context` of analytics events that come from pressable.
|
|
64
64
|
*/
|
|
65
65
|
analyticsContext?: Record<string, any> | undefined;
|
|
66
|
-
}, "padding" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "backgroundColor" | "color" | "translate" | "
|
|
66
|
+
}, "padding" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "backgroundColor" | "color" | "translate" | "hidden" | "key" | "value" | "children" | "form" | "slot" | "title" | "name" | "type" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "testId" | "xcss" | "data-testid" | "isDisabled" | "interactionName" | "componentName" | "analyticsContext"> & React.RefAttributes<HTMLButtonElement>>;
|
|
67
67
|
export default UNSAFE_PRESSABLE;
|
|
@@ -58,7 +58,7 @@ declare const Stack: import("react").MemoExoticComponent<import("react").Forward
|
|
|
58
58
|
/**
|
|
59
59
|
* Used to align children along the block axis (typically vertical).
|
|
60
60
|
*/
|
|
61
|
-
alignBlock?: "
|
|
61
|
+
alignBlock?: "center" | "stretch" | "end" | "start" | undefined;
|
|
62
62
|
/**
|
|
63
63
|
* Used to align children along the inline axis (typically horizontal).
|
|
64
64
|
*/
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { FC, ReactNode } from 'react';
|
|
3
|
-
import {
|
|
3
|
+
import { BodyFont, FontWeight, TextColor } from '../xcss/style-maps.partial';
|
|
4
4
|
import type { BasePrimitiveProps } from './types';
|
|
5
5
|
declare const asAllowlist: readonly [
|
|
6
6
|
"span",
|
|
@@ -9,27 +9,6 @@ declare const asAllowlist: readonly [
|
|
|
9
9
|
"em"
|
|
10
10
|
];
|
|
11
11
|
type AsElement = (typeof asAllowlist)[number];
|
|
12
|
-
type TextPropsBody = {
|
|
13
|
-
/**
|
|
14
|
-
* Text variant.
|
|
15
|
-
*/
|
|
16
|
-
variant?: BodyText;
|
|
17
|
-
/**
|
|
18
|
-
* The number of lines to limit the provided text to. Text will be truncated with an ellipsis.
|
|
19
|
-
*
|
|
20
|
-
* When `maxLines={1}`, `wordBreak` defaults to `break-all` to match the behaviour of `text-overflow: ellipsis`.
|
|
21
|
-
*
|
|
22
|
-
* Only available for `body` text variants.
|
|
23
|
-
*/
|
|
24
|
-
maxLines?: number;
|
|
25
|
-
};
|
|
26
|
-
type TextPropsUi = {
|
|
27
|
-
/**
|
|
28
|
-
* Text variant.
|
|
29
|
-
*/
|
|
30
|
-
variant: UiText;
|
|
31
|
-
maxLines?: never;
|
|
32
|
-
};
|
|
33
12
|
type TextPropsBase = {
|
|
34
13
|
/**
|
|
35
14
|
* HTML tag to be rendered. Defaults to `span`.
|
|
@@ -49,16 +28,26 @@ type TextPropsBase = {
|
|
|
49
28
|
* The [HTML `id` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id).
|
|
50
29
|
*/
|
|
51
30
|
id?: string;
|
|
31
|
+
/**
|
|
32
|
+
* The number of lines to limit the provided text to. Text will be truncated with an ellipsis.
|
|
33
|
+
*
|
|
34
|
+
* When `maxLines={1}`, `wordBreak` defaults to `break-all` to match the behaviour of `text-overflow: ellipsis`.
|
|
35
|
+
*/
|
|
36
|
+
maxLines?: number;
|
|
52
37
|
/**
|
|
53
38
|
* The [HTML `text-align` attribute](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align).
|
|
54
39
|
*/
|
|
55
40
|
textAlign?: TextAlign;
|
|
41
|
+
/**
|
|
42
|
+
* Text variant.
|
|
43
|
+
*/
|
|
44
|
+
variant?: BodyFont;
|
|
56
45
|
/**
|
|
57
46
|
* The [HTML `font-weight` attribute](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight).
|
|
58
47
|
*/
|
|
59
48
|
weight?: FontWeight;
|
|
60
49
|
};
|
|
61
|
-
export type TextProps = TextPropsBase & Omit<BasePrimitiveProps, 'xcss'
|
|
50
|
+
export type TextProps = TextPropsBase & Omit<BasePrimitiveProps, 'xcss'>;
|
|
62
51
|
type TextAlign = keyof typeof textAlignMap;
|
|
63
52
|
declare const textAlignMap: {
|
|
64
53
|
center: import("@emotion/react").SerializedStyles;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { CSSProperties } from 'react';
|
|
2
|
+
import type { StrictXCSSProp, XCSSAllProperties, XCSSAllPseudos } from '@atlaskit/css';
|
|
2
3
|
import type { XCSS } from '../xcss/xcss';
|
|
3
4
|
export type BasePrimitiveProps = {
|
|
4
5
|
/**
|
|
@@ -11,9 +12,9 @@ export type BasePrimitiveProps = {
|
|
|
11
12
|
*/
|
|
12
13
|
'data-testid'?: never;
|
|
13
14
|
/**
|
|
14
|
-
* Apply a subset of permitted styles
|
|
15
|
+
* Apply a subset of permitted styles powered by Atlassian Design System design tokens.
|
|
15
16
|
*/
|
|
16
|
-
xcss?: XCSS | Array<XCSS | false | undefined>;
|
|
17
|
+
xcss?: XCSS | Array<XCSS | false | undefined> | StrictXCSSProp<XCSSAllProperties, XCSSAllPseudos>;
|
|
17
18
|
/**
|
|
18
19
|
* Accessible role.
|
|
19
20
|
*/
|
|
@@ -515,24 +515,19 @@ export type BorderRadius = keyof typeof borderRadiusMap;
|
|
|
515
515
|
*/
|
|
516
516
|
/**
|
|
517
517
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
518
|
-
* @codegen <<SignedSource::
|
|
518
|
+
* @codegen <<SignedSource::76c411b57ce0b5e8faa09cb692065229>>
|
|
519
519
|
* @codegenId typography
|
|
520
520
|
* @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
|
|
521
521
|
* @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight", "body", "ui"]
|
|
522
522
|
* @codegenDependency ../../scripts/codegen-file-templates/dimensions.tsx <<SignedSource::0cd422575c3f2a3784eeef767abe71f4>>
|
|
523
523
|
* @codegenDependency ../../scripts/codegen-file-templates/layer.tsx <<SignedSource::79d24a1e558f12d671c06a7609f90dc1>>
|
|
524
524
|
*/
|
|
525
|
-
export declare const
|
|
526
|
-
|
|
527
|
-
'
|
|
528
|
-
'
|
|
529
|
-
'font.size.200': "var(--ds-font-size-200)";
|
|
530
|
-
'font.size.300': "var(--ds-font-size-300)";
|
|
531
|
-
'font.size.400': "var(--ds-font-size-400)";
|
|
532
|
-
'font.size.500': "var(--ds-font-size-500)";
|
|
533
|
-
'font.size.600': "var(--ds-font-size-600)";
|
|
525
|
+
export declare const bodyFontMap: {
|
|
526
|
+
body: "var(--ds-font-body)";
|
|
527
|
+
'body.large': "var(--ds-font-body-large)";
|
|
528
|
+
'body.small': "var(--ds-font-body-small)";
|
|
534
529
|
};
|
|
535
|
-
export type
|
|
530
|
+
export type BodyFont = keyof typeof bodyFontMap;
|
|
536
531
|
export declare const fontWeightMap: {
|
|
537
532
|
bold: "var(--ds-font-weight-bold)";
|
|
538
533
|
medium: "var(--ds-font-weight-medium)";
|
|
@@ -541,36 +536,10 @@ export declare const fontWeightMap: {
|
|
|
541
536
|
};
|
|
542
537
|
export type FontWeight = keyof typeof fontWeightMap;
|
|
543
538
|
export declare const fontFamilyMap: {
|
|
544
|
-
'font.family.body': "var(--ds-font-family-body)";
|
|
545
539
|
'font.family.brand.body': "var(--ds-font-family-brand-body)";
|
|
546
540
|
'font.family.brand.heading': "var(--ds-font-family-brand-heading)";
|
|
547
|
-
'font.family.code': "var(--ds-font-family-code)";
|
|
548
|
-
'font.family.heading': "var(--ds-font-family-heading)";
|
|
549
|
-
'font.family.monospace': "var(--ds-font-family-monospace)";
|
|
550
|
-
'font.family.sans': "var(--ds-font-family-sans)";
|
|
551
541
|
};
|
|
552
542
|
export type FontFamily = keyof typeof fontFamilyMap;
|
|
553
|
-
export declare const lineHeightMap: {
|
|
554
|
-
'font.lineHeight.1': "var(--ds-font-lineHeight-1)";
|
|
555
|
-
'font.lineHeight.100': "var(--ds-font-lineHeight-100)";
|
|
556
|
-
'font.lineHeight.200': "var(--ds-font-lineHeight-200)";
|
|
557
|
-
'font.lineHeight.300': "var(--ds-font-lineHeight-300)";
|
|
558
|
-
'font.lineHeight.400': "var(--ds-font-lineHeight-400)";
|
|
559
|
-
'font.lineHeight.500': "var(--ds-font-lineHeight-500)";
|
|
560
|
-
'font.lineHeight.600': "var(--ds-font-lineHeight-600)";
|
|
561
|
-
};
|
|
562
|
-
export type LineHeight = keyof typeof lineHeightMap;
|
|
563
|
-
export declare const bodyTextMap: {
|
|
564
|
-
body: "var(--ds-font-body)";
|
|
565
|
-
'body.large': "var(--ds-font-body-large)";
|
|
566
|
-
'body.small': "var(--ds-font-body-small)";
|
|
567
|
-
};
|
|
568
|
-
export type BodyText = keyof typeof bodyTextMap;
|
|
569
|
-
export declare const uiTextMap: {
|
|
570
|
-
ui: "var(--ds-font-ui)";
|
|
571
|
-
'ui.small': "var(--ds-font-ui-small)";
|
|
572
|
-
};
|
|
573
|
-
export type UiText = keyof typeof uiTextMap;
|
|
574
543
|
/**
|
|
575
544
|
* @codegenEnd
|
|
576
545
|
*/
|
|
@@ -682,32 +651,23 @@ type SpacingToken = keyof typeof positiveSpaceMap;
|
|
|
682
651
|
type BackgroundColorToken = keyof typeof backgroundColorMap;
|
|
683
652
|
type SurfaceColorToken = keyof typeof surfaceColorMap;
|
|
684
653
|
type TextColorToken = keyof typeof textColorMap;
|
|
685
|
-
type FontSizeToken = keyof typeof fontSizeMap;
|
|
686
654
|
type FontWeightToken = keyof typeof fontWeightMap;
|
|
687
655
|
type FontFamilyToken = keyof typeof fontFamilyMap;
|
|
688
|
-
type
|
|
689
|
-
type BodyTextToken = keyof typeof bodyTextMap;
|
|
690
|
-
type UITextToken = keyof typeof uiTextMap;
|
|
656
|
+
type BodyFontToken = keyof typeof bodyFontMap;
|
|
691
657
|
type SpacingStyleMap = Record<SpacingProperty, Record<SpacingToken, SerializedStyles>>;
|
|
692
658
|
type BackgroundColorStyleMap = Record<BackgroundColorToken, SerializedStyles>;
|
|
693
659
|
type SurfaceColorStyleMap = Record<SurfaceColorToken, SerializedStyles>;
|
|
694
660
|
type TextColorStyleMap = Record<TextColorToken, SerializedStyles>;
|
|
695
|
-
type FontSizeStyleMap = Record<FontSizeToken, SerializedStyles>;
|
|
696
661
|
type FontWeightStyleMap = Record<FontWeightToken, SerializedStyles>;
|
|
697
662
|
type FontFamilyStyleMap = Record<FontFamilyToken, SerializedStyles>;
|
|
698
|
-
type
|
|
699
|
-
type BodyTextStyleMap = Record<BodyTextToken, SerializedStyles>;
|
|
700
|
-
type UITextStyleMap = Record<UITextToken, SerializedStyles>;
|
|
663
|
+
type FontStyleMap = Record<BodyFontToken, SerializedStyles>;
|
|
701
664
|
export declare const paddingStylesMap: SpacingStyleMap;
|
|
702
665
|
export declare const spaceStylesMap: SpacingStyleMap;
|
|
703
666
|
export declare const backgroundColorStylesMap: BackgroundColorStyleMap;
|
|
704
667
|
export declare const textColorStylesMap: TextColorStyleMap;
|
|
705
|
-
export declare const fontSizeStylesMap: FontSizeStyleMap;
|
|
706
668
|
export declare const fontWeightStylesMap: FontWeightStyleMap;
|
|
707
669
|
export declare const fontFamilyStylesMap: FontFamilyStyleMap;
|
|
708
|
-
export declare const
|
|
709
|
-
export declare const bodyTextStylesMap: BodyTextStyleMap;
|
|
710
|
-
export declare const uiTextStylesMap: UITextStyleMap;
|
|
670
|
+
export declare const fontStylesMap: FontStyleMap;
|
|
711
671
|
export declare const surfaceColorStylesMap: SurfaceColorStyleMap;
|
|
712
672
|
export declare const isSurfaceColorToken: (color: unknown) => color is "elevation.surface" | "elevation.surface.hovered" | "elevation.surface.pressed" | "elevation.surface.overlay" | "elevation.surface.overlay.hovered" | "elevation.surface.overlay.pressed" | "elevation.surface.raised" | "elevation.surface.raised.hovered" | "elevation.surface.raised.pressed" | "elevation.surface.sunken";
|
|
713
673
|
export {};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { css as cssEmotion } from '@emotion/react';
|
|
2
1
|
import type { CSSPropertiesWithMultiValues, SerializedStyles } from '@emotion/serialize';
|
|
3
2
|
import type * as CSS from 'csstype';
|
|
3
|
+
import type { StrictXCSSProp, XCSSAllProperties, XCSSAllPseudos } from '@atlaskit/css';
|
|
4
4
|
import type { MediaQuery } from '../responsive/types';
|
|
5
5
|
import { TokenisedProps } from './style-maps.partial';
|
|
6
6
|
export declare const tokensMap: {
|
|
@@ -1627,11 +1627,17 @@ export declare const tokensMap: {
|
|
|
1627
1627
|
};
|
|
1628
1628
|
declare const uniqueSymbol: unique symbol;
|
|
1629
1629
|
/**
|
|
1630
|
-
*
|
|
1631
|
-
*
|
|
1630
|
+
* Picks out runtime XCSS objects and build-time XCSS strings. This is needed
|
|
1631
|
+
* to supported both Emotion and Compiled styles until we've fully migrated
|
|
1632
|
+
* to Compiled.
|
|
1633
|
+
*
|
|
1634
|
+
* @private
|
|
1635
|
+
* @deprecated
|
|
1632
1636
|
*/
|
|
1633
|
-
|
|
1634
|
-
|
|
1637
|
+
export declare const parseXcss: (args: XCSS | (XCSS | false | undefined)[] | undefined | StrictXCSSProp<XCSSAllProperties, XCSSAllPseudos>) => {
|
|
1638
|
+
emotion?: SerializedStyles[];
|
|
1639
|
+
static?: string;
|
|
1640
|
+
};
|
|
1635
1641
|
type AllMedia = MediaQuery | '@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)' | '@media (prefers-color-scheme: dark)' | '@media (prefers-color-scheme: light)' | '@media (prefers-reduced-motion: reduce)';
|
|
1636
1642
|
type CSSMediaQueries = {
|
|
1637
1643
|
[MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/primitives",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"description": "Primitives are token-backed low-level building blocks.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -124,9 +124,10 @@
|
|
|
124
124
|
"dependencies": {
|
|
125
125
|
"@atlaskit/analytics-next": "^9.2.0",
|
|
126
126
|
"@atlaskit/app-provider": "^1.0.0",
|
|
127
|
+
"@atlaskit/css": "^0.0.3",
|
|
127
128
|
"@atlaskit/ds-lib": "^2.2.0",
|
|
128
129
|
"@atlaskit/interaction-context": "^2.1.0",
|
|
129
|
-
"@atlaskit/tokens": "^1.
|
|
130
|
+
"@atlaskit/tokens": "^1.39.0",
|
|
130
131
|
"@babel/runtime": "^7.0.0",
|
|
131
132
|
"@emotion/react": "^11.7.1",
|
|
132
133
|
"@emotion/serialize": "^1.1.0",
|
|
@@ -117,7 +117,7 @@ const sourceFns = [
|
|
|
117
117
|
// font*, lineheight
|
|
118
118
|
() =>
|
|
119
119
|
createPartialSignedArtifact(
|
|
120
|
-
|
|
120
|
+
createTypographyStylesFromTemplate,
|
|
121
121
|
'yarn workspace @atlaskit/primitives codegen-styles',
|
|
122
122
|
{
|
|
123
123
|
id: 'typography',
|