@react-md/core 1.0.0-next.1 → 1.0.0-next.2

package/.turbo/turbo-build.log

@@ -6,7 +6,7 @@
 > @react-md/core@1.0.0-next.1 build-esm /home/mlaursen/code/react-md/packages/core
 > swc src -d ./dist
 
-Successfully compiled: 363 files with swc (295.72ms)
+Successfully compiled: 363 files with swc (363.6ms)
 
 > @react-md/core@1.0.0-next.1 build-scss /home/mlaursen/code/react-md/packages/core
 > node scripts/copySassFiles.js

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @react-md/core
 
+## 1.0.0-next.2
+
+### Major Changes
+
+- Updated custom properties to require a defined value instead of always providing a fallback. This decreases the bundle size by a good amount.
+
+  Also updated the `Snackbar` so that it no longer has a `role="status"` to fix accessibility. Instead, each toast will have `role="status"` or `role="alert"`.
+
 ## 1.0.0-next.1
 
 ### Major Changes

package/coverage/clover.xml

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<coverage generated="1699995634484" clover="3.2.0">
-  <project timestamp="1699995634484" name="All files">
+<coverage generated="1700343545055" clover="3.2.0">
+  <project timestamp="1700343545055" name="All files">
     <metrics statements="0" coveredstatements="0" conditionals="0" coveredconditionals="0" methods="0" coveredmethods="0" elements="0" coveredelements="0" complexity="0" loc="0" ncloc="0" packages="0" files="0" classes="0"/>
   </project>
 </coverage>

package/coverage/lcov-report/DefaultToastRenderer.tsx.html

@@ -23,30 +23,30 @@
         <div class='clearfix'>
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">99.22% </span>
+                <span class="strong">100% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>128/129</span>
+                <span class='fraction'>147/147</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">83.33% </span>
+                <span class="strong">100% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>10/12</span>
+                <span class='fraction'>18/18</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">100% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>7/7</span>
+                <span class='fraction'>12/12</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">99.22% </span>
+                <span class="strong">100% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>128/129</span>
+                <span class='fraction'>147/147</span>
             </div>
         
             
@@ -192,7 +192,27 @@
 <a name='L127'></a><a href='#L127'>127</a>
 <a name='L128'></a><a href='#L128'>128</a>
 <a name='L129'></a><a href='#L129'>129</a>
-<a name='L130'></a><a href='#L130'>130</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
+<a name='L130'></a><a href='#L130'>130</a>
+<a name='L131'></a><a href='#L131'>131</a>
+<a name='L132'></a><a href='#L132'>132</a>
+<a name='L133'></a><a href='#L133'>133</a>
+<a name='L134'></a><a href='#L134'>134</a>
+<a name='L135'></a><a href='#L135'>135</a>
+<a name='L136'></a><a href='#L136'>136</a>
+<a name='L137'></a><a href='#L137'>137</a>
+<a name='L138'></a><a href='#L138'>138</a>
+<a name='L139'></a><a href='#L139'>139</a>
+<a name='L140'></a><a href='#L140'>140</a>
+<a name='L141'></a><a href='#L141'>141</a>
+<a name='L142'></a><a href='#L142'>142</a>
+<a name='L143'></a><a href='#L143'>143</a>
+<a name='L144'></a><a href='#L144'>144</a>
+<a name='L145'></a><a href='#L145'>145</a>
+<a name='L146'></a><a href='#L146'>146</a>
+<a name='L147'></a><a href='#L147'>147</a>
+<a name='L148'></a><a href='#L148'>148</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
@@ -202,10 +222,10 @@
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">130x</span>
+<span class="cline-any cline-yes">130x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
-<span class="cline-any cline-yes">22x</span>
-<span class="cline-any cline-yes">22x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
@@ -237,100 +257,116 @@
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">9x</span>
-<span class="cline-any cline-yes">9x</span>
-<span class="cline-any cline-yes">9x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">28x</span>
+<span class="cline-any cline-yes">28x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">34x</span>
+<span class="cline-any cline-yes">34x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">4x</span>
+<span class="cline-any cline-yes">4x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">40x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
 <span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">1x</span>
 <span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">5x</span>
-<span class="cline-any cline-yes">5x</span>
-<span class="cline-any cline-yes">5x</span>
-<span class="cline-any cline-yes">5x</span>
-<span class="cline-any cline-yes">18x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">34x</span>
+<span class="cline-any cline-yes">34x</span>
+<span class="cline-any cline-yes">34x</span>
+<span class="cline-any cline-yes">34x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">27x</span>
+<span class="cline-any cline-yes">27x</span>
+<span class="cline-any cline-yes">27x</span>
+<span class="cline-any cline-yes">27x</span>
+<span class="cline-any cline-yes">112x</span>
 <span class="cline-any cline-yes">3x</span>
 <span class="cline-any cline-yes">3x</span>
 <span class="cline-any cline-yes">3x</span>
 <span class="cline-any cline-yes">3x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">1x</span>
