@sonic-equipment/ui 0.0.63 → 0.0.64

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.
@@ -0,0 +1,23 @@
1
+ import type { StoryObj } from '@storybook/react';
2
+ import { Link } from './link';
3
+ declare const meta: {
4
+ args: {
5
+ onPress: import("@vitest/spy").Mock<[e: import("react-aria").PressEvent], void>;
6
+ };
7
+ component: typeof Link;
8
+ parameters: {
9
+ layout: string;
10
+ };
11
+ tags: string[];
12
+ title: string;
13
+ };
14
+ export default meta;
15
+ type Story = StoryObj<typeof meta>;
16
+ export declare const Default: Story;
17
+ export declare const WithIcon: Story;
18
+ export declare const Underline: Story;
19
+ export declare const SecondaryStyle: Story;
20
+ export declare const SecondaryUnderlineStyle: Story;
21
+ export declare const SecondaryWithIcon: Story;
22
+ export declare const Disabled: Story;
23
+ export declare const SecondaryDisabledStyle: Story;
@@ -1,9 +1,9 @@
1
1
  import { ReactElement, ReactNode } from 'react';
2
2
  import { PressEvent } from 'react-aria-components';
3
+ import { LinkProps } from 'buttons/link/link';
3
4
  import type { ImageSource } from 'shared/model/image';
4
5
  import type { ProductPrice as ProductPriceType } from 'shared/model/price';
