@snapdragonsnursery/react-components 1.0.10 → 1.1.0
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.
- package/README.md +51 -0
- package/package.json +20 -2
- package/src/ChildSearchModal.jsx +2 -2
package/README.md
CHANGED
|
@@ -6,6 +6,8 @@ Reusable React components for Snapdragons projects.
|
|
|
6
6
|
|
|
7
7
|
- **AuthButtons**: Profile button with authentication, user image, dropdown menu (sign out, dark mode), and login/logout handling for MSAL (Azure AD).
|
|
8
8
|
- **ThemeToggle**: Simple theme (light/dark/system) toggle button.
|
|
9
|
+
- **LandingPage**: Professional landing page component for Microsoft authentication flows with customizable branding.
|
|
10
|
+
- **ChildSearchModal**: Modal component for searching and selecting children with advanced filtering and selection capabilities.
|
|
9
11
|
|
|
10
12
|
## Installation
|
|
11
13
|
|
|
@@ -451,6 +453,55 @@ Once setup is complete, the AuthButtons component will:
|
|
|
451
453
|
- Provide a dropdown menu with theme toggle and logout option
|
|
452
454
|
- Handle all authentication flows automatically
|
|
453
455
|
|
|
456
|
+
## LandingPage Component
|
|
457
|
+
|
|
458
|
+
The LandingPage component provides a professional landing page for Microsoft authentication flows.
|
|
459
|
+
|
|
460
|
+
### Quick Start
|
|
461
|
+
|
|
462
|
+
```jsx
|
|
463
|
+
import { LandingPage } from '@snapdragonsnursery/react-components';
|
|
464
|
+
|
|
465
|
+
function App() {
|
|
466
|
+
const handleSignIn = () => {
|
|
467
|
+
// Implement your Microsoft authentication logic
|
|
468
|
+
console.log('Sign in clicked');
|
|
469
|
+
};
|
|
470
|
+
|
|
471
|
+
return (
|
|
472
|
+
<LandingPage
|
|
473
|
+
logoUrl="https://your-logo-url.png"
|
|
474
|
+
appName="Your Application"
|
|
475
|
+
appDescription="Manage your application efficiently"
|
|
476
|
+
onSignIn={handleSignIn}
|
|
477
|
+
companyName="Your Company"
|
|
478
|
+
/>
|
|
479
|
+
);
|
|
480
|
+
}
|
|
481
|
+
```
|
|
482
|
+
|
|
483
|
+
### Props
|
|
484
|
+
|
|
485
|
+
| Prop | Type | Required | Default | Description |
|
|
486
|
+
|------|------|----------|---------|-------------|
|
|
487
|
+
| `logoUrl` | `string` | ✅ | - | URL to your company logo |
|
|
488
|
+
| `appName` | `string` | ✅ | - | Name of your application |
|
|
489
|
+
| `appDescription` | `string` | ❌ | "Manage your application efficiently" | App description |
|
|
490
|
+
| `onSignIn` | `function` | ❌ | `() => console.log('Sign in clicked')` | Sign-in callback |
|
|
491
|
+
| `companyName` | `string` | ❌ | "Your Company" | Company name for footer |
|
|
492
|
+
| `backgroundColor` | `string` | ❌ | Blue gradient | CSS background value |
|
|
493
|
+
| `cardClassName` | `string` | ❌ | `""` | Additional CSS classes |
|
|
494
|
+
|
|
495
|
+
### Features
|
|
496
|
+
|
|
497
|
+
- **Framework Agnostic**: Uses inline styles for maximum compatibility
|
|
498
|
+
- **Responsive Design**: Works on all device sizes
|
|
499
|
+
- **Microsoft Integration**: Official Microsoft logo and branding
|
|
500
|
+
- **Customizable**: Configurable logo, colors, and branding
|
|
501
|
+
- **Accessible**: Proper semantic HTML and keyboard navigation
|
|
502
|
+
|
|
503
|
+
For detailed documentation, see [LANDING_PAGE_DOCUMENTATION.md](./LANDING_PAGE_DOCUMENTATION.md).
|
|
504
|
+
|
|
454
505
|
## Troubleshooting
|
|
455
506
|
|
|
456
507
|
### Common Issues
|
package/package.json
CHANGED
|
@@ -1,10 +1,28 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@snapdragonsnursery/react-components",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "1.1.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"scripts": {
|
|
7
|
-
"test": "echo \"
|
|
7
|
+
"test": "echo \"No tests specified - skipping\"",
|
|
8
|
+
"version:patch": "npm version patch",
|
|
9
|
+
"version:minor": "npm version minor",
|
|
10
|
+
"version:major": "npm version major",
|
|
11
|
+
"version:prepatch": "npm version prepatch",
|
|
12
|
+
"version:preminor": "npm version preminor",
|
|
13
|
+
"version:premajor": "npm version premajor",
|
|
14
|
+
"version:prerelease": "npm version prerelease",
|
|
15
|
+
"publish:patch": "npm run version:patch && npm publish",
|
|
16
|
+
"publish:minor": "npm run version:minor && npm publish",
|
|
17
|
+
"publish:major": "npm run version:major && npm publish",
|
|
18
|
+
"publish:prepatch": "npm run version:prepatch && npm publish --tag beta",
|
|
19
|
+
"publish:preminor": "npm run version:preminor && npm publish --tag beta",
|
|
20
|
+
"publish:premajor": "npm run version:premajor && npm publish --tag beta",
|
|
21
|
+
"publish:prerelease": "npm run version:prerelease && npm publish --tag beta",
|
|
22
|
+
"release": "node scripts/release.js",
|
|
23
|
+
"release:patch": "node scripts/release.js patch",
|
|
24
|
+
"release:minor": "node scripts/release.js minor",
|
|
25
|
+
"release:major": "node scripts/release.js major"
|
|
8
26
|
},
|
|
9
27
|
"repository": {
|
|
10
28
|
"type": "git",
|
package/src/ChildSearchModal.jsx
CHANGED
|
@@ -159,8 +159,8 @@ const ChildSearchModal = ({
|
|
|
159
159
|
// Make API call
|
|
160
160
|
const apiResponse = await fetch(
|
|
161
161
|
`${
|
|
162
|
-
process.env.
|
|
163
|
-
"https://
|
|
162
|
+
process.env.VITE_COMMON_API_BASE_URL ||
|
|
163
|
+
"https://snaps-common-api.azurewebsites.net"
|
|
164
164
|
}/api/search-children?${params}`,
|
|
165
165
|
{
|
|
166
166
|
headers: {
|