@eduboxpro/studio 0.1.7 → 0.1.8

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/index.d.ts CHANGED
@@ -198,6 +198,27 @@ interface TextareaDefaultsConfig {
198
198
  showCharCount?: boolean;
199
199
  clearable?: boolean;
200
200
  }
201
+ /**
202
+ * ButtonGroup component defaults configuration
203
+ */
204
+ interface ButtonGroupDefaultsConfig {
205
+ orientation?: 'horizontal' | 'vertical';
206
+ size?: 'sm' | 'md' | 'lg';
207
+ variant?: 'solid' | 'outline' | 'ghost';
208
+ color?: 'primary' | 'secondary' | 'success' | 'error' | 'warning';
209
+ radius?: 'none' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
210
+ }
211
+ /**
212
+ * ButtonToggleGroup component defaults configuration
213
+ */
214
+ interface ButtonToggleGroupDefaultsConfig {
215
+ orientation?: 'horizontal' | 'vertical';
216
+ size?: 'sm' | 'md' | 'lg';
217
+ variant?: 'solid' | 'outline' | 'ghost';
218
+ color?: 'primary' | 'secondary' | 'success' | 'error' | 'warning';
219
+ radius?: 'none' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
220
+ shadow?: 'none' | 'sm' | 'md' | 'lg';
221
+ }
201
222
  /**
202
223
  * Components defaults configuration
203
224
  */
@@ -208,6 +229,8 @@ interface ComponentsConfig {
208
229
  input?: InputDefaultsConfig;
209
230
  checkbox?: CheckboxDefaultsConfig;
210
231
  textarea?: TextareaDefaultsConfig;
232
+ buttonGroup?: ButtonGroupDefaultsConfig;
233
+ buttonToggleGroup?: ButtonToggleGroupDefaultsConfig;
211
234
  }
