Skip to content

Commit 4e9fb48

Browse files
NandhakumarENandhakumarE
authored
Merge pull request #14 from NandhakumarE/develop
v1.0.0 - UI Library Integrations, Enhanced Stories & Release Workflow
2 parents 6060ac6 + 9ebfd08 commit 4e9fb48

39 files changed

Lines changed: 7420 additions & 1691 deletions

‎.changeset/ui-library-integrations.md‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
---
2+
"react-querybuilder-lite": major
3+
---
4+
5+
Add comprehensive UI library integrations and enhanced Storybook stories
6+
7+
## Features
8+
9+
### UI Library Integrations
10+
- **Ant Design**: Complete query builder integration with custom Rule, Group, and ValueInput components supporting light/dark themes
11+
- **Chakra UI**: Full Chakra UI implementation with accessible components and theme configuration
12+
- **Material UI**: Material Design query builder components with Google-inspired palette and theme system
13+
- **Custom CSS**: Pure CSS-based query builder with unique vertical line design pattern
14+
15+
### Components & Utilities
16+
- Custom ValueInput components for each UI library handling string, number, date, and boolean field types
17+
- Range value input support for operators like `between` and `not_between`
18+
- Drag-and-drop handles for all components (when items are not locked)
19+
- Lock/unlock functionality with visual feedback
20+
- Duplicate and delete actions for rules and groups
21+
- AND/OR combinator toggles with keyboard and mouse support
22+
23+
### Story Enhancements
24+
- Complete core stories for BasicBuilder, MaxDepth, Operators, WithDragAndDrop, and LockedRules
25+
- Story component utilities with configurable features (drag, clone, lock)
26+
- Dark mode support across all stories
27+
- Improved responsive layouts with proper container styling
28+
29+
### Dependencies
30+
- Added: `@chakra-ui/react`, `@emotion/react`, `@emotion/styled`
31+
- Added: `@mui/icons-material`, `@mui/material`
32+
- Added: `antd`, `dayjs`
33+
34+
### Testing & Configuration
35+
- Updated vitest configuration for improved test setup
36+
- Enhanced TypeScript configuration support
37+
- Added GitHub workflows for CI/CD (deploy-storybook, release)
38+
39+
## Breaking Changes
40+
None
41+
42+
## Migration Guide
43+
No migration needed. This is a purely additive release with new story examples and UI library integrations.

‎.github/workflows/release.yml‎

Lines changed: 16 additions & 106 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,14 @@
11
# Release Workflow
22
#
33
# Your flow:
4-
# develop → release (PR) → merge → publishes beta
5-
# release → main (PR) → merge → publishes stable (changeset required)
6-
#
7-
# Beta version: Reads changeset for bump type (patch/minor/major), defaults to patch
4+
# develop → main (PR) → merge → publishes stable (changeset required)
85
#
96
name: Release
107

118
on:
129
push:
1310
branches:
1411
- main
15-
- release
1612

1713
concurrency:
1814
group: ${{ github.workflow }}-${{ github.ref }}
@@ -44,122 +40,36 @@ jobs:
4440
run: npm run build
4541

