@grandbazar/ui-baza 1.1.0 → 1.1.2

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 CHANGED
@@ -129,13 +129,17 @@ Currently available components:
129
129
  - **Button** - Flexible button component with various styles and states.
130
130
  - **Checkbox** - Custom checkbox with state support, custom labels, and full styling.
131
131
  - **Chip** - Compact element for displaying tags, filters, or selections.
132
+ - **Counter** - Compact visual indicator for displaying short numeric values like notification counts, unread messages, or status badges.
132
133
  - **DatePicker** - Flexible date picker component with calendar interface, date ranges, and internationalization support. Implemented using Compound Components pattern.
133
134
  - **DropdownMenu** - Flexible dropdown menu with support for submenus, custom triggers, and rich content. Implemented using Compound Components pattern.
134
135
  - **RadioButton** - Radio button component for single selection from multiple options.
136
+ - **Search** - Search input field with icon and clear button. Supports two modes: default (inline icon) and custom (separate search button).
137
+ - **SegmentControl** - Segmented control component for single selection from multiple options with visual button group interface. Implemented using Compound Components pattern.
135
138
  - **Switch** - Toggle switch component for binary on/off states with smooth animations.
136
139
  - **Tag** - Elements for visual marking using keywords. Help with quick recognition, differentiation, and sorting or navigation through content.
137
140
  - **TextField** - Input field component with validation, labels, and various input types support. Implemented using Compound Components pattern.
138
141
  - **Pagination** - Navigation component for multi-page content with customizable appearance and behavior.
142
+ - **ProgressBar** - Progress indicator component with linear and step-based variants. Supports multiple sizes and full ARIA accessibility. Implemented using Compound Components pattern.
139
143
 
140
144
  More components coming soon! 🎉
141
145
 
@@ -143,33 +147,51 @@ More components coming soon! 🎉
143
147
 
144
148
  Basic set of SVG icons for common UI needs:
145
149
 
150
+ - **IconArrow** - Arrow icon for navigation and directional indicators
151
+ - **IconArrowCircle** - Arrow inside circle for navigation buttons
152
+ - **IconArrowDiagonal** - Diagonal arrow for external links and redirects
153
+ - **IconArrowUTurn** - U-turn arrow for undo/return actions
146
154
  - **IconCalendar** - Calendar icon for date pickers and scheduling
155
+ - **IconCharacteristic** - Pattern icon for characteristics and properties
147
156
  - **IconCheck** - Checkmark icon for confirmations and completed states
148
157
  - **IconChevron** - Arrow/chevron icon for navigation and dropdowns
158
+ - **IconChevronDouble** - Double chevron for fast navigation (first/last page)
159
+ - **IconCollapse** - Collapse icon for expanding/collapsing content
160
+ - **IconFilters** - Filter icon for filtering and sorting options
149
161
  - **IconGear** - Settings/gear icon for configuration and preferences
162
+ - **IconLogOut** - Logout icon for sign out actions
150
163
  - **IconMinus** - Minus icon for decrements and removal actions
164
+ - **IconPerson** - Person/user icon for profiles and accounts
151
165
  - **IconPlus** - Plus icon for increments and add actions
166
+ - **IconPrize** - Prize/gift icon for rewards and bonuses
167
+ - **IconProject** - Project/layers icon for project management
168
+ - **IconQRCode** - QR code icon for scanning and sharing
169
+ - **IconRequest** - Request/branch icon for requests and workflows
152
170
  - **IconShopping** - Shopping bag/cart icon for e-commerce and shopping features
171
+ - **IconSort** - Sort icon for sorting options
153
172
  - **IconXMark** - Close/remove icon for dismissing and deleting
154
173
 
155
174
  ### Icon Variants
156
175
 
157
176
  Some icons provide multiple variants using Compound Components pattern:
158
177
 
178
+ - **IconArrowCircle.Filled** - Filled version of the arrow circle icon
179
+ - **IconArrowDiagonal.Up** - Upward diagonal arrow variant
180
+ - **IconArrowUTurn.Up** - Upward U-turn arrow variant
181
+ - **IconPerson.Filled** - Filled version of the person icon for active states
182
+ - **IconPrize.Filled** - Filled version of the prize icon for active states
159
183
  - **IconShopping.Filled** - Filled version of the shopping icon for active/selected states
160
184
  - **IconXMark.Small** - Smaller version of the close icon for compact UI elements
161
185
 
162
186
  ```tsx
163
- import { IconCheck, IconShopping, IconXMark } from '@grandbazar/ui-baza';
187
+ import { IconCheck, IconShopping, IconPerson, IconArrowCircle } from '@grandbazar/ui-baza';
164
188
 
165
189
  function Example() {
166
190
  return (
167
191
  <div>
168
192
  <IconCheck style={{ color: 'green', width: 16, height: 16 }} />
169
- <IconShopping style={{ color: 'blue', width: 24, height: 24 }} />
170
- <IconShopping.Filled style={{ color: 'blue', width: 24, height: 24 }} />
171
- <IconXMark style={{ width: 24, height: 24 }} />
172
- <IconXMark.Small style={{ width: 20, height: 20 }} />
193
+ <IconShopping style={{ color: 'blue', width: 20, height: 20 }} />
194
+ <IconShopping.Filled style={{ color: 'red', width: 24, height: 24 }} />
173
195
  </div>
174
196
  );
175
197
  }