@planningcenter/doxy-web - npm Package Compare versions

Comparing version 1.15.0 to 1.16.0-rc.0

dist/components/Button/Button.d.ts

 import React from "react";
 export interface ButtonProps {
     disabled?: boolean;
+    isLoading?: boolean;
     onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
@@ -11,2 +12,2 @@ size?: "lg" | "md" | "sm";
 }
-export declare const Button: ({ disabled, onClick, size, text, theme, type, variant, }: ButtonProps) => JSX.Element;
+export declare const Button: ({ disabled, isLoading, onClick, size, text, theme, type, variant, }: ButtonProps) => JSX.Element;

dist/components/Grid/Grid.d.ts

@@ -6,5 +6,5 @@ import React from "react";
     children: React.ReactNode;
-    columns?: Columns;
+    columns: Columns;
     gap?: Gap;
 }
-export declare const Grid: ({ as, children, columns, gap, }: GridProps) => JSX.Element;
+export declare const Grid: ({ as, children, columns, gap }: GridProps) => JSX.Element;

dist/index.es.js

@@ -31,2 +31,3 @@ import React, { forwardRef } from 'react';
     disabled = false,
+    isLoading = false,
     onClick = undefined,
@@ -41,6 +42,8 @@ size = "lg",
     type: type,
-    className: classnames("btn", `${size}-btn`, `${variant}-btn`, `${theme}-btn`),
+    className: classnames("btn", `${size}-btn`, `${variant}-btn`, `${theme}-btn`, `${isLoading ? "loading-btn" : null}`),
     disabled: disabled,
     onClick: onClick
-  }, text);
+  }, isLoading && /*#__PURE__*/React.createElement("span", {
+    className: "spinner"
+  }), text);
 };
@@ -216,3 +219,3 @@
     children,
-    columns = 1,
+    columns,
     gap = 1
@@ -223,3 +226,3 @@ } = _ref;
     "data-testid": "grid",
-    className: classnames("grid", columns && getColumnClasses(columns), gap && getGapClasses(gap))
+    className: classnames("grid", getColumnClasses(columns), gap && getGapClasses(gap))
   }, children);
@@ -226,0 +229,0 @@ };

dist/index.js

@@ -40,2 +40,3 @@ 'use strict';
     disabled = false,
+    isLoading = false,
     onClick = undefined,
@@ -50,6 +51,8 @@ size = "lg",
     type: type,
-    className: classnames__default["default"]("btn", `${size}-btn`, `${variant}-btn`, `${theme}-btn`),
+    className: classnames__default["default"]("btn", `${size}-btn`, `${variant}-btn`, `${theme}-btn`, `${isLoading ? "loading-btn" : null}`),
     disabled: disabled,
     onClick: onClick
-  }, text);
+  }, isLoading && /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "spinner"
+  }), text);
 };
@@ -225,3 +228,3 @@
     children,
-    columns = 1,
+    columns,
     gap = 1
@@ -232,3 +235,3 @@ } = _ref;
     "data-testid": "grid",
-    className: classnames__default["default"]("grid", columns && getColumnClasses(columns), gap && getGapClasses(gap))
+    className: classnames__default["default"]("grid", getColumnClasses(columns), gap && getGapClasses(gap))
   }, children);
@@ -235,0 +238,0 @@ };

package.json

 {
   "name": "@planningcenter/doxy-web",
-  "version": "1.15.0",
+  "version": "1.16.0-rc.0",
   "description": "Doxy for Church Center Web",
@@ -22,2 +22,4 @@ "main": "dist/index.js",
   "scripts": {
+    "sandbox:start": "cd sandbox && yarn start",
+    "sandbox": "npm-run-all --parallel --print-label develop:yalc sandbox:start",
     "start": "start-storybook -p 3000 --no-open",
@@ -56,3 +58,2 @@ "storybook:build": "build-storybook",
     "@storybook/client-api": "^6.5.16",
-    "@storybook/manager-webpack4": "^6.5.16",
     "@storybook/manager-webpack5": "^6.5.16",
@@ -84,2 +85,3 @@ "@storybook/react": "^6.5.16",
     "jest-environment-jsdom": "^29.2.2",
+    "npm-run-all": "^4.1.5",
     "postcss": "^8.4.21",
@@ -96,3 +98,3 @@ "postcss-loader": "^7.0.2",
     "sass-loader": "^13.2.0",
-    "storybook-dark-mode": "^2.0.5",
+    "storybook-dark-mode": "^2.0.6",
     "style-loader": "^3.3.1",
@@ -112,3 +114,5 @@ "tailwindcss": "^3.2.4",
   },
-  "browserslist": ["defaults"]
+  "browserslist": [
+    "defaults"
+  ]
 }

README.md

@@ -35,2 +35,15 @@ # doxy-web
 
+#### "Sandbox" Development Environment:
+Provides another local testing/development environment where multiple UI elements/components can be viewed simultaneously. This is especially useful for making new CSS changes because you can see multiple instances of the UI states vs. in Storybook, where you can only toggle 1 state at a time...
+
+1. Run `yarn sandbox` (parallel command for `yarn develop:yalc` & `cd sandbox && yarn start`)
+2. Follow `localhost` link in terminal to view local Parcel app
+
+**To add new views:**
+
+1. Add a contextually-named component to `sandbox/src/pages` directory and export from [`pages/index.js`](https://github.com/planningcenter/doxy-web/blob/main/sandbox/src/pages/index.js)
+2. Import page/component to [`src/App.jsx`](https://github.com/planningcenter/doxy-web/blob/main/sandbox/src/App.jsx) and add to [`<Router />`](https://github.com/planningcenter/doxy-web/blob/main/sandbox/src/App.jsx#L35) with path
+3. Add corresponding `<Link />` to [`src/components/Sidebar.jsx`](https://github.com/planningcenter/doxy-web/blob/main/sandbox/src/components/Sidebar.jsx#L60)
+
+
 ## Contributing
@@ -37,0 +50,0 @@ - New versions to `@planningcenter/doxy-web` are made using a "batched" process by deploying changes to NPM from `main`.

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

571838

increased by1.15%

Lines of code

11493

increased by1%

Number of lines in readme file

77

increased by20.31%

Worsened metrics

Number of package files

38

decreased by-2.56%

Number of low quality alerts

1

increased byInfinity%

No dependency changes