@phcdevworks/spectre-ui 1.7.0 → 1.9.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/dist/index.d.cts CHANGED
@@ -103,6 +103,7 @@ declare const BADGE_VARIANTS: {
103
103
  readonly neutral: true;
104
104
  readonly info: true;
105
105
  readonly ghost: true;
106
+ readonly outline: true;
106
107
  readonly accent: true;
107
108
  readonly cta: true;
108
109
  };
@@ -137,8 +138,10 @@ declare const ICONBOX_VARIANTS: {
137
138
  readonly ghost: true;
138
139
  readonly accent: true;
139
140
  readonly cta: true;
141
+ readonly outline: true;
140
142
  };
141
143
  declare const ICONBOX_SIZES: {
144
+ readonly xs: true;
142
145
  readonly sm: true;
143
146
  readonly md: true;
144
147
  readonly lg: true;
@@ -314,15 +317,110 @@ interface TagRecipeOptions {
314
317
  }
315
318
  declare function getTagClasses(opts?: TagRecipeOptions): string;
316
319
 
320
+ declare const SPINNER_VARIANTS: {
321
+ readonly primary: true;
322
+ readonly secondary: true;
323
+ readonly success: true;
324
+ readonly warning: true;
325
+ readonly danger: true;
326
+ readonly info: true;
327
+ readonly neutral: true;
328
+ readonly accent: true;
329
+ readonly cta: true;
330
+ };
317
331
  declare const SPINNER_SIZES: {
318
332
  readonly sm: true;
319
333
  readonly md: true;
320
334
  readonly lg: true;
321
335
  };
336
+ type SpinnerVariant = keyof typeof SPINNER_VARIANTS;
322
337
  type SpinnerSize = keyof typeof SPINNER_SIZES;
323
338
  interface SpinnerRecipeOptions {
339
+ variant?: SpinnerVariant;
324
340
  size?: SpinnerSize;
341
+ disabled?: boolean;
342
+ loading?: boolean;
325
343
  }
326
344
  declare function getSpinnerClasses(opts?: SpinnerRecipeOptions): string;
327
345
 
328
- export { type AlertRecipeOptions, type AlertSize, type AlertVariant, type AvatarRecipeOptions, type AvatarShape, type AvatarSize, type BadgeRecipeOptions, type BadgeSize, type BadgeVariant, type ButtonRecipeOptions, type ButtonSize, type ButtonVariant, type CardRecipeOptions, type CardVariant, type IconBoxRecipeOptions, type IconBoxSize, type IconBoxVariant, type InputRecipeOptions, type InputSize, type InputState, type PricingCardRecipeOptions, type RatingRecipeOptions, type RatingSize, type SpinnerRecipeOptions, type SpinnerSize, type TagRecipeOptions, type TagSize, type TagVariant, type TestimonialRecipeOptions, getAlertClasses, getAvatarClasses, getBadgeClasses, getButtonClasses, getCardClasses, getIconBoxClasses, getInputClasses, getInputErrorMessageClasses, getInputHelperTextClasses, getInputLabelClasses, getInputWrapperClasses, getPricingCardBadgeClasses, getPricingCardClasses, getPricingCardDescriptionClasses, getPricingCardPriceClasses, getPricingCardPriceContainerClasses, getRatingClasses, getRatingStarClasses, getRatingStarsClasses, getRatingTextClasses, getSpinnerClasses, getTagClasses, getTestimonialAuthorClasses, getTestimonialAuthorInfoClasses, getTestimonialAuthorNameClasses, getTestimonialAuthorTitleClasses, getTestimonialClasses, getTestimonialQuoteClasses, spectreBaseStylesPath, spectreComponentsStylesPath, spectreIndexStylesPath, spectreStyles, spectreUtilitiesStylesPath };
346
+ interface NavRecipeOptions {
347
+ bordered?: boolean;
348
+ sticky?: boolean;
349
+ fullWidth?: boolean;
350
+ }
351
+ declare function getNavClasses(opts?: NavRecipeOptions): string;
352
+ declare function getNavLinksClasses(): string;
353
+ interface NavLinkRecipeOptions {
354
+ active?: boolean;
355
+ disabled?: boolean;
356
+ hovered?: boolean;
357
+ focused?: boolean;
358
+ }
359
+ declare function getNavLinkClasses(opts?: NavLinkRecipeOptions): string;
360
+
361
+ declare const TOAST_VARIANTS: {
362
+ readonly info: true;
363
+ readonly success: true;
364
+ readonly warning: true;
365
+ readonly danger: true;
366
+ };
367
+ type ToastVariant = keyof typeof TOAST_VARIANTS;
368
+ interface ToastRecipeOptions {
369
+ variant?: ToastVariant;
370
+ dismissed?: boolean;
371
+ fullWidth?: boolean;
372
+ }
373
+ declare function getToastClasses(opts?: ToastRecipeOptions): string;
374
+ interface ToastIconRecipeOptions {
375
+ variant?: ToastVariant;
376
+ }
377
+ declare function getToastIconClasses(opts?: ToastIconRecipeOptions): string;
378
+
379
+ declare const TOOLTIP_PLACEMENTS: {
380
+ readonly top: true;
381
+ readonly bottom: true;
382
+ readonly left: true;
383
+ readonly right: true;
384
+ };
385
+ type TooltipPlacement = keyof typeof TOOLTIP_PLACEMENTS;
386
+ interface TooltipRecipeOptions {
387
+ placement?: TooltipPlacement;
388
+ visible?: boolean;
389
+ }
390
+ declare function getTooltipClasses(opts?: TooltipRecipeOptions): string;
391
+
392
+ declare const DROPDOWN_PLACEMENTS: {
393
+ readonly 'bottom-start': true;
394
+ readonly 'bottom-end': true;
395
+ readonly 'top-start': true;
396
+ readonly 'top-end': true;
397
+ };
398
+ type DropdownPlacement = keyof typeof DROPDOWN_PLACEMENTS;
399
+ interface DropdownRecipeOptions {
400
+ fullWidth?: boolean;
401
+ }
402
+ declare function getDropdownClasses(opts?: DropdownRecipeOptions): string;
403
+ interface DropdownMenuRecipeOptions {
404
+ placement?: DropdownPlacement;
405
+ open?: boolean;
406
+ }
407
+ declare function getDropdownMenuClasses(opts?: DropdownMenuRecipeOptions): string;
408
+ interface DropdownItemRecipeOptions {
409
+ active?: boolean;
410
+ disabled?: boolean;
411
+ hovered?: boolean;
412
+ focused?: boolean;
413
+ }
414
+ declare function getDropdownItemClasses(opts?: DropdownItemRecipeOptions): string;
415
+
416
+ interface ModalOverlayRecipeOptions {
417
+ open?: boolean;
418
+ }
419
+ declare function getModalOverlayClasses(opts?: ModalOverlayRecipeOptions): string;
420
+ interface ModalRecipeOptions {
421
+ open?: boolean;
422
+ fullWidth?: boolean;
423
+ }
424
+ declare function getModalClasses(opts?: ModalRecipeOptions): string;
425
+
426
+ export { type AlertRecipeOptions, type AlertSize, type AlertVariant, type AvatarRecipeOptions, type AvatarShape, type AvatarSize, type BadgeRecipeOptions, type BadgeSize, type BadgeVariant, type ButtonRecipeOptions, type ButtonSize, type ButtonVariant, type CardRecipeOptions, type CardVariant, type DropdownItemRecipeOptions, type DropdownMenuRecipeOptions, type DropdownPlacement, type DropdownRecipeOptions, type IconBoxRecipeOptions, type IconBoxSize, type IconBoxVariant, type InputRecipeOptions, type InputSize, type InputState, type ModalOverlayRecipeOptions, type ModalRecipeOptions, type NavLinkRecipeOptions, type NavRecipeOptions, type PricingCardRecipeOptions, type RatingRecipeOptions, type RatingSize, type SpinnerRecipeOptions, type SpinnerSize, type SpinnerVariant, type TagRecipeOptions, type TagSize, type TagVariant, type TestimonialRecipeOptions, type ToastIconRecipeOptions, type ToastRecipeOptions, type ToastVariant, type TooltipPlacement, type TooltipRecipeOptions, getAlertClasses, getAvatarClasses, getBadgeClasses, getButtonClasses, getCardClasses, getDropdownClasses, getDropdownItemClasses, getDropdownMenuClasses, getIconBoxClasses, getInputClasses, getInputErrorMessageClasses, getInputHelperTextClasses, getInputLabelClasses, getInputWrapperClasses, getModalClasses, getModalOverlayClasses, getNavClasses, getNavLinkClasses, getNavLinksClasses, getPricingCardBadgeClasses, getPricingCardClasses, getPricingCardDescriptionClasses, getPricingCardPriceClasses, getPricingCardPriceContainerClasses, getRatingClasses, getRatingStarClasses, getRatingStarsClasses, getRatingTextClasses, getSpinnerClasses, getTagClasses, getTestimonialAuthorClasses, getTestimonialAuthorInfoClasses, getTestimonialAuthorNameClasses, getTestimonialAuthorTitleClasses, getTestimonialClasses, getTestimonialQuoteClasses, getToastClasses, getToastIconClasses, getTooltipClasses, spectreBaseStylesPath, spectreComponentsStylesPath, spectreIndexStylesPath, spectreStyles, spectreUtilitiesStylesPath };
package/dist/index.d.ts CHANGED
@@ -103,6 +103,7 @@ declare const BADGE_VARIANTS: {
103
103
  readonly neutral: true;
104
104
  readonly info: true;
105
105
  readonly ghost: true;
106
+ readonly outline: true;
106
107
  readonly accent: true;
107
108
  readonly cta: true;
108
109
  };
@@ -137,8 +138,10 @@ declare const ICONBOX_VARIANTS: {
137
138
  readonly ghost: true;
138
139
  readonly accent: true;
139
140
  readonly cta: true;
141
+ readonly outline: true;
140
142
  };
141
143
  declare const ICONBOX_SIZES: {
144
+ readonly xs: true;
142
145
  readonly sm: true;
143
146
  readonly md: true;
144
147
  readonly lg: true;
@@ -314,15 +317,110 @@ interface TagRecipeOptions {
314
317
  }
315
318
  declare function getTagClasses(opts?: TagRecipeOptions): string;
316
319
 
320
+ declare const SPINNER_VARIANTS: {
321
+ readonly primary: true;
322
+ readonly secondary: true;
323
+ readonly success: true;
324
+ readonly warning: true;
325
+ readonly danger: true;
326
+ readonly info: true;
327
+ readonly neutral: true;
328
+ readonly accent: true;
329
+ readonly cta: true;
330
+ };
317
331
  declare const SPINNER_SIZES: {
318
332
  readonly sm: true;
319
333
  readonly md: true;
320
334
  readonly lg: true;
321
335
  };
336
+ type SpinnerVariant = keyof typeof SPINNER_VARIANTS;
322
337
  type SpinnerSize = keyof typeof SPINNER_SIZES;
323
338
  interface SpinnerRecipeOptions {
339
+ variant?: SpinnerVariant;
324
340
  size?: SpinnerSize;
341
+ disabled?: boolean;
342
+ loading?: boolean;
325
343
  }
326
344
  declare function getSpinnerClasses(opts?: SpinnerRecipeOptions): string;
327
345
 
328
- export { type AlertRecipeOptions, type AlertSize, type AlertVariant, type AvatarRecipeOptions, type AvatarShape, type AvatarSize, type BadgeRecipeOptions, type BadgeSize, type BadgeVariant, type ButtonRecipeOptions, type ButtonSize, type ButtonVariant, type CardRecipeOptions, type CardVariant, type IconBoxRecipeOptions, type IconBoxSize, type IconBoxVariant, type InputRecipeOptions, type InputSize, type InputState, type PricingCardRecipeOptions, type RatingRecipeOptions, type RatingSize, type SpinnerRecipeOptions, type SpinnerSize, type TagRecipeOptions, type TagSize, type TagVariant, type TestimonialRecipeOptions, getAlertClasses, getAvatarClasses, getBadgeClasses, getButtonClasses, getCardClasses, getIconBoxClasses, getInputClasses, getInputErrorMessageClasses, getInputHelperTextClasses, getInputLabelClasses, getInputWrapperClasses, getPricingCardBadgeClasses, getPricingCardClasses, getPricingCardDescriptionClasses, getPricingCardPriceClasses, getPricingCardPriceContainerClasses, getRatingClasses, getRatingStarClasses, getRatingStarsClasses, getRatingTextClasses, getSpinnerClasses, getTagClasses, getTestimonialAuthorClasses, getTestimonialAuthorInfoClasses, getTestimonialAuthorNameClasses, getTestimonialAuthorTitleClasses, getTestimonialClasses, getTestimonialQuoteClasses, spectreBaseStylesPath, spectreComponentsStylesPath, spectreIndexStylesPath, spectreStyles, spectreUtilitiesStylesPath };
346
+ interface NavRecipeOptions {
347
+ bordered?: boolean;
348
+ sticky?: boolean;
349
+ fullWidth?: boolean;
350
+ }
351
+ declare function getNavClasses(opts?: NavRecipeOptions): string;
352
+ declare function getNavLinksClasses(): string;
353
+ interface NavLinkRecipeOptions {
354
+ active?: boolean;
355
+ disabled?: boolean;
356
+ hovered?: boolean;
357
+ focused?: boolean;
358
+ }
359
+ declare function getNavLinkClasses(opts?: NavLinkRecipeOptions): string;
360
+
361
+ declare const TOAST_VARIANTS: {
362
+ readonly info: true;
363
+ readonly success: true;
364
+ readonly warning: true;
365
+ readonly danger: true;
366
+ };
367
+ type ToastVariant = keyof typeof TOAST_VARIANTS;
368
+ interface ToastRecipeOptions {
369
+ variant?: ToastVariant;
370
+ dismissed?: boolean;
371
+ fullWidth?: boolean;
372
+ }
373
+ declare function getToastClasses(opts?: ToastRecipeOptions): string;
374
+ interface ToastIconRecipeOptions {
375
+ variant?: ToastVariant;
376
+ }
377
+ declare function getToastIconClasses(opts?: ToastIconRecipeOptions): string;
378
+
379
+ declare const TOOLTIP_PLACEMENTS: {
380
+ readonly top: true;
381
+ readonly bottom: true;
382
+ readonly left: true;
383
+ readonly right: true;
384
+ };
385
+ type TooltipPlacement = keyof typeof TOOLTIP_PLACEMENTS;
386
+ interface TooltipRecipeOptions {
387
+ placement?: TooltipPlacement;
388
+ visible?: boolean;
389
+ }
390
+ declare function getTooltipClasses(opts?: TooltipRecipeOptions): string;
391
+
392
+ declare const DROPDOWN_PLACEMENTS: {
393
+ readonly 'bottom-start': true;
394
+ readonly 'bottom-end': true;
395
+ readonly 'top-start': true;
396
+ readonly 'top-end': true;
397
+ };
398
+ type DropdownPlacement = keyof typeof DROPDOWN_PLACEMENTS;
399
+ interface DropdownRecipeOptions {
400
+ fullWidth?: boolean;
401
+ }
402
+ declare function getDropdownClasses(opts?: DropdownRecipeOptions): string;
403
+ interface DropdownMenuRecipeOptions {
404
+ placement?: DropdownPlacement;
405
+ open?: boolean;
406
+ }
407
+ declare function getDropdownMenuClasses(opts?: DropdownMenuRecipeOptions): string;
408
+ interface DropdownItemRecipeOptions {
409
+ active?: boolean;
410
+ disabled?: boolean;
411
+ hovered?: boolean;
412
+ focused?: boolean;
413
+ }
414
+ declare function getDropdownItemClasses(opts?: DropdownItemRecipeOptions): string;
415
+
416
+ interface ModalOverlayRecipeOptions {
417
+ open?: boolean;
418
+ }
419
+ declare function getModalOverlayClasses(opts?: ModalOverlayRecipeOptions): string;
420
+ interface ModalRecipeOptions {
421
+ open?: boolean;
422
+ fullWidth?: boolean;
423
+ }
424
+ declare function getModalClasses(opts?: ModalRecipeOptions): string;
425
+
426
+ export { type AlertRecipeOptions, type AlertSize, type AlertVariant, type AvatarRecipeOptions, type AvatarShape, type AvatarSize, type BadgeRecipeOptions, type BadgeSize, type BadgeVariant, type ButtonRecipeOptions, type ButtonSize, type ButtonVariant, type CardRecipeOptions, type CardVariant, type DropdownItemRecipeOptions, type DropdownMenuRecipeOptions, type DropdownPlacement, type DropdownRecipeOptions, type IconBoxRecipeOptions, type IconBoxSize, type IconBoxVariant, type InputRecipeOptions, type InputSize, type InputState, type ModalOverlayRecipeOptions, type ModalRecipeOptions, type NavLinkRecipeOptions, type NavRecipeOptions, type PricingCardRecipeOptions, type RatingRecipeOptions, type RatingSize, type SpinnerRecipeOptions, type SpinnerSize, type SpinnerVariant, type TagRecipeOptions, type TagSize, type TagVariant, type TestimonialRecipeOptions, type ToastIconRecipeOptions, type ToastRecipeOptions, type ToastVariant, type TooltipPlacement, type TooltipRecipeOptions, getAlertClasses, getAvatarClasses, getBadgeClasses, getButtonClasses, getCardClasses, getDropdownClasses, getDropdownItemClasses, getDropdownMenuClasses, getIconBoxClasses, getInputClasses, getInputErrorMessageClasses, getInputHelperTextClasses, getInputLabelClasses, getInputWrapperClasses, getModalClasses, getModalOverlayClasses, getNavClasses, getNavLinkClasses, getNavLinksClasses, getPricingCardBadgeClasses, getPricingCardClasses, getPricingCardDescriptionClasses, getPricingCardPriceClasses, getPricingCardPriceContainerClasses, getRatingClasses, getRatingStarClasses, getRatingStarsClasses, getRatingTextClasses, getSpinnerClasses, getTagClasses, getTestimonialAuthorClasses, getTestimonialAuthorInfoClasses, getTestimonialAuthorNameClasses, getTestimonialAuthorTitleClasses, getTestimonialClasses, getTestimonialQuoteClasses, getToastClasses, getToastIconClasses, getTooltipClasses, spectreBaseStylesPath, spectreComponentsStylesPath, spectreIndexStylesPath, spectreStyles, spectreUtilitiesStylesPath };
package/dist/index.js CHANGED
@@ -215,9 +215,9 @@ function getInputClasses(opts = {}) {
215
215
  // Visual state only; actual disabled attribute is handled by adapters.
216
216
  (state === "disabled" || disabled) && "sp-input--disabled",
217
217
  (state === "loading" || loading) && "sp-input--loading",
218
- focused && "sp-input--focus",
219
- hovered && "sp-input--hover",
220
- active && "sp-input--active",
218
+ focused && "sp-input--focus is-focus",
219
+ hovered && "sp-input--hover is-hover",
220
+ active && "sp-input--active is-active",
221
221
  fullWidth && "sp-input--full",
222
222
  pill && "sp-input--pill"
223
223
  );
@@ -253,6 +253,7 @@ var BADGE_VARIANTS = {
253
253
  neutral: true,
254
254
  info: true,
255
255
  ghost: true,
256
+ outline: true,
256
257
  accent: true,
257
258
  cta: true
258
259
  };
@@ -294,6 +295,7 @@ function getBadgeClasses(opts = {}) {
294
295
  neutral: "sp-badge--neutral",
295
296
  info: "sp-badge--info",
296
297
  ghost: "sp-badge--ghost",
298
+ outline: "sp-badge--outline",
297
299
  accent: "sp-badge--accent",
298
300
  cta: "sp-badge--cta"
299
301
  };
@@ -329,9 +331,11 @@ var ICONBOX_VARIANTS = {
329
331
  neutral: true,
330
332
  ghost: true,
331
333
  accent: true,
332
- cta: true
334
+ cta: true,
335
+ outline: true
333
336
  };
334
337
  var ICONBOX_SIZES = {
338
+ xs: true,
335
339
  sm: true,
336
340
  md: true,
337
341
  lg: true
@@ -371,10 +375,12 @@ function getIconBoxClasses(opts = {}) {
371
375
  neutral: "sp-iconbox--neutral",
372
376
  ghost: "sp-iconbox--ghost",
373
377
  accent: "sp-iconbox--accent",
374
- cta: "sp-iconbox--cta"
378
+ cta: "sp-iconbox--cta",
379
+ outline: "sp-iconbox--outline"
375
380
  };
376
381
  const variantClass = variantMap[variant];
377
382
  const sizeMap = {
383
+ xs: "sp-iconbox--xs",
378
384
  sm: "sp-iconbox--sm",
379
385
  md: "sp-iconbox--md",
380
386
  lg: "sp-iconbox--lg"
@@ -707,22 +713,189 @@ function getTagClasses(opts = {}) {
707
713
  }
708
714
 
709
715
  // src/recipes/spinner.ts
716
+ var SPINNER_VARIANTS = {
717
+ primary: true,
718
+ secondary: true,
719
+ success: true,
720
+ warning: true,
721
+ danger: true,
722
+ info: true,
723
+ neutral: true,
724
+ accent: true,
725
+ cta: true
726
+ };
710
727
  var SPINNER_SIZES = {
711
728
  sm: true,
712
729
  md: true,
713
730
  lg: true
714
731
  };
715
732
  function getSpinnerClasses(opts = {}) {
716
- const { size: sizeInput } = opts;
733
+ const {
734
+ variant: variantInput,
735
+ size: sizeInput,
736
+ disabled = false,
737
+ loading = false
738
+ } = opts;
739
+ const variant = variantInput && resolveOption({
740
+ name: "spinner variant",
741
+ value: variantInput,
742
+ allowed: SPINNER_VARIANTS,
743
+ fallback: "primary"
744
+ });
717
745
  const size = resolveOption({
718
746
  name: "spinner size",
719
747
  value: sizeInput,
720
748
  allowed: SPINNER_SIZES,
721
749
  fallback: "md"
722
750
  });
723
- return cx("sp-spinner", `sp-spinner--${size}`);
751
+ return cx(
752
+ "sp-spinner",
753
+ variant && `sp-spinner--${variant}`,
754
+ `sp-spinner--${size}`,
755
+ disabled && "sp-spinner--disabled",
756
+ loading && "sp-spinner--loading"
757
+ );
758
+ }
759
+
760
+ // src/recipes/nav.ts
761
+ function getNavClasses(opts = {}) {
762
+ const { bordered = false, sticky = false, fullWidth = false } = opts;
763
+ return cx(
764
+ "sp-nav",
765
+ bordered && "sp-nav--bordered",
766
+ sticky && "sp-nav--sticky",
767
+ fullWidth && "sp-nav--full"
768
+ );
769
+ }
770
+ function getNavLinksClasses() {
771
+ return cx("sp-nav__links");
772
+ }
773
+ function getNavLinkClasses(opts = {}) {
774
+ const {
775
+ active = false,
776
+ disabled = false,
777
+ hovered = false,
778
+ focused = false
779
+ } = opts;
780
+ return cx(
781
+ "sp-nav__link",
782
+ active && "sp-nav__link--active",
783
+ disabled && "sp-nav__link--disabled",
784
+ hovered && "sp-nav__link--hover is-hover",
785
+ focused && "sp-nav__link--focus is-focus"
786
+ );
787
+ }
788
+
789
+ // src/recipes/toast.ts
790
+ var TOAST_VARIANTS = {
791
+ info: true,
792
+ success: true,
793
+ warning: true,
794
+ danger: true
795
+ };
796
+ function getToastClasses(opts = {}) {
797
+ const { variant: variantInput, dismissed = false, fullWidth = false } = opts;
798
+ const variant = resolveOption({
799
+ name: "toast variant",
800
+ value: variantInput,
801
+ allowed: TOAST_VARIANTS,
802
+ fallback: "info"
803
+ });
804
+ return cx(
805
+ "sp-toast",
806
+ `sp-toast--${variant}`,
807
+ dismissed && "sp-toast--dismissed",
808
+ fullWidth && "sp-toast--full"
809
+ );
810
+ }
811
+ function getToastIconClasses(opts = {}) {
812
+ const { variant: variantInput } = opts;
813
+ const variant = resolveOption({
814
+ name: "toast variant",
815
+ value: variantInput,
816
+ allowed: TOAST_VARIANTS,
817
+ fallback: "info"
818
+ });
819
+ return cx("sp-toast__icon", `sp-toast__icon--${variant}`);
820
+ }
821
+
822
+ // src/recipes/tooltip.ts
823
+ var TOOLTIP_PLACEMENTS = {
824
+ top: true,
825
+ bottom: true,
826
+ left: true,
827
+ right: true
828
+ };
829
+ function getTooltipClasses(opts = {}) {
830
+ const { placement: placementInput, visible = false } = opts;
831
+ const placement = resolveOption({
832
+ name: "tooltip placement",
833
+ value: placementInput,
834
+ allowed: TOOLTIP_PLACEMENTS,
835
+ fallback: "top"
836
+ });
837
+ return cx(
838
+ "sp-tooltip",
839
+ `sp-tooltip--${placement}`,
840
+ visible && "sp-tooltip--visible"
841
+ );
842
+ }
843
+
844
+ // src/recipes/dropdown.ts
845
+ var DROPDOWN_PLACEMENTS = {
846
+ "bottom-start": true,
847
+ "bottom-end": true,
848
+ "top-start": true,
849
+ "top-end": true
850
+ };
851
+ function getDropdownClasses(opts = {}) {
852
+ const { fullWidth = false } = opts;
853
+ return cx("sp-dropdown", fullWidth && "sp-dropdown--full");
854
+ }
855
+ function getDropdownMenuClasses(opts = {}) {
856
+ const { placement: placementInput, open = false } = opts;
857
+ const placement = resolveOption({
858
+ name: "dropdown menu placement",
859
+ value: placementInput,
860
+ allowed: DROPDOWN_PLACEMENTS,
861
+ fallback: "bottom-start"
862
+ });
863
+ return cx(
864
+ "sp-dropdown__menu",
865
+ `sp-dropdown__menu--${placement}`,
866
+ open && "sp-dropdown__menu--open"
867
+ );
868
+ }
869
+ function getDropdownItemClasses(opts = {}) {
870
+ const {
871
+ active = false,
872
+ disabled = false,
873
+ hovered = false,
874
+ focused = false
875
+ } = opts;
876
+ return cx(
877
+ "sp-dropdown__item",
878
+ active && "sp-dropdown__item--active",
879
+ disabled && "sp-dropdown__item--disabled",
880
+ hovered && "sp-dropdown__item--hover is-hover",
881
+ focused && "sp-dropdown__item--focus is-focus"
882
+ );
883
+ }
884
+
885
+ // src/recipes/modal.ts
886
+ function getModalOverlayClasses(opts = {}) {
887
+ const { open = false } = opts;
888
+ return cx("sp-modal-overlay", open && "sp-modal-overlay--open");
889
+ }
890
+ function getModalClasses(opts = {}) {
891
+ const { open = false, fullWidth = false } = opts;
892
+ return cx(
893
+ "sp-modal",
894
+ open && "sp-modal--open",
895
+ fullWidth && "sp-modal--full"
896
+ );
724
897
  }
725
898
 
726
- export { getAlertClasses, getAvatarClasses, getBadgeClasses, getButtonClasses, getCardClasses, getIconBoxClasses, getInputClasses, getInputErrorMessageClasses, getInputHelperTextClasses, getInputLabelClasses, getInputWrapperClasses, getPricingCardBadgeClasses, getPricingCardClasses, getPricingCardDescriptionClasses, getPricingCardPriceClasses, getPricingCardPriceContainerClasses, getRatingClasses, getRatingStarClasses, getRatingStarsClasses, getRatingTextClasses, getSpinnerClasses, getTagClasses, getTestimonialAuthorClasses, getTestimonialAuthorInfoClasses, getTestimonialAuthorNameClasses, getTestimonialAuthorTitleClasses, getTestimonialClasses, getTestimonialQuoteClasses, spectreBaseStylesPath, spectreComponentsStylesPath, spectreIndexStylesPath, spectreStyles, spectreUtilitiesStylesPath };
899
+ export { getAlertClasses, getAvatarClasses, getBadgeClasses, getButtonClasses, getCardClasses, getDropdownClasses, getDropdownItemClasses, getDropdownMenuClasses, getIconBoxClasses, getInputClasses, getInputErrorMessageClasses, getInputHelperTextClasses, getInputLabelClasses, getInputWrapperClasses, getModalClasses, getModalOverlayClasses, getNavClasses, getNavLinkClasses, getNavLinksClasses, getPricingCardBadgeClasses, getPricingCardClasses, getPricingCardDescriptionClasses, getPricingCardPriceClasses, getPricingCardPriceContainerClasses, getRatingClasses, getRatingStarClasses, getRatingStarsClasses, getRatingTextClasses, getSpinnerClasses, getTagClasses, getTestimonialAuthorClasses, getTestimonialAuthorInfoClasses, getTestimonialAuthorNameClasses, getTestimonialAuthorTitleClasses, getTestimonialClasses, getTestimonialQuoteClasses, getToastClasses, getToastIconClasses, getTooltipClasses, spectreBaseStylesPath, spectreComponentsStylesPath, spectreIndexStylesPath, spectreStyles, spectreUtilitiesStylesPath };
727
900
  //# sourceMappingURL=index.js.map
728
901
  //# sourceMappingURL=index.js.map