@navette-js/panels 0.0.0-stage → 1.0.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (207) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +8 -2
  3. package/THIRD-PARTY-NOTICES.md +12 -0
  4. package/dist/FILAMENT-LICENSE.md +21 -0
  5. package/dist/filament/css/filament/filament/app.css +2 -0
  6. package/dist/filament/fonts/INTER-LICENSE.txt +92 -0
  7. package/dist/filament/fonts/filament/filament/inter/index.css +1 -0
  8. package/dist/filament/fonts/filament/filament/inter/inter-cyrillic-ext-wght-normal-SP7Z6XGK.woff2 +0 -0
  9. package/dist/filament/fonts/filament/filament/inter/inter-cyrillic-wght-normal-DR6K5BQD.woff2 +0 -0
  10. package/dist/filament/fonts/filament/filament/inter/inter-greek-ext-wght-normal-A2J6H3EX.woff2 +0 -0
  11. package/dist/filament/fonts/filament/filament/inter/inter-greek-wght-normal-ZABHMKQG.woff2 +0 -0
  12. package/dist/filament/fonts/filament/filament/inter/inter-latin-ext-wght-normal-ZIT2UBIY.woff2 +0 -0
  13. package/dist/filament/fonts/filament/filament/inter/inter-latin-wght-normal-DIHYUR35.woff2 +0 -0
  14. package/dist/filament/fonts/filament/filament/inter/inter-vietnamese-wght-normal-VWEHJHBA.woff2 +0 -0
  15. package/dist/filament/js/filament/actions/actions.js +1 -0
  16. package/dist/filament/js/filament/filament/app.js +1 -0
  17. package/dist/filament/js/filament/filament/echo.js +13 -0
  18. package/dist/filament/js/filament/forms/components/builder.js +1 -0
  19. package/dist/filament/js/filament/forms/components/checkbox-list.js +1 -0
  20. package/dist/filament/js/filament/forms/components/code-editor.js +38 -0
  21. package/dist/filament/js/filament/forms/components/color-picker.js +1 -0
  22. package/dist/filament/js/filament/forms/components/date-time-picker.js +1 -0
  23. package/dist/filament/js/filament/forms/components/file-upload.js +116 -0
  24. package/dist/filament/js/filament/forms/components/js-field.js +1 -0
  25. package/dist/filament/js/filament/forms/components/key-value.js +1 -0
  26. package/dist/filament/js/filament/forms/components/markdown-editor.js +51 -0
  27. package/dist/filament/js/filament/forms/components/repeater.js +1 -0
  28. package/dist/filament/js/filament/forms/components/rich-editor.js +161 -0
  29. package/dist/filament/js/filament/forms/components/select.js +11 -0
  30. package/dist/filament/js/filament/forms/components/slider.js +1 -0
  31. package/dist/filament/js/filament/forms/components/tags-input.js +1 -0
  32. package/dist/filament/js/filament/forms/components/text-input/password-reveal.js +1 -0
  33. package/dist/filament/js/filament/forms/components/textarea.js +1 -0
  34. package/dist/filament/js/filament/forms/components/toggle-buttons.js +1 -0
  35. package/dist/filament/js/filament/notifications/notifications.js +1 -0
  36. package/dist/filament/js/filament/schemas/components/actions.js +1 -0
  37. package/dist/filament/js/filament/schemas/components/js-component.js +1 -0
  38. package/dist/filament/js/filament/schemas/components/tabs.js +1 -0
  39. package/dist/filament/js/filament/schemas/components/wizard.js +1 -0
  40. package/dist/filament/js/filament/schemas/schemas.js +1 -0
  41. package/dist/filament/js/filament/support/support.js +46 -0
  42. package/dist/filament/js/filament/tables/components/columns/checkbox.js +1 -0
  43. package/dist/filament/js/filament/tables/components/columns/select.js +11 -0
  44. package/dist/filament/js/filament/tables/components/columns/text-input.js +1 -0
  45. package/dist/filament/js/filament/tables/components/columns/toggle.js +1 -0
  46. package/dist/filament/js/filament/tables/tables.js +1 -0
  47. package/dist/filament/js/filament/widgets/components/chart.js +31 -0
  48. package/dist/filament/js/filament/widgets/components/js-widget.js +1 -0
  49. package/dist/filament/js/filament/widgets/components/stats-overview/stat/chart.js +20 -0
  50. package/dist/navette/navette/calendar.css +108 -0
  51. package/dist/navette/navette/motion.css +101 -0
  52. package/dist/navette/navette/motion.js +49 -0
  53. package/lib/auth.d.ts +61 -0
  54. package/lib/auth.js +140 -0
  55. package/lib/calendar.d.ts +82 -0
  56. package/lib/calendar.js +107 -0
  57. package/lib/index.d.ts +1624 -0
  58. package/lib/index.js +3532 -0
  59. package/lib/notifications.d.ts +76 -0
  60. package/lib/notifications.js +112 -0
  61. package/lib/topbar.d.ts +90 -0
  62. package/lib/topbar.js +240 -0
  63. package/package.json +58 -4
  64. package/resources/filament/LICENSE.md +21 -0
  65. package/resources/filament/README.md +2 -0
  66. package/resources/filament/packages/actions/resources/css/actions.css +30 -0
  67. package/resources/filament/packages/actions/resources/css/index.css +1 -0
  68. package/resources/filament/packages/forms/dist/index.css +1 -0
  69. package/resources/filament/packages/forms/resources/css/components/builder.css +206 -0
  70. package/resources/filament/packages/forms/resources/css/components/checkbox-list.css +55 -0
  71. package/resources/filament/packages/forms/resources/css/components/code-editor.css +79 -0
  72. package/resources/filament/packages/forms/resources/css/components/color-picker.css +17 -0
  73. package/resources/filament/packages/forms/resources/css/components/date-time-picker.css +127 -0
  74. package/resources/filament/packages/forms/resources/css/components/field.css +88 -0
  75. package/resources/filament/packages/forms/resources/css/components/file-upload/filepond-plugin-media-preview.css +104 -0
  76. package/resources/filament/packages/forms/resources/css/components/file-upload.css +199 -0
  77. package/resources/filament/packages/forms/resources/css/components/key-value.css +57 -0
  78. package/resources/filament/packages/forms/resources/css/components/markdown-editor.css +343 -0
  79. package/resources/filament/packages/forms/resources/css/components/modal-table-select.css +17 -0
  80. package/resources/filament/packages/forms/resources/css/components/radio.css +41 -0
  81. package/resources/filament/packages/forms/resources/css/components/repeater.css +401 -0
  82. package/resources/filament/packages/forms/resources/css/components/rich-editor.css +666 -0
  83. package/resources/filament/packages/forms/resources/css/components/select.css +13 -0
  84. package/resources/filament/packages/forms/resources/css/components/slider.css +54 -0
  85. package/resources/filament/packages/forms/resources/css/components/tags-input.css +33 -0
  86. package/resources/filament/packages/forms/resources/css/components/text-input.css +20 -0
  87. package/resources/filament/packages/forms/resources/css/components/textarea.css +26 -0
  88. package/resources/filament/packages/forms/resources/css/components/toggle-buttons.css +49 -0
  89. package/resources/filament/packages/forms/resources/css/index.css +32 -0
  90. package/resources/filament/packages/infolists/resources/css/components/code.css +21 -0
  91. package/resources/filament/packages/infolists/resources/css/components/color.css +34 -0
  92. package/resources/filament/packages/infolists/resources/css/components/entry.css +68 -0
  93. package/resources/filament/packages/infolists/resources/css/components/icon.css +39 -0
  94. package/resources/filament/packages/infolists/resources/css/components/image.css +161 -0
  95. package/resources/filament/packages/infolists/resources/css/components/key-value.css +24 -0
  96. package/resources/filament/packages/infolists/resources/css/components/repeatable.css +136 -0
  97. package/resources/filament/packages/infolists/resources/css/components/text.css +234 -0
  98. package/resources/filament/packages/infolists/resources/css/index.css +14 -0
  99. package/resources/filament/packages/notifications/resources/css/database-notifications.css +56 -0
  100. package/resources/filament/packages/notifications/resources/css/index.css +3 -0
  101. package/resources/filament/packages/notifications/resources/css/notification.css +109 -0
  102. package/resources/filament/packages/notifications/resources/css/notifications.css +29 -0
  103. package/resources/filament/packages/panels/resources/css/base.css +13 -0
  104. package/resources/filament/packages/panels/resources/css/components/global-search.css +93 -0
  105. package/resources/filament/packages/panels/resources/css/components/header.css +56 -0
  106. package/resources/filament/packages/panels/resources/css/components/layout.css +182 -0
  107. package/resources/filament/packages/panels/resources/css/components/logo.css +11 -0
  108. package/resources/filament/packages/panels/resources/css/components/page.css +60 -0
  109. package/resources/filament/packages/panels/resources/css/components/sidebar.css +311 -0
  110. package/resources/filament/packages/panels/resources/css/components/tenant-menu.css +49 -0
  111. package/resources/filament/packages/panels/resources/css/components/theme-switcher.css +15 -0
  112. package/resources/filament/packages/panels/resources/css/components/topbar.css +89 -0
  113. package/resources/filament/packages/panels/resources/css/components/user-menu.css +46 -0
  114. package/resources/filament/packages/panels/resources/css/index.css +40 -0
  115. package/resources/filament/packages/panels/resources/css/theme.css +2 -0
  116. package/resources/filament/packages/panels/resources/css/utilities.css +3 -0
  117. package/resources/filament/packages/panels/resources/css/widgets/account-widget.css +21 -0
  118. package/resources/filament/packages/panels/resources/css/widgets/filament-info-widget.css +21 -0
  119. package/resources/filament/packages/schemas/resources/css/components/actions.css +29 -0
  120. package/resources/filament/packages/schemas/resources/css/components/flex.css +106 -0
  121. package/resources/filament/packages/schemas/resources/css/components/form.css +7 -0
  122. package/resources/filament/packages/schemas/resources/css/components/fused-group.css +337 -0
  123. package/resources/filament/packages/schemas/resources/css/components/icon.css +11 -0
  124. package/resources/filament/packages/schemas/resources/css/components/image.css +12 -0
  125. package/resources/filament/packages/schemas/resources/css/components/section.css +24 -0
  126. package/resources/filament/packages/schemas/resources/css/components/tabs.css +77 -0
  127. package/resources/filament/packages/schemas/resources/css/components/text.css +77 -0
  128. package/resources/filament/packages/schemas/resources/css/components/unordered-list.css +15 -0
  129. package/resources/filament/packages/schemas/resources/css/components/wizard.css +177 -0
  130. package/resources/filament/packages/schemas/resources/css/index.css +12 -0
  131. package/resources/filament/packages/schemas/resources/css/schema.css +132 -0
  132. package/resources/filament/packages/support/dist/index.css +1 -0
  133. package/resources/filament/packages/support/resources/css/base.css +23 -0
  134. package/resources/filament/packages/support/resources/css/components/avatar.css +15 -0
  135. package/resources/filament/packages/support/resources/css/components/badge.css +90 -0
  136. package/resources/filament/packages/support/resources/css/components/breadcrumbs.css +25 -0
  137. package/resources/filament/packages/support/resources/css/components/button.css +214 -0
  138. package/resources/filament/packages/support/resources/css/components/callout.css +57 -0
  139. package/resources/filament/packages/support/resources/css/components/dropdown/header.css +21 -0
  140. package/resources/filament/packages/support/resources/css/components/dropdown/index.css +79 -0
  141. package/resources/filament/packages/support/resources/css/components/dropdown/list/index.css +7 -0
  142. package/resources/filament/packages/support/resources/css/components/dropdown/list/item.css +74 -0
  143. package/resources/filament/packages/support/resources/css/components/empty-state.css +67 -0
  144. package/resources/filament/packages/support/resources/css/components/fieldset.css +23 -0
  145. package/resources/filament/packages/support/resources/css/components/grid.css +511 -0
  146. package/resources/filament/packages/support/resources/css/components/icon-button.css +124 -0
  147. package/resources/filament/packages/support/resources/css/components/icon.css +31 -0
  148. package/resources/filament/packages/support/resources/css/components/input/checkbox.css +32 -0
  149. package/resources/filament/packages/support/resources/css/components/input/index.css +55 -0
  150. package/resources/filament/packages/support/resources/css/components/input/one-time-code.css +7 -0
  151. package/resources/filament/packages/support/resources/css/components/input/radio.css +11 -0
  152. package/resources/filament/packages/support/resources/css/components/input/select.css +154 -0
  153. package/resources/filament/packages/support/resources/css/components/input/wrapper.css +107 -0
  154. package/resources/filament/packages/support/resources/css/components/link.css +90 -0
  155. package/resources/filament/packages/support/resources/css/components/loading-indicator.css +3 -0
  156. package/resources/filament/packages/support/resources/css/components/loading-section.css +3 -0
  157. package/resources/filament/packages/support/resources/css/components/modal.css +494 -0
  158. package/resources/filament/packages/support/resources/css/components/pagination.css +160 -0
  159. package/resources/filament/packages/support/resources/css/components/section.css +234 -0
  160. package/resources/filament/packages/support/resources/css/components/tabs.css +70 -0
  161. package/resources/filament/packages/support/resources/css/components/toggle.css +60 -0
  162. package/resources/filament/packages/support/resources/css/components/tooltip.css +36 -0
  163. package/resources/filament/packages/support/resources/css/index.css +133 -0
  164. package/resources/filament/packages/support/resources/css/sortable.css +3 -0
  165. package/resources/filament/packages/support/resources/css/utilities.css +897 -0
  166. package/resources/filament/packages/tables/resources/css/actions.css +51 -0
  167. package/resources/filament/packages/tables/resources/css/cell.css +139 -0
  168. package/resources/filament/packages/tables/resources/css/column-manager.css +48 -0
  169. package/resources/filament/packages/tables/resources/css/columns/checkbox.css +54 -0
  170. package/resources/filament/packages/tables/resources/css/columns/color.css +76 -0
  171. package/resources/filament/packages/tables/resources/css/columns/icon.css +81 -0
  172. package/resources/filament/packages/tables/resources/css/columns/image.css +207 -0
  173. package/resources/filament/packages/tables/resources/css/columns/layout/grid.css +49 -0
  174. package/resources/filament/packages/tables/resources/css/columns/layout/panel.css +3 -0
  175. package/resources/filament/packages/tables/resources/css/columns/layout/split.css +35 -0
  176. package/resources/filament/packages/tables/resources/css/columns/layout/stack.css +29 -0
  177. package/resources/filament/packages/tables/resources/css/columns/select.css +36 -0
  178. package/resources/filament/packages/tables/resources/css/columns/summaries/icon-count.css +43 -0
  179. package/resources/filament/packages/tables/resources/css/columns/summaries/range.css +27 -0
  180. package/resources/filament/packages/tables/resources/css/columns/summaries/text.css +29 -0
  181. package/resources/filament/packages/tables/resources/css/columns/summaries/values.css +33 -0
  182. package/resources/filament/packages/tables/resources/css/columns/text-input.css +36 -0
  183. package/resources/filament/packages/tables/resources/css/columns/text.css +319 -0
  184. package/resources/filament/packages/tables/resources/css/columns/toggle.css +54 -0
  185. package/resources/filament/packages/tables/resources/css/container.css +311 -0
  186. package/resources/filament/packages/tables/resources/css/content.css +342 -0
  187. package/resources/filament/packages/tables/resources/css/empty-state.css +31 -0
  188. package/resources/filament/packages/tables/resources/css/group-header.css +54 -0
  189. package/resources/filament/packages/tables/resources/css/header-cell.css +224 -0
  190. package/resources/filament/packages/tables/resources/css/index.css +26 -0
  191. package/resources/filament/packages/tables/resources/css/row.css +47 -0
  192. package/resources/filament/packages/tables/resources/css/table.css +394 -0
  193. package/resources/filament/packages/widgets/resources/css/chart-widget.css +88 -0
  194. package/resources/filament/packages/widgets/resources/css/index.css +3 -0
  195. package/resources/filament/packages/widgets/resources/css/stats-overview-widget.css +67 -0
  196. package/resources/filament/packages/widgets/resources/css/widget.css +3 -0
  197. package/theme.css +17 -0
  198. package/views/components/logo.ejs +9 -0
  199. package/views/components/tenant-menu.ejs +13 -0
  200. package/views/components/user-menu.ejs +82 -0
  201. package/views/layout/base.ejs +129 -0
  202. package/views/layout/index.ejs +41 -0
  203. package/views/layout/simple.ejs +19 -0
  204. package/views/livewire/sidebar.ejs +123 -0
  205. package/views/livewire/topbar.ejs +47 -0
  206. package/views/pages/page.ejs +143 -0
  207. package/views/pages/simple.ejs +32 -0