5
- import { AutocompleteProps } from 'shared/routing/route-link';
6
- export interface ProductCardProps extends AutocompleteProps {
6
+ export interface ProductCardProps extends LinkProps {
7
7
  addToCartButton: ReactElement;
8
8
  favoriteButton?: ReactElement;
9
9
  href: string;
@@ -3,8 +3,7 @@ interface Config {
3
3
  ALGOLIA_API_KEY: string;
4
4
  ALGOLIA_APP_ID: string;
5
5
  ALGOLIA_HOST: string;
6
- ALGOLIA_PROXY_HOST: string;
7
- PROXY_API_URL: string;
6
+ BFF_API_URL: string;
8
7
  SHOP_API_URL: string;
9
8
  }
10
9
  export declare const configPerEnvironment: Record<Environment, Config>;
@@ -4,5 +4,7 @@ export interface SearchInputProps {
4
4
  formRef: React.RefObject<HTMLFormElement>;
5
5
  inputRef: React.RefObject<HTMLInputElement>;
6
6
  onCancel?: VoidFunction;
7
+ onSubmit?: VoidFunction;
8
+ placeholder?: string;
7
9
  }
8
- export declare function SearchInput({ autocomplete, formRef, inputRef, onCancel, }: SearchInputProps): import("react/jsx-runtime").JSX.Element;
10
+ export declare function SearchInput({ autocomplete, formRef, inputRef, onCancel, onSubmit, placeholder, }: SearchInputProps): import("react/jsx-runtime").JSX.Element;
@@ -22,7 +22,7 @@ export * from './breadcrumbs/breadcrumb';
22
22
  export * from './buttons/button/button';
23
23
  export * from './buttons/favorite/favorite-button';
24
24
  export * from './buttons/icon-button/icon-button';
25
- export * from './buttons/link-button/link-button';
25
+ export * from './buttons/link/link';
26
26
  export * from './buttons/add-to-cart-button/add-to-cart-button';
27
27
  export * from './buttons/add-to-cart-button/connected-add-to-cart-button';
28
28
  export * from './cards/product-card/product-card';
@@ -1 +1 @@
1
- export type TranslationId = "'{0}' in all products" | ' to your account to manage your lists.' | 'Add to list' | 'An unexpected error occured' | 'Cancel' | 'Create new list' | 'Chosen filters' | 'Clear filters' | 'Clear' | 'Double check your spelling' | 'Excl. VAT' | 'Explore by categories' | 'Exploring our products by category' | 'Hide filters' | 'Incl. VAT' | 'List name already exists' | 'New list name' | 'Please Sign In' | 'Popular searches' | 'Products' | 'Quick access' | 'Recent searches' | 'Searching again using more general terms' | 'See all results' | 'Select a list' | 'Show all' | 'Show filters' | 'Show less' | 'Show' | 'Sorry, we could not find matches for' | 'Sort by' | 'Submit' | 'Suggestions' | 'Use fewer keywords' | 'You could try' | 'You must ' | 'article' | 'articles' | 'facet.categories' | 'facet.height' | 'facet.weight' | 'of' | 'sign in' | 'sort.newest' | 'sort.price_asc' | 'sort.price_desc' | 'sort.relevance' | 'tag.limited' | 'tag.new';
1
+ export type TranslationId = "'{0}' in all products" | ' to your account to manage your lists.' | 'Add to list' | 'An unexpected error occured' | 'Cancel' | 'Create new list' | 'Chosen filters' | 'Clear filters' | 'Clear' | 'Double check your spelling' | 'Excl. VAT' | 'Explore by categories' | 'Exploring our products by category' | 'Hide filters' | 'Incl. VAT' | 'List name already exists' | 'New list name' | 'Please Sign In' | 'Popular searches' | 'Products' | 'Quick access' | 'Recent searches' | 'Searching again using more general terms' | 'See all results' | 'Select a list' | 'Show all' | 'Show filters' | 'Show less' | 'Show' | 'Sorry, we could not find matches for' | 'Sort by' | 'Submit' | 'Suggestions' | 'Use fewer keywords' | 'You could try' | 'You must ' | 'article' | 'articles' | 'facet.categories' | 'facet.height' | 'facet.weight' | 'of' | 'sign in' | 'sort.newest' | 'sort.price_asc' | 'sort.price_desc' | 'sort.relevance' | 'tag.limited' | 'tag.new' | 'Search tools, toolsets, boxes and more';
@@ -1,7 +1,7 @@
1
1
  import { ReactNode } from 'react';
2
- import { Link } from 'breadcrumbs/breadcrumb';
2
+ import { BreadcrumbLink } from 'breadcrumbs/breadcrumb';
3
3
  export interface PageProps {
4
- breadCrumb: Link[];
4
+ breadCrumb: BreadcrumbLink[];
5
5
  children: ReactNode;
6
6
  className?: string;
7
7
  title?: string;
@@ -16,6 +16,7 @@ export interface ProductListingPageData {
16
16
  breadCrumb: Link[];
17
17
  category: Category;
18
18
  categoryPages: string;
19
+ hierarchicalCategories: string[];
19
20
  promoCards?: {
20
21
  top: PromoCard[];
21
22
  };
@@ -43,5 +43,6 @@ export interface ProductListingPageDataResponse {
43
43
  breadCrumb: BreadCrumb[];
44
44
  categories: Category;
45
45
  categoryPages: string;
46
+ hierarchicalCategories: string[];
46
47
  promoCards: PromoCards | null;
47
48
  }
@@ -1,8 +1,6 @@
1
- import { RefAttributes } from 'react';
2
- import { ButtonProps } from 'react-aria-components';
1
+ import { ButtonProps } from 'buttons/button/button';
3
2
  import { NavigateOptions } from './route-provider';
4
- interface RouteButtonProps extends ButtonProps, RefAttributes<HTMLButtonElement> {
5
- href?: string;
3
+ interface RouteButtonProps extends ButtonProps {
6
4
  route?: NavigateOptions;
7
5
  }
8
6
  export declare function RouteButton({ children, ...props }: RouteButtonProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,16 @@
1
+ import { StoryObj } from '@storybook/react';
2
+ import { RouteButton } from './route-button';
3
+ declare const meta: {
4
+ args: {
5
+ children: string;
6
+ href: string;
7
+ };
8
+ component: typeof RouteButton;
9
+ parameters: {
10
+ layout: string;
11
+ };
12
+ title: string;
13
+ };
14
+ export default meta;
15
+ type Story = StoryObj<typeof meta>;
16
+ export declare const Default: Story;
@@ -1,15 +1,6 @@
1
- import { MouseEvent, RefAttributes } from 'react';
2
- import { LinkProps } from 'react-aria-components';
1
+ import { LinkProps } from 'buttons/link/link';
3
2
  import { NavigateOptions } from './route-provider';
4
- export interface AutocompleteProps {
5
- areaSelected?: boolean;
6
- id?: string;
7
- onClick?(event: MouseEvent): void;
8
- onMouseDown?(event: MouseEvent): void;
9
- onMouseMove?(event: MouseEvent): void;
10
- role?: 'option';
11
- }
12
- interface RouteLinkProps extends LinkProps, RefAttributes<HTMLAnchorElement>, AutocompleteProps {
3
+ interface RouteLinkProps extends LinkProps {
13
4
  route?: NavigateOptions;
14
5
  }
15
6
  export declare function RouteLink({ children, onClick: _onClick, ...props }: RouteLinkProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,16 @@
1
+ import { StoryObj } from '@storybook/react';
2
+ import { RouteLink } from './route-link';
3
+ declare const meta: {
4
+ args: {
5
+ children: string;
6
+ href: string;
7
+ };
8
+ component: typeof RouteLink;
9
+ parameters: {
10
+ layout: string;
11
+ };
12
+ title: string;
13
+ };
14
+ export default meta;
15
+ type Story = StoryObj<typeof meta>;
16
+ export declare const Default: Story;
package/dist/styles.css CHANGED
@@ -218,71 +218,61 @@
218
218
  --modal-layer: 300;
219
219
  }
220
220
 
221
- /* stylelint-disable max-nesting-depth */
222
- .breadcrumb-module-CQGse {
223
- display: flex;
224
- flex-wrap: wrap;
221
+ .link-module-xLqBn {
222
+ all: unset;
223
+ position: relative;
224
+ display: inline-flex;
225
225
  align-items: center;
226
- padding: 0;
227
- margin: 0;
228
- list-style: none;
226
+ cursor: pointer;
227
+ font: inherit;
228
+ gap: var(--space-4);
229
229
  }
230
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY {
231
- display: flex;
232
- align-items: center;
230
+
231
+ .link-module-xLqBn > svg {
232
+ display: block;
233
+ width: 12px;
234
+ height: 12px;
233
235
  }
234
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 {
235
- display: inline-block;
236
- color: var(--color-brand-dark-gray);
237
- cursor: pointer;
238
- text-decoration: none;
236
+
237
+ .link-module-xLqBn:where(.link-module-bGD6u) {
238
+ color: var(--color-black);
239
+ }
240
+
241
+ .link-module-xLqBn:where(.link-module-bGD6u)[data-pressed],
242
+ .link-module-xLqBn:where(.link-module-bGD6u)[data-hovered] {
243
+ color: var(--color-brand-red);
239
244
  }
240
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 .breadcrumb-module-uIn3w {
241
- display: inline-block;
242
- width: 14px;
243
- height: 14px;
244
- }
245
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 .breadcrumb-module-uIn3w.breadcrumb-module-K-wMJ {
246
- display: none;
247
- }
248
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6:focus-visible {
249
- box-shadow: var(--shadow-focus-outline);
250
- outline: none;
251
- }
252
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6[aria-disabled] {
253
- cursor: default;
254
- }
255
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6:not([aria-disabled]):hover {
256
- color: var(--color-brand-red);
257
- }
258
- /* stylelint-disable-next-line no-descending-specificity */
259
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY:last-of-type .breadcrumb-module-fp2Q6 {
260
- font-weight: var(--font-weight-bold);
245
+
246
+ .link-module-xLqBn:where(.link-module-bGD6u)[data-pressed]::after, .link-module-xLqBn:where(.link-module-bGD6u)[data-hovered]::after {
247
+ background-color: var(--color-brand-red);
261
248
  }
262
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY:not(:last-of-type)::after {
263
- color: var(--color-brand-medium-gray);
264
- content: '/';
265
- margin-inline: 10px;
249
+
250
+ .link-module-xLqBn:where(.link-module-v31wH) {
251
+ color: var(--color-brand-red);
252
+ }
253
+
254
+ .link-module-xLqBn:where(.link-module-v31wH)[data-pressed],
255
+ .link-module-xLqBn:where(.link-module-v31wH)[data-hovered] {
256
+ color: var(--color-brand-dark-red);
266
257
  }
267
- @media (width < 768px) {
268
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY::after {
269
- display: none;
270
- }
271
258
 
272
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 {
273
- display: flex;
274
- align-items: center;
275
- font-size: var(--font-size-14);
276
- gap: 6px;
259
+ .link-module-xLqBn:where(.link-module-v31wH)[data-pressed]::after, .link-module-xLqBn:where(.link-module-v31wH)[data-hovered]::after {
260
+ background-color: var(--color-brand-dark-red);
277
261
  }
278
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 .breadcrumb-module-uIn3w.breadcrumb-module-K-wMJ {
279
- display: inline-block;
280
- }
281
- .breadcrumb-module-CQGse .breadcrumb-module-hxhDY:last-of-type .breadcrumb-module-fp2Q6 {
282
- font-weight: var(--font-weight-normal);
283
- }
262
+
263
+ .link-module-xLqBn:where([data-disabled]) {
264
+ cursor: default;
265
+ opacity: 0.4;
266
+ }
267
+
268
+ .link-module-xLqBn:where(.link-module-UuCEp) {
269
+ text-decoration: underline;
284
270
  }
285
271
 
272
+ .link-module-xLqBn:where(.link-module-UuCEp)::after {
273
+ display: none;
274
+ }
275
+
286
276
  .button-module-V4meK {
287
277
  all: unset;
288
278
  display: inline-flex;
@@ -424,6 +414,71 @@
424
414
  color: var(--color-red-300);
425
415
  }
426
416
 
417
+ /* stylelint-disable max-nesting-depth */
418
+ .breadcrumb-module-CQGse {
419
+ display: flex;
420
+ flex-wrap: wrap;
421
+ align-items: center;
422
+ padding: 0;
423
+ margin: 0;
424
+ list-style: none;
425
+ }
426
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY {
427
+ display: flex;
428
+ align-items: center;
429
+ }
430
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 {
431
+ display: inline-block;
432
+ color: var(--color-brand-dark-gray);
433
+ }
434
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 .breadcrumb-module-uIn3w {
435
+ display: inline-block;
436
+ width: 14px;
437
+ height: 14px;
438
+ }
439
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 .breadcrumb-module-uIn3w.breadcrumb-module-K-wMJ {
440
+ display: none;
441
+ }
442
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6:focus-visible {
443
+ box-shadow: var(--shadow-focus-outline);
444
+ outline: none;
445
+ }
446
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6[aria-disabled] {
447
+ cursor: default;
448
+ }
449
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6:not([aria-disabled]):hover {
450
+ color: var(--color-brand-red);
451
+ }
452
+ /* stylelint-disable-next-line no-descending-specificity */
453
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY:last-of-type .breadcrumb-module-fp2Q6 {
454
+ color: var(--color-brand-dark-gray);
455
+ font-weight: var(--font-weight-bold);
456
+ opacity: 1;
457
+ }
458
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY:not(:last-of-type)::after {
459
+ color: var(--color-brand-medium-gray);
460
+ content: '/';
461
+ margin-inline: 10px;
462
+ }
463
+ @media (width < 768px) {
464
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY::after {
465
+ display: none;
466
+ }
467
+
468
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 {
469
+ display: flex;
470
+ align-items: center;
471
+ font-size: var(--font-size-14);
472
+ gap: 6px;
473
+ }
474
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6 .breadcrumb-module-uIn3w.breadcrumb-module-K-wMJ {
475
+ display: inline-block;
476
+ }
477
+ .breadcrumb-module-CQGse .breadcrumb-module-hxhDY:last-of-type .breadcrumb-module-fp2Q6 {
478
+ font-weight: var(--font-weight-normal);
479
+ }
480
+ }
481
+
427
482
  .icon-button-module-4PDK- {
428
483
  all: unset;
429
484
  display: flex;
@@ -511,70 +566,6 @@
511
566
  }
512
567
  }
513
568
 
514
- .link-button-module-6i75g {
515
- all: unset;
516
- position: relative;
517
- display: inline-flex;
518
- align-items: center;
519
- cursor: pointer;
520
- font: inherit;
521
- gap: var(--space-4);
522
- }
523
-
524
- .link-button-module-6i75g svg {
525
- display: block;
526
- width: 12px;
527
- height: 12px;
528
- }
529
-
530
- .link-button-module-6i75g:where(.link-button-module-DRTd0) {
531
- color: var(--color-brand-red);
532
- }
533
-
534
- .link-button-module-6i75g:where(.link-button-module-DRTd0):where([data-pressed]),
535
- .link-button-module-6i75g:where(.link-button-module-DRTd0):where([data-hovered]) {
536
- color: var(--color-brand-dark-red);
537
- }
538
-
539
- .link-button-module-6i75g:where(.link-button-module-DRTd0):where([data-pressed])::after, .link-button-module-6i75g:where(.link-button-module-DRTd0):where([data-hovered])::after {
540
- background-color: var(--color-brand-dark-red);
541
- }
542
-
543
- .link-button-module-6i75g:where(.link-button-module-HEqnO) {
544
- color: var(--color-black);
545
- }
546
-
547
- .link-button-module-6i75g:where(.link-button-module-HEqnO)[data-pressed],
548
- .link-button-module-6i75g:where(.link-button-module-HEqnO)[data-hovered] {
549
- color: var(--color-brand-dark-red);
550
- }
551
-
552
- .link-button-module-6i75g:where(.link-button-module-HEqnO)[data-pressed]::after, .link-button-module-6i75g:where(.link-button-module-HEqnO)[data-hovered]::after {
553
- background-color: var(--color-brand-dark-red);
554
- }
555
-
556
- .link-button-module-6i75g:where([data-disabled]) {
557
- cursor: default;
558
- opacity: 0.4;
559
- }
560
-
561
- .link-button-module-6i75g:where([data-pressed])::after, .link-button-module-6i75g:where([data-hovered])::after {
562
- position: absolute;
563
- bottom: 0;
564
- left: 0;
565
- width: 100%;
566
- height: 1px;
567
- content: '';
568
- }
569
-
570
- .link-button-module-6i75g:where(.link-button-module-Xc-3N) {
571
- text-decoration: underline;
572
- }
573
-
574
- .link-button-module-6i75g:where(.link-button-module-Xc-3N)::after {
575
- display: none;
576
- }
577
-
578
569
  .field-error-module-FXnIg {
579
570
  color: var(--color-brand-red);
580
571
  }
@@ -997,6 +988,7 @@
997
988
  @media (hover: hover) {
998
989
  .product-card-module-pLaiB:hover {
999
990
  box-shadow: var(--box-shadow);
991
+ color: var(--color-black);
1000
992
  scale: 1.04;
1001
993
  }
1002
994
  }
@@ -1033,7 +1025,7 @@
1033
1025
  }
1034
1026
 
1035
1027
  /**
1036
- * Swiper 11.1.10
1028
+ * Swiper 11.1.11
1037
1029
  * Most modern mobile touch slider and framework with hardware accelerated transitions
1038
1030
  * https://swiperjs.com
1039
1031
  *
@@ -1041,7 +1033,7 @@
1041
1033
  *
1042
1034
  * Released under the MIT License
1043
1035
  *
1044
- * Released on: August 21, 2024
1036
+ * Released on: August 28, 2024
1045
1037
  */
1046
1038
 
1047
1039
  /* FONT_START */
@@ -2192,19 +2184,17 @@
2192
2184
  }
2193
2185
 
2194
2186
  .algolia-filter-panel-module-GfhOO .algolia-filter-panel-module-LKet3 {
2195
- all: unset;
2196
2187
  display: inline-block;
2197
- color: var(--color-black);
2198
2188
  cursor: pointer;
2199
2189
  font: inherit;
2200
2190
  font-size: var(--font-size-14);
2201
2191
  -webkit-tap-highlight-color: transparent;
2202
- text-decoration: underline;
2203
2192
  }
2204
2193
 
2205
2194
  .algolia-filter-panel-module-GfhOO .algolia-filter-panel-module-LKet3.algolia-filter-panel-module-yf8kI {
2206
2195
  cursor: default;
2207
2196
  font-weight: var(--font-weight-bold);
2197
+ opacity: 1;
2208
2198
  text-decoration: none;
2209
2199
  }
2210
2200
 
@@ -2384,7 +2374,6 @@
2384
2374
 
2385
2375
  .category-card-module-4NUjH .category-card-module-LEhh3 span {
2386
2376
  display: block;
2387
- color: var(--color-brand-black);
2388
2377
  font-size: var(--font-size-12);
2389
2378
  font-style: italic;
2390
2379
  font-weight: var(--font-weight-bold);
@@ -2830,7 +2819,7 @@
2830
2819
  .search-input-module-xCCzd .search-input-module-okP8k .search-input-module-vKCm4 {
2831
2820
  position: absolute;
2832
2821
  top: 50%;
2833
- left: var(--space-32);
2822
+ left: var(--space-16);
2834
2823
  display: flex;
2835
2824
  -webkit-tap-highlight-color: transparent;
2836
2825
  transform: translateY(-50%);
@@ -2865,6 +2854,20 @@
2865
2854
  appearance: none;
2866
2855
  }
2867
2856
 
2857
+ .search-input-module-xCCzd .search-input-module-okP8k .search-input-module-bELFK::-moz-placeholder {
2858
+ color: var(--color-brand-dark-gray);
2859
+ }
2860
+
2861
+ .search-input-module-xCCzd .search-input-module-okP8k .search-input-module-bELFK::placeholder {
2862
+ color: var(--color-brand-dark-gray);
2863
+ }
2864
+
2865
+ @media (width >= 768px) {
2866
+ .search-input-module-xCCzd .search-input-module-okP8k .search-input-module-vKCm4 {
2867
+ left: var(--space-24);
2868
+ }
2869
+ }
2870
+
2868
2871
  .categories-grid-module-C751R {
2869
2872
  --amount-of-columns: 2;
2870
2873
  --border: 1px solid var(--color-brand-light-gray);
@@ -2975,11 +2978,14 @@
2975
2978
  .search-content-module-w-ORq {
2976
2979
  display: flex;
2977
2980
  flex-wrap: wrap;
2978
- padding-bottom: var(--padding-block);
2979
2981
  gap: var(--space-16);
2980
2982
  padding-inline: var(--padding-inline);
2981
2983
  }
2982
2984
 
2985
+ .search-content-module-w-ORq:not(:empty) {
2986
+ padding-bottom: var(--padding-block);
2987
+ }
2988
+
2983
2989
  @media (width < 768px) {
2984
2990
  .search-content-module-w-ORq .search-content-module-bO1Q0 {
2985
2991
  width: 100%;
@@ -3003,6 +3009,7 @@
3003
3009
  margin-bottom: var(--space-24);
3004
3010
  font-size: var(--font-size-24);
3005
3011
  font-weight: var(--font-weight-medium);
3012
+ word-break: break-word;
3006
3013
  }
3007
3014
 
3008
3015
  .search-content-module-H-FX2 .search-content-module-mhiBZ {
@@ -3021,6 +3028,10 @@
3021
3028
  }
3022
3029
 
3023
3030
  @media (width >= 768px) {
3031
+ .search-content-module-ZMwlB {
3032
+ padding-left: var(--space-8);
3033
+ }
3034
+
3024
3035
  .search-content-module-KIok6 {
3025
3036
  gap: 0;
3026
3037
  grid-template-columns: 388px 1fr;
@@ -3067,12 +3078,17 @@
3067
3078
  display: block;
3068
3079
  width: 20px;
3069
3080
  height: 20px;
3081
+ flex-shrink: 0;
3070
3082
  color: currentcolor;
3071
3083
  }
3072
3084
 
3073
3085
  .search-list-item-module-WXp77 .search-list-item-module-CPrhz .search-list-item-module--5uqN {
3074
- display: flex;
3075
- align-items: center;
3086
+ display: -webkit-box;
3087
+ overflow: hidden;
3088
+ -webkit-box-orient: vertical;
3089
+ -webkit-line-clamp: 1;
3090
+ line-clamp: 1;
3091
+ word-break: break-word;
3076
3092
  }
3077
3093
 
3078
3094
  .search-list-item-module-WXp77 .search-list-item-module-CPrhz .search-list-item-module--5uqN mark {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sonic-equipment/ui",
3
- "version": "0.0.63",
3
+ "version": "0.0.64",
4
4
  "type": "module",
5
5
  "license": "MIT",
6
6
  "engines": {
@@ -1,15 +0,0 @@
1
- import type { HTMLAttributeAnchorTarget } from 'react';
2
- import { NavigateOptions } from 'shared/routing/route-provider';
3
- export interface LinkButtonProps {
4
- children?: React.ReactNode | string;
5
- className?: string;
6
- color?: 'primary' | 'secondary';
7
- hasUnderline?: boolean;
8
- href?: string;
9
- isDisabled?: boolean;
10
- onPress?: VoidFunction;
11
- route?: NavigateOptions;
12
- target?: HTMLAttributeAnchorTarget;
13
- type?: 'button' | 'link';
14
- }
15
- export declare function LinkButton({ children, className, href, isDisabled, onPress, route, hasUnderline, target, color, type, }: LinkButtonProps): import("react/jsx-runtime").JSX.Element;
@@ -1,19 +0,0 @@
1
- import type { StoryObj } from '@storybook/react';
2
- import { LinkButton } from './link-button';
3
- declare const meta: {
4
- args: {
5
- onPress: import("@vitest/spy").Mock<[], void>;
6
- };
7
- component: typeof LinkButton;
8
- parameters: {
9
- layout: string;
10
- };
11
- tags: string[];
12
- title: string;
13
- };
14
- export default meta;
15
- type Story = StoryObj<typeof meta>;
16
- export declare const Default: Story;
17
- export declare const WithIcon: Story;
18
- export declare const AsButton: Story;
19
- export declare const Disabled: Story;
@@ -1,16 +0,0 @@
1
- import { ComponentProps } from 'react';
2
- import { StoryObj } from '@storybook/react';
3
- import { RouteProvider } from './route-provider';
4
- declare const meta: {
5
- args: {};
6
- component: typeof RouteProvider;
7
- parameters: {
8
- layout: string;
9
- };
10
- tags: string[];
11
- title: string;
12
- };
13
- export default meta;
14
- type StoryProps = ComponentProps<typeof RouteProvider>;
15
- type Story = StoryObj<StoryProps>;
16
- export declare const Default: Story;