@ncds/ui-admin 1.8.21-alpha.2 → 1.8.21-alpha.4

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.
Files changed (4) hide show
  1. package/dist/cjs/src/components/layout/ncua-scope/NcuaScope.js +8 -2
  2. package/dist/esm/src/components/layout/ncua-scope/NcuaScope.js +8 -2
  3. package/dist/temp/src/components/layout/ncua-scope/NcuaScope.js +5 -1
  4. package/package.json +1 -1
package/dist/cjs/src/components/layout/ncua-scope/NcuaScope.js CHANGED
@@ -23,6 +23,12 @@ const STYLE_HOISTING_PROPS = {
23
23
  href: STYLE_KEY,
24
24
  precedence: 'default'
25
25
  };
26
+ // SSR 은 <style> 의 자식 텍스트를 HTML 이스케이프하지만(' -> &#x27;), 브라우저는 <style>
27
+ // 안을 raw text 로 읽어 되돌리지 않는다. 그러면 CSS 가 깨지고 하이드레이션도 불일치한다.
28
+ // innerHTML 로 넣으면 서버가 원문 그대로 내보낸다.
29
+ const STYLE_CONTENT = {
30
+ __html: _scopedCss.NCUA_SCOPED_CSS
31
+ };
26
32
  /**
27
33
  * NCUA 스타일을 이 엘리먼트 하위로 한정하는 경계.
28
34
  *
@@ -59,10 +65,10 @@ const NcuaScope = exports.NcuaScope = /*#__PURE__*/(0, _react.forwardRef)((_ref,
59
65
  value: true,
60
66
  children: [shouldRenderStyle && (SUPPORTS_STYLE_HOISTING ? (0, _jsxRuntime.jsx)("style", {
61
67
  ...STYLE_HOISTING_PROPS,
62
- children: _scopedCss.NCUA_SCOPED_CSS
68
+ dangerouslySetInnerHTML: STYLE_CONTENT
63
69
  }) : (0, _jsxRuntime.jsx)("style", {
64
70
  "data-ncua-scope": STYLE_KEY,
65
- children: _scopedCss.NCUA_SCOPED_CSS
71
+ dangerouslySetInnerHTML: STYLE_CONTENT
66
72
  })), (0, _jsxRuntime.jsx)("div", {
67
73
  ref: ref,
68
74
  className: (0, _classnames.default)('ncua-scope', className),
package/dist/esm/src/components/layout/ncua-scope/NcuaScope.js CHANGED
@@ -17,6 +17,12 @@ const STYLE_HOISTING_PROPS = {
17
17
  href: STYLE_KEY,
18
18
  precedence: 'default'
19
19
  };
20
+ // SSR 은 <style> 의 자식 텍스트를 HTML 이스케이프하지만(' -> &#x27;), 브라우저는 <style>
21
+ // 안을 raw text 로 읽어 되돌리지 않는다. 그러면 CSS 가 깨지고 하이드레이션도 불일치한다.
22
+ // innerHTML 로 넣으면 서버가 원문 그대로 내보낸다.
23
+ const STYLE_CONTENT = {
24
+ __html: NCUA_SCOPED_CSS
25
+ };
20
26
  /**
21
27
  * NCUA 스타일을 이 엘리먼트 하위로 한정하는 경계.
22
28
  *
@@ -53,10 +59,10 @@ export const NcuaScope = /*#__PURE__*/forwardRef((_ref, ref) => {
53
59
  value: true,
54
60
  children: [shouldRenderStyle && (SUPPORTS_STYLE_HOISTING ? _jsx("style", {
55
61
  ...STYLE_HOISTING_PROPS,
56
- children: NCUA_SCOPED_CSS
62
+ dangerouslySetInnerHTML: STYLE_CONTENT
57
63
  }) : _jsx("style", {
58
64
  "data-ncua-scope": STYLE_KEY,
59
- children: NCUA_SCOPED_CSS
65
+ dangerouslySetInnerHTML: STYLE_CONTENT
60
66
  })), _jsx("div", {
61
67
  ref: ref,
62
68
  className: classnames('ncua-scope', className),
package/dist/temp/src/components/layout/ncua-scope/NcuaScope.js CHANGED
@@ -13,6 +13,10 @@ const DECIMAL_RADIX = 10;
13
13
  const SUPPORTS_STYLE_HOISTING = Number.parseInt(reactVersion, DECIMAL_RADIX) >= STYLE_HOISTING_MIN_REACT_MAJOR;
14
14
  const STYLE_KEY = 'ncua-scoped';
15
15
  const STYLE_HOISTING_PROPS = { href: STYLE_KEY, precedence: 'default' };
16
+ // SSR 은 <style> 의 자식 텍스트를 HTML 이스케이프하지만(' -> &#x27;), 브라우저는 <style>
17
+ // 안을 raw text 로 읽어 되돌리지 않는다. 그러면 CSS 가 깨지고 하이드레이션도 불일치한다.
18
+ // innerHTML 로 넣으면 서버가 원문 그대로 내보낸다.
19
+ const STYLE_CONTENT = { __html: NCUA_SCOPED_CSS };
16
20
  /**
17
21
  * NCUA 스타일을 이 엘리먼트 하위로 한정하는 경계.
18
22
  *
@@ -42,6 +46,6 @@ export const NcuaScope = forwardRef(({ className, children }, ref) => {
42
46
  const styleAlreadyMounted = useContext(NcuaStyleMountedContext);
43
47
  const shouldRenderStyle = SUPPORTS_STYLE_HOISTING || !styleAlreadyMounted;
44
48
  return (_jsxs(NcuaStyleMountedContext.Provider, { value: true, children: [shouldRenderStyle &&
45
- (SUPPORTS_STYLE_HOISTING ? (_jsx("style", { ...STYLE_HOISTING_PROPS, children: NCUA_SCOPED_CSS })) : (_jsx("style", { "data-ncua-scope": STYLE_KEY, children: NCUA_SCOPED_CSS }))), _jsx("div", { ref: ref, className: classnames('ncua-scope', className), children: children })] }));
49
+ (SUPPORTS_STYLE_HOISTING ? (_jsx("style", { ...STYLE_HOISTING_PROPS, dangerouslySetInnerHTML: STYLE_CONTENT })) : (_jsx("style", { "data-ncua-scope": STYLE_KEY, dangerouslySetInnerHTML: STYLE_CONTENT }))), _jsx("div", { ref: ref, className: classnames('ncua-scope', className), children: children })] }));
46
50
  });
47
51
  NcuaScope.displayName = 'NcuaScope';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ncds/ui-admin",
3
- "version": "1.8.21-alpha.2",
3
+ "version": "1.8.21-alpha.4",
4
4
  "description": "nhn-commerce의 어드민 디자인 시스템입니다.",
5
5
  "scripts": {
6
6
  "barrel": "node barrel.js",