@charcoal-ui/react 3.2.0 → 3.3.0-beta.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/dist/components/Button/index.test.d.ts +2 -2
- package/dist/components/Button/index.test.d.ts.map +1 -1
- package/dist/components/Checkbox/performance.test.d.ts +2 -2
- package/dist/components/Checkbox/performance.test.d.ts.map +1 -1
- package/dist/components/LoadingSpinner/index.story.d.ts +1 -1
- package/dist/core/CharcoalProvider.d.ts +3 -2
- package/dist/core/CharcoalProvider.d.ts.map +1 -1
- package/dist/index.cjs.js +7 -6
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +7 -6
- package/dist/index.esm.js.map +1 -1
- package/package.json +16 -14
- package/src/components/Button/index.test.tsx +2 -2
- package/src/components/Button/index.tsx +2 -2
- package/src/components/Checkbox/performance.test.tsx +2 -2
- package/src/components/LoadingSpinner/index.tsx +2 -2
- package/src/core/CharcoalProvider.tsx +6 -2
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import 'jest-styled-components';
|
|
2
|
-
import
|
|
3
|
-
export declare function render(children: JSX.Element):
|
|
2
|
+
import renderer from 'react-test-renderer';
|
|
3
|
+
export declare function render(children: JSX.Element): renderer.ReactTestRendererJSON | renderer.ReactTestRendererJSON[] | null;
|
|
4
4
|
//# sourceMappingURL=index.test.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.test.tsx"],"names":[],"mappings":"AAAA,OAAO,wBAAwB,CAAA;AAG/B,OAAO,
|
|
1
|
+
{"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.test.tsx"],"names":[],"mappings":"AAAA,OAAO,wBAAwB,CAAA;AAG/B,OAAO,QAAQ,MAAM,qBAAqB,CAAA;AAI1C,wBAAgB,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,4EAI3C"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import 'jest-styled-components';
|
|
2
|
-
import
|
|
3
|
-
export declare function render(children: JSX.Element):
|
|
2
|
+
import renderer from 'react-test-renderer';
|
|
3
|
+
export declare function render(children: JSX.Element): renderer.ReactTestRendererJSON | renderer.ReactTestRendererJSON[] | null;
|
|
4
4
|
//# sourceMappingURL=performance.test.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"performance.test.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/performance.test.tsx"],"names":[],"mappings":"AACA,OAAO,wBAAwB,CAAA;AAG/B,OAAO,
|
|
1
|
+
{"version":3,"file":"performance.test.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/performance.test.tsx"],"names":[],"mappings":"AACA,OAAO,wBAAwB,CAAA;AAG/B,OAAO,QAAQ,MAAM,qBAAqB,CAAA;AAI1C,wBAAgB,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,4EAI3C"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
declare const _default: {
|
|
2
2
|
title: string;
|
|
3
3
|
component: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import(".").LoadingSpinnerProps & import("react").RefAttributes<HTMLDivElement>>>;
|
|
4
|
-
decorators:
|
|
4
|
+
decorators: any[];
|
|
5
5
|
};
|
|
6
6
|
export default _default;
|
|
7
7
|
export declare function Basic(): JSX.Element;
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Components } from './ComponentAbstraction';
|
|
3
3
|
import { ThemeMap } from '@charcoal-ui/styled/src/TokenInjector';
|
|
4
|
-
import { CharcoalTheme } from '@charcoal-ui/theme';
|
|
4
|
+
import { CharcoalTheme, ThemeColor } from '@charcoal-ui/theme';
|
|
5
5
|
export type CharcoalProviderProps = React.PropsWithChildren<{
|
|
6
6
|
themeMap: ThemeMap<CharcoalTheme>;
|
|
7
7
|
defaultTheme?: CharcoalTheme;
|
|
8
8
|
injectTokens?: boolean;
|
|
9
9
|
components?: Partial<Components>;
|
|
10
|
+
background?: keyof ThemeColor;
|
|
10
11
|
}>;
|
|
11
|
-
export declare function CharcoalProvider({ themeMap, defaultTheme, components, injectTokens, children, }: CharcoalProviderProps): JSX.Element;
|
|
12
|
+
export declare function CharcoalProvider({ themeMap, defaultTheme, components, injectTokens, children, background, }: CharcoalProviderProps): JSX.Element;
|
|
12
13
|
//# sourceMappingURL=CharcoalProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CharcoalProvider.d.ts","sourceRoot":"","sources":["../../src/core/CharcoalProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAA6B,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAEzE,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAA;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;
|
|
1
|
+
{"version":3,"file":"CharcoalProvider.d.ts","sourceRoot":"","sources":["../../src/core/CharcoalProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAA6B,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAEzE,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAA;AAChE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAK9D,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC1D,QAAQ,EAAE,QAAQ,CAAC,aAAa,CAAC,CAAA;IACjC,YAAY,CAAC,EAAE,aAAa,CAAA;IAC5B,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAA;IAChC,UAAU,CAAC,EAAE,MAAM,UAAU,CAAA;CAC9B,CAAC,CAAA;AAEF,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,YAAgC,EAChC,UAAe,EACf,YAAmB,EACnB,QAAQ,EACR,UAAU,GACX,EAAE,qBAAqB,eAavB"}
|
package/dist/index.cjs.js
CHANGED
|
@@ -99,10 +99,11 @@ function CharcoalProvider({
|
|
|
99
99
|
defaultTheme = themeMap[":root"],
|
|
100
100
|
components = {},
|
|
101
101
|
injectTokens = true,
|
|
102
|
-
children
|
|
102
|
+
children,
|
|
103
|
+
background
|
|
103
104
|
}) {
|
|
104
105
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ssr.SSRProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_styled_components.ThemeProvider, { theme: defaultTheme, children: [
|
|
105
|
-
injectTokens && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_styled.TokenInjector, { theme: themeMap }),
|
|
106
|
+
injectTokens && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_styled.TokenInjector, { theme: themeMap, background }),
|
|
106
107
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ComponentAbstraction, { components, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_overlays.OverlayProvider, { children }) })
|
|
107
108
|
] }) });
|
|
108
109
|
}
|
|
@@ -258,7 +259,7 @@ var StyledButton = (0, import_styled_components4.default)(Clickable_default)`
|
|
|
258
259
|
|
|
259
260
|
${(p) => theme((o) => [
|
|
260
261
|
o.font[variantToFont(p.$variant)].hover.press,
|
|
261
|
-
o.bg[
|
|
262
|
+
o.bg[variantToBackground(p.$variant)].hover.press,
|
|
262
263
|
o.typography(14).bold.preserveHalfLeading,
|
|
263
264
|
o.padding.horizontal(p.$size === "M" ? 24 : 16),
|
|
264
265
|
o.disabled,
|
|
@@ -269,7 +270,7 @@ var StyledButton = (0, import_styled_components4.default)(Clickable_default)`
|
|
|
269
270
|
/* よく考えたらheight=32って定義が存在しないな... */
|
|
270
271
|
height: ${(p) => p.$size === "M" ? 40 : 32}px;
|
|
271
272
|
`;
|
|
272
|
-
function
|
|
273
|
+
function variantToBackground(variant) {
|
|
273
274
|
switch (variant) {
|
|
274
275
|
case "Overlay":
|
|
275
276
|
return "surface4";
|
|
@@ -1588,7 +1589,7 @@ var LoadingSpinnerRoot = import_styled_components14.default.div.attrs({ role: "p
|
|
|
1588
1589
|
transparent ? o.bg.transparent : o.bg.background1
|
|
1589
1590
|
])}
|
|
1590
1591
|
`;
|
|
1591
|
-
var
|
|
1592
|
+
var scaleOut = import_styled_components14.keyframes`
|
|
1592
1593
|
from {
|
|
1593
1594
|
transform: scale(0);
|
|
1594
1595
|
opacity: 1;
|
|
@@ -1604,7 +1605,7 @@ var Icon2 = import_styled_components14.default.div.attrs({ role: "presentation"
|
|
|
1604
1605
|
height: 1em;
|
|
1605
1606
|
border-radius: 1em;
|
|
1606
1607
|
background-color: currentColor;
|
|
1607
|
-
animation: ${
|
|
1608
|
+
animation: ${scaleOut} 1s both ease-out;
|
|
1608
1609
|
animation-iteration-count: ${(p) => p.once ? 1 : "infinite"};
|
|
1609
1610
|
|
|
1610
1611
|
&[data-reset-animation] {
|