@cloudscape-design/components 3.0.204 → 3.0.205

package/internal/components/visual-context/index.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
-export declare const useVisualContext: (elementRef: React.RefObject<HTMLElement>) => string;
 interface VisualContextProps {
     contextName: string;
     className?: string;
     children: React.ReactNode;
 }
+export declare function useVisualContext(elementRef: React.RefObject<HTMLElement>): string;
 /**
  * This function returns only the className string needed to apply a
  * visual context to the DOM. It is used by the default export but

package/internal/components/visual-context/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/visual-context/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAIxC,eAAO,MAAM,gBAAgB,eAAgB,MAAM,SAAS,CAAC,WAAW,CAAC,WAQxE,CAAC;AAEF,UAAU,kBAAkB;IAC1B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;GAKG;AACH,wBAAgB,yBAAyB,CAAC,WAAW,EAAE,MAAM,UAE5D;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,kBAAkB,eAE7F"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/visual-context/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAGzD,UAAU,kBAAkB;IAC1B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAID,wBAAgB,gBAAgB,CAAC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,UAWxE;AAED;;;;;GAKG;AACH,wBAAgB,yBAAyB,CAAC,WAAW,EAAE,MAAM,UAE5D;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,kBAAkB,eAE7F"}

package/internal/components/visual-context/index.js

@@ -1,18 +1,20 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import clsx from 'clsx';
-import React, { useState } from 'react';
-import { useMutationObserver } from '../../hooks/use-mutation-observer';
+import React, { useLayoutEffect, useState } from 'react';
 import { findUpUntil } from '../../utils/dom';
-export var useVisualContext = function (elementRef) {
-    var contextMatch = /awsui-context-([\w-]+)/;
+var contextMatch = /awsui-context-([\w-]+)/;
+export function useVisualContext(elementRef) {
     var _a = useState(''), value = _a[0], setValue = _a[1];
-    useMutationObserver(elementRef, function (node) {
-        var contextParent = findUpUntil(node, function (node) { return !!node.className.match(contextMatch); });
-        setValue(contextParent ? contextParent.className.match(contextMatch)[1] : '');
-    });
+    useLayoutEffect(function () {
+        var _a;
+        if (elementRef.current) {
+            var contextParent = findUpUntil(elementRef.current, function (node) { return !!node.className.match(contextMatch); });
+            setValue((_a = contextParent === null || contextParent === void 0 ? void 0 : contextParent.className.match(contextMatch)[1]) !== null && _a !== void 0 ? _a : '');
+        }
+    }, [elementRef]);
     return value;
-};
+}
 /**
  * This function returns only the className string needed to apply a
  * visual context to the DOM. It is used by the default export but

package/internal/components/visual-context/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/visual-context/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C,MAAM,CAAC,IAAM,gBAAgB,GAAG,UAAC,UAAwC;IACvE,IAAM,YAAY,GAAG,wBAAwB,CAAC;IACxC,IAAA,KAAoB,QAAQ,CAAC,EAAE,CAAC,EAA/B,KAAK,QAAA,EAAE,QAAQ,QAAgB,CAAC;IACvC,mBAAmB,CAAC,UAAU,EAAE,UAAA,IAAI;QAClC,IAAM,aAAa,GAAG,WAAW,CAAC,IAAI,EAAE,UAAA,IAAI,IAAI,OAAA,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,YAAY,CAAC,EAApC,CAAoC,CAAC,CAAC;QACtF,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,KAAK,CAAC,YAAY,CAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IACjF,CAAC,CAAC,CAAC;IACH,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAQF;;;;;GAKG;AACH,MAAM,UAAU,yBAAyB,CAAC,WAAmB;IAC3D,OAAO,wBAAiB,WAAW,CAAE,CAAC;AACxC,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAwD;QAAtD,WAAW,iBAAA,EAAE,SAAS,eAAA,EAAE,QAAQ,cAAA;IACtE,OAAO,6BAAK,SAAS,EAAE,IAAI,CAAC,yBAAyB,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC,IAAG,QAAQ,CAAO,CAAC;AACnG,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useState } from 'react';\nimport { useMutationObserver } from '../../hooks/use-mutation-observer';\nimport { findUpUntil } from '../../utils/dom';\n\nexport const useVisualContext = (elementRef: React.RefObject<HTMLElement>) => {\n  const contextMatch = /awsui-context-([\\w-]+)/;\n  const [value, setValue] = useState('');\n  useMutationObserver(elementRef, node => {\n    const contextParent = findUpUntil(node, node => !!node.className.match(contextMatch));\n    setValue(contextParent ? contextParent.className.match(contextMatch)![1] : '');\n  });\n  return value;\n};\n\ninterface VisualContextProps {\n  contextName: string;\n  className?: string;\n  children: React.ReactNode;\n}\n\n/**\n * This function returns only the className string needed to apply a\n * visual context to the DOM. It is used by the default export but\n * can also be imported directly for situations where the insertion\n * of a <div> node creates style problems.\n */\nexport function getVisualContextClassname(contextName: string) {\n  return `awsui-context-${contextName}`;\n}\n\nexport default function VisualContext({ contextName, className, children }: VisualContextProps) {\n  return <div className={clsx(getVisualContextClassname(contextName), className)}>{children}</div>;\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/visual-context/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAQ9C,IAAM,YAAY,GAAG,wBAAwB,CAAC;AAE9C,MAAM,UAAU,gBAAgB,CAAC,UAAwC;IACjE,IAAA,KAAoB,QAAQ,CAAC,EAAE,CAAC,EAA/B,KAAK,QAAA,EAAE,QAAQ,QAAgB,CAAC;IAEvC,eAAe,CAAC;;QACd,IAAI,UAAU,CAAC,OAAO,EAAE;YACtB,IAAM,aAAa,GAAG,WAAW,CAAC,UAAU,CAAC,OAAO,EAAE,UAAA,IAAI,IAAI,OAAA,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,YAAY,CAAC,EAApC,CAAoC,CAAC,CAAC;YACpG,QAAQ,CAAC,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,SAAS,CAAC,KAAK,CAAC,YAAY,EAAG,CAAC,CAAC,mCAAI,EAAE,CAAC,CAAC;SAClE;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,KAAK,CAAC;AACf,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,yBAAyB,CAAC,WAAmB;IAC3D,OAAO,wBAAiB,WAAW,CAAE,CAAC;AACxC,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAwD;QAAtD,WAAW,iBAAA,EAAE,SAAS,eAAA,EAAE,QAAQ,cAAA;IACtE,OAAO,6BAAK,SAAS,EAAE,IAAI,CAAC,yBAAyB,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC,IAAG,QAAQ,CAAO,CAAC;AACnG,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useLayoutEffect, useState } from 'react';\nimport { findUpUntil } from '../../utils/dom';\n\ninterface VisualContextProps {\n  contextName: string;\n  className?: string;\n  children: React.ReactNode;\n}\n\nconst contextMatch = /awsui-context-([\\w-]+)/;\n\nexport function useVisualContext(elementRef: React.RefObject<HTMLElement>) {\n  const [value, setValue] = useState('');\n\n  useLayoutEffect(() => {\n    if (elementRef.current) {\n      const contextParent = findUpUntil(elementRef.current, node => !!node.className.match(contextMatch));\n      setValue(contextParent?.className.match(contextMatch)![1] ?? '');\n    }\n  }, [elementRef]);\n\n  return value;\n}\n\n/**\n * This function returns only the className string needed to apply a\n * visual context to the DOM. It is used by the default export but\n * can also be imported directly for situations where the insertion\n * of a <div> node creates style problems.\n */\nexport function getVisualContextClassname(contextName: string) {\n  return `awsui-context-${contextName}`;\n}\n\nexport default function VisualContext({ contextName, className, children }: VisualContextProps) {\n  return <div className={clsx(getVisualContextClassname(contextName), className)}>{children}</div>;\n}\n"]}

package/internal/environment.js

@@ -1,6 +1,6 @@
 
     export var PACKAGE_SOURCE = 'components';
-    export var PACKAGE_VERSION = '3.0.0 (869e01f)';
+    export var PACKAGE_VERSION = '3.0.0 (fc49ae8)';
     export var THEME = 'open-source-visual-refresh';
     export var ALWAYS_VISUAL_REFRESH = true;
     

package/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "869e01f1192b53a2729036472506637cc33cba03"
+  "commit": "fc49ae884ccfbb8632240c6b82cbd323ce29fddf"
 }

package/package.json

@@ -81,7 +81,7 @@
     "./internal/base-component/index.js",
     "./internal/base-component/styles.css.js"
   ],
-  "version": "3.0.204",
+  "version": "3.0.205",
   "repository": {
     "type": "git",
     "url": "https://github.com/cloudscape-design/components.git"