diff --git a/docs/app.vue b/docs/app.vue index 231fa4c..ef04dae 100644 --- a/docs/app.vue +++ b/docs/app.vue @@ -26,13 +26,9 @@ onMounted(async () => { diff --git a/docs/assets/css/main.css b/docs/assets/css/main.css index 72ff309..d07de5e 100644 --- a/docs/assets/css/main.css +++ b/docs/assets/css/main.css @@ -19,16 +19,15 @@ html.dark body { @apply selection:bg-fuchsia-600; } html body::before { - @apply opacity-100; + @apply h-lvh w-screen opacity-100; @apply contrast-[300%]; @apply mix-blend-overlay; @apply brightness-[100%]; + @apply inset-0; content: ""; position: fixed; inset: 0; z-index: -1; - width: 100vw; - height: 100vh; background-size: cover; background-image: radial-gradient( circle at 50% 40%, @@ -42,6 +41,19 @@ html.dark body::before { @apply mix-blend-multiply; @apply contrast-[150%]; @apply brightness-[70%]; + @apply inset-0; +} + +.DocSearch-Reset { + @apply text-white; +} + +.DocSearch-SearchBar { + @apply grid grid-cols-[minmax(0,1fr)_auto]; +} + +.DocSearch-SearchBar form { + @apply grid grid-cols-[auto_0_minmax(0,1fr)_auto]; } .monaco-editor, @@ -137,7 +149,7 @@ html.dark body::before { } .page-section table code { - @apply rounded bg-slate-100 p-1 font-mono min-[1400px]:text-base; + @apply me-2 rounded bg-slate-100 p-1 font-mono min-[1400px]:text-base; @apply dark:bg-purple-950 dark:text-slate-100; } .page-section table tr:nth-child(odd) code { diff --git a/docs/components/CodeExample.client.vue b/docs/components/CodeExample.client.vue index 0245004..cc26fde 100644 --- a/docs/components/CodeExample.client.vue +++ b/docs/components/CodeExample.client.vue @@ -155,13 +155,13 @@ const stopWatch = watch(el, () => { min-[1600px]:-mr-64 shadow-sm bg-[#f9f9f9] ${'' /* --vs-editor-background */} - after:-z-10 - after:absolute - after:-inset-px - after:bg-sky-600/50 - after:rounded-lg + after:-z-10 + after:absolute + after:-inset-px + after:bg-sky-600/50 + after:rounded-lg - dark:bg-[#180626] ${'' /* --vs-editor-background */} + dark:bg-[#180626] ${'' /* --vs-editor-background */} dark:after:-inset-px dark:after:bg-purple-900 `"> @@ -190,7 +190,7 @@ const stopWatch = watch(el, () => { `"> @@ -199,7 +199,7 @@ const stopWatch = watch(el, () => {
{{ sensibleError }}
diff --git a/docs/components/CodeExample.server.vue b/docs/components/CodeExample.server.vue index 1690b52..4f2b6fc 100644 --- a/docs/components/CodeExample.server.vue +++ b/docs/components/CodeExample.server.vue @@ -6,12 +6,13 @@ code.value = value.default diff --git a/docs/components/TheSidebar.vue b/docs/components/TheSidebar.vue index 7ef168f..4a021ce 100644 --- a/docs/components/TheSidebar.vue +++ b/docs/components/TheSidebar.vue @@ -15,10 +15,10 @@ onMounted(() => { document.querySelectorAll("h3:not([data-sidebar-exclude=true])") ) as HTMLElement[]) || [] - // add ids to all headings based on their text content + // add ids to all headings based on their text content if id is not already present const headings = Array.from(document.querySelectorAll("h2, h3")) headings.forEach((heading) => { - const id = heading.textContent?.toLowerCase().replace(/\s/g, "-") + const id = heading?.id ?? heading.textContent?.toLowerCase().replace(/\s/g, "-") if (id) { heading.id = id } diff --git a/docs/components/content/Data.vue b/docs/components/content/Data.vue index a78ea92..8b6f9cc 100644 --- a/docs/components/content/Data.vue +++ b/docs/components/content/Data.vue @@ -3,6 +3,7 @@ import type { FunctionRef, ObjectRef } from "../../src/types" const fns: Record< string, { + name: string description: string return: string arguments: FunctionRef["arguments"] @@ -12,6 +13,7 @@ const fns: Record< } > = { ap: { + name: "ap", description: "Returns either am or pm but in any given locale.", return: "Date", arguments: [ @@ -27,6 +29,7 @@ const fns: Record< example: "ap", }, dayOfYear: { + name: "day-of-year", description: `Gets the day of the year a given date is. For example, August 1st is the 213th day of the year on non-leap years and 214th on leap years.`, arguments: [ { @@ -37,6 +40,7 @@ const fns: Record< return: "number", }, formatStr: { + name: "format-str", description: "This little gem of a function returns the token format for a given format style.", arguments: [ @@ -53,6 +57,7 @@ const fns: Record< example: "format-str", }, fourDigitYear: { + name: "four-digit-year", description: "Converts a 2 digit year into a 4 digit year. This function assumes years 20 years into the future belong to the current century, and the past 80 are in the past century.", arguments: [ @@ -64,6 +69,7 @@ const fns: Record< return: "number", }, iso8601: { + name: "iso-8601", description: "Validates that a given date passes “acceptable” levels of ISO 8601 compatibility and can be utilized within Tempo. This allows incomplete dates but must include at least the year and month. Does not require the T separator.", arguments: [ @@ -75,6 +81,7 @@ const fns: Record< return: "string", }, monthDays: { + name: "month-days", description: "Returns the number of days in a given month.", arguments: [ { @@ -85,6 +92,7 @@ const fns: Record< return: "number", }, nearestDay: { + name: "nearest-day", description: "Performs a bidirectional search for the nearest date that passes a given search function. It stops searching when it finds a result or when it reaches the constraint bounds (on both sides).", arguments: [ @@ -104,6 +112,7 @@ const fns: Record< return: "Date | null", }, offset: { + name: "offset", description: "Returns the offset between two (IANA) timezones on a given date. The results are ISO 8601 compatible string offsets like -0800 or +0530.", arguments: [ @@ -125,6 +134,7 @@ const fns: Record< return: "string", }, parseParts: { + name: "parse-parts", description: 'Given a date string like "2019/12/31" and the parts (like those returned from the parts function) this function returns the parts with the appropriate values extracted from the date string and added to a value property.', arguments: [ @@ -151,6 +161,7 @@ const fns: Record< example: "parseParts", }, parts: { + name: "parts", description: 'Given a format and locale, this function produces an array of "parts". Similar to Intl.DateTimeFormat.formatToParts() but it accepts style formats and token formats and returns parts with granular data such as the part’s token and a regex to match for it.', arguments: [ @@ -209,6 +220,7 @@ const fns: Record< return: "Part[]", }, range: { + name: "range", description: "Returns an array of options for a given token in a given locale. For example, the token MMMM in the locale en-US would return ['January', 'February', 'March', ...].", arguments: [ @@ -230,22 +242,8 @@ const fns: Record< return: "string[]", example: "range", }, - sameDay: { - description: - "Checks if two dates are the same day. This function is useful for comparing dates but ignoring the time.", - arguments: [ - { - name: "dateA", - type: "Date", - }, - { - name: "dateB", - type: "Date", - }, - ], - return: "boolean", - }, yearDays: { + name: "year-days", description: "Returns the number of days in a given year. Leap years and century years cause this to not always be 365.", arguments: [ @@ -268,20 +266,13 @@ const fns: Record< data that is commonly needed to build applications.

-

{{ fn }}

- +

{{ fn }}

+

- +

diff --git a/docs/components/content/Helpers.vue b/docs/components/content/Helpers.vue index db978dd..0253501 100644 --- a/docs/components/content/Helpers.vue +++ b/docs/components/content/Helpers.vue @@ -10,6 +10,81 @@ const fns: Record< tip?: string } > = { + sameSecond: { + description: + "Checks if two dates are the same second. This function is useful for comparing dates but ignoring the milliseconds.", + arguments: [ + { + name: "dateA", + type: "Date", + }, + { + name: "dateB", + type: "Date", + }, + ], + return: "boolean", + }, + sameMinute: { + description: + "Checks if two dates are the same minute. This function is useful for comparing dates but ignoring the seconds and milliseconds.", + arguments: [ + { + name: "dateA", + type: "Date", + }, + { + name: "dateB", + type: "Date", + }, + ], + return: "boolean", + }, + sameHour: { + description: + "Checks if two dates are the same hour. This function is useful for comparing dates but ignoring the minutes, seconds, and milliseconds.", + arguments: [ + { + name: "dateA", + type: "Date", + }, + { + name: "dateB", + type: "Date", + }, + ], + return: "boolean", + }, + sameDay: { + description: + "Checks if two dates are the same day. This function is useful for comparing dates but ignoring the time.", + arguments: [ + { + name: "dateA", + type: "Date", + }, + { + name: "dateB", + type: "Date", + }, + ], + return: "boolean", + }, + sameYear: { + description: + "Checks if two dates are the same year. This function is useful for comparing dates but ignoring the month, day, and time.", + arguments: [ + { + name: "dateA", + type: "Date", + }, + { + name: "dateB", + type: "Date", + }, + ], + return: "boolean", + }, isBefore: { description: "Returns true if the first date is before the second date, otherwise false.", diff --git a/docs/components/content/Modify.vue b/docs/components/content/Modify.vue index abe8fb1..0f63939 100644 --- a/docs/components/content/Modify.vue +++ b/docs/components/content/Modify.vue @@ -3,6 +3,7 @@ import type { FunctionRef } from "../../src/types" const fns: Record< string, { + name: string description: string return: string arguments: FunctionRef["arguments"] @@ -11,6 +12,7 @@ const fns: Record< } > = { addDay: { + name: 'add-day', description: "Returns a new Date object with a positive or negative number of days applied to date argument. To subtract days, use a negative number.", return: "Date", @@ -27,6 +29,7 @@ const fns: Record< example: "addDay", }, addHour: { + name: 'add-hour', description: "Returns a new Date object with a positive or negative number of hours applied to date argument. To subtract hours, use a negative number.", return: "Date", @@ -42,6 +45,7 @@ const fns: Record< ], }, addMinute: { + name: 'add-minute', description: "Returns a new Date object with a positive or negative number of minutes applied to date argument. To subtract minutes, use a negative number.", return: "Date", @@ -57,6 +61,7 @@ const fns: Record< ], }, addMonth: { + name: 'add-month', description: `Returns a new Date object with a positive or negative number of months applied to date argument. To subtract months, use a negative number. Sometimes the result will "overflow" the available days of @@ -82,6 +87,7 @@ const fns: Record< ], }, addSecond: { + name: 'add-second', description: "Returns a new Date object with a positive or negative number of seconds applied to date argument. To subtract seconds, use a negative number.", return: "Date", @@ -97,6 +103,7 @@ const fns: Record< ], }, addYear: { + name: 'add-year', description: `Returns a new Date object with a positive or negative number of years applied to date argument. To subtract years, use a negative number. Sometimes the result will "overflow" the available days of @@ -122,6 +129,7 @@ const fns: Record< ], }, applyOffset: { + name: 'apply-offset', description: `Returns a new Date object with a timezone offset applied to date argument — this function does fundamentally change the date but can be very useful when working with timezones. Read more in the timezone section.`, @@ -140,6 +148,7 @@ const fns: Record< example: "applyOffset", }, date: { + name: 'date', description: `Converts an ISO 8601 like string into a Date object (noop on Date objects). ISO 8601 strings do not need to be complete to be accepted, but you need at least a year and month.`, return: "Date", arguments: [ @@ -152,6 +161,7 @@ const fns: Record< tip: 'To produce a date in a given timezone either include the offset in the date string (ex: "2021-01-01T00:00:00-0800") or use the tzDate function.', }, dayEnd: { + name: 'day-end', description: `Returns a new Date object with the time set to 23:59:59.999 (local time).`, return: "Date", arguments: [ @@ -162,6 +172,7 @@ const fns: Record< ], }, dayStart: { + name: 'day-start', description: `Returns a new Date object with the time set to 00:00:00.000 (local time).`, return: "Date", arguments: [ @@ -172,6 +183,7 @@ const fns: Record< ], }, hourEnd: { + name: 'hour-end', description: `Returns a new Date object with the minutes part of the time set to 59:59.999 (local time).`, return: "Date", arguments: [ @@ -182,6 +194,7 @@ const fns: Record< ], }, hourStart: { + name: 'hour-start', description: `Returns a new Date object with the minutes part of the time set to 00:00.000 (local time).`, return: "Date", arguments: [ @@ -192,6 +205,7 @@ const fns: Record< ], }, minuteEnd: { + name: 'minute-end', description: `Returns a new Date object with the seconds part of the time set to 59.999 (local time).`, return: "Date", arguments: [ @@ -202,6 +216,7 @@ const fns: Record< ], }, minuteStart: { + name: 'minute-start', description: `Returns a new Date object with the seconds part of the time set to 00.000 (local time).`, return: "Date", arguments: [ @@ -212,6 +227,7 @@ const fns: Record< ], }, monthEnd: { + name: 'month-end', description: `Returns a new Date object with the date set to the last day of the current month (does not modify the time).`, return: "Date", arguments: [ @@ -222,6 +238,7 @@ const fns: Record< ], }, monthStart: { + name: 'month-start', description: `Returns a new Date object with the date set to the first day of the current month and the time set to 00:00:00 (local).`, return: "Date", arguments: [ @@ -232,6 +249,7 @@ const fns: Record< ], }, removeOffset: { + name: 'remove-offset', description: `Returns a new Date object with the inverse of the specified offset applied. This can be helpful to normalize time information across timezones.`, return: "Date", arguments: [ @@ -247,6 +265,7 @@ const fns: Record< ], }, tzDate: { + name: 'tz-date', description: `Converts an ISO 8601 like string into a Date object with a timezone applied. For example, tzDate('2021-01-01T00:00', 'America/Los_Angeles') will return a Date object representing 2021-01-01 00:00 in L.A.`, return: "Date", arguments: [ @@ -263,6 +282,7 @@ const fns: Record< example: "tzDate", }, weekEnd: { + name: 'week-end', description: `Returns a new Date object with the date set to the last day of the current week with the time set to 23:59:59 (local).`, return: "Date", arguments: [ @@ -278,6 +298,7 @@ const fns: Record< ], }, weekStart: { + name: 'week-start', description: `Returns a new Date object with the date set to the first day of the current week with the time set to 00:00:00 (local).`, return: "Date", arguments: [ @@ -293,6 +314,7 @@ const fns: Record< ], }, yearEnd: { + name: 'year-end', description: "Returns a new Date object with the date set to the end of the year", return: "Date", arguments: [ @@ -303,6 +325,7 @@ const fns: Record< ], }, yearStart: { + name: 'year-start', description: "Returns a new Date object with the date set to the start of the year", return: "Date", arguments: [ @@ -325,12 +348,8 @@ const fns: Record< do not change the date argument).

-

{{ fn }}

- +

{{ fn }}

+

diff --git a/docs/components/content/Parse.vue b/docs/components/content/Parse.vue index 5509b6c..36ddcb5 100644 --- a/docs/components/content/Parse.vue +++ b/docs/components/content/Parse.vue @@ -41,19 +41,14 @@ const parseOptionsProperties = [