212
235
  /**
213
236
  * Main Studio configuration interface
@@ -350,6 +373,33 @@ declare class ButtonComponent {
350
373
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonComponent, "studio-button", never, { "variantInput": { "alias": "variant"; "required": false; "isSignal": true; }; "sizeInput": { "alias": "size"; "required": false; "isSignal": true; }; "colorInput": { "alias": "color"; "required": false; "isSignal": true; }; "radiusInput": { "alias": "radius"; "required": false; "isSignal": true; }; "shadowInput": { "alias": "shadow"; "required": false; "isSignal": true; }; "compactInput": { "alias": "compact"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconPosition": { "alias": "iconPosition"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "badgeColor": { "alias": "badgeColor"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, ["*"], true, never>;
351
374
  }
352
375
 
376
+ declare class ButtonGroupComponent {
377
+ private readonly elementRef;
378
+ private readonly configService;
379
+ private readonly groupDefaults;
380
+ orientationInput: _angular_core.InputSignal<"vertical" | "horizontal" | undefined>;
381
+ sizeInput: _angular_core.InputSignal<"sm" | "md" | "lg" | undefined>;
382
+ variantInput: _angular_core.InputSignal<"solid" | "outline" | "ghost" | undefined>;
383
+ colorInput: _angular_core.InputSignal<"primary" | "secondary" | "success" | "error" | "warning" | undefined>;
384
+ radiusInput: _angular_core.InputSignal<"sm" | "md" | "lg" | "none" | "xl" | "full" | undefined>;
385
+ orientation: _angular_core.Signal<"vertical" | "horizontal">;
386
+ size: _angular_core.Signal<"sm" | "md" | "lg" | undefined>;
387
+ variant: _angular_core.Signal<"solid" | "outline" | "ghost" | undefined>;
388
+ color: _angular_core.Signal<"primary" | "secondary" | "success" | "error" | "warning" | undefined>;
389
+ radius: _angular_core.Signal<"sm" | "md" | "lg" | "none" | "xl" | "full" | undefined>;
390
+ attached: _angular_core.InputSignal<boolean>;
391
+ fullWidth: _angular_core.InputSignal<boolean>;
392
+ disabled: _angular_core.InputSignal<boolean>;
393
+ spacing: _angular_core.InputSignal<"sm" | "md" | "lg" | "none" | "xs">;
394
+ align: _angular_core.InputSignal<"center" | "start" | "end" | "stretch">;
395
+ ariaLabel: _angular_core.InputSignal<string | undefined>;
396
+ role: _angular_core.InputSignal<string>;
397
+ protected hostClasses: _angular_core.Signal<string>;
398
+ constructor();
399
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonGroupComponent, never>;
400
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonGroupComponent, "studio-button-group", never, { "orientationInput": { "alias": "orientation"; "required": false; "isSignal": true; }; "sizeInput": { "alias": "size"; "required": false; "isSignal": true; }; "variantInput": { "alias": "variant"; "required": false; "isSignal": true; }; "colorInput": { "alias": "color"; "required": false; "isSignal": true; }; "radiusInput": { "alias": "radius"; "required": false; "isSignal": true; }; "attached": { "alias": "attached"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "spacing": { "alias": "spacing"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "role": { "alias": "role"; "required": false; "isSignal": true; }; }, {}, never, ["studio-button"], true, never>;
401
+ }
402
+
353
403
  /**
354
404
  * Checkbox component for selecting boolean values
355
405
  *
@@ -896,6 +946,56 @@ type TextareaSize = 'sm' | 'md' | 'lg';
896
946
  type TextareaColor = 'primary' | 'secondary' | 'success' | 'error';
897
947
  type TextareaRadius = 'none' | 'sm' | 'md' | 'lg' | 'full';
898
948
 
949
+ interface ButtonToggleGroupOption {
950
+ value: string | number;
951
+ label: string;
952
+ icon?: string;
953
+ disabled?: boolean;
954
+ ariaLabel?: string;
955
+ }
956
+ type ButtonToggleGroupValue = string | number | (string | number)[];
957
+
958
+ declare class ButtonToggleGroupComponent implements ControlValueAccessor {
959
+ private readonly configService;
960
+ private readonly toggleGroupDefaults;
961
+ private onChange;
962
+ private onTouched;
963
+ value: _angular_core.ModelSignal<ButtonToggleGroupValue>;
964
+ options: _angular_core.InputSignal<ButtonToggleGroupOption[]>;
965
+ multiple: _angular_core.InputSignal<boolean>;
966
+ allowEmpty: _angular_core.InputSignal<boolean>;
967
+ orientationInput: _angular_core.InputSignal<"vertical" | "horizontal" | undefined>;
968
+ sizeInput: _angular_core.InputSignal<"sm" | "md" | "lg" | undefined>;
969
+ variantInput: _angular_core.InputSignal<"solid" | "outline" | "ghost" | undefined>;
970
+ colorInput: _angular_core.InputSignal<"primary" | "secondary" | "success" | "error" | "warning" | undefined>;
971
+ radiusInput: _angular_core.InputSignal<"sm" | "md" | "lg" | "none" | "xl" | "full" | undefined>;
972
+ shadowInput: _angular_core.InputSignal<"sm" | "md" | "lg" | "none" | undefined>;
973
+ orientation: _angular_core.Signal<"vertical" | "horizontal">;
974
+ size: _angular_core.Signal<"sm" | "md" | "lg">;
975
+ variant: _angular_core.Signal<"solid" | "outline" | "ghost">;
976
+ color: _angular_core.Signal<"primary" | "secondary" | "success" | "error" | "warning">;
977
+ radius: _angular_core.Signal<"sm" | "md" | "lg" | "none" | "xl" | "full">;
978
+ shadow: _angular_core.Signal<"sm" | "md" | "lg" | "none">;
979
+ attached: _angular_core.InputSignal<boolean>;
980
+ fullWidth: _angular_core.InputSignal<boolean>;
981
+ disabled: _angular_core.InputSignal<boolean>;
982
+ spacing: _angular_core.InputSignal<"sm" | "md" | "lg" | "none" | "xs">;
983
+ align: _angular_core.InputSignal<"center" | "start" | "end" | "stretch">;
984
+ showIcons: _angular_core.InputSignal<boolean>;
985
+ iconPosition: _angular_core.InputSignal<"left" | "right" | "only">;
986
+ ariaLabel: _angular_core.InputSignal<string | undefined>;
987
+ valueChange: _angular_core.OutputEmitterRef<ButtonToggleGroupValue>;
988
+ protected hostClasses: _angular_core.Signal<string>;
989
+ protected isSelected(optionValue: string | number): boolean;
990
+ protected handleToggle(optionValue: string | number): void;
991
+ writeValue(val: ButtonToggleGroupValue): void;
992
+ registerOnChange(fn: (value: ButtonToggleGroupValue) => void): void;
993
+ registerOnTouched(fn: () => void): void;
994
+ setDisabledState(isDisabled: boolean): void;
995
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonToggleGroupComponent, never>;
996
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonToggleGroupComponent, "studio-button-toggle-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "allowEmpty": { "alias": "allowEmpty"; "required": false; "isSignal": true; }; "orientationInput": { "alias": "orientation"; "required": false; "isSignal": true; }; "sizeInput": { "alias": "size"; "required": false; "isSignal": true; }; "variantInput": { "alias": "variant"; "required": false; "isSignal": true; }; "colorInput": { "alias": "color"; "required": false; "isSignal": true; }; "radiusInput": { "alias": "radius"; "required": false; "isSignal": true; }; "shadowInput": { "alias": "shadow"; "required": false; "isSignal": true; }; "attached": { "alias": "attached"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "spacing": { "alias": "spacing"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "showIcons": { "alias": "showIcons"; "required": false; "isSignal": true; }; "iconPosition": { "alias": "iconPosition"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "valueChange": "valueChange"; }, never, never, true, never>;
997
+ }
998
+
899
999
  /**
900
1000
  * Theme toggle switch with sun/moon icons
901
1001
  *
@@ -1013,5 +1113,5 @@ declare function loadGoogleFonts(fonts: Array<{
1013
1113
  display?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional';
1014
1114
  }>): void;
1015
1115
 
1016
- export { BadgeComponent, ButtonComponent, CheckboxComponent, IconComponent, InputComponent, STUDIO_CONFIG, StudioConfigService, SwitchComponent, TextareaComponent, ThemeSwitchComponent, classNames, isSafeUrl, loadGoogleFont, loadGoogleFonts, provideStudioConfig, provideStudioIcons, sanitizeUrl, withConfigDefault };
1017
- export type { BadgeDefaultsConfig, ButtonDefaultsConfig, CheckboxColor, CheckboxDefaultsConfig, CheckboxRadius, CheckboxSize, CheckboxVariant, ColorConfig, ComponentsConfig, InputDefaultsConfig, InputMode, InputType, StudioConfig, StudioThemeConfig, SwitchDefaultsConfig, TextareaColor, TextareaDefaultsConfig, TextareaRadius, TextareaSize, TextareaVariant, ThemeMode };
1116
+ export { BadgeComponent, ButtonComponent, ButtonGroupComponent, ButtonToggleGroupComponent, CheckboxComponent, IconComponent, InputComponent, STUDIO_CONFIG, StudioConfigService, SwitchComponent, TextareaComponent, ThemeSwitchComponent, classNames, isSafeUrl, loadGoogleFont, loadGoogleFonts, provideStudioConfig, provideStudioIcons, sanitizeUrl, withConfigDefault };
1117
+ export type { BadgeDefaultsConfig, ButtonDefaultsConfig, ButtonGroupDefaultsConfig, ButtonToggleGroupDefaultsConfig, ButtonToggleGroupOption, ButtonToggleGroupValue, CheckboxColor, CheckboxDefaultsConfig, CheckboxRadius, CheckboxSize, CheckboxVariant, ColorConfig, ComponentsConfig, InputDefaultsConfig, InputMode, InputType, StudioConfig, StudioThemeConfig, SwitchDefaultsConfig, TextareaColor, TextareaDefaultsConfig, TextareaRadius, TextareaSize, TextareaVariant, ThemeMode };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eduboxpro/studio",
3
- "version": "0.1.7",
3
+ "version": "0.1.8",
4
4
  "description": "Modern Angular UI library for educational platforms with customizable design system",
5
5
  "keywords": [
6
6
  "angular",