change docs, remove ComponentSize refs

bruceharrison1984 · Jan 10, 2023 · e448ec0 · e448ec0
1 parent a2af3ac
commit e448ec0
Show file tree

Hide file tree

Showing 7 changed files with 88 additions and 100 deletions.
diff --git a/apps/schedulely-docs/docs/Components/Header.md b/apps/schedulely-docs/docs/Components/Header.md
@@ -1,93 +1,88 @@
----
-title: Header Component
----
-
-## Description
-
-The `HeaderComponent` defines how the large banner at the top of the calendar appears. It can include as many or
-as few controls as you want.
-
-## Component Props
-
-```tsx
-export interface HeaderProps {
-  month: string;
-  year: number;
-  isCurrentMonth: boolean;
-  onNextMonth: () => void;
-  onNextYear: () => void;
-  onPrevMonth: () => void;
-  onPrevYear: () => void;
-}
-```
-
-| Property       | Type            | Description                                                                          |
-| -------------- | --------------- | ------------------------------------------------------------------------------------ |
-| month          | `string`        | The current month the calendar is displaying                                         |
-| year           | `number`        | The current year the calendar is displaying                                          |
-| isCurrentMonth | `boolean`       | True if the selected month is the same as the current month                          |
-| onNextMonth    | `() => void`    | Calling this functions moves to the next month                                       |
-| onNextYear     | `() => void`    | Calling this functions moves to the same month of the next year                      |
-| onPrevMonth    | `() => void`    | Calling this functions moves to the previous month                                   |
-| onPrevYear     | `() => void`    | Calling this functions moves to the same month of the previous year                  |
-| componentSize  | `ComponentSize` | Enum value that indicates the current size of the calendar (used for element sizing) |
-
-## Example (DefaultHeader)
-
-```tsx live noInline
-// This demo is an example of what a custom component might look like if you wanted to override the default.
-// If you are using the default components, you don't need to worry about this.
-
-const DefaultHeader = ({
-  month,
-  year,
-  onNextMonth,
-  onNextYear,
-  onPrevMonth,
-  onPrevYear,
-  isCurrentMonth,
-  componentSize,
-}) => (
-  <div className="header-layout">
-    <button
-      className="header-button"
-      title="Previous Month"
-      onClick={onPrevMonth}
-    >
-      <strong>{'‹'}</strong>
-    </button>
-    <button
-      className="header-button"
-      title="Previous Year"
-      onClick={onPrevYear}
-    >
-      <strong>{'«'}</strong>
-    </button>
-
-    <div className="header-banner">
-      <span
-        className="header-text"
-        style={{ fontSize: componentSize === 'large' ? '1.5em' : '1.1em' }}
-      >
-        {month} - {year}
-      </span>
-      {isCurrentMonth && (
-        <div className="current-month-indicator" title="Current Month" />
-      )}
-    </div>
-
-    <button className="header-button" title="Next Year" onClick={onNextYear}>
-      <strong>{'»'}</strong>
-    </button>
-    <button className="header-button" title="Next Month" onClick={onNextMonth}>
-      <strong>{'›'}</strong>
-    </button>
-  </div>
-);
-
-render(
-  <div className="schedulely">
-    <DefaultHeader month="December" year="2022" componentSize={'large'} />
-  </div>
-);
-```
+---
+title: Header Component
+---
+
+## Description
+
+The `HeaderComponent` defines how the large banner at the top of the calendar appears. It can include as many or
+as few controls as you want.
+
+## Component Props
+
+```tsx
+export interface HeaderProps {
+  month: string;
+  year: number;
+  isCurrentMonth: boolean;
+  onNextMonth: () => void;
+  onNextYear: () => void;
+  onPrevMonth: () => void;
+  onPrevYear: () => void;
+}
+```
+
+| Property       | Type         | Description                                                         |
+| -------------- | ------------ | ------------------------------------------------------------------- |
+| month          | `string`     | The current month the calendar is displaying                        |
+| year           | `number`     | The current year the calendar is displaying                         |
+| isCurrentMonth | `boolean`    | True if the selected month is the same as the current month         |
+| onNextMonth    | `() => void` | Calling this functions moves to the next month                      |
+| onNextYear     | `() => void` | Calling this functions moves to the same month of the next year     |
+| onPrevMonth    | `() => void` | Calling this functions moves to the previous month                  |
+| onPrevYear     | `() => void` | Calling this functions moves to the same month of the previous year |
+
+## Example (DefaultHeader)
+
+```tsx live noInline
+// This demo is an example of what a custom component might look like if you wanted to override the default.
+// If you are using the default components, you don't need to worry about this.
+
+const DefaultHeader = ({
+  month,
+  year,
+  onNextMonth,
+  onNextYear,
+  onPrevMonth,
+  onPrevYear,
+  isCurrentMonth,
+}) => (
+  <div className="header-layout">
+    <button
+      className="header-button"
+      title="Previous Month"
+      onClick={onPrevMonth}
+    >
+      <strong>{'‹'}</strong>
+    </button>
+    <button
+      className="header-button"
+      title="Previous Year"
+      onClick={onPrevYear}
+    >
+      <strong>{'«'}</strong>
+    </button>
+
+    <div className="header-banner">
+      <span className="header-text">
+        {month} - {year}
+      </span>
+      {isCurrentMonth && (
+        <div className="current-month-indicator" title="Current Month" />
+      )}
+    </div>
+
+    <button className="header-button" title="Next Year" onClick={onNextYear}>
+      <strong>{'»'}</strong>
+    </button>
+    <button className="header-button" title="Next Month" onClick={onNextMonth}>
+      <strong>{'›'}</strong>
+    </button>
+  </div>
+);
+
+render(
+  <div className="schedulely">
+    <DefaultHeader month="December" year="2022" />
+  </div>
+);
+```
diff --git a/packages/Schedulely/__tests__/dateAdapters/dateAdapter.spec.ts b/packages/Schedulely/__tests__/dateAdapters/dateAdapter.spec.ts
@@ -1,4 +1,3 @@
-import { ComponentSize } from '@/types/ComponentSize';
 import { DateTimeAdapter } from '@/types/index';
 import { createDefaultAdapter } from '@/dateAdapters/date';
 import {

diff --git a/packages/Schedulely/__tests__/testHelpers/dateAdapter.testHelper.ts b/packages/Schedulely/__tests__/testHelpers/dateAdapter.testHelper.ts
@@ -1,4 +1,3 @@
-import { ComponentSize } from '@/types/ComponentSize';
 import chance from 'chance';
 
 const DEFAULT_ITERATIONS = 30;

diff --git a/packages/Schedulely/src/dateAdapters/date.ts b/packages/Schedulely/src/dateAdapters/date.ts
@@ -1,4 +1,3 @@
-import { ComponentSize } from '@/types/ComponentSize';
 import { DateTimeAdapter } from '@/types';
 
 /**

diff --git a/packages/Schedulely/src/types/DateAdapter.ts b/packages/Schedulely/src/types/DateAdapter.ts
@@ -1,5 +1,3 @@
-import { ComponentSize } from '@/types';
-
 /**
  * Common interface for porting date libraries so they can be used with Schedulely
  */

diff --git a/packages/Schedulely/src/types/SchedulelyProps.ts b/packages/Schedulely/src/types/SchedulelyProps.ts
@@ -1,7 +1,6 @@
 import {
   ActionContextState,
   CalendarEvent,
-  ComponentSize,
   DateTimeAdapter,
   SchedulelyComponents,
 } from '@/types';

diff --git a/packages/Schedulely/src/types/components/HeaderComponent.ts b/packages/Schedulely/src/types/components/HeaderComponent.ts
@@ -1,4 +1,3 @@
-import { ComponentSize } from '@/types';
 import { JSXElementConstructor } from 'react';
 
 /** Props used when creating a Header */