package/views/layout/base.ejs ADDED
@@ -0,0 +1,129 @@
1
+ <%# Panel HTML document %>
2
+ <!DOCTYPE html>
3
+ <html lang="en" dir="ltr" class="fi">
4
+ <head>
5
+ <%- renderHook('panels::head.start', renderHookScopes) %>
6
+ <meta charset="utf-8" />
7
+ <meta name="csrf-token" content="<%- csrf %>" />
8
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
9
+
10
+ <% if (locals.favicon) { %><link rel="icon" href="<%= favicon %>" /><% } %>
11
+
12
+ <title>
13
+ <%= title %>
14
+ -
15
+ <%= brandName %>
16
+ </title>
17
+
18
+ <%- renderHook('panels::styles.before', renderHookScopes) %>
19
+ <style>
20
+ [x-cloak=''],
21
+ [x-cloak='x-cloak'],
22
+ [x-cloak='1'] {
23
+ display: none !important;
24
+ }
25
+
26
+ [x-cloak='inline-flex'] {
27
+ display: inline-flex !important;
28
+ }
29
+
30
+ @media (max-width: 1023px) {
31
+ [x-cloak='-lg'] {
32
+ display: none !important;
33
+ }
34
+ }
35
+
36
+ @media (min-width: 1024px) {
37
+ [x-cloak='lg'] {
38
+ display: none !important;
39
+ }
40
+ }
41
+ </style>
42
+
43
+ <link href="<%- assetUrl('fonts/filament/filament/inter/index.css') %>" rel="stylesheet" data-navigate-track />
44
+
45
+ <%- colorVariables %>
46
+
47
+ <%# The application's compiled theme if any, otherwise the default stylesheet %>
48
+ <link rel="stylesheet" href="<%- locals.theme ? theme : assetUrl('css/filament/filament/app.css') %>" data-navigate-track="reload" />
49
+
50
+ <% if (font.url) { %>
51
+ <% if (font.preconnect) { %><link rel="preconnect" href="<%- font.preconnect %>"><% } %>
52
+ <link href="<%= font.url %>" rel="stylesheet" />
53
+ <% } %>
54
+
55
+ <style>
56
+ :root {
57
+ --font-family: '<%- font.family %>';
58
+ --font-family-mono: 'ui-monospace';
59
+ --font-family-serif: 'ui-serif';
60
+ --sidebar-width: 20rem;
61
+ --sidebar-collapsed-width: 4.5rem;
62
+ --default-theme-mode: system;
63
+ }
64
+
65
+ html.fi {
66
+ --livewire-progress-bar-color: var(--primary-500);
67
+ }
68
+ </style>
69
+
70
+ <%- renderHook('panels::styles.after', renderHookScopes) %>
71
+ <script>
72
+ const loadDarkMode = () => {
73
+ window.theme =
74
+ localStorage.getItem('filament:theme:mode') ?? 'system'
75
+
76
+ if (
77
+ window.theme === 'dark' ||
78
+ (window.theme === 'system' &&
79
+ window.matchMedia('(prefers-color-scheme: dark)')
80
+ .matches)
81
+ ) {
82
+ document.documentElement.classList.add('dark')
83
+ }
84
+ }
85
+
86
+ loadDarkMode()
87
+
88
+ document.addEventListener('livewire:navigated', loadDarkMode)
89
+ </script>
90
+
91
+ <% if (locals.themeCss) { %><style data-navette-theme><%- themeCss %></style><% } %>
92
+
93
+ <% if (locals.motion) { %><link rel="stylesheet" href="<%- assetUrl('navette/motion.css') %>" data-navigate-track /><% } %>
94
+ <link rel="stylesheet" href="<%- assetUrl('navette/calendar.css') %>" data-navigate-track />
95
+
96
+ <%- wireStyles %>
97
+ <%- renderHook('panels::head.end', renderHookScopes) %>
98
+ </head>
99
+
100
+ <body class="<%- cls(['fi-body', 'fi-panel-' + panelId, bodyClass]) %>">
101
+ <%- renderHook('panels::body.start', renderHookScopes) %>
102
+ <%- body %>
103
+
104
+ <%- notifications %>
105
+
106
+ <%- renderHook('panels::scripts.before', renderHookScopes) %>
107
+ <script>
108
+ window.filamentData = []
109
+ </script>
110
+
111
+ <% for (const src of ['js/filament/actions/actions.js', 'js/filament/notifications/notifications.js', 'js/filament/schemas/schemas.js', 'js/filament/support/support.js', 'js/filament/tables/tables.js', 'js/filament/filament/echo.js', 'js/filament/filament/app.js']) { %>
112
+ <script src="<%- assetUrl(src) %>"<% if (locals.spa !== false) { %> data-navigate-once data-navigate-track<% } %>></script>
113
+ <% } %>
114
+
115
+ <style>
116
+ :root {
117
+ }
118
+ </style>
119
+
120
+ <script>
121
+ loadDarkMode()
122
+ </script>
123
+
124
+ <%- wireScripts %>
125
+ <%- renderHook('panels::scripts.after', renderHookScopes) %>
126
+ <%- renderHook('panels::body.end', renderHookScopes) %>
127
+ <% if (locals.motion) { %><script src="<%- assetUrl('navette/motion.js') %>" data-navigate-once defer></script><% } %>
128
+ </body>
129
+ </html>
package/views/layout/index.ejs ADDED
@@ -0,0 +1,41 @@
1
+ <%# Full panel layout %>
2
+ <% const collapsible = isSidebarCollapsibleOnDesktop || isSidebarFullyCollapsibleOnDesktop; %>
3
+ <a x-data="{}" x-bind:inert="$store.sidebar.isOpenMobile" href="#fi-main-content" class="fi-skip-link fi-sr-only">
4
+ <%= t('filament-panels::layout.skip_to_content.label') %>
5
+ </a>
6
+
7
+ <% if (topbar) { %>
8
+ <%- renderHook('panels::topbar.before', renderHookScopes) %>
9
+ <%- topbar %>
10
+ <%- renderHook('panels::topbar.after', renderHookScopes) %>
11
+ <% } else if (hasNavigation) { %>
12
+ <div x-data="{}" x-bind:inert="$store.sidebar.isOpenMobile"<% if (isSidebarFullyCollapsibleOnDesktop) { %> x-bind:class="{ 'lg:fi-hidden': $store.sidebar.isOpen }"<% } %> class="<%- cls(['fi-layout-sidebar-toggle-btn-ctn', { 'lg:fi-hidden': !isSidebarFullyCollapsibleOnDesktop }]) %>">
13
+ <%- view('filament::components.icon-button', {
14
+ iconName: 'o-bars-3', iconSize: 'lg', label: t('filament-panels::layout.actions.sidebar.expand.label'), className: 'fi-layout-sidebar-toggle-btn',
15
+ extra: attrs({ 'x-cloak': 'x-cloak', 'x-data': '{}', 'aria-controls': 'fi-main-sidebar', 'x-bind:aria-expanded': '$store.sidebar.isOpen', 'x-on:click': '$store.sidebar.open($event.currentTarget)' }),
16
+ }) %>
17
+ </div>
18
+ <% } %>
19
+
20
+ <div class="fi-layout">
21
+ <%- renderHook('panels::layout.start', renderHookScopes) %>
22
+ <% if (hasNavigation) { %>
23
+ <div x-cloak x-data="{}" x-on:click="$store.sidebar.close()" x-show="$store.sidebar.isOpen" x-transition.opacity.300ms class="fi-sidebar-close-overlay"></div>
24
+
25
+ <%- sidebar %>
26
+ <% } %>
27
+
28
+ <div x-data="filamentSidebarBackground" x-bind:inert="$store.sidebar.isOpenMobile && ! hasOpenModal"<% if (collapsible) { %> x-bind:class="{
29
+ 'fi-main-ctn-sidebar-open': $store.sidebar.isOpen,
30
+ }" x-bind:style="'display: flex; opacity:1;'"<% } else if (!(hasTopNavigation || !hasNavigation)) { %> x-bind:style="'display: flex; opacity:1;'"<% } %> class="fi-main-ctn">
31
+ <%- renderHook('panels::content.before', renderHookScopes) %>
32
+ <main id="fi-main-content" tabindex="-1" class="fi-main fi-width-<%- maxContentWidth %>">
33
+ <%- renderHook('panels::content.start', renderHookScopes) %>
34
+ <%- slot %>
35
+ <%- renderHook('panels::content.end', renderHookScopes) %>
36
+ </main>
37
+ <%- renderHook('panels::content.after', renderHookScopes) %>
38
+ <%- renderHook('panels::footer', renderHookScopes) %>
39
+ </div>
40
+ <%- renderHook('panels::layout.end', renderHookScopes) %>
41
+ </div>
package/views/layout/simple.ejs ADDED
@@ -0,0 +1,19 @@
1
+ <%# Simple layout (login, registration…) %>
2
+ <div class="fi-simple-layout">
3
+ <% if (locals.header) { %>
4
+ <a href="#fi-main-content" class="fi-skip-link fi-sr-only">
5
+ <%= t('filament-panels::layout.skip_to_content.label') %>
6
+ </a>
7
+ <% } %>
8
+ <%- renderHook('panels::simple-layout.start', renderHookScopes) %>
9
+ <% if (locals.header) { %>
10
+ <div class="fi-simple-layout-header"><%- header %></div>
11
+ <% } %>
12
+ <div class="fi-simple-main-ctn">
13
+ <main id="fi-main-content" tabindex="-1" class="fi-simple-main fi-width-<%- locals.maxContentWidth ?? 'lg' %>">
14
+ <%- slot %>
15
+ </main>
16
+ </div>
17
+ <%- renderHook('panels::footer', renderHookScopes) %>
18
+ <%- renderHook('panels::simple-layout.end', renderHookScopes) %>
19
+ </div>
package/views/livewire/sidebar.ejs ADDED
@@ -0,0 +1,123 @@
1
+ <%# Sidebar: navigation groups and items %>
2
+ <% const collapsible = isSidebarCollapsibleOnDesktop || isSidebarFullyCollapsibleOnDesktop; %>
3
+ <div>
4
+ <div x-data="filamentSidebar({
5
+ hasTopNavigation: <%= hasTopNavigation ? 'true' : 'false' %>,
6
+ isSidebarCollapsibleOnDesktop: <%= isSidebarCollapsibleOnDesktop ? 'true' : 'false' %>,
7
+ isSidebarFullyCollapsibleOnDesktop: <%= isSidebarFullyCollapsibleOnDesktop ? 'true' : 'false' %>,
8
+ })" <% if (collapsible) { %>x-cloak<% } else { %>x-cloak="-lg"<% } %> x-bind:class="{ 'fi-sidebar-open': $store.sidebar.isOpen }" x-bind:inert="isHidden" x-effect="focusInitialNavigation()" x-on:keydown.tab="handleTab($event)" x-on:keydown.escape.document="handleEscape($event)" id="fi-main-sidebar" class="fi-sidebar fi-main-sidebar">
9
+ <%- renderHook('panels::sidebar.start') %>
10
+ <div class="fi-sidebar-header-ctn">
11
+ <header class="fi-sidebar-header">
12
+ <% if (!hasTopbar && isSidebarCollapsibleOnDesktop) { %>
13
+ <%- view('filament::components.icon-button', {
14
+ iconName: 'o-chevron-right', iconSize: 'lg', label: t('filament-panels::layout.actions.sidebar.expand.label'), className: 'fi-sidebar-open-collapse-sidebar-btn',
15
+ extra: attrs({ 'x-cloak': 'x-cloak', 'x-data': '{}', 'aria-controls': 'fi-main-sidebar', 'x-bind:aria-expanded': '$store.sidebar.isOpen', 'x-on:click': '$store.sidebar.open()', 'x-show': '! $store.sidebar.isOpen' }),
16
+ }) %>
17
+ <% } %>
18
+ <% if (!hasTopbar && collapsible) { %>
19
+ <%- view('filament::components.icon-button', {
20
+ iconName: 'o-chevron-left', iconSize: 'lg', label: t('filament-panels::layout.actions.sidebar.collapse.label'), className: 'fi-sidebar-close-collapse-sidebar-btn',
21
+ extra: attrs({ 'x-cloak': 'x-cloak', 'x-data': '{}', 'aria-controls': 'fi-main-sidebar', 'x-bind:aria-expanded': '$store.sidebar.isOpen', 'x-on:click': '$store.sidebar.close()', 'x-show': '$store.sidebar.isOpen' }),
22
+ }) %>
23
+ <% } %>
24
+ <%- renderHook('panels::sidebar.logo.before') %>
25
+ <div<% if (collapsible) { %> x-show="$store.sidebar.isOpen"<% } %> class="fi-sidebar-header-logo-ctn">
26
+ <a href="<%= homeUrl %>"<% if (spa) { %> wire:navigate<% } %>>
27
+ <%- view('filament-panels::components.logo', { brand }) %>
28
+ </a>
29
+ </div>
30
+ <%- renderHook('panels::sidebar.logo.after') %>
31
+ </header>
32
+ </div>
33
+ <% if (tenantMenu || globalSearch) { %>
34
+ <div<% if (!tenantMenu && collapsible) { %> x-show="$store.sidebar.isOpen"<% } %> class="fi-sidebar-header-controls">
35
+ <% if (tenantMenu) { %><%- tenantMenu %><% } %>
36
+ <% if (globalSearch) { %> <div<% if (collapsible) { %> x-show="$store.sidebar.isOpen"<% } %>><%- globalSearch %></div>
37
+ <% } %>
38
+ </div>
39
+ <% } %>
40
+
41
+ <nav aria-label="<%= t('filament-panels::layout.navigation.label') %>" class="fi-sidebar-nav">
42
+ <%- renderHook('panels::sidebar.nav.start') %>
43
+ <ul class="fi-sidebar-nav-groups">
44
+ <% for (const group of groups) { %>
45
+ <li x-data="{ label: <%- js(group.label ?? '') %> }" data-group-label="<%= group.label ?? '' %>" x-bind:class="{ 'fi-collapsed': $store.sidebar.groupIsCollapsed(label) }" class="<%- cls(['fi-sidebar-group', { 'fi-active': group.isActive }, 'fi-collapsible']) %>">
46
+ <% if (group.label) { %>
47
+ <div x-on:click="$store.sidebar.toggleCollapsedGroup(label)" class="fi-sidebar-group-btn">
48
+ <span class="fi-sidebar-group-label">
49
+ <%= group.label %>
50
+ </span>
51
+ <%- view('filament::components.icon-button', {
52
+ iconName: 'm-chevron-up', label: group.label, className: 'fi-sidebar-group-collapse-btn',
53
+ extra: attrs({ 'aria-controls': group.itemsId, 'x-bind:aria-expanded': '! $store.sidebar.groupIsCollapsed(label)', 'x-on:click.stop': '$store.sidebar.toggleCollapsedGroup(label)' }),
54
+ }) %>
55
+ </div>
56
+ <% } %>
57
+ <ul<% if (group.label) { %> id="<%= group.itemsId %>" x-show="! $store.sidebar.groupIsCollapsed(label)" x-collapse.duration.200ms<% } %> class="fi-sidebar-group-items">
58
+ <% for (const item of group.items) { %>
59
+ <li class="<%- cls(['fi-sidebar-item', { 'fi-active': item.isActive }, 'fi-sidebar-item-has-url']) %>">
60
+ <a href="<%= item.url %>"<% if (spa) { %> wire:navigate<% } %><% if (item.isActive) { %> aria-current="page"<% } %> x-on:click="$store.sidebar.isMobile && $store.sidebar.close()" class="fi-sidebar-item-btn">
61
+ <% if (item.icon) { %><%- icon(item.icon, { size: 'lg', attributes: attrs({ class: 'fi-sidebar-item-icon' }) }) %><% } %>
62
+ <span class="fi-sidebar-item-label">
63
+ <%= item.label %>
64
+ </span>
65
+ <% if (item.badge !== null) { %>
66
+ <span class="fi-sidebar-item-badge-ctn">
67
+ <%- view('filament::components.badge', { label: item.badge, colorClasses: item.badgeColorClasses }) %>
68
+ </span>
69
+ <% } %>
70
+ </a>
71
+ </li>
72
+ <% } %>
73
+ </ul>
74
+ </li>
75
+ <% } %>
76
+ </ul>
77
+
78
+ <script>
79
+ if (! window.Alpine?.store('sidebar')) {
80
+ let collapsedGroups = JSON.parse(
81
+ localStorage.getItem('filament:sidebar:collapsed_groups'),
82
+ )
83
+
84
+ if (collapsedGroups === null || collapsedGroups === 'null') {
85
+ collapsedGroups = []
86
+
87
+ localStorage.setItem(
88
+ 'filament:sidebar:collapsed_groups',
89
+ JSON.stringify(collapsedGroups),
90
+ )
91
+ }
92
+
93
+ document.currentScript
94
+ .closest('nav')
95
+ .querySelectorAll('.fi-sidebar-group')
96
+ .forEach((group) => {
97
+ if (! collapsedGroups.includes(group.dataset.groupLabel)) {
98
+ return
99
+ }
100
+
101
+ // Hide collapsed groups before Alpine initializes to avoid a flash.
102
+ group.querySelector('.fi-sidebar-group-items').style.display = 'none'
103
+ group.classList.add('fi-collapsed')
104
+ })
105
+ }
106
+ </script>
107
+ <%- renderHook('panels::sidebar.nav.end') %>
108
+ </nav>
109
+
110
+ <% if (databaseNotifications || userMenu) { %>
111
+ <div class="fi-sidebar-footer">
112
+ <%- databaseNotifications ?? '' %>
113
+ <%- userMenu ?? '' %>
114
+ </div>
115
+ <% } %>
116
+ <%# Rendered after the sidebar footer, not inside it. %>
117
+ <%- renderHook('panels::sidebar.footer') %>
118
+ </div>
119
+
120
+ <div wire:partial="action-modals" x-data="filamentActionModals({
121
+ livewireId: <%- js(livewireId) %>,
122
+ })" style="height: 0"></div>
123
+ </div>
package/views/livewire/topbar.ejs ADDED
@@ -0,0 +1,47 @@
1
+ <%# Topbar and its navigation items %>
2
+ <div x-data="filamentSidebarBackground" x-bind:inert="$store.sidebar.isOpenMobile && ! hasOpenModal" class="fi-topbar-ctn" ><nav aria-label="<%= t('filament-panels::layout.topbar.label') %>" class="fi-topbar" >
3
+ <%- renderHook('panels::topbar.start') %>
4
+ <% if (hasNavigation) { %>
5
+ <%- view('filament::components.icon-button', {
6
+ iconName: 'o-bars-3', iconSize: 'lg', label: t('filament-panels::layout.actions.sidebar.expand.label'), className: 'fi-topbar-open-sidebar-btn',
7
+ extra: attrs({ 'x-cloak': 'x-cloak', 'x-data': '{}', 'aria-controls': 'fi-main-sidebar', 'x-bind:aria-expanded': '$store.sidebar.isOpen', 'x-on:click': '$store.sidebar.open($event.currentTarget)', 'x-show': '! $store.sidebar.isOpen' }),
8
+ }) %><%- view('filament::components.icon-button', {
9
+ iconName: 'o-x-mark', iconSize: 'lg', label: t('filament-panels::layout.actions.sidebar.collapse.label'), className: 'fi-topbar-close-sidebar-btn',
10
+ extra: attrs({ 'x-cloak': 'x-cloak', 'x-data': '{}', 'aria-controls': 'fi-main-sidebar', 'x-bind:aria-expanded': '$store.sidebar.isOpen', 'x-on:click': '$store.sidebar.close()', 'x-show': '$store.sidebar.isOpen' }),
11
+ }) %>
12
+ <% } %>
13
+ <div class="fi-topbar-start">
14
+ <% if (isSidebarCollapsibleOnDesktop || isSidebarFullyCollapsibleOnDesktop) { %>
15
+ <div x-show="$store.sidebar.isOpen || <%= isSidebarCollapsibleOnDesktop ? 'true' : 'false' %>" class="fi-topbar-collapse-sidebar-btn-ctn" >
16
+ <% if (isSidebarCollapsibleOnDesktop) { %><%- view('filament::components.icon-button', {
17
+ iconName: 'o-chevron-right', iconSize: 'lg', label: t('filament-panels::layout.actions.sidebar.expand.label'), className: 'fi-topbar-open-collapse-sidebar-btn',
18
+ extra: attrs({ 'x-cloak': 'x-cloak', 'x-data': '{}', 'aria-controls': 'fi-main-sidebar', 'x-bind:aria-expanded': '$store.sidebar.isOpen', 'x-on:click': '$store.sidebar.open()', 'x-show': '! $store.sidebar.isOpen' }),
19
+ }) %><% } %><%- view('filament::components.icon-button', {
20
+ iconName: 'o-chevron-left', iconSize: 'lg', label: t('filament-panels::layout.actions.sidebar.collapse.label'), className: 'fi-topbar-close-collapse-sidebar-btn',
21
+ extra: attrs({ 'x-cloak': 'x-cloak', 'x-data': '{}', 'aria-controls': 'fi-main-sidebar', 'x-bind:aria-expanded': '$store.sidebar.isOpen', 'x-on:click': '$store.sidebar.close()', 'x-show': '$store.sidebar.isOpen' }),
22
+ }) %>
23
+ </div>
24
+ <% } %>
25
+ <%- renderHook('panels::topbar.logo.before') %><a href="<%= homeUrl %>"<% if (spa) { %> wire:navigate<% } %>><%- view('filament-panels::components.logo', { brand }) %></a><%- renderHook('panels::topbar.logo.after') %>
26
+ </div>
27
+ <% if (tenantMenu) { %><%- tenantMenu %><% } %>
28
+ <% if (topNavigation) { %>
29
+ <ul class="fi-topbar-nav-groups">
30
+ <% for (const group of topNavigation) { %>
31
+ <% if (group.label) { %>
32
+ <div x-data="filamentDropdown({ isMenu: true })" class="fi-dropdown" ><div x-on:mousedown="if ($event.button === 0) toggle($event)" class="fi-dropdown-trigger" ><li class="<%- cls(['fi-topbar-item', { 'fi-active': group.isActive }]) %>"><button type="button" class="fi-topbar-item-btn"><span class="fi-topbar-item-label"> <%= group.label %> </span><%- icon('m-chevron-down', { attributes: attrs({ class: 'fi-topbar-group-toggle-icon' }) }) %></button></li></div><div x-cloak x-float.placement.bottom-start.flip.teleport.offset="{ offset: 8, }" x-ref="panel" x-transition:enter-start="fi-opacity-0" x-transition:leave-end="fi-opacity-0" role="menu" class="fi-dropdown-panel " style="" ><div class="fi-dropdown-list"><% for (const item of group.items) { %><a href="<%= item.url %>"<% if (spa) { %> wire:navigate<% } %><% if (item.isActive) { %> aria-current="page"<% } %> class="<%- cls(['fi-dropdown-list-item', ...item.colorClasses]) %>" role="menuitem" tabindex="-1"><% if (item.icon) { %><%- icon(item.icon, item.isActive ? { attributes: attrs({ class: 'fi-color fi-color-primary' }) } : {}) %><% } %><span class="fi-dropdown-list-item-label"><%= item.label %></span><% if (item.badge !== null) { %><%- view('filament::components.badge', { label: item.badge, colorClasses: item.badgeColorClasses }) %><% } %></a><% } %></div></div></div>
33
+ <% } else { %>
34
+ <% for (const item of group.items) { %><li class="<%- cls(['fi-topbar-item', { 'fi-active': item.isActive }]) %>"><a href="<%= item.url %>"<% if (spa) { %> wire:navigate<% } %><% if (item.isActive) { %> aria-current="page"<% } %> class="fi-topbar-item-btn"><% if (item.icon) { %><%- icon(item.icon, { attributes: attrs({ class: 'fi-topbar-item-icon' }) }) %><% } %><span class="fi-topbar-item-label"> <%= item.label %> </span><% if (item.badge !== null) { %><%- view('filament::components.badge', { label: item.badge, colorClasses: item.badgeColorClasses }) %><% } %></a></li><% } %>
35
+ <% } %>
36
+ <% } %>
37
+ </ul>
38
+ <% } %>
39
+ <div x-persist="<%= persistKey %>" class="fi-topbar-end" >
40
+ <%- renderHook('panels::global-search.before') %><%- globalSearch ?? '' %><%- renderHook('panels::global-search.after') %>
41
+ <%- databaseNotifications ?? '' %>
42
+ <%- userMenu ?? '' %>
43
+ </div>
44
+ <%- renderHook('panels::topbar.end') %>
45
+ </nav><div wire:partial="action-modals" x-data="filamentActionModals({
46
+ livewireId: <%- js(livewireId) %>,
47
+ })" style="height: 0"></div></div>
package/views/pages/page.ejs ADDED
@@ -0,0 +1,143 @@
1
+ <%# Panel page: header, breadcrumbs, sub-navigation and content %>
2
+ <% const beforeHeaderActions = renderHook('panels::page.header.actions.before', renderHookScopes), afterHeaderActions = renderHook('panels::page.header.actions.after', renderHookScopes); %>
3
+ <% const subNavigation = locals.subNavigation ?? []; const activeSubItem = subNavigation.find((item) => item.active) ?? subNavigation[0]; const subNavigationPosition = locals.subNavigationPosition ?? 'top'; %>
4
+ <div class="<%- cls(['fi-page', subNavigation.length ? `fi-page-has-sub-navigation fi-page-has-sub-navigation-${subNavigationPosition}` : null, ...(locals.pageClasses ?? [])]) %>">
5
+ <%- renderHook('panels::page.start', renderHookScopes) %>
6
+ <div class="fi-page-header-main-ctn">
7
+ <% if (subNavigation.length) { %>
8
+ <%# Sub-navigation: a dropdown on mobile; on desktop, tabs (top) or a column (start, end) %>
9
+ <div class="fi-page-main-sub-navigation-mobile-menu-render-hook-ctn"><%- renderHook('panels::page.sub-navigation.module-menu.before', renderHookScopes) %></div>
10
+ <div x-data="filamentDropdown({ isMenu: true })" class="fi-dropdown fi-page-sub-navigation-dropdown">
11
+ <div x-on:mousedown="if ($event.button === 0) toggle($event)" class="fi-dropdown-trigger">
12
+ <button class="fi-btn fi-size-md" type="button" wire:loading.attr="aria-disabled" wire:loading.class="fi-disabled"><%= activeSubItem.label %><%- icon('m-chevron-down') %></button>
13
+ </div>
14
+ <div x-cloak x-float.placement.bottom-start.flip.offset="{ offset: 8, }" x-ref="panel" x-transition:enter-start="fi-opacity-0" x-transition:leave-end="fi-opacity-0" role="menu" class="fi-dropdown-panel fi-width-xs" style="">
15
+ <div class="fi-dropdown-list">
16
+ <% for (const item of subNavigation) { %>
17
+ <a href="<%= item.url %>" wire:navigate class="fi-dropdown-list-item" role="menuitem" tabindex="-1"<% if (item.active) { %> aria-current="page"<% } %>><% if (item.icon) { %><%- icon(item.icon) %><% } %><span class="fi-dropdown-list-item-label"><%= item.label %></span></a>
18
+ <% } %>
19
+ </div>
20
+ </div>
21
+ </div>
22
+ <div class="fi-page-main-sub-navigation-mobile-menu-render-hook-ctn"><%- renderHook('panels::page.sub-navigation.module-menu.after', renderHookScopes) %></div>
23
+ <% } %>
24
+ <header class="<%- cls(['fi-header', { 'fi-header-has-breadcrumbs': breadcrumbs.length }]) %>">
25
+ <div>
26
+ <% if (breadcrumbs.length) { %>
27
+ <nav class="fi-breadcrumbs" aria-label="<%= t('filament::components/breadcrumbs.label') %>">
28
+ <ol class="fi-breadcrumbs-list">
29
+ <% breadcrumbs.forEach((crumb, i) => { %>
30
+ <li class="fi-breadcrumbs-item">
31
+ <% if (i > 0) { %>
32
+ <%- icon('m-chevron-right', { attributes: attrs({ 'aria-hidden': 'true', class: 'fi-breadcrumbs-item-separator fi-ltr' }) }) %>
33
+ <%- icon('m-chevron-left', { attributes: attrs({ 'aria-hidden': 'true', class: 'fi-breadcrumbs-item-separator fi-rtl' }) }) %>
34
+ <% } %>
35
+ <% if (crumb.url) { %>
36
+ <a href="<%= crumb.url %>" wire:navigate class="fi-breadcrumbs-item-label">
37
+ <%= crumb.label %>
38
+ </a>
39
+ <% } else { %>
40
+ <span<% if (i === breadcrumbs.length - 1) { %> aria-current="page"<% } %> class="fi-breadcrumbs-item-label">
41
+ <%= crumb.label %>
42
+ </span>
43
+ <% } %>
44
+ </li>
45
+ <% }) %>
46
+ </ol>
47
+ </nav>
48
+ <% } %>
49
+
50
+ <%- renderHook('panels::page.header.heading.before', renderHookScopes) %>
51
+ <h1 class="fi-header-heading">
52
+ <%= heading %>
53
+ </h1>
54
+ <%- renderHook('panels::page.header.heading.after', renderHookScopes) %>
55
+ </div>
56
+
57
+ <%# The container exists as soon as there is an action or either render hook outputs something. %>
58
+ <% if (headerActions.length || (beforeHeaderActions + afterHeaderActions).trim() !== '') { %>
59
+ <div class="fi-header-actions-ctn">
60
+ <%- beforeHeaderActions %>
61
+ <% if (headerActions.length) { %>
62
+ <div class="fi-ac fi-align-start" wire:key="<%= livewireId %>.header-actions.<%- headerActionsKey %>">
63
+ <%- headerActions.join('') %>
64
+ </div>
65
+ <% } %>
66
+ <%- afterHeaderActions %>
67
+ </div>
68
+ <% } %>
69
+ </header>
70
+
71
+ <div class="fi-page-main">
72
+ <% if (subNavigation.length && subNavigationPosition === 'start') { %>
73
+ <%- renderHook('panels::page.sub-navigation.start.before', renderHookScopes) %>
74
+ <div class="fi-page-sub-navigation-sidebar-ctn">
75
+ <%- renderHook('panels::page.sub-navigation.sidebar.before', renderHookScopes) %>
76
+ <ul class="fi-page-sub-navigation-sidebar">
77
+ <li x-data="{ label: 'sub_navigation_' }" data-group-label="sub_navigation_" x-bind:class="{ 'fi-collapsed': $store.sidebar.groupIsCollapsed(label) }" class="<%- cls(['fi-sidebar-group', { 'fi-active': subNavigation.some((item) => item.active) }, 'fi-collapsible']) %>">
78
+ <ul class="fi-sidebar-group-items">
79
+ <% for (const item of subNavigation) { %>
80
+ <li class="<%- cls(['fi-sidebar-item', { 'fi-active': item.active }, 'fi-sidebar-item-has-url']) %>">
81
+ <a href="<%= item.url %>" wire:navigate<% if (item.active) { %> aria-current="page"<% } %> x-on:click="$store.sidebar.isMobile && $store.sidebar.close()" class="fi-sidebar-item-btn">
82
+ <% if (item.icon) { %><%- icon(item.icon, { size: 'lg', attributes: attrs({ class: 'fi-sidebar-item-icon' }) }) %><% } %>
83
+ <span class="fi-sidebar-item-label">
84
+ <%= item.label %>
85
+ </span>
86
+ </a>
87
+ </li>
88
+ <% } %>
89
+ </ul>
90
+ </li>
91
+ </ul>
92
+ <%- renderHook('panels::page.sub-navigation.sidebar.after', renderHookScopes) %>
93
+ </div>
94
+ <%- renderHook('panels::page.sub-navigation.start.after', renderHookScopes) %>
95
+ <% } %>
96
+ <% if (subNavigation.length && subNavigationPosition === 'top') { %>
97
+ <%- renderHook('panels::page.sub-navigation.top.before', renderHookScopes) %>
98
+ <nav class="fi-tabs fi-page-sub-navigation-tabs" aria-label="<%= t('filament::components/tabs.label') %>">
99
+ <% for (const item of subNavigation) { %>
100
+ <a href="<%= item.url %>" wire:navigate class="<%- cls(['fi-tabs-item', { 'fi-active': item.active }]) %>"<% if (item.active) { %> aria-current="page"<% } %>><% if (item.icon) { %><%- icon(item.icon) %><% } %><span class="fi-tabs-item-label"><%= item.label %></span></a>
101
+ <% } %>
102
+ </nav>
103
+ <%- renderHook('panels::page.sub-navigation.top.after', renderHookScopes) %>
104
+ <% } %>
105
+ <div class="fi-page-content">
106
+ <%- renderHook('panels::page.header-widgets.before', renderHookScopes) %>
107
+ <%- headerWidgets %>
108
+ <%- renderHook('panels::page.header-widgets.after', renderHookScopes) %>
109
+ <%- content %>
110
+ <%- renderHook('panels::page.footer-widgets.before', renderHookScopes) %>
111
+ <%- locals.footerWidgets ?? '' %>
112
+ <%- renderHook('panels::page.footer-widgets.after', renderHookScopes) %>
113
+ </div>
114
+ <% if (subNavigation.length && subNavigationPosition === 'end') { %>
115
+ <%- renderHook('panels::page.sub-navigation.end.before', renderHookScopes) %>
116
+ <div class="fi-page-sub-navigation-sidebar-ctn">
117
+ <%- renderHook('panels::page.sub-navigation.sidebar.before', renderHookScopes) %>
118
+ <ul class="fi-page-sub-navigation-sidebar">
119
+ <li x-data="{ label: 'sub_navigation_' }" data-group-label="sub_navigation_" x-bind:class="{ 'fi-collapsed': $store.sidebar.groupIsCollapsed(label) }" class="<%- cls(['fi-sidebar-group', { 'fi-active': subNavigation.some((item) => item.active) }, 'fi-collapsible']) %>">
120
+ <ul class="fi-sidebar-group-items">
121
+ <% for (const item of subNavigation) { %>
122
+ <li class="<%- cls(['fi-sidebar-item', { 'fi-active': item.active }, 'fi-sidebar-item-has-url']) %>">
123
+ <a href="<%= item.url %>" wire:navigate<% if (item.active) { %> aria-current="page"<% } %> x-on:click="$store.sidebar.isMobile && $store.sidebar.close()" class="fi-sidebar-item-btn">
124
+ <% if (item.icon) { %><%- icon(item.icon, { size: 'lg', attributes: attrs({ class: 'fi-sidebar-item-icon' }) }) %><% } %>
125
+ <span class="fi-sidebar-item-label">
126
+ <%= item.label %>
127
+ </span>
128
+ </a>
129
+ </li>
130
+ <% } %>
131
+ </ul>
132
+ </li>
133
+ </ul>
134
+ <%- renderHook('panels::page.sub-navigation.sidebar.after', renderHookScopes) %>
135
+ </div>
136
+ <%- renderHook('panels::page.sub-navigation.end.after', renderHookScopes) %>
137
+ <% } %>
138
+ </div>
139
+ </div>
140
+
141
+ <%- actionModals %>
142
+ <%- renderHook('panels::page.end', renderHookScopes) %>
143
+ </div>
package/views/pages/simple.ejs ADDED
@@ -0,0 +1,32 @@
1
+ <%# Simple page: logo, header and content %>
2
+ <div class="fi-simple-page">
3
+ <%- renderHook('panels::simple-page.start', renderHookScopes) %>
4
+ <div class="fi-simple-page-content">
5
+ <% if (heading || locals.hasLogo !== false || locals.subheading) { %>
6
+ <header class="fi-simple-header">
7
+ <% if (locals.hasLogo !== false) { %>
8
+ <%- view('filament-panels::components.logo', { brand }) %>
9
+ <% } %>
10
+
11
+ <% if (heading) { %>
12
+ <h1 class="fi-simple-header-heading">
13
+ <%= heading %>
14
+ </h1>
15
+ <% } %>
16
+
17
+ <% if (locals.subheading) { %>
18
+ <p class="fi-simple-header-subheading">
19
+ <%- subheading %>
20
+ </p>
21
+ <% } %>
22
+ </header>
23
+ <% } %>
24
+
25
+ <%- content %>
26
+ </div>
27
+
28
+ <div wire:partial="action-modals" x-data="filamentActionModals({
29
+ livewireId: <%- js(livewireId) %>,
30
+ })" style="height: 0"></div>
31
+ <%- renderHook('panels::simple-page.end', renderHookScopes) %>
32
+ </div>