@wheelhouse/ui 0.2.2 → 0.2.3
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/blocks/columns/columns-types.d.ts +40 -0
- package/dist/blocks/columns/columns-types.d.ts.map +1 -0
- package/dist/blocks/columns/columns-types.js +10 -0
- package/dist/blocks/columns/columns-utils.d.ts +13 -0
- package/dist/blocks/columns/columns-utils.d.ts.map +1 -0
- package/dist/blocks/columns/columns-utils.js +85 -0
- package/dist/blocks/columns/columns.d.ts +3 -0
- package/dist/blocks/columns/columns.d.ts.map +1 -0
- package/dist/blocks/columns/columns.js +79 -0
- package/dist/blocks/columns/columns.stories.d.ts +12 -0
- package/dist/blocks/columns/columns.stories.d.ts.map +1 -0
- package/dist/blocks/columns/columns.stories.js +67 -0
- package/dist/blocks/columns/index.d.ts +6 -0
- package/dist/blocks/columns/index.d.ts.map +1 -0
- package/dist/blocks/columns/index.js +3 -0
- package/dist/blocks/date-selector/date-selector-context.d.ts.map +1 -0
- package/dist/blocks/date-selector/date-selector-default-i18n.d.ts +10 -0
- package/dist/blocks/date-selector/date-selector-default-i18n.d.ts.map +1 -0
- package/dist/blocks/date-selector/date-selector-default-i18n.js +29 -0
- package/dist/blocks/date-selector/date-selector-i18n-resources.d.ts +11 -0
- package/dist/blocks/date-selector/date-selector-i18n-resources.d.ts.map +1 -0
- package/dist/blocks/date-selector/date-selector-i18n-resources.js +248 -0
- package/dist/blocks/date-selector/date-selector-i18n.shared.d.ts +12 -0
- package/dist/blocks/date-selector/date-selector-i18n.shared.d.ts.map +1 -0
- package/dist/blocks/date-selector/date-selector-i18n.shared.js +84 -0
- package/dist/{components → blocks}/date-selector/date-selector-parts.d.ts +9 -0
- package/dist/blocks/date-selector/date-selector-parts.d.ts.map +1 -0
- package/dist/{components → blocks}/date-selector/date-selector-parts.js +21 -6
- package/dist/{components → blocks}/date-selector/date-selector-types.d.ts +70 -0
- package/dist/blocks/date-selector/date-selector-types.d.ts.map +1 -0
- package/dist/{components → blocks}/date-selector/date-selector-types.js +22 -0
- package/dist/blocks/date-selector/date-selector-value.d.ts +81 -0
- package/dist/blocks/date-selector/date-selector-value.d.ts.map +1 -0
- package/dist/blocks/date-selector/date-selector-value.js +423 -0
- package/dist/{components → blocks}/date-selector/date-selector.d.ts +1 -1
- package/dist/blocks/date-selector/date-selector.d.ts.map +1 -0
- package/dist/blocks/date-selector/date-selector.js +191 -0
- package/dist/{components → blocks}/date-selector/date-selector.stories.d.ts +14 -0
- package/dist/blocks/date-selector/date-selector.stories.d.ts.map +1 -0
- package/dist/blocks/date-selector/date-selector.stories.js +299 -0
- package/dist/blocks/date-selector/index.d.ts +11 -0
- package/dist/blocks/date-selector/index.d.ts.map +1 -0
- package/dist/blocks/date-selector/index.js +8 -0
- package/dist/{components → blocks}/date-selector/use-date-selector.d.ts +4 -3
- package/dist/blocks/date-selector/use-date-selector.d.ts.map +1 -0
- package/dist/{components → blocks}/date-selector/use-date-selector.js +14 -8
- package/dist/blocks/index.d.ts +4 -0
- package/dist/blocks/index.d.ts.map +1 -0
- package/dist/blocks/index.js +3 -0
- package/dist/blocks/navigation/index.d.ts +5 -0
- package/dist/blocks/navigation/index.d.ts.map +1 -0
- package/dist/blocks/navigation/index.js +2 -0
- package/dist/blocks/navigation/navigation-types.d.ts +60 -0
- package/dist/blocks/navigation/navigation-types.d.ts.map +1 -0
- package/dist/blocks/navigation/navigation-types.js +1 -0
- package/dist/blocks/navigation/navigation.d.ts +9 -0
- package/dist/blocks/navigation/navigation.d.ts.map +1 -0
- package/dist/blocks/navigation/navigation.demo.d.ts +4 -0
- package/dist/blocks/navigation/navigation.demo.d.ts.map +1 -0
- package/dist/blocks/navigation/navigation.demo.js +46 -0
- package/dist/blocks/navigation/navigation.js +98 -0
- package/dist/blocks/navigation/navigation.stories.d.ts +14 -0
- package/dist/blocks/navigation/navigation.stories.d.ts.map +1 -0
- package/dist/blocks/navigation/navigation.stories.js +16 -0
- package/dist/components/accordion/accordion.stories.js +1 -1
- package/dist/components/alert/alert.stories.js +1 -1
- package/dist/components/alert-dialog/alert-dialog.stories.js +1 -1
- package/dist/components/aspect-ratio/aspect-ratio.stories.js +1 -1
- package/dist/components/avatar/avatar.stories.js +1 -1
- package/dist/components/badge/badge.stories.js +1 -1
- package/dist/components/breadcrumb/breadcrumb.stories.js +1 -1
- package/dist/components/button/button.stories.js +1 -1
- package/dist/components/button-group/button-group.d.ts +10 -4
- package/dist/components/button-group/button-group.d.ts.map +1 -1
- package/dist/components/button-group/button-group.js +15 -3
- package/dist/components/button-group/button-group.stories.js +1 -1
- package/dist/components/button-group/index.d.ts +2 -2
- package/dist/components/button-group/index.d.ts.map +1 -1
- package/dist/components/button-group/index.js +1 -1
- package/dist/components/calendar/calendar.stories.js +1 -1
- package/dist/components/card/card.stories.js +1 -1
- package/dist/components/checkbox/checkbox.stories.js +1 -1
- package/dist/components/collapsible/collapsible.stories.js +1 -1
- package/dist/components/combobox/combobox.stories.js +1 -1
- package/dist/components/command/command.stories.js +1 -1
- package/dist/components/context-menu/context-menu.stories.js +1 -1
- package/dist/components/dialog/dialog.stories.js +1 -1
- package/dist/components/direction/direction.stories.js +1 -1
- package/dist/components/drawer/drawer.stories.js +1 -1
- package/dist/components/dropdown-menu/dropdown-menu.d.ts +9 -2
- package/dist/components/dropdown-menu/dropdown-menu.d.ts.map +1 -1
- package/dist/components/dropdown-menu/dropdown-menu.js +4 -1
- package/dist/components/dropdown-menu/dropdown-menu.stories.js +1 -1
- package/dist/components/dropdown-menu/index.d.ts +2 -2
- package/dist/components/dropdown-menu/index.d.ts.map +1 -1
- package/dist/components/dropdown-menu/index.js +1 -1
- package/dist/components/empty/empty.stories.js +1 -1
- package/dist/components/field/field.stories.js +1 -1
- package/dist/components/filters/filter-date-metric-value.d.ts +32 -0
- package/dist/components/filters/filter-date-metric-value.d.ts.map +1 -0
- package/dist/components/filters/filter-date-metric-value.js +331 -0
- package/dist/components/filters/filters-defaults.d.ts +4 -0
- package/dist/components/filters/filters-defaults.d.ts.map +1 -1
- package/dist/components/filters/filters-defaults.js +59 -1
- package/dist/components/filters/filters-i18n-resources.d.ts +277 -0
- package/dist/components/filters/filters-i18n-resources.d.ts.map +1 -0
- package/dist/components/filters/filters-i18n-resources.js +276 -0
- package/dist/components/filters/filters-i18n.shared.d.ts +16 -0
- package/dist/components/filters/filters-i18n.shared.d.ts.map +1 -0
- package/dist/components/filters/filters-i18n.shared.js +111 -0
- package/dist/components/filters/filters-types.d.ts +33 -1
- package/dist/components/filters/filters-types.d.ts.map +1 -1
- package/dist/components/filters/filters-utils.d.ts +28 -1
- package/dist/components/filters/filters-utils.d.ts.map +1 -1
- package/dist/components/filters/filters-utils.js +102 -0
- package/dist/components/filters/filters.d.ts +21 -3
- package/dist/components/filters/filters.d.ts.map +1 -1
- package/dist/components/filters/filters.js +493 -290
- package/dist/components/filters/filters.stories.d.ts +107 -2
- package/dist/components/filters/filters.stories.d.ts.map +1 -1
- package/dist/components/filters/filters.stories.js +364 -29
- package/dist/components/filters/index.d.ts +3 -1
- package/dist/components/filters/index.d.ts.map +1 -1
- package/dist/components/filters/index.js +3 -1
- package/dist/components/frame/frame.stories.js +1 -1
- package/dist/components/hover-card/hover-card.stories.js +1 -1
- package/dist/components/index.d.ts +0 -2
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +0 -2
- package/dist/components/input/input.stories.js +1 -1
- package/dist/components/input-group/input-group.stories.js +1 -1
- package/dist/components/item/item.stories.js +1 -1
- package/dist/components/kbd/kbd.stories.js +1 -1
- package/dist/components/label/label.stories.js +1 -1
- package/dist/components/menubar/menubar.stories.js +1 -1
- package/dist/components/native-select/native-select.stories.js +1 -1
- package/dist/components/navigation-menu/navigation-menu.stories.js +1 -1
- package/dist/components/pagination/pagination.stories.js +1 -1
- package/dist/components/popover/popover.stories.js +1 -1
- package/dist/components/progress/progress.stories.js +1 -1
- package/dist/components/radio-group/radio-group.stories.js +1 -1
- package/dist/components/resizable/resizable.stories.js +1 -1
- package/dist/components/scroll-area/scroll-area.stories.js +1 -1
- package/dist/components/select/select.stories.js +1 -1
- package/dist/components/separator/separator.stories.js +1 -1
- package/dist/components/sheet/sheet.stories.js +1 -1
- package/dist/components/slider/slider.stories.js +1 -1
- package/dist/components/sonner/sonner.stories.js +1 -1
- package/dist/components/sortable/sortable.stories.js +1 -1
- package/dist/components/spinner/spinner.stories.js +1 -1
- package/dist/components/status-indicator/status-indicator.stories.js +1 -1
- package/dist/components/switch/switch.stories.js +1 -1
- package/dist/components/tabs/tabs.stories.js +1 -1
- package/dist/components/text/text.stories.js +1 -1
- package/dist/components/textarea/textarea.stories.js +1 -1
- package/dist/components/toggle/toggle.stories.js +1 -1
- package/dist/components/toggle-group/toggle-group.stories.js +1 -1
- package/dist/components/tooltip/tooltip.stories.js +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/llms.txt +10 -5
- package/package.json +8 -4
- package/dist/components/date-selector/date-selector-context.d.ts.map +0 -1
- package/dist/components/date-selector/date-selector-parts.d.ts.map +0 -1
- package/dist/components/date-selector/date-selector-types.d.ts.map +0 -1
- package/dist/components/date-selector/date-selector-value.d.ts +0 -47
- package/dist/components/date-selector/date-selector-value.d.ts.map +0 -1
- package/dist/components/date-selector/date-selector-value.js +0 -183
- package/dist/components/date-selector/date-selector.d.ts.map +0 -1
- package/dist/components/date-selector/date-selector.js +0 -144
- package/dist/components/date-selector/date-selector.stories.d.ts.map +0 -1
- package/dist/components/date-selector/date-selector.stories.js +0 -144
- package/dist/components/date-selector/index.d.ts +0 -7
- package/dist/components/date-selector/index.d.ts.map +0 -1
- package/dist/components/date-selector/index.js +0 -5
- package/dist/components/date-selector/use-date-selector.d.ts.map +0 -1
- package/dist/components/navigation-pattern-1/index.d.ts +0 -3
- package/dist/components/navigation-pattern-1/index.d.ts.map +0 -1
- package/dist/components/navigation-pattern-1/index.js +0 -1
- package/dist/components/navigation-pattern-1/pattern-1.config.d.ts +0 -47
- package/dist/components/navigation-pattern-1/pattern-1.config.d.ts.map +0 -1
- package/dist/components/navigation-pattern-1/pattern-1.config.js +0 -55
- package/dist/components/navigation-pattern-1/pattern-1.d.ts +0 -7
- package/dist/components/navigation-pattern-1/pattern-1.d.ts.map +0 -1
- package/dist/components/navigation-pattern-1/pattern-1.js +0 -83
- package/dist/components/navigation-pattern-1/pattern-1.stories.d.ts +0 -16
- package/dist/components/navigation-pattern-1/pattern-1.stories.d.ts.map +0 -1
- package/dist/components/navigation-pattern-1/pattern-1.stories.js +0 -20
- /package/dist/{components → blocks}/date-selector/date-selector-context.d.ts +0 -0
- /package/dist/{components → blocks}/date-selector/date-selector-context.js +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/date-selector/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACjF,OAAO,EAAE,iCAAiC,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AACtG,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACjE,YAAY,EACR,wBAAwB,EACxB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,iBAAiB,EACjB,uBAAuB,EACvB,yBAAyB,EACzB,iBAAiB,EACjB,sBAAsB,GACzB,MAAM,uBAAuB,CAAC"}
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
export { computeRollingDateRange, formatDateValue } from './date-selector-value';
|
|
2
|
-
export { DATE_SELECTOR_ROLLING_DAY_OPTIONS, DEFAULT_DATE_SELECTOR_I18N } from './date-selector-types';
|
|
3
|
-
export { DateSelector } from './date-selector';
|
|
4
|
-
export { useDateSelector } from './use-date-selector';
|
|
5
|
-
export { useDateSelectorContext } from './date-selector-context';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-date-selector.d.ts","sourceRoot":"","sources":["../../../src/components/date-selector/use-date-selector.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAkC,MAAM,OAAO,CAAC;AAG5E,OAAO,KAAK,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAUhK;;;;;;;GAOG;AACH,wBAAgB,eAAe,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,iBAAyB,EACzB,iBAAwB,EACxB,UAAU,EACV,UAAiB,EACjB,SAAc,EACd,QAAQ,EACR,OAAO,EACP,OAAO,EACP,WAAW,EACX,WAAW,GACd,EAAE,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;0BA4PV,sBAAsB;0BAmBtB,sBAAsB;8BAjMpB,cAAc,CAAC,IAAI,GAAG,SAAS,CAAC;iCAUhC,cAAc,CAAC,IAAI,GAAG,SAAS,CAAC;+BA/BC,cAAc,CAAC,IAAI,CAAC;2BAUxB,cAAc,CAAC,IAAI,GAAG,SAAS,CAAC;;0BA4EhE,IAAI;+BA+BH,MAAM,eAAe,MAAM;6BA0C3B,MAAM;sBA2EN,MAAM,eAAe,MAAM;0BAW3B,MAAM;+BAjLN,cAAc,GAAG,cAAc,QAAQ,uBAAuB;;0CA9E5D,iBAAiB;EA2SjC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-pattern-1/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,YAAY,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { NavigationPattern1 } from './pattern-1';
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Navigation data for {@link NavigationPattern1}. Single source for desktop + mobile.
|
|
3
|
-
*/
|
|
4
|
-
export type NavBadge = {
|
|
5
|
-
label: string;
|
|
6
|
-
};
|
|
7
|
-
/** Simple top-level link (Dashboard, Performance, …). */
|
|
8
|
-
export type Pattern1PrimaryLink = {
|
|
9
|
-
kind: 'link';
|
|
10
|
-
label: string;
|
|
11
|
-
href: string;
|
|
12
|
-
/** Current / highlighted item (e.g. Dashboard). */
|
|
13
|
-
active?: boolean;
|
|
14
|
-
badge?: NavBadge;
|
|
15
|
-
};
|
|
16
|
-
/** Expandable group (Portfolio + children). */
|
|
17
|
-
export type Pattern1PrimarySubmenu = {
|
|
18
|
-
kind: 'submenu';
|
|
19
|
-
label: string;
|
|
20
|
-
items: readonly {
|
|
21
|
-
label: string;
|
|
22
|
-
href: string;
|
|
23
|
-
}[];
|
|
24
|
-
};
|
|
25
|
-
export type Pattern1PrimaryItem = Pattern1PrimaryLink | Pattern1PrimarySubmenu;
|
|
26
|
-
/** Left cluster: primary app routes. */
|
|
27
|
-
export declare const pattern1PrimaryNav: readonly Pattern1PrimaryItem[];
|
|
28
|
-
export type Pattern1SupportItem = {
|
|
29
|
-
label: string;
|
|
30
|
-
href: string;
|
|
31
|
-
};
|
|
32
|
-
/** Right cluster: Help / Support menu. */
|
|
33
|
-
export declare const pattern1SupportMenu: {
|
|
34
|
-
triggerLabel: string;
|
|
35
|
-
items: readonly Pattern1SupportItem[];
|
|
36
|
-
};
|
|
37
|
-
export type Pattern1UserLink = {
|
|
38
|
-
label: string;
|
|
39
|
-
href: string;
|
|
40
|
-
};
|
|
41
|
-
/** Right cluster: Account menu — grouped sections + log out. */
|
|
42
|
-
export declare const pattern1UserMenu: {
|
|
43
|
-
triggerLabel: string;
|
|
44
|
-
sections: readonly (readonly Pattern1UserLink[])[];
|
|
45
|
-
logOut: Pattern1UserLink;
|
|
46
|
-
};
|
|
47
|
-
//# sourceMappingURL=pattern-1.config.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"pattern-1.config.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-pattern-1/pattern-1.config.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,MAAM,MAAM,QAAQ,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAEzC,yDAAyD;AACzD,MAAM,MAAM,mBAAmB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,mDAAmD;IACnD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,QAAQ,CAAC;CACpB,CAAC;AAEF,+CAA+C;AAC/C,MAAM,MAAM,sBAAsB,GAAG;IACjC,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACrD,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,mBAAmB,GAAG,sBAAsB,CAAC;AAE/E,wCAAwC;AACxC,eAAO,MAAM,kBAAkB,EAAE,SAAS,mBAAmB,EAiB5D,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAElE,0CAA0C;AAC1C,eAAO,MAAM,mBAAmB,EAAE;IAAE,YAAY,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,SAAS,mBAAmB,EAAE,CAAA;CAO9F,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAE/D,gEAAgE;AAChE,eAAO,MAAM,gBAAgB,EAAE;IAC3B,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC,SAAS,gBAAgB,EAAE,CAAC,EAAE,CAAC;IACnD,MAAM,EAAE,gBAAgB,CAAC;CAuB5B,CAAC"}
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Navigation data for {@link NavigationPattern1}. Single source for desktop + mobile.
|
|
3
|
-
*/
|
|
4
|
-
/** Left cluster: primary app routes. */
|
|
5
|
-
export const pattern1PrimaryNav = [
|
|
6
|
-
{ kind: 'link', label: 'Dashboard', href: '/dashboard', active: true },
|
|
7
|
-
{
|
|
8
|
-
kind: 'submenu',
|
|
9
|
-
label: 'Portfolio',
|
|
10
|
-
items: [
|
|
11
|
-
{ label: 'Settings', href: '/portfolio/settings' },
|
|
12
|
-
{ label: 'Calendar', href: '/portfolio/calendar' },
|
|
13
|
-
{ label: 'Performance', href: '/portfolio/performance' },
|
|
14
|
-
{ label: 'Engine Version', href: '/portfolio/engine' },
|
|
15
|
-
],
|
|
16
|
-
},
|
|
17
|
-
{ kind: 'link', label: 'Performance', href: '/products' },
|
|
18
|
-
{ kind: 'link', label: 'Reporting', href: '/customers', badge: { label: 'Beta' } },
|
|
19
|
-
{ kind: 'link', label: 'Budgets', href: '/settings', badge: { label: 'Beta' } },
|
|
20
|
-
{ kind: 'link', label: 'Sets', href: '/settings' },
|
|
21
|
-
{ kind: 'link', label: 'Markets', href: '/settings' },
|
|
22
|
-
];
|
|
23
|
-
/** Right cluster: Help / Support menu. */
|
|
24
|
-
export const pattern1SupportMenu = {
|
|
25
|
-
triggerLabel: 'Support',
|
|
26
|
-
items: [
|
|
27
|
-
{ label: 'Live chat', href: '/support/chat' },
|
|
28
|
-
{ label: 'Help center', href: '/help' },
|
|
29
|
-
{ label: 'Changelog', href: '/changelog' },
|
|
30
|
-
],
|
|
31
|
-
};
|
|
32
|
-
/** Right cluster: Account menu — grouped sections + log out. */
|
|
33
|
-
export const pattern1UserMenu = {
|
|
34
|
-
triggerLabel: 'User',
|
|
35
|
-
sections: [
|
|
36
|
-
[
|
|
37
|
-
{ label: 'Profile', href: '/account/profile' },
|
|
38
|
-
{ label: 'Notifications', href: '/account/notifications' },
|
|
39
|
-
{ label: 'Email preferences', href: '/account/email-preferences' },
|
|
40
|
-
{ label: 'Your referrals', href: '/account/referrals' },
|
|
41
|
-
{ label: 'Teams', href: '/account/teams' },
|
|
42
|
-
],
|
|
43
|
-
[
|
|
44
|
-
{ label: 'Connected channels', href: '/connections' },
|
|
45
|
-
{ label: 'Add channel', href: '/connections/add' },
|
|
46
|
-
{ label: 'API key', href: '/account/api-key' },
|
|
47
|
-
],
|
|
48
|
-
[
|
|
49
|
-
{ label: 'Payment method', href: '/billing/payment' },
|
|
50
|
-
{ label: 'Subscriptions', href: '/billing/subscriptions' },
|
|
51
|
-
{ label: 'Invoices', href: '/billing/invoices' },
|
|
52
|
-
],
|
|
53
|
-
],
|
|
54
|
-
logOut: { label: 'Log out', href: '/logout' },
|
|
55
|
-
};
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
export type NavigationPattern1Props = React.ComponentProps<'div'>;
|
|
3
|
-
/**
|
|
4
|
-
* Responsive app header: mobile bar (menu, brand, search, upgrade) plus desktop nav with account actions.
|
|
5
|
-
*/
|
|
6
|
-
export declare function NavigationPattern1({ className, ...props }: NavigationPattern1Props): import("react/jsx-runtime").JSX.Element;
|
|
7
|
-
//# sourceMappingURL=pattern-1.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"pattern-1.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-pattern-1/pattern-1.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AA4HlE;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,2CAyLlF"}
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import { Bell, ChevronDown, Menu, Search, X } from 'lucide-react';
|
|
5
|
-
import { Avatar, AvatarFallback, AvatarImage } from '../avatar';
|
|
6
|
-
import { Badge } from '../badge';
|
|
7
|
-
import { Button } from '../button';
|
|
8
|
-
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../collapsible';
|
|
9
|
-
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from '../dropdown-menu';
|
|
10
|
-
import { Separator } from '../separator';
|
|
11
|
-
import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from '../sheet';
|
|
12
|
-
import { cn } from '../../lib/utils';
|
|
13
|
-
import { pattern1PrimaryNav, pattern1SupportMenu, pattern1UserMenu } from './pattern-1.config';
|
|
14
|
-
/** Demo user — keep in sync between desktop account menu and mobile sheet. */
|
|
15
|
-
const demoUser = {
|
|
16
|
-
name: 'shadcn',
|
|
17
|
-
email: 'm@example.com',
|
|
18
|
-
avatarSrc: 'https://github.com/shadcn.png',
|
|
19
|
-
avatarAlt: '@shadcn',
|
|
20
|
-
initials: 'CN',
|
|
21
|
-
};
|
|
22
|
-
const navLinkClass = 'rounded-md px-3 py-1 text-sm font-medium text-muted-foreground hover:bg-primary/5 outline-none focus-visible:ring-2 focus-visible:ring-ring';
|
|
23
|
-
const sheetNavLinkClass = 'flex items-center gap-2 rounded-md px-3 py-2.5 text-sm font-normal text-muted-foreground hover:bg-accent hover:text-accent-foreground';
|
|
24
|
-
function primaryNavKey(entry, index) {
|
|
25
|
-
return entry.kind === 'link' ? `link-${entry.label}-${entry.href}-${index}` : `submenu-${entry.label}`;
|
|
26
|
-
}
|
|
27
|
-
/** Wheelhouse icon mark — aligned with `marketing_site/public/svg/wh-logo-icon.svg`. */
|
|
28
|
-
function BrandLogo({ className, ...props }) {
|
|
29
|
-
return (_jsxs("svg", { viewBox: "0 0 282 196", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": true, className: cn('h-5 w-auto shrink-0', className), ...props, children: [_jsx("path", { d: "M113.84 192.61L182.63 73.4702C201.1 41.4702 178.01 1.47021 141.07 1.47021H3.4999C3.149 1.47057 2.80437 1.56325 2.50062 1.73893C2.19687 1.91462 1.94468 2.16712 1.76939 2.4711C1.5941 2.77508 1.50186 3.11983 1.50195 3.47073C1.50204 3.82163 1.59445 4.16633 1.7699 4.47021L110.38 192.61C110.556 192.913 110.808 193.165 111.112 193.34C111.415 193.515 111.76 193.607 112.11 193.607C112.46 193.607 112.805 193.515 113.108 193.34C113.412 193.165 113.664 192.913 113.84 192.61Z", fill: "#AA1DA5" }), _jsx("path", { d: "M171.33 192.61L279.93 4.5C280.106 4.19611 280.198 3.85141 280.198 3.50051C280.198 3.14961 280.106 2.80487 279.931 2.50089C279.755 2.19691 279.503 1.9444 279.2 1.76872C278.896 1.59303 278.551 1.50036 278.2 1.5H140.74C103.74 1.5 80.6402 41.5 99.1302 73.57L167.86 192.57C168.032 192.877 168.282 193.134 168.584 193.314C168.887 193.494 169.232 193.591 169.584 193.595C169.936 193.599 170.283 193.51 170.589 193.337C170.896 193.164 171.152 192.913 171.33 192.61V192.61Z", fill: "#D926D2" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M142.811 1.5H140.74C103.74 1.5 80.6402 41.5 99.1302 73.57L140.858 145.817L182.63 73.4702C200.808 41.976 178.729 2.73259 142.811 1.5Z", fill: "#71146D" })] }));
|
|
30
|
-
}
|
|
31
|
-
function MobileNavLinks({ onNavigate }) {
|
|
32
|
-
return (_jsxs("div", { className: "flex flex-col gap-0.5 p-4 pt-2", children: [pattern1PrimaryNav.map((entry, i) => {
|
|
33
|
-
if (entry.kind === 'link') {
|
|
34
|
-
return (_jsxs("a", { className: cn(sheetNavLinkClass, entry.active && 'text-primary'), href: entry.href, onClick: onNavigate, children: [entry.label, entry.badge ? _jsx(Badge, { size: "sm", children: entry.badge.label }) : null] }, primaryNavKey(entry, i)));
|
|
35
|
-
}
|
|
36
|
-
return (_jsxs(Collapsible, { className: "w-full", children: [_jsx(CollapsibleTrigger, { render: _jsxs("button", { type: "button", className: cn(sheetNavLinkClass, 'group flex w-full cursor-default justify-between font-normal text-muted-foreground hover:text-accent-foreground'), children: [_jsx("span", { children: entry.label }), _jsx(ChevronDown, { className: "size-4 shrink-0 opacity-80 transition-transform group-data-[panel-open]:rotate-180" })] }) }), _jsx(CollapsibleContent, { className: "flex flex-col gap-0.5 pt-0.5 pb-1", children: entry.items.map((sub) => (_jsx("a", { className: cn(sheetNavLinkClass, 'py-2 pl-8 text-sm'), href: sub.href, onClick: onNavigate, children: sub.label }, sub.href))) })] }, primaryNavKey(entry, i)));
|
|
37
|
-
}), _jsx(Separator, { className: "my-3" }), _jsxs("div", { className: "flex items-center gap-3 rounded-md px-3 py-2", children: [_jsxs(Avatar, { className: "size-8 border-0 after:hidden", children: [_jsx(AvatarImage, { src: demoUser.avatarSrc, alt: demoUser.avatarAlt }), _jsx(AvatarFallback, { children: demoUser.initials })] }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-sm font-medium text-foreground", children: demoUser.name }), _jsx("p", { className: "truncate text-xs text-muted-foreground", children: demoUser.email })] })] }), pattern1UserMenu.sections.map((section, si) => (_jsxs(React.Fragment, { children: [si > 0 ? _jsx(Separator, { className: "my-2" }) : null, section.map((item) => (_jsx("a", { className: sheetNavLinkClass, href: item.href, onClick: onNavigate, children: item.label }, item.href)))] }, `user-section-${si}`))), _jsx(Separator, { className: "my-2" }), _jsx("a", { className: cn(sheetNavLinkClass, 'text-destructive-foreground hover:bg-destructive/10 hover:text-destructive-foreground'), href: pattern1UserMenu.logOut.href, onClick: onNavigate, children: pattern1UserMenu.logOut.label })] }));
|
|
38
|
-
}
|
|
39
|
-
/**
|
|
40
|
-
* Responsive app header: mobile bar (menu, brand, search, upgrade) plus desktop nav with account actions.
|
|
41
|
-
*/
|
|
42
|
-
export function NavigationPattern1({ className, ...props }) {
|
|
43
|
-
const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false);
|
|
44
|
-
// #region agent log
|
|
45
|
-
const agentDbg = React.useCallback((hypothesisId, message, data) => {
|
|
46
|
-
fetch('http://127.0.0.1:7669/ingest/d1992449-3e7e-4566-9281-d4bff7e38fe9', {
|
|
47
|
-
method: 'POST',
|
|
48
|
-
headers: { 'Content-Type': 'application/json', 'X-Debug-Session-Id': '8829e4' },
|
|
49
|
-
body: JSON.stringify({
|
|
50
|
-
sessionId: '8829e4',
|
|
51
|
-
runId: 'pre-fix',
|
|
52
|
-
hypothesisId,
|
|
53
|
-
location: 'pattern-1.tsx:NavigationPattern1',
|
|
54
|
-
message,
|
|
55
|
-
data,
|
|
56
|
-
timestamp: Date.now(),
|
|
57
|
-
}),
|
|
58
|
-
}).catch(() => { });
|
|
59
|
-
}, []);
|
|
60
|
-
React.useEffect(() => {
|
|
61
|
-
const mq = typeof window !== 'undefined' ? window.matchMedia('(min-width: 1024px)') : null;
|
|
62
|
-
agentDbg('A', 'viewport-lg', {
|
|
63
|
-
innerWidth: typeof window !== 'undefined' ? window.innerWidth : null,
|
|
64
|
-
lgMatches: mq?.matches ?? null,
|
|
65
|
-
desktopNavExpectedVisible: mq?.matches ?? null,
|
|
66
|
-
});
|
|
67
|
-
const onResize = () => {
|
|
68
|
-
agentDbg('A', 'viewport-lg-resize', {
|
|
69
|
-
innerWidth: window.innerWidth,
|
|
70
|
-
lgMatches: window.matchMedia('(min-width: 1024px)').matches,
|
|
71
|
-
});
|
|
72
|
-
};
|
|
73
|
-
window.addEventListener('resize', onResize);
|
|
74
|
-
return () => window.removeEventListener('resize', onResize);
|
|
75
|
-
}, [agentDbg]);
|
|
76
|
-
// #endregion
|
|
77
|
-
return (_jsxs("div", { "data-slot": "navigation-pattern-1", className: cn(className), ...props, children: [_jsx("nav", { className: "lg:hidden", "aria-label": "Main", children: _jsxs("div", { className: "relative flex h-14 items-center justify-between border-b border-border bg-background px-4", children: [_jsxs(Button, { type: "button", variant: "ghost", className: "relative -ml-2 h-9 w-9 shrink-0 px-0 [&_svg]:size-5", "aria-expanded": mobileMenuOpen, "aria-controls": "navigation-pattern-1-mobile-sheet", "aria-label": mobileMenuOpen ? 'Close menu' : 'Open menu', onClick: () => setMobileMenuOpen((open) => !open), children: [_jsx("span", { className: cn('absolute transition-all duration-300', mobileMenuOpen ? '-rotate-90 opacity-0' : 'rotate-0 opacity-100'), "aria-hidden": true, children: _jsx(Menu, {}) }), _jsx("span", { className: cn('absolute transition-all duration-300', mobileMenuOpen ? 'rotate-0 opacity-100' : '-rotate-90 opacity-0'), "aria-hidden": true, children: _jsx(X, {}) })] }), _jsx("div", { className: "pointer-events-none absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2", children: _jsx(BrandLogo, { className: "h-6 w-auto" }) }), _jsxs("div", { className: "flex shrink-0 items-center gap-3", children: [_jsx(Button, { type: "button", variant: "ghost", className: "size-9 p-0 [&_svg]:size-5", "aria-label": "Search", children: _jsx(Search, { className: "text-muted-foreground" }) }), _jsx(Button, { type: "button", variant: "ghost", className: "size-9 p-0 [&_svg]:size-5", "aria-label": "Notifications", children: _jsx(Bell, { className: "text-muted-foreground" }) })] })] }) }), _jsx(Sheet, { open: mobileMenuOpen, onOpenChange: setMobileMenuOpen, children: _jsxs(SheetContent, { id: "navigation-pattern-1-mobile-sheet", side: "left", showCloseButton: false, className: "flex h-[100dvh] max-h-[100dvh] w-full flex-col gap-0 overflow-hidden p-0 sm:max-w-sm", children: [_jsxs(SheetHeader, { className: "shrink-0 border-b border-border text-left", children: [_jsx(SheetTitle, { children: "Menu" }), _jsx(SheetDescription, { className: "sr-only", children: "Primary navigation links for the application." })] }), _jsx("div", { className: "min-h-0 flex-1 overflow-y-auto overscroll-contain", children: _jsx(MobileNavLinks, { onNavigate: () => setMobileMenuOpen(false) }) })] }) }), _jsx("nav", { className: "hidden h-12 border-b border-border bg-background lg:block", "aria-label": "Main", children: _jsxs("div", { className: "container flex h-full items-center justify-between px-6", children: [_jsxs("div", { className: "flex items-center gap-x-3", children: [_jsx(BrandLogo, {}), _jsx("div", { className: "flex items-center gap-x-1", children: pattern1PrimaryNav.map((entry, i) => {
|
|
78
|
-
if (entry.kind === 'link') {
|
|
79
|
-
return (_jsxs("a", { className: cn(navLinkClass, entry.active && 'text-primary', entry.badge && 'inline-flex items-center gap-1'), href: entry.href, children: [entry.label, entry.badge ? (_jsx(Badge, { variant: "outline", size: "sm", children: entry.badge.label })) : null] }, primaryNavKey(entry, i)));
|
|
80
|
-
}
|
|
81
|
-
return (_jsxs(DropdownMenu, { onOpenChange: (open) => agentDbg('D', 'menu-open-change', { menu: 'portfolio', open, label: entry.label }), children: [_jsxs(DropdownMenuTrigger, { className: cn(navLinkClass, 'inline-flex cursor-default items-center gap-0 border-0 bg-transparent'), children: [entry.label, _jsx(ChevronDown, { className: "ml-1 size-4 opacity-80" })] }), _jsx(DropdownMenuContent, { align: "start", className: "min-w-48", children: entry.items.map((sub) => (_jsx(DropdownMenuItem, { children: sub.label }, sub.href))) })] }, primaryNavKey(entry, i)));
|
|
82
|
-
}) })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": "Search", children: _jsx(Search, { className: "size-4 text-muted-foreground" }) }), _jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": "Search", children: _jsx(Bell, { className: "size-4 text-muted-foreground" }) }), _jsxs(DropdownMenu, { onOpenChange: (open) => agentDbg('D', 'menu-open-change', { menu: 'support', open }), children: [_jsxs(DropdownMenuTrigger, { className: cn(navLinkClass, 'inline-flex cursor-default items-center gap-0 border-0 bg-transparent'), children: [pattern1SupportMenu.triggerLabel, _jsx(ChevronDown, { className: "ml-1 size-4 opacity-80" })] }), _jsx(DropdownMenuContent, { align: "start", className: "min-w-48", children: pattern1SupportMenu.items.map((item) => (_jsx(DropdownMenuItem, { children: item.label }, item.href))) })] }), _jsxs(DropdownMenu, { onOpenChange: (open) => agentDbg('D', 'menu-open-change', { menu: 'user', open }), children: [_jsxs(DropdownMenuTrigger, { className: cn(navLinkClass, 'inline-flex cursor-default items-center gap-0 border-0 bg-transparent'), children: [pattern1UserMenu.triggerLabel, _jsx(ChevronDown, { className: "ml-1 size-4 opacity-80" })] }), _jsxs(DropdownMenuContent, { align: "end", className: "min-w-56", children: [_jsxs(DropdownMenuLabel, { className: "font-normal", children: [_jsx("span", { className: "block text-sm font-medium", children: demoUser.name }), _jsx("span", { className: "block text-xs text-muted-foreground", children: demoUser.email })] }), _jsx(DropdownMenuSeparator, {}), pattern1UserMenu.sections.map((section, si) => (_jsxs(React.Fragment, { children: [si > 0 ? _jsx(DropdownMenuSeparator, {}) : null, section.map((item) => (_jsx(DropdownMenuItem, { children: item.label }, `${item.href}-${item.label}`)))] }, `user-dd-${si}`))), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { variant: "destructive", children: pattern1UserMenu.logOut.label })] })] })] })] }) })] }));
|
|
83
|
-
}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import type { StoryObj } from '@storybook/react';
|
|
2
|
-
import { NavigationPattern1 } from './pattern-1';
|
|
3
|
-
declare const meta: {
|
|
4
|
-
title: string;
|
|
5
|
-
component: typeof NavigationPattern1;
|
|
6
|
-
parameters: {
|
|
7
|
-
layout: string;
|
|
8
|
-
};
|
|
9
|
-
};
|
|
10
|
-
export default meta;
|
|
11
|
-
type Story = StoryObj<typeof meta>;
|
|
12
|
-
/** Wide canvas: show the desktop bar only (`hidden lg:block` → forced visible). */
|
|
13
|
-
export declare const Desktop: Story;
|
|
14
|
-
/** Wide canvas: show the mobile bar and sheet trigger (`lg:hidden` → forced visible). */
|
|
15
|
-
export declare const Mobile: Story;
|
|
16
|
-
//# sourceMappingURL=pattern-1.stories.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"pattern-1.stories.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-pattern-1/pattern-1.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,QAAA,MAAM,IAAI;;;;;;CAMiC,CAAC;AAE5C,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,mFAAmF;AACnF,eAAO,MAAM,OAAO,EAAE,KAGrB,CAAC;AAEF,yFAAyF;AACzF,eAAO,MAAM,MAAM,EAAE,KAEpB,CAAC"}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
import { NavigationPattern1 } from './pattern-1';
|
|
4
|
-
const meta = {
|
|
5
|
-
title: 'UI/Navigation pattern 1',
|
|
6
|
-
component: NavigationPattern1,
|
|
7
|
-
parameters: {
|
|
8
|
-
layout: 'padded',
|
|
9
|
-
},
|
|
10
|
-
};
|
|
11
|
-
export default meta;
|
|
12
|
-
/** Wide canvas: show the desktop bar only (`hidden lg:block` → forced visible). */
|
|
13
|
-
export const Desktop = {
|
|
14
|
-
// className="[&>nav:first-of-type]:hidden [&>nav:last-of-type]:!block"
|
|
15
|
-
render: () => _jsx(NavigationPattern1, {}),
|
|
16
|
-
};
|
|
17
|
-
/** Wide canvas: show the mobile bar and sheet trigger (`lg:hidden` → forced visible). */
|
|
18
|
-
export const Mobile = {
|
|
19
|
-
render: () => _jsx(NavigationPattern1, { className: "[&>nav:first-of-type]:!block [&>nav:last-of-type]:!hidden" }),
|
|
20
|
-
};
|
|
File without changes
|
|
File without changes
|