@soul-refiner/design-system 0.2.90 → 0.2.92

package/dist/components/input/calendar/calendar.js

@@ -3,9 +3,8 @@ import React from 'react';
 import styled from 'styled-components';
 import { MONTHS, WEEKDAYS } from '../../../common';
 import { Button, P } from '../..';
-import { ChevronLeft, ChevronRight } from '../../../icons';
+import { ChevronLeft, ChevronRight, Calendar as CalendarIcon, } from '../../../icons';
 import { buildCalendar, zeroPad } from '../../../utils';
-import { Icons } from 'index';
 export const CalendarInput = ({ selectedDate, onSelect: parentOnSelect, }) => {
     const today = new Date();
     today.setHours(0);
@@ -71,7 +70,7 @@ export const CalendarInput = ({ selectedDate, onSelect: parentOnSelect, }) => {
     return (React.createElement(Wrapper, { onBlurCapture: handleBlur, ref: pickerRef, tabIndex: 0 },
         React.createElement(InputWrapper, null,
             React.createElement(Input, { value: `${month} / ${day} / ${year}`, onFocus: handleShow, style: { letterSpacing: '1px', fontSize: '16px' }, readOnly: true }),
-            React.createElement(Icons.Calendar, null)),
+            React.createElement(CalendarIcon, null)),
         show && (React.createElement(DateSelector, null,
             React.createElement(InnerWrapper, null,
                 React.createElement("div", null,

package/dist/components/input/time/time.js

@@ -1,8 +1,8 @@
 'use client';
-import { Dropdown } from 'components/actions/dropdown/dropdown';
-import { Icons } from 'index';
+import { Dropdown } from '../../actions/dropdown';
 import React from 'react';
 import styled from 'styled-components';
+import { Clock } from '../../../icons';
 export const Time = ({ selectedTime, setTime, selectedPeriod, setPeriod, }) => {
     const hours = React.useMemo(() => {
         const hours = [];
@@ -19,7 +19,7 @@ export const Time = ({ selectedTime, setTime, selectedPeriod, setPeriod, }) => {
             label: hour,
         })), containerSx: "height: 440px;", trigger: React.createElement(InputWrapper, null,
             React.createElement(Input, { readOnly: true, value: `${selectedTime} ${selectedPeriod}` }),
-            React.createElement(Icons.Clock, null)), additionalOptions: [
+            React.createElement(Clock, null)), additionalOptions: [
             {
                 label: 'AM',
                 value: 'AM',

package/dist/components/navigation/inner/inner.d.ts

@@ -16,6 +16,10 @@ declare const InnerNav: {
         ({ href, label, sx }: InnerNavBackButtonProps): React.JSX.Element;
         displayName: string;
     };
+    Header: {
+        ({ children }: InnerNavHeaderProps): React.JSX.Element;
+        displayName: string;
+    };
     Drawer: {
         ({ children, label }: InnerNavDrawerProps): React.JSX.Element;
         displayName: string;
@@ -74,6 +78,10 @@ export interface InnerNavBackButtonProps {
     label: React.ReactNode;
     sx?: string;
 }
+/*************************************************************************************************************************
+ * Header
+ */
+export type InnerNavHeaderProps = React.PropsWithChildren;
 /*************************************************************************************************************************
  * Create Button
  */

package/dist/components/navigation/inner/inner.js

@@ -4,6 +4,7 @@ import { Button } from '../../../components/actions/button';
 import { Drawer } from '../../../components/surfaces/drawer';
 import { ChevronDown, ChevronLeft, ChevronUp, Plus } from '../../../icons';
 const INNER_NAV_CHILD_TYPES = [
+    'Header',
     'Item',
     'Dropdown',
     'BackButton',
@@ -15,6 +16,7 @@ const INNER_NAV_CHILD_TYPES = [
  */
 const InnerNav = ({ children }) => {
     const elementsByType = {
+        Header: [],
         Item: [],
         Dropdown: [],
         BackButton: [],
@@ -25,8 +27,8 @@ const InnerNav = ({ children }) => {
     for (const child of _children) {
         const isValidChild = React.isValidElement(child);
         const isInnerNavChild = isValidChild &&
-            INNER_NAV_CHILD_TYPES.includes(child?.type?.displayName.replace('InnerNav.', ''));
-        if (isValidChild && isInnerNavChild) {
+            INNER_NAV_CHILD_TYPES.includes(child?.type?.displayName?.replace('InnerNav.', ''));
+        if (isInnerNavChild) {
             const type = child?.type?.displayName.replace('InnerNav.', '');
             elementsByType[type].push(child);
         }
@@ -35,6 +37,7 @@ const InnerNav = ({ children }) => {
         }
     }
     return (React.createElement(NavWrapper, { "aria-label": "side-navigation" },
+        React.createElement("div", null, elementsByType['Header']),
         React.createElement("div", null, elementsByType['BackButton']),
         React.createElement("div", null, elementsByType['Drawer']),
         React.createElement("div", null, elementsByType['Item']),
@@ -137,6 +140,12 @@ const BackButton = styled.a `
 `;
 InnerNav.BackButton = InnerNavBackButton;
 InnerNavBackButton.displayName = 'InnerNav.BackButton';
+const InnerNavHeader = ({ children }) => {
+    return React.createElement(HeaderWrapper, null, children);
+};
+const HeaderWrapper = styled.div ``;
+InnerNav.Header = InnerNavHeader;
+InnerNavHeader.displayName = 'InnerNav.Header';
 const InnerNavDrawer = ({ children, label }) => {
     return (React.createElement(Drawer, null,
         React.createElement(Drawer.Trigger, null,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soul-refiner/design-system",
-  "version": "0.2.90",
+  "version": "0.2.92",
   "main": "dist/index.js",
   "license": "MIT",
   "publishConfig": {