4642
# ─────────────────────────────────────────────────────────
47-
# Check for changesets and determine bump type
43+
# Check for changesets
4844
# ─────────────────────────────────────────────────────────
49-
- name: Check changesets and bump type
45+
- name: Check changesets
5046
id: changesets
5147
run: |
5248
CHANGESET_FILE=$(find .changeset -name "*.md" ! -name "README.md" 2>/dev/null | head -1)
5349
5450
if [ -z "$CHANGESET_FILE" ]; then
5551
echo "has_changesets=false" >> $GITHUB_OUTPUT
56-
echo "bump_type=patch" >> $GITHUB_OUTPUT
57-
echo "⚠️ No changesets found - defaulting to patch"
52+
echo "⚠️ No changesets found"
5853
else
5954
echo "has_changesets=true" >> $GITHUB_OUTPUT
60-
61-
# Read changeset to determine bump type (major > minor > patch)
62-
if grep -q "major" "$CHANGESET_FILE"; then
63-
echo "bump_type=major" >> $GITHUB_OUTPUT
64-
echo "📦 Changeset indicates: major"
65-
elif grep -q "minor" "$CHANGESET_FILE"; then
66-
echo "bump_type=minor" >> $GITHUB_OUTPUT
67-
echo "📦 Changeset indicates: minor"
68-
else
69-
echo "bump_type=patch" >> $GITHUB_OUTPUT
70-
echo "📦 Changeset indicates: patch"
71-
fi
55+
echo "✅ Changeset found: $CHANGESET_FILE"
7256
fi
7357
7458
# ─────────────────────────────────────────────────────────
75-
# RELEASE BRANCH → Publish Beta
76-
# ─────────────────────────────────────────────────────────
77-
- name: Get current version
78-
if: github.ref == 'refs/heads/release'
79-
id: current_version
80-
run: |
81-
VERSION=$(node -p "require('./package.json').version")
82-
echo "version=$VERSION" >> $GITHUB_OUTPUT
83-
echo "Current version: $VERSION"
84-
85-
- name: Determine beta version
86-
if: github.ref == 'refs/heads/release'
87-
id: beta_version
88-
run: |
89-
CURRENT="${{ steps.current_version.outputs.version }}"
90-
BUMP_TYPE="${{ steps.changesets.outputs.bump_type }}"
91-
92-
# Remove any existing prerelease suffix
93-
BASE=$(echo $CURRENT | sed 's/-beta.*//' | sed 's/-alpha.*//' | sed 's/-rc.*//')
94-
IFS='.' read -ra PARTS <<< "$BASE"
95-
96-
MAJOR=${PARTS[0]}
97-
MINOR=${PARTS[1]}
98-
PATCH=${PARTS[2]}
99-
100-
# Apply bump based on changeset type
101-
case $BUMP_TYPE in
102-
major)
103-
NEW_MAJOR=$((MAJOR + 1))
104-
NEW_VERSION="${NEW_MAJOR}.0.0-beta.1"
105-
;;
106-
minor)
107-
NEW_MINOR=$((MINOR + 1))
108-
NEW_VERSION="${MAJOR}.${NEW_MINOR}.0-beta.1"
109-
;;
110-
patch)
111-
# Check if already a beta of same base version
112-
if [[ "$CURRENT" == "${MAJOR}.${MINOR}.$((PATCH))-beta"* ]]; then
113-
# Increment beta number
114-
BETA_NUM=$(echo $CURRENT | sed 's/.*-beta\.//')
115-
NEW_BETA=$((BETA_NUM + 1))
116-
NEW_VERSION="${MAJOR}.${MINOR}.${PATCH}-beta.${NEW_BETA}"
117-
else
118-
NEW_PATCH=$((PATCH + 1))
119-
NEW_VERSION="${MAJOR}.${MINOR}.${NEW_PATCH}-beta.1"
120-
fi
121-
;;
122-
esac
123-
124-
echo "new_version=$NEW_VERSION" >> $GITHUB_OUTPUT
125-
echo "📦 Beta version: $NEW_VERSION (bump type: $BUMP_TYPE)"
126-
127-
- name: Update version for beta
128-
if: github.ref == 'refs/heads/release'
129-
run: npm version ${{ steps.beta_version.outputs.new_version }} --no-git-tag-version
130-
131-
- name: Publish beta to npm
132-
if: github.ref == 'refs/heads/release'
133-
run: npm publish --tag beta --provenance --access public
134-
env:
135-
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
136-
137-
- name: Commit beta version
138-
if: github.ref == 'refs/heads/release'
139-
run: |
140-
git config user.name "github-actions[bot]"
141-
git config user.email "github-actions[bot]@users.noreply.github.com"
142-
git add package.json package-lock.json
143-
git commit -m "chore: release ${{ steps.beta_version.outputs.new_version }}"
144-
git push
145-
env:
146-
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
147-
148-
# ─────────────────────────────────────────────────────────
149-
# MAIN BRANCH → Publish Stable (changeset REQUIRED)
59+
# Publish Stable (changeset REQUIRED)
15060
# ─────────────────────────────────────────────────────────
151-
- name: Version packages (stable)
152-
if: github.ref == 'refs/heads/main' && steps.changesets.outputs.has_changesets == 'true'
61+
- name: Version packages
62+
if: steps.changesets.outputs.has_changesets == 'true'
15363
run: npx changeset version
15464

155-
- name: Publish stable to npm
156-
if: github.ref == 'refs/heads/main' && steps.changesets.outputs.has_changesets == 'true'
65+
- name: Publish to npm
66+
if: steps.changesets.outputs.has_changesets == 'true'
15767
run: npm publish --provenance --access public
15868
env:
15969
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
16070

