@licklist/design 0.78.41 → 0.78.44

package/src/v2/navigation/DashboardLayout/TopNavigation.tsx

@@ -43,7 +43,8 @@ const SidebarCollapsedIcon = () => (
     <path d="M29 10C30.6569 10 32 11.3431 32 13V27C32 28.6569 30.6569 30 29 30H11C9.34315 30 8 28.6569 8 27V13C8 11.3431 9.34315 10 11 10H29ZM14 28H29C29.5523 28 30 27.5523 30 27V13C30 12.4477 29.5523 12 29 12H14V28ZM11 12C10.4477 12 10 12.4477 10 13V27C10 27.5523 10.4477 28 11 28H12V12H11Z" fill="var(--fills-main-fill-secondary, #626A90)"/>
   </svg>
 )
-const InboxIcon = ({ active, hovered }: { active?: boolean; hovered?: boolean }) => (
+// @ts-ignore kept for future use
+const _InboxIcon = ({ active, hovered }: { active?: boolean; hovered?: boolean }) => (
     <svg width="32" height="32" viewBox="0 0 32 32" fill="none">
         {(hovered && !active) && (
             <path d="M11 10H21L22.5 18H19L18 20L16 20.5L14 20L13 18H9.5L11 10Z" fill="var(--fills-main-fill-secondary, #626A90)" fillOpacity="0.3"/>
@@ -54,7 +55,8 @@ const InboxIcon = ({ active, hovered }: { active?: boolean; hovered?: boolean })
         <path d="M8.02381 7.78307C8.12549 7.32553 8.5313 7 9 7H23C23.4687 7 23.8745 7.32553 23.9762 7.78307L25.9762 16.7831C25.992 16.8543 26 16.927 26 17V24C26 24.5523 25.5523 25 25 25H7C6.44772 25 6 24.5523 6 24V17C6 16.927 6.00799 16.8543 6.02381 16.7831L8.02381 7.78307ZM9.80217 9L8.24662 16H13C13 17.6569 14.3431 19 16 19C17.6569 19 19 17.6569 19 16H23.7534L22.1978 9H9.80217ZM20.584 18C19.8124 19.7659 18.0503 21 16 21C13.9497 21 12.1876 19.7659 11.416 18H8V23H24V18H20.584Z" fill={active ? 'white' : 'var(--fills-main-fill-secondary, #626A90)'}/>
     </svg>
 )
-const NotificationIcon = ({ active, hovered }: { active?: boolean; hovered?: boolean }) => {
+// @ts-ignore kept for future use
+const _NotificationIcon = ({ active, hovered }: { active?: boolean; hovered?: boolean }) => {
     if (active) {
         return (
             <svg width="32" height="32" viewBox="0 0 32 32" fill="none">
@@ -135,10 +137,10 @@ export const TopNavigation: React.FC<TopNavigationProps> = ({
     userAvatarUrl,
     userId,
     userRole,
-    inboxCount = 0,
-    notificationCount = 0,
+    inboxCount: _inboxCount = 0,
+    notificationCount: _notificationCount = 0,
     onUserClick,
-    onInboxClick,
+    onInboxClick: _onInboxClick,
     onNotificationClick,
     onHelpClick,
     onProfileClick,
@@ -153,7 +155,8 @@ export const TopNavigation: React.FC<TopNavigationProps> = ({
     const handleUserClick = () => {
         onUserClick?.()
     }
-    const handleNotificationClick = () => {
+    // @ts-ignore kept for future use
+    const _handleNotificationClick = () => {
         setIsNotificationActive(!isNotificationActive)
         onNotificationClick?.()
     }

package/src/v2/navigation/FigmasAdminSideBar/FigmasAdminSideBar.tsx

@@ -8,7 +8,7 @@ export interface FigmasAdminSideBarProps {
 
 export const FigmasAdminSideBar: React.FC<FigmasAdminSideBarProps> = ({
     expanded = true,
-    onToggle,
+    onToggle: _onToggle,
 }) => {
     const homeIcon = (
         <div className="figmas-admin-sidebar__icon">

package/src/v2/navigation/FigmasSideBar/FigmasSideBar.tsx

@@ -26,18 +26,20 @@ export const FigmasSideBar: React.FC<FigmasSideBarProps> = ({
     venueName = "Sharky's Soft Play",
     venueId = "123",
     venueImage,
-    onToggle,
+    onToggle: _onToggle,
     navigationItems,
-    onNavigation,
+    onNavigation: _onNavigation,
     activePath,
     authCredentials,
 }) => {
     // Filter navigation items based on auth if provided
-    const accessibleItems = authCredentials && navigationItems
+    // @ts-ignore kept for future use
+    const _accessibleItems = authCredentials && navigationItems
         ? navigationItems.filter(item => useCanAccess(authCredentials, item))
         : navigationItems || []
 
-    const isActive = (path: string) => activePath === path
+    // @ts-ignore kept for future use
+    const _isActive = (path: string) => activePath === path
     const icon = (
         <div className="figmas-sidebar__icon">
             <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">

package/src/v2/navigation/config.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import type { NavigationItem } from '../types/navigation'
 
 // Icon components (these would be your actual icon imports)

package/src/v2/pages/SettingsSubPage/SettingsSubPage.scss

@@ -0,0 +1,43 @@
+.settings-sub-page {
+  display: flex;
+  flex-direction: column;
+  align-self: stretch;
+
+  &__back {
+    padding: 24px 32px 0 0;
+    align-self: flex-start;
+
+    .ghost-button {
+      color: var(--fill-action, #5D5BF4);
+      border-color: var(--borders-main-border-primary, #E8E9EF);
+
+      &:not(.active):hover:not(:disabled) {
+        background-color: var(--surface-action-soft, #F4F4FE);
+        color: var(--fill-action, #5D5BF4);
+      }
+
+      .ghost-button__icon svg {
+        width: 24px;
+        height: 24px;
+      }
+    }
+
+    @media (max-width: 768px) {
+      padding: 16px 16px 0 0;
+    }
+  }
+
+  &__content {
+    padding: 24px 0;
+
+    @media (max-width: 768px) {
+      padding: 0;
+    }
+  }
+
+  &__action {
+    margin-bottom: 16px;
+    display: flex;
+    justify-content: flex-end;
+  }
+}

package/src/v2/styles/form/NewInput.scss

@@ -35,6 +35,7 @@
   &__input {
     @include typography('text.regular');
     flex: 1 0 0;
+    color: var(--label-primary, #121e52);
     background-color: var(--surfaces-main-background-secondary);
     border: 2px solid var(--border-primary);
     border-radius: var(--radius-md);
@@ -57,6 +58,17 @@
     &::placeholder {
       color: var(--labels-main-label-secondary, #626a90);
     }
+
+    &[type="date"]::-webkit-datetime-edit-text,
+    &[type="date"]::-webkit-datetime-edit-month-field,
+    &[type="date"]::-webkit-datetime-edit-day-field,
+    &[type="date"]::-webkit-datetime-edit-year-field,
+    &[type="time"]::-webkit-datetime-edit-text,
+    &[type="time"]::-webkit-datetime-edit-hour-field,
+    &[type="time"]::-webkit-datetime-edit-minute-field,
+    &[type="time"]::-webkit-datetime-edit-ampm-field {
+      color: var(--label-primary, #121e52);
+    }
   }
 
     &__textarea {

package/src/v2/types/navigation.ts

@@ -1,6 +1,9 @@
+import React from 'react'
+
 export interface NavigationItem {
   id: string
   label: string
+  icon?: React.ReactNode
   path: string
   requiredRoles?: string[]
   requiredPermissions?: string[]

package/src/virtualized/components/VirtualizedGrid.tsx

@@ -15,6 +15,7 @@ export const VirtualizedGrid = (props: VirtualizedGridProps) => {
 
   return (
     <div className='virtualized-grid-container'>
+      {/* @ts-ignore - library types may be incompatible with newer TS */}
       <Grid ref={gridRef} {...props} />
     </div>
   )

package/src/virtualized/components/VirtualizedWindowScroller.tsx

@@ -43,6 +43,7 @@ const WrappedVirtualizedWindowScroller = ({
   }, [windowDimensions])
 
   return (
+    // @ts-ignore - library types may be incompatible with newer TS
     <WindowScroller scrollElement={scrollElement}>
       {(props) =>
         children({