-<span class="cline-any cline-yes">1x</span>
-<span class="cline-any cline-yes">1x</span>
-<span class="cline-any cline-yes">1x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-yes">18x</span>
-<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import type { ReactElement } from "react";
-import { useCallback, useEffect } from "react";
-import { usePageInactive } from "../usePageInactive";
-import type { ConfigurableToastProps } from "./Toast";
-import { Toast } from "./Toast";
-import type { ToastMeta } from "./ToastManagerProvider";
-import { useToastManager } from "./ToastManagerProvider";
-&nbsp;
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { RemoveToastProvider } from "./useRemoveToast";
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-yes">112x</span>
+<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">"use client";
+import { useEffect, useMemo, type ReactElement } from "react";
+import { usePageInactive } from "../usePageInactive.js";
+import { Toast, type ConfigurableToastProps } from "./Toast.js";
+import { type ToastMeta } from "./ToastManager.js";
+import { useToastManager } from "./ToastManagerProvider.js";
+import {
+  CurrentToastActionsProvider,
+  type CurrentToastActions,
+} from "./useCurrentToastActions.js";
 &nbsp;
 const noop = (): void =&gt; {
   // do nothing
@@ -349,6 +385,8 @@ export interface ToastRendererProps extends ConfigurableToastProps, ToastMeta {
 }
 &nbsp;
 /**
+ * **Client Component**
+ *
  * This is the default implementation for rendering toasts that will:
  *
  * - controls the visibility of the toast with the {@link useToast} hook
@@ -382,7 +420,7 @@ export function DefaultToastRenderer(props: ToastRendererProps): ReactElement {
   } = props;
   const {
     closeButtonProps,
-    closeButton = !!closeButtonProps,
+    closeButton = !!closeButtonProps || !!remaining.closeButtonProps,
     onEntered: defaultEntered = noop,
     onExited: defaultExited = noop,
     onMouseEnter: defaultMouseEnter = noop,
@@ -390,33 +428,49 @@ export function DefaultToastRenderer(props: ToastRendererProps): ReactElement {
     ...defaults
   } = toastDefaults;
 &nbsp;
-  const toastManager = useToastManager(toastId);
+  const toastManager = useToastManager();
+  const currentToastActions = useMemo&lt;CurrentToastActions&gt;(
+    () =&gt; ({
+      clearTimer() {
+        toastManager.clearTimer(toastId);
+      },
+      removeToast(transition) {
+        toastManager.removeToast(toastId, transition);
+      },
+      startRemoveTimeout() {
+        toastManager.startRemoveTimeout(toastId);
+      },
+      pauseRemoveTimeout() {
+        toastManager.pauseRemoveTimeout(toastId);
+      },
+      resumeRemoveTimeout() {
+        toastManager.resumeRemoveTimeout(toastId);
+      },
+    }),
+    [toastId, toastManager]
+  );
   useEffect(() =&gt; {
     return () =&gt; {
-      toastManager.clearTimer();
+      currentToastActions.clearTimer();
     };
-  }, [toastManager]);
+  }, [currentToastActions]);
   usePageInactive({
     disabled: !visible,
     onChange(active) {
       if (active) {
-        toastManager.resumeRemoveTimeout();
+        currentToastActions.resumeRemoveTimeout();
       } else {
-        toastManager.pauseRemoveTimeout();
+        currentToastActions.pauseRemoveTimeout();
       }
     },
   });
 &nbsp;
   return (
-    &lt;RemoveToastProvider
-      value={useCallback(() =&gt; {
-<span class="cstat-no" title="statement not covered" >        toastManager.removeToast(true);</span>
-      }, [toastManager])}
-    &gt;
+    &lt;CurrentToastActionsProvider value={currentToastActions}&gt;
       &lt;Toast
         closeButton={
           closeButton ||
-          (!<span class="branch-0 cbranch-no" title="branch not covered" >visibleTime &amp;&amp; !remaining.<span class="branch-0 cbranch-no" title="branch not covered" >action &amp;&amp; !</span>remaining.actionButton)</span>
+          (!visibleTime &amp;&amp; !remaining.action &amp;&amp; !remaining.actionButton)
         }
         closeButtonProps={closeButtonProps}
         {...defaults}
@@ -426,28 +480,28 @@ export function DefaultToastRenderer(props: ToastRendererProps): ReactElement {
         onEntered={(appearing) =&gt; {
           defaultEntered(appearing);
           onEntered(appearing);
-          toastManager.startRemoveTimeout();
+          currentToastActions.startRemoveTimeout();
         }}
         onExited={() =&gt; {
           defaultExited();
           onExited();
-          toastManager.removeToast(false);
+          currentToastActions.removeToast(false);
         }}
         onMouseEnter={(event) =&gt; {
           defaultMouseEnter(event);
           onMouseEnter(event);
-          toastManager.pauseRemoveTimeout();
+          currentToastActions.pauseRemoveTimeout();
         }}
         onMouseLeave={(event) =&gt; {
           defaultMouseLeave(event);
           onMouseLeave(event);
-          toastManager.resumeRemoveTimeout();
+          currentToastActions.resumeRemoveTimeout();
         }}
       &gt;
         {defaults.children}
         {remaining.children}
       &lt;/Toast&gt;
-    &lt;/RemoveToastProvider&gt;
+    &lt;/CurrentToastActionsProvider&gt;
   );
 }
 &nbsp;</pre></td></tr></table></pre>
@@ -457,7 +511,7 @@ export function DefaultToastRenderer(props: ToastRendererProps): ReactElement {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-06-12T14:30:38.913Z
+                at 2023-11-17T21:52:53.225Z
             </div>
         <script src="prettify.js"></script>
         <script>