@unitedstatespowersquadrons/components 1.2.2 → 1.2.4-pre.1

package/FontAwesomeIcon.tsx

@@ -12,7 +12,7 @@ export interface FontAwesomeProps {
 
 const useStyles = createUseStyles({
   icon: {
-    padding: "0.25em 0.5em",
+    padding: "0.25em",
   },
 });
 

package/Readme.md

@@ -49,17 +49,8 @@ More detailed information is available for [Toasts](Toasts/Readme.md) usage.
 To create a reducer, follow the following pattern, follow the pattern described
 in [Reducer/Example](Reducer/Example).
 
-### State without Dispatch
-
-If you only need access to app state, but no dispatchable events, you can use
-the simplified generator function:
-
-```ts
-import { buildUnreducableState } from "@unitedstatespowersquadrons/components";
-import { AppState } from "./types";
-
-export const { AppProvider, useAppState } = buildUnreducableState<AppState>();
-```
+There is also an example in `appstate.tsx` for if you only need access to app
+state, but do not have any dispatchable events.
 
 ## Automated Testing
 

package/Reducer/Example/SubComponent.tsx

@@ -0,0 +1,21 @@
+import React from "react";
+import { useAppDispatch, useAppState } from "./reducer";
+
+const SubComponent = () => {
+  const { something } = useAppState();
+  const dispatch = useAppDispatch();
+
+  const handleDoSomething = () => {
+    const newSomething = "changed";
+
+    dispatch({ something: newSomething, type: "doSomething" });
+  };
+
+  return(
+    <div onClick={handleDoSomething}>
+      {something}
+    </div>
+  );
+};
+
+export default SubComponent;

package/Reducer/Example/appstate.tsx

@@ -0,0 +1,4 @@
+import { AppState } from "./types";
+import buildUnreducibleState from "../buildUnreducibleState";
+
+export const { AppProvider, useAppState } = buildUnreducibleState<AppState>();

package/Reducer/Example/index.tsx

@@ -0,0 +1,14 @@
+import React from "react";
+import { AppProvider } from "./reducer";
+import { AppState } from "./types";
+import SubComponent from "./SubComponent";
+
+const Example = (props: AppState) => {
+  return(
+    <AppProvider initialState={props}>
+      <SubComponent />
+    </AppProvider>
+  );
+};
+
+export default Example;

package/Reducer/Example/reducer.tsx

@@ -17,7 +17,7 @@ export const reducer = (draft: Draft<AppState>, action: AppAction): void => {
 
   switch (type) {
   case "doSomething":
-    draft.something = "changed";
+    draft.something = action.something;
 
     break;
   case "saveComplete": break;

package/Reducer/{buildUnreducableState.tsx → buildUnreducibleState.tsx}

@@ -5,7 +5,7 @@ interface InitialAppProps<AppState> {
   children: React.ReactNode;
 }
 
-export default function buildUnreducableState<AppState>() {
+export default function buildUnreducibleState<AppState>() {
   const StateContext = createContext<AppState | null>(null);
 
   const AppProvider = (props: InitialAppProps<AppState>) => {

package/Reducer/index.tsx

@@ -1,4 +1,4 @@
 export { default as wrapDispatch } from "./wrapDispatch";
 export { default as buildReducer } from "./buildReducer";
-export { default as buildUnreducableState } from "./buildUnreducableState";
+export { default as buildUnreducibleState } from "./buildUnreducibleState";
 export type * from "./types";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unitedstatespowersquadrons/components",
-  "version": "1.2.2",
+  "version": "1.2.4-pre.1",
   "description": "USPS shared React components library",
   "main": "index.tsx",
   "scripts": {