16171
- name: Commit version + changelog
162-
if: github.ref == 'refs/heads/main' && steps.changesets.outputs.has_changesets == 'true'
72+
if: steps.changesets.outputs.has_changesets == 'true'
16373
run: |
16474
git config user.name "github-actions[bot]"
16575
git config user.email "github-actions[bot]@users.noreply.github.com"
@@ -170,15 +80,15 @@ jobs:
17080
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
17181

17282
# ─────────────────────────────────────────────────────────
173-
# MAIN BRANCH + NO CHANGESETS → Skip
83+
# No changesets → Skip
17484
# ─────────────────────────────────────────────────────────
175-
- name: Skip stable publish (no changesets)
176-
if: github.ref == 'refs/heads/main' && steps.changesets.outputs.has_changesets == 'false'
85+
- name: Skip publish (no changesets)
86+
if: steps.changesets.outputs.has_changesets == 'false'
17787
run: |
17888
echo "────────────────────────────────────────────────"
179-
echo "ℹ️ No changesets found - skipping stable release"
89+
echo "ℹ️ No changesets found - skipping release"
18090
echo ""
181-
echo "To publish a stable version:"
91+
echo "To publish a new version:"
18292
echo " 1. Run: npx changeset"
18393
echo " 2. Commit the .md file"
18494
echo " 3. Merge to main"

‎.storybook/main.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,15 @@ import tailwindcss from '@tailwindcss/vite';
33

44
const config: StorybookConfig = {
55
"stories": [
6-
"../src/**/*.mdx",
7-
"../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"
6+
"../src/stories/**/*.mdx",
7+
"../src/stories/**/*.stories.@(js|jsx|mjs|ts|tsx)"
88
],
9+
// Disable auto-composition of external storybooks from dependencies
10+
"refs": () => ({}),
911
"addons": [
10-
"@chromatic-com/storybook",
1112
"@storybook/addon-vitest",
1213
"@storybook/addon-a11y",
1314
"@storybook/addon-docs",
14-
"@storybook/addon-onboarding"
1515
],
1616
"framework": "@storybook/react-vite",
1717
viteFinal: (config) => {

‎.storybook/preview.ts‎

Lines changed: 0 additions & 21 deletions
This file was deleted.

‎.storybook/preview.tsx‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import type { Preview } from '@storybook/react-vite';
2+
import type { Decorator } from '@storybook/react';
3+
import '../src/stories/stories.css';
4+
5+
const withThemeWrapper: Decorator = (Story, context) => {
6+
const theme = context.globals.theme || 'light';
7+
return (
8+
<div className={theme === 'dark' ? 'dark' : ''}>
9+
<Story />
10+
</div>
11+
);
12+
};
13+
14+
const preview: Preview = {
15+
parameters: {
16+
controls: {
17+
matchers: {
18+
color: /(background|color)$/i,
19+
date: /Date$/i,
20+
},
21+
},
22+
a11y: {
23+
test: 'todo',
24+
},
25+
},
26+
globalTypes: {
27+
theme: {
28+
description: 'Theme for components',
29+
toolbar: {
30+
title: 'Theme',
31+
icon: 'paintbrush',
32+
items: [
33+
{ value: 'light', icon: 'sun', title: 'Light' },
34+
{ value: 'dark', icon: 'moon', title: 'Dark' },
35+
],
36+
dynamicTitle: true,
37+
},
38+
},
39+
},
40+
initialGlobals: {
41+
theme: 'light',
42+
},
43+
decorators: [withThemeWrapper],
44+
};
45+
46+
export default preview;

‎eslint.config.js‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,3 @@
1-
// For more info, see https://github.com/storybookjs/eslint-plugin-storybook#configuration-flat-config-format
2-
import storybook from "eslint-plugin-storybook";
3-
41
import js from '@eslint/js'
52
import globals from 'globals'
63
import reactHooks from 'eslint-plugin-react-hooks'
@@ -9,7 +6,7 @@ import tseslint from 'typescript-eslint'
96
import { defineConfig, globalIgnores } from 'eslint/config'
107

118
export default defineConfig([
12-
globalIgnores(['dist']),
9+
globalIgnores(['dist', 'storybook-static']),
1310
{
1411
files: ['**/*.{ts,tsx}'],
1512
extends: [

0 commit comments

Comments
 (0)