tinacms 0.68.6 → 0.68.7

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.
package/dist/index.js CHANGED
@@ -59,6 +59,7 @@ var __objRest = (source, exclude) => {
59
59
  var G__namespace = /* @__PURE__ */ _interopNamespace(G);
60
60
  var set__default = /* @__PURE__ */ _interopDefaultLegacy(set);
61
61
  var React__default = /* @__PURE__ */ _interopDefaultLegacy(React);
62
+ var React__namespace = /* @__PURE__ */ _interopNamespace(React);
62
63
  var gql__default = /* @__PURE__ */ _interopDefaultLegacy(gql$1);
63
64
  var yup__namespace = /* @__PURE__ */ _interopNamespace(yup);
64
65
  var styled__default = /* @__PURE__ */ _interopDefaultLegacy(styled);
@@ -2467,19 +2468,25 @@ mutation addPendingDocumentMutation(
2467
2468
  }
2468
2469
  }`, { variables: { collection, relativePath } });
2469
2470
  }
2470
- async fetchCollection(collectionName, includeDocuments) {
2471
+ async fetchCollection(collectionName, includeDocuments, after) {
2471
2472
  if (includeDocuments === true) {
2472
2473
  if (this.useDataLayer) {
2473
2474
  const sort = this.schema.getIsTitleFieldName(collectionName);
2474
2475
  const response = await this.api.request(`#graphql
2475
- query($collection: String!, $includeDocuments: Boolean!, $sort: String){
2476
+ query($collection: String!, $includeDocuments: Boolean!, $sort: String, $limit: Float, $after: String){
2476
2477
  collection(collection: $collection){
2477
2478
  name
2478
2479
  label
2479
2480
  format
2480
2481
  templates
2481
- documents(sort: $sort) @include(if: $includeDocuments) {
2482
+ documents(sort: $sort, after: $after, first: $limit) @include(if: $includeDocuments) {
2482
2483
  totalCount
2484
+ pageInfo {
2485
+ hasPreviousPage
2486
+ hasNextPage
2487
+ startCursor
2488
+ endCursor
2489
+ }
2483
2490
  edges {
2484
2491
  node {
2485
2492
  ... on Document {
@@ -2498,7 +2505,15 @@ mutation addPendingDocumentMutation(
2498
2505
  }
2499
2506
  }
2500
2507
  }
2501
- }`, { variables: { collection: collectionName, includeDocuments, sort } });
2508
+ }`, {
2509
+ variables: {
2510
+ collection: collectionName,
2511
+ includeDocuments,
2512
+ sort,
2513
+ limit: 10,
2514
+ after
2515
+ }
2516
+ });
2502
2517
  return response.collection;
2503
2518
  } else {
2504
2519
  const response = await this.api.request(`#graphql
@@ -2514,7 +2529,6 @@ mutation addPendingDocumentMutation(
2514
2529
  node {
2515
2530
  ... on Document {
2516
2531
  _sys {
2517
- # TODO: only include title if we need to
2518
2532
  template
2519
2533
  breadcrumbs
2520
2534
  path
@@ -2729,7 +2743,7 @@ mutation addPendingDocumentMutation(
2729
2743
  }))));
2730
2744
  };
2731
2745
  const TinaCloudAuthWall = TinaCloudProvider;
2732
- var styles = '*, ::before, ::after {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(0 132 255 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n}\n.tina-tailwind .pointer-events-auto {\n pointer-events: auto;\n}\n.tina-tailwind .static {\n position: static;\n}\n.tina-tailwind .fixed {\n position: fixed;\n}\n.tina-tailwind .absolute {\n position: absolute;\n}\n.tina-tailwind .relative {\n position: relative;\n}\n.tina-tailwind .inset-0 {\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n}\n.tina-tailwind .left-0 {\n left: 0px;\n}\n.tina-tailwind .top-0 {\n top: 0px;\n}\n.tina-tailwind .top-8 {\n top: 32px;\n}\n.tina-tailwind .right-0 {\n right: 0px;\n}\n.tina-tailwind .top-10 {\n top: 40px;\n}\n.tina-tailwind .top-4 {\n top: 16px;\n}\n.tina-tailwind .z-overlay {\n z-index: 10600;\n}\n.tina-tailwind .z-menu {\n z-index: 9800;\n}\n.tina-tailwind .z-50 {\n z-index: 50;\n}\n.tina-tailwind .mx-auto {\n margin-left: auto;\n margin-right: auto;\n}\n.tina-tailwind .-ml-px {\n margin-left: -1px;\n}\n.tina-tailwind .mr-2 {\n margin-right: 8px;\n}\n.tina-tailwind .mb-2 {\n margin-bottom: 8px;\n}\n.tina-tailwind .mb-1 {\n margin-bottom: 4px;\n}\n.tina-tailwind .-mt-0\\.5 {\n margin-top: -2px;\n}\n.tina-tailwind .-mt-0 {\n margin-top: -0px;\n}\n.tina-tailwind .ml-1 {\n margin-left: 4px;\n}\n.tina-tailwind .mt-2 {\n margin-top: 8px;\n}\n.tina-tailwind .mr-1\\.5 {\n margin-right: 6px;\n}\n.tina-tailwind .mr-1 {\n margin-right: 4px;\n}\n.tina-tailwind .block {\n display: block;\n}\n.tina-tailwind .inline-block {\n display: inline-block;\n}\n.tina-tailwind .inline {\n display: inline;\n}\n.tina-tailwind .flex {\n display: flex;\n}\n.tina-tailwind .inline-flex {\n display: inline-flex;\n}\n.tina-tailwind .table {\n display: table;\n}\n.tina-tailwind .h-screen {\n height: 100vh;\n}\n.tina-tailwind .h-auto {\n height: auto;\n}\n.tina-tailwind .h-full {\n height: 100%;\n}\n.tina-tailwind .h-6 {\n height: 24px;\n}\n.tina-tailwind .h-7 {\n height: 28px;\n}\n.tina-tailwind .h-10 {\n height: 40px;\n}\n.tina-tailwind .h-5 {\n height: 20px;\n}\n.tina-tailwind .h-12 {\n height: 48px;\n}\n.tina-tailwind .w-full {\n width: 100%;\n}\n.tina-tailwind .w-10 {\n width: 40px;\n}\n.tina-tailwind .w-auto {\n width: auto;\n}\n.tina-tailwind .w-5 {\n width: 20px;\n}\n.tina-tailwind .w-56 {\n width: 224px;\n}\n.tina-tailwind .w-0 {\n width: 0px;\n}\n.tina-tailwind .w-6 {\n width: 24px;\n}\n.tina-tailwind .max-w-lg {\n max-width: 32rem;\n}\n.tina-tailwind .max-w-screen-xl {\n max-width: 1280px;\n}\n.tina-tailwind .max-w-form {\n max-width: 900px;\n}\n.tina-tailwind .max-w-full {\n max-width: 100%;\n}\n.tina-tailwind .flex-1 {\n flex: 1 1 0%;\n}\n.tina-tailwind .flex-shrink-0 {\n flex-shrink: 0;\n}\n.tina-tailwind .flex-grow-0 {\n flex-grow: 0;\n}\n.tina-tailwind .table-auto {\n table-layout: auto;\n}\n.tina-tailwind .origin-top-right {\n transform-origin: top right;\n}\n.tina-tailwind .-translate-x-full {\n --tw-translate-x: -100%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .translate-x-0 {\n --tw-translate-x: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .translate-x-full {\n --tw-translate-x: 100%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .scale-95 {\n --tw-scale-x: .95;\n --tw-scale-y: .95;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .scale-100 {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .cursor-pointer {\n cursor: pointer;\n}\n.tina-tailwind .flex-col {\n flex-direction: column;\n}\n.tina-tailwind .items-end {\n align-items: flex-end;\n}\n.tina-tailwind .items-center {\n align-items: center;\n}\n.tina-tailwind .items-stretch {\n align-items: stretch;\n}\n.tina-tailwind .justify-end {\n justify-content: flex-end;\n}\n.tina-tailwind .justify-center {\n justify-content: center;\n}\n.tina-tailwind .justify-between {\n justify-content: space-between;\n}\n.tina-tailwind .gap-0\\.5 {\n gap: 2px;\n}\n.tina-tailwind .gap-0 {\n gap: 0px;\n}\n.tina-tailwind .gap-4 {\n gap: 16px;\n}\n.tina-tailwind .gap-3 {\n gap: 12px;\n}\n.tina-tailwind .divide-y > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-y-reverse: 0;\n border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));\n border-bottom-width: calc(1px * var(--tw-divide-y-reverse));\n}\n.tina-tailwind .divide-gray-150 > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-opacity: 1;\n border-color: rgb(230 227 239 / var(--tw-divide-opacity));\n}\n.tina-tailwind .overflow-hidden {\n overflow: hidden;\n}\n.tina-tailwind .overflow-y-auto {\n overflow-y: auto;\n}\n.tina-tailwind .whitespace-nowrap {\n white-space: nowrap;\n}\n.tina-tailwind .rounded-lg {\n border-radius: 8px;\n}\n.tina-tailwind .rounded {\n border-radius: 4px;\n}\n.tina-tailwind .rounded-full {\n border-radius: 9999px;\n}\n.tina-tailwind .rounded-md {\n border-radius: 6px;\n}\n.tina-tailwind .rounded-r-md {\n border-top-right-radius: 6px;\n border-bottom-right-radius: 6px;\n}\n.tina-tailwind .border {\n border-width: 1px;\n}\n.tina-tailwind .border-b {\n border-bottom-width: 1px;\n}\n.tina-tailwind .border-gray-150 {\n --tw-border-opacity: 1;\n border-color: rgb(230 227 239 / var(--tw-border-opacity));\n}\n.tina-tailwind .border-gray-200 {\n --tw-border-opacity: 1;\n border-color: rgb(225 221 236 / var(--tw-border-opacity));\n}\n.tina-tailwind .bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-gray-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(246 246 249 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-blue-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(0 132 255 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-gradient-to-b {\n background-image: linear-gradient(to bottom, var(--tw-gradient-stops));\n}\n.tina-tailwind .bg-gradient-to-br {\n background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));\n}\n.tina-tailwind .from-blue-900 {\n --tw-gradient-from: #1D2C6C;\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(29 44 108 / 0));\n}\n.tina-tailwind .from-gray-800 {\n --tw-gradient-from: #363145;\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(54 49 69 / 0));\n}\n.tina-tailwind .via-gray-900 {\n --tw-gradient-stops: var(--tw-gradient-from), #252336, var(--tw-gradient-to, rgb(37 35 54 / 0));\n}\n.tina-tailwind .to-gray-900 {\n --tw-gradient-to: #252336;\n}\n.tina-tailwind .to-black {\n --tw-gradient-to: #000;\n}\n.tina-tailwind .px-4 {\n padding-left: 16px;\n padding-right: 16px;\n}\n.tina-tailwind .py-6 {\n padding-top: 24px;\n padding-bottom: 24px;\n}\n.tina-tailwind .px-5 {\n padding-left: 20px;\n padding-right: 20px;\n}\n.tina-tailwind .py-4 {\n padding-top: 16px;\n padding-bottom: 16px;\n}\n.tina-tailwind .px-12 {\n padding-left: 48px;\n padding-right: 48px;\n}\n.tina-tailwind .py-10 {\n padding-top: 40px;\n padding-bottom: 40px;\n}\n.tina-tailwind .px-20 {\n padding-left: 80px;\n padding-right: 80px;\n}\n.tina-tailwind .px-6 {\n padding-left: 24px;\n padding-right: 24px;\n}\n.tina-tailwind .py-1 {\n padding-top: 4px;\n padding-bottom: 4px;\n}\n.tina-tailwind .py-2 {\n padding-top: 8px;\n padding-bottom: 8px;\n}\n.tina-tailwind .py-5 {\n padding-top: 20px;\n padding-bottom: 20px;\n}\n.tina-tailwind .pt-4 {\n padding-top: 16px;\n}\n.tina-tailwind .pb-4 {\n padding-bottom: 16px;\n}\n.tina-tailwind .pt-18 {\n padding-top: 72px;\n}\n.tina-tailwind .pl-18 {\n padding-left: 72px;\n}\n.tina-tailwind .text-left {\n text-align: left;\n}\n.tina-tailwind .text-center {\n text-align: center;\n}\n.tina-tailwind .font-sans {\n font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n}\n.tina-tailwind .text-2xl {\n font-size: 24px;\n line-height: 1.33;\n}\n.tina-tailwind .text-base {\n font-size: 16px;\n line-height: 1.5;\n}\n.tina-tailwind .text-sm {\n font-size: 14px;\n line-height: 1.43;\n}\n.tina-tailwind .text-xl {\n font-size: 20px;\n line-height: 1.4;\n}\n.tina-tailwind .text-md {\n font-size: 16px;\n line-height: 1.5;\n}\n.tina-tailwind .text-xs {\n font-size: 13px;\n line-height: 1.33;\n}\n.tina-tailwind .font-medium {\n font-weight: 500;\n}\n.tina-tailwind .uppercase {\n text-transform: uppercase;\n}\n.tina-tailwind .italic {\n font-style: italic;\n}\n.tina-tailwind .leading-normal {\n line-height: 1.5;\n}\n.tina-tailwind .leading-tight {\n line-height: 1.25;\n}\n.tina-tailwind .leading-5 {\n line-height: 20px;\n}\n.tina-tailwind .tracking-wide {\n letter-spacing: 0.025em;\n}\n.tina-tailwind .text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(86 81 101 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-700 {\n --tw-text-opacity: 1;\n color: rgb(67 62 82 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-blue-600 {\n --tw-text-opacity: 1;\n color: rgb(5 116 228 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-500 {\n --tw-text-opacity: 1;\n color: rgb(113 108 127 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-400 {\n --tw-text-opacity: 1;\n color: rgb(145 140 158 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-current {\n color: currentColor;\n}\n.tina-tailwind .text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-800 {\n --tw-text-opacity: 1;\n color: rgb(54 49 69 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(37 35 54 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity));\n}\n.tina-tailwind .underline {\n text-decoration-line: underline;\n}\n.tina-tailwind .opacity-100 {\n opacity: 1;\n}\n.tina-tailwind .opacity-0 {\n opacity: 0;\n}\n.tina-tailwind .opacity-80 {\n opacity: .8;\n}\n.tina-tailwind .opacity-90 {\n opacity: .9;\n}\n.tina-tailwind .opacity-50 {\n opacity: .5;\n}\n.tina-tailwind .opacity-70 {\n opacity: .7;\n}\n.tina-tailwind .shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .shadow-2xl {\n --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .shadow {\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .ring-1 {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.tina-tailwind .ring-black {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity));\n}\n.tina-tailwind .ring-opacity-5 {\n --tw-ring-opacity: .05;\n}\n.tina-tailwind .filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.tina-tailwind .transition-opacity {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tina-tailwind .transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tina-tailwind .transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tina-tailwind .transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tina-tailwind .duration-300 {\n transition-duration: 300ms;\n}\n.tina-tailwind .duration-200 {\n transition-duration: 200ms;\n}\n.tina-tailwind .duration-150 {\n transition-duration: 150ms;\n}\n.tina-tailwind .duration-100 {\n transition-duration: 100ms;\n}\n.tina-tailwind .duration-75 {\n transition-duration: 75ms;\n}\n.tina-tailwind .ease-out {\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n.tina-tailwind .ease-in {\n transition-timing-function: cubic-bezier(0.4, 0, 1, 1);\n}\n.tina-tailwind .icon-parent svg {\n fill: currentColor;\n }\n\n.tina-tailwind {\n font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n font-size: 16px;\n line-height: 1.5;\n --tw-text-opacity: 1;\n color: rgb(86 81 101 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:bg-blue-600:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(5 116 228 / var(--tw-bg-opacity));\n}\n\n.tina-tailwind .hover\\:text-blue-600:hover {\n --tw-text-opacity: 1;\n color: rgb(5 116 228 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:text-blue-400:hover {\n --tw-text-opacity: 1;\n color: rgb(34 150 254 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:opacity-100:hover {\n opacity: 1;\n}\n\n.tina-tailwind .focus\\:text-blue-400:focus {\n --tw-text-opacity: 1;\n color: rgb(34 150 254 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .focus\\:underline:focus {\n text-decoration-line: underline;\n}\n\n.tina-tailwind .focus\\:shadow-outline:focus {\n --tw-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);\n --tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.tina-tailwind .focus\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n\n.tina-tailwind .focus\\:ring-2:focus {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n.tina-tailwind .focus\\:ring-blue-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(0 132 255 / var(--tw-ring-opacity));\n}\n';
2746
+ var styles = '*, ::before, ::after {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(0 132 255 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n}\n.tina-tailwind .pointer-events-auto {\n pointer-events: auto;\n}\n.tina-tailwind .static {\n position: static;\n}\n.tina-tailwind .fixed {\n position: fixed;\n}\n.tina-tailwind .absolute {\n position: absolute;\n}\n.tina-tailwind .relative {\n position: relative;\n}\n.tina-tailwind .inset-0 {\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n}\n.tina-tailwind .left-0 {\n left: 0px;\n}\n.tina-tailwind .top-0 {\n top: 0px;\n}\n.tina-tailwind .top-8 {\n top: 32px;\n}\n.tina-tailwind .right-0 {\n right: 0px;\n}\n.tina-tailwind .top-10 {\n top: 40px;\n}\n.tina-tailwind .top-4 {\n top: 16px;\n}\n.tina-tailwind .z-overlay {\n z-index: 10600;\n}\n.tina-tailwind .z-menu {\n z-index: 9800;\n}\n.tina-tailwind .z-50 {\n z-index: 50;\n}\n.tina-tailwind .mx-auto {\n margin-left: auto;\n margin-right: auto;\n}\n.tina-tailwind .-ml-px {\n margin-left: -1px;\n}\n.tina-tailwind .mr-2 {\n margin-right: 8px;\n}\n.tina-tailwind .mb-2 {\n margin-bottom: 8px;\n}\n.tina-tailwind .mb-1 {\n margin-bottom: 4px;\n}\n.tina-tailwind .-mt-0\\.5 {\n margin-top: -2px;\n}\n.tina-tailwind .-mt-0 {\n margin-top: -0px;\n}\n.tina-tailwind .ml-1 {\n margin-left: 4px;\n}\n.tina-tailwind .mt-2 {\n margin-top: 8px;\n}\n.tina-tailwind .mr-1\\.5 {\n margin-right: 6px;\n}\n.tina-tailwind .mr-1 {\n margin-right: 4px;\n}\n.tina-tailwind .block {\n display: block;\n}\n.tina-tailwind .inline-block {\n display: inline-block;\n}\n.tina-tailwind .inline {\n display: inline;\n}\n.tina-tailwind .flex {\n display: flex;\n}\n.tina-tailwind .inline-flex {\n display: inline-flex;\n}\n.tina-tailwind .table {\n display: table;\n}\n.tina-tailwind .h-screen {\n height: 100vh;\n}\n.tina-tailwind .h-auto {\n height: auto;\n}\n.tina-tailwind .h-full {\n height: 100%;\n}\n.tina-tailwind .h-6 {\n height: 24px;\n}\n.tina-tailwind .h-7 {\n height: 28px;\n}\n.tina-tailwind .h-10 {\n height: 40px;\n}\n.tina-tailwind .h-5 {\n height: 20px;\n}\n.tina-tailwind .h-12 {\n height: 48px;\n}\n.tina-tailwind .w-full {\n width: 100%;\n}\n.tina-tailwind .w-10 {\n width: 40px;\n}\n.tina-tailwind .w-auto {\n width: auto;\n}\n.tina-tailwind .w-5 {\n width: 20px;\n}\n.tina-tailwind .w-56 {\n width: 224px;\n}\n.tina-tailwind .w-0 {\n width: 0px;\n}\n.tina-tailwind .w-6 {\n width: 24px;\n}\n.tina-tailwind .max-w-lg {\n max-width: 32rem;\n}\n.tina-tailwind .max-w-screen-xl {\n max-width: 1280px;\n}\n.tina-tailwind .max-w-form {\n max-width: 900px;\n}\n.tina-tailwind .max-w-full {\n max-width: 100%;\n}\n.tina-tailwind .flex-1 {\n flex: 1 1 0%;\n}\n.tina-tailwind .flex-shrink-0 {\n flex-shrink: 0;\n}\n.tina-tailwind .flex-grow-0 {\n flex-grow: 0;\n}\n.tina-tailwind .table-auto {\n table-layout: auto;\n}\n.tina-tailwind .origin-top-right {\n transform-origin: top right;\n}\n.tina-tailwind .-translate-x-full {\n --tw-translate-x: -100%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .translate-x-0 {\n --tw-translate-x: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .translate-x-full {\n --tw-translate-x: 100%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .scale-95 {\n --tw-scale-x: .95;\n --tw-scale-y: .95;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .scale-100 {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .cursor-pointer {\n cursor: pointer;\n}\n.tina-tailwind .flex-col {\n flex-direction: column;\n}\n.tina-tailwind .items-end {\n align-items: flex-end;\n}\n.tina-tailwind .items-center {\n align-items: center;\n}\n.tina-tailwind .items-stretch {\n align-items: stretch;\n}\n.tina-tailwind .justify-end {\n justify-content: flex-end;\n}\n.tina-tailwind .justify-center {\n justify-content: center;\n}\n.tina-tailwind .justify-between {\n justify-content: space-between;\n}\n.tina-tailwind .gap-0\\.5 {\n gap: 2px;\n}\n.tina-tailwind .gap-0 {\n gap: 0px;\n}\n.tina-tailwind .gap-4 {\n gap: 16px;\n}\n.tina-tailwind .gap-3 {\n gap: 12px;\n}\n.tina-tailwind .divide-y > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-y-reverse: 0;\n border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));\n border-bottom-width: calc(1px * var(--tw-divide-y-reverse));\n}\n.tina-tailwind .divide-gray-150 > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-opacity: 1;\n border-color: rgb(230 227 239 / var(--tw-divide-opacity));\n}\n.tina-tailwind .overflow-hidden {\n overflow: hidden;\n}\n.tina-tailwind .overflow-y-auto {\n overflow-y: auto;\n}\n.tina-tailwind .whitespace-nowrap {\n white-space: nowrap;\n}\n.tina-tailwind .rounded-lg {\n border-radius: 8px;\n}\n.tina-tailwind .rounded {\n border-radius: 4px;\n}\n.tina-tailwind .rounded-full {\n border-radius: 9999px;\n}\n.tina-tailwind .rounded-md {\n border-radius: 6px;\n}\n.tina-tailwind .rounded-r-md {\n border-top-right-radius: 6px;\n border-bottom-right-radius: 6px;\n}\n.tina-tailwind .border {\n border-width: 1px;\n}\n.tina-tailwind .border-b {\n border-bottom-width: 1px;\n}\n.tina-tailwind .border-gray-150 {\n --tw-border-opacity: 1;\n border-color: rgb(230 227 239 / var(--tw-border-opacity));\n}\n.tina-tailwind .border-gray-200 {\n --tw-border-opacity: 1;\n border-color: rgb(225 221 236 / var(--tw-border-opacity));\n}\n.tina-tailwind .bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-gray-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(246 246 249 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-blue-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(0 132 255 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-gradient-to-b {\n background-image: linear-gradient(to bottom, var(--tw-gradient-stops));\n}\n.tina-tailwind .bg-gradient-to-br {\n background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));\n}\n.tina-tailwind .from-blue-900 {\n --tw-gradient-from: #1D2C6C;\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(29 44 108 / 0));\n}\n.tina-tailwind .from-gray-800 {\n --tw-gradient-from: #363145;\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(54 49 69 / 0));\n}\n.tina-tailwind .via-gray-900 {\n --tw-gradient-stops: var(--tw-gradient-from), #252336, var(--tw-gradient-to, rgb(37 35 54 / 0));\n}\n.tina-tailwind .to-gray-900 {\n --tw-gradient-to: #252336;\n}\n.tina-tailwind .to-black {\n --tw-gradient-to: #000;\n}\n.tina-tailwind .px-4 {\n padding-left: 16px;\n padding-right: 16px;\n}\n.tina-tailwind .py-6 {\n padding-top: 24px;\n padding-bottom: 24px;\n}\n.tina-tailwind .px-5 {\n padding-left: 20px;\n padding-right: 20px;\n}\n.tina-tailwind .py-4 {\n padding-top: 16px;\n padding-bottom: 16px;\n}\n.tina-tailwind .px-12 {\n padding-left: 48px;\n padding-right: 48px;\n}\n.tina-tailwind .py-10 {\n padding-top: 40px;\n padding-bottom: 40px;\n}\n.tina-tailwind .px-20 {\n padding-left: 80px;\n padding-right: 80px;\n}\n.tina-tailwind .px-6 {\n padding-left: 24px;\n padding-right: 24px;\n}\n.tina-tailwind .py-1 {\n padding-top: 4px;\n padding-bottom: 4px;\n}\n.tina-tailwind .py-2 {\n padding-top: 8px;\n padding-bottom: 8px;\n}\n.tina-tailwind .py-5 {\n padding-top: 20px;\n padding-bottom: 20px;\n}\n.tina-tailwind .pt-4 {\n padding-top: 16px;\n}\n.tina-tailwind .pb-4 {\n padding-bottom: 16px;\n}\n.tina-tailwind .pt-18 {\n padding-top: 72px;\n}\n.tina-tailwind .pt-3 {\n padding-top: 12px;\n}\n.tina-tailwind .pl-18 {\n padding-left: 72px;\n}\n.tina-tailwind .text-left {\n text-align: left;\n}\n.tina-tailwind .text-center {\n text-align: center;\n}\n.tina-tailwind .font-sans {\n font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n}\n.tina-tailwind .text-2xl {\n font-size: 24px;\n line-height: 1.33;\n}\n.tina-tailwind .text-base {\n font-size: 16px;\n line-height: 1.5;\n}\n.tina-tailwind .text-sm {\n font-size: 14px;\n line-height: 1.43;\n}\n.tina-tailwind .text-xl {\n font-size: 20px;\n line-height: 1.4;\n}\n.tina-tailwind .text-md {\n font-size: 16px;\n line-height: 1.5;\n}\n.tina-tailwind .text-xs {\n font-size: 13px;\n line-height: 1.33;\n}\n.tina-tailwind .font-medium {\n font-weight: 500;\n}\n.tina-tailwind .uppercase {\n text-transform: uppercase;\n}\n.tina-tailwind .italic {\n font-style: italic;\n}\n.tina-tailwind .leading-normal {\n line-height: 1.5;\n}\n.tina-tailwind .leading-tight {\n line-height: 1.25;\n}\n.tina-tailwind .leading-5 {\n line-height: 20px;\n}\n.tina-tailwind .tracking-wide {\n letter-spacing: 0.025em;\n}\n.tina-tailwind .text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(86 81 101 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-700 {\n --tw-text-opacity: 1;\n color: rgb(67 62 82 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-blue-600 {\n --tw-text-opacity: 1;\n color: rgb(5 116 228 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-500 {\n --tw-text-opacity: 1;\n color: rgb(113 108 127 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-400 {\n --tw-text-opacity: 1;\n color: rgb(145 140 158 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-current {\n color: currentColor;\n}\n.tina-tailwind .text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-800 {\n --tw-text-opacity: 1;\n color: rgb(54 49 69 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(37 35 54 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity));\n}\n.tina-tailwind .underline {\n text-decoration-line: underline;\n}\n.tina-tailwind .opacity-100 {\n opacity: 1;\n}\n.tina-tailwind .opacity-0 {\n opacity: 0;\n}\n.tina-tailwind .opacity-80 {\n opacity: .8;\n}\n.tina-tailwind .opacity-90 {\n opacity: .9;\n}\n.tina-tailwind .opacity-50 {\n opacity: .5;\n}\n.tina-tailwind .opacity-70 {\n opacity: .7;\n}\n.tina-tailwind .shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .shadow-2xl {\n --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .shadow {\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .ring-1 {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.tina-tailwind .ring-black {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity));\n}\n.tina-tailwind .ring-opacity-5 {\n --tw-ring-opacity: .05;\n}\n.tina-tailwind .filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.tina-tailwind .transition-opacity {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tina-tailwind .transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tina-tailwind .transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tina-tailwind .transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tina-tailwind .duration-300 {\n transition-duration: 300ms;\n}\n.tina-tailwind .duration-200 {\n transition-duration: 200ms;\n}\n.tina-tailwind .duration-150 {\n transition-duration: 150ms;\n}\n.tina-tailwind .duration-100 {\n transition-duration: 100ms;\n}\n.tina-tailwind .duration-75 {\n transition-duration: 75ms;\n}\n.tina-tailwind .ease-out {\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n.tina-tailwind .ease-in {\n transition-timing-function: cubic-bezier(0.4, 0, 1, 1);\n}\n.tina-tailwind .icon-parent svg {\n fill: currentColor;\n }\n\n.tina-tailwind {\n font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n font-size: 16px;\n line-height: 1.5;\n --tw-text-opacity: 1;\n color: rgb(86 81 101 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:bg-blue-600:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(5 116 228 / var(--tw-bg-opacity));\n}\n\n.tina-tailwind .hover\\:text-blue-600:hover {\n --tw-text-opacity: 1;\n color: rgb(5 116 228 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:text-blue-400:hover {\n --tw-text-opacity: 1;\n color: rgb(34 150 254 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:opacity-100:hover {\n opacity: 1;\n}\n\n.tina-tailwind .focus\\:text-blue-400:focus {\n --tw-text-opacity: 1;\n color: rgb(34 150 254 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .focus\\:underline:focus {\n text-decoration-line: underline;\n}\n\n.tina-tailwind .focus\\:shadow-outline:focus {\n --tw-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);\n --tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.tina-tailwind .focus\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n\n.tina-tailwind .focus\\:ring-2:focus {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n.tina-tailwind .focus\\:ring-blue-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(0 132 255 / var(--tw-ring-opacity));\n}\n';
2733
2747
  class ContentCreatorPlugin {
2734
2748
  constructor(options) {
2735
2749
  this.__type = "content-creator";
@@ -3400,6 +3414,9 @@ This will work when developing locally but NOT when deployed to production.
3400
3414
  function BiEdit(props) {
3401
3415
  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "m7 17.013 4.413-.015 9.632-9.54c.378-.378.586-.88.586-1.414s-.208-1.036-.586-1.414l-1.586-1.586c-.756-.756-2.075-.752-2.825-.003L7 12.583v4.43zM18.045 4.458l1.589 1.583-1.597 1.582-1.586-1.585 1.594-1.58zM9 13.417l6.03-5.973 1.586 1.586-6.029 5.971L9 15.006v-1.589z" } }, { "tag": "path", "attr": { "d": "M5 21h14c1.103 0 2-.897 2-2v-8.668l-2 2V19H8.158c-.026 0-.053.01-.079.01-.033 0-.066-.009-.1-.01H5V5h6.847l2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2z" } }] })(props);
3402
3416
  }
3417
+ function BiLeftArrowAlt(props) {
3418
+ return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M12.707 17.293 8.414 13H18v-2H8.414l4.293-4.293-1.414-1.414L4.586 12l6.707 6.707z" } }] })(props);
3419
+ }
3403
3420
  function BiLogIn(props) {
3404
3421
  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "m13 16 5-4-5-4v3H4v2h9z" } }, { "tag": "path", "attr": { "d": "M20 3h-9c-1.103 0-2 .897-2 2v4h2V5h9v14h-9v-4H9v4c0 1.103.897 2 2 2h9c1.103 0 2-.897 2-2V5c0-1.103-.897-2-2-2z" } }] })(props);
3405
3422
  }
@@ -3412,6 +3429,9 @@ This will work when developing locally but NOT when deployed to production.
3412
3429
  function BiPlus(props) {
3413
3430
  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M19 11h-6V5h-2v6H5v2h6v6h2v-6h6z" } }] })(props);
3414
3431
  }
3432
+ function BiRightArrowAlt(props) {
3433
+ return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "m11.293 17.293 1.414 1.414L19.414 12l-6.707-6.707-1.414 1.414L15.586 11H6v2h9.586z" } }] })(props);
3434
+ }
3415
3435
  function BiTrash(props) {
3416
3436
  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M5 20a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8h2V6h-4V4a2 2 0 0 0-2-2H9a2 2 0 0 0-2 2v2H3v2h2zM9 4h6v2H9zM8 8h9v12H7V8z" } }, { "tag": "path", "attr": { "d": "M9 10h2v8H9zm4 0h2v8h-2z" } }] })(props);
3417
3437
  }
@@ -3755,7 +3775,7 @@ This will work when developing locally but NOT when deployed to production.
3755
3775
  fontWeight: "normal"
3756
3776
  }
3757
3777
  }, "Please wait, Tina is loading data..."))));
3758
- const useGetCollection = (cms, collectionName, includeDocuments = true) => {
3778
+ const useGetCollection = (cms, collectionName, includeDocuments = true, after = "") => {
3759
3779
  const api = new TinaAdminApi(cms);
3760
3780
  const [collection, setCollection] = React.useState(void 0);
3761
3781
  const [loading, setLoading] = React.useState(true);
@@ -3765,7 +3785,7 @@ This will work when developing locally but NOT when deployed to production.
3765
3785
  const fetchCollection = async () => {
3766
3786
  if (await api.isAuthenticated()) {
3767
3787
  try {
3768
- const collection2 = await api.fetchCollection(collectionName, includeDocuments);
3788
+ const collection2 = await api.fetchCollection(collectionName, includeDocuments, after);
3769
3789
  setCollection(collection2);
3770
3790
  } catch (error2) {
3771
3791
  cms.alerts.error(`[${error2.name}] GetCollection failed: ${error2.message}`, 30 * 1e3);
@@ -3778,7 +3798,7 @@ This will work when developing locally but NOT when deployed to production.
3778
3798
  };
3779
3799
  setLoading(true);
3780
3800
  fetchCollection();
3781
- }, [cms, collectionName, resetState]);
3801
+ }, [cms, collectionName, resetState, after]);
3782
3802
  const reFetchCollection = () => setResetSate((x) => x + 1);
3783
3803
  return { collection, loading, error, reFetchCollection };
3784
3804
  };
@@ -3786,9 +3806,10 @@ This will work when developing locally but NOT when deployed to production.
3786
3806
  cms,
3787
3807
  collectionName,
3788
3808
  includeDocuments = true,
3809
+ startCursor,
3789
3810
  children
3790
3811
  }) => {
3791
- const { collection, loading, error, reFetchCollection } = useGetCollection(cms, collectionName, includeDocuments);
3812
+ const { collection, loading, error, reFetchCollection } = useGetCollection(cms, collectionName, includeDocuments, startCursor || "");
3792
3813
  if (error) {
3793
3814
  return null;
3794
3815
  }
@@ -3797,6 +3818,148 @@ This will work when developing locally but NOT when deployed to production.
3797
3818
  }
3798
3819
  return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, children(collection, loading, reFetchCollection));
3799
3820
  };
3821
+ const theme = styled.css`
3822
+ :root {
3823
+ --tina-color-primary-light: #2296fe;
3824
+ --tina-color-primary: #0084ff;
3825
+ --tina-color-primary-dark: #0574e4;
3826
+ --tina-color-error-light: #eb6337;
3827
+ --tina-color-error: #ec4815;
3828
+ --tina-color-error-dark: #dc4419;
3829
+ --tina-color-warning-light: #f5e06e;
3830
+ --tina-color-warning: #e9d050;
3831
+ --tina-color-warning-dark: #d3ba38;
3832
+ --tina-color-success-light: #57c355;
3833
+ --tina-color-success: #3cad3a;
3834
+ --tina-color-success-dark: #249a21;
3835
+ --tina-color-grey-0: #ffffff;
3836
+ --tina-color-grey-1: #f6f6f9;
3837
+ --tina-color-grey-2: #edecf3;
3838
+ --tina-color-grey-3: #e1ddec;
3839
+ --tina-color-grey-4: #b2adbe;
3840
+ --tina-color-grey-5: #918c9e;
3841
+ --tina-color-grey-6: #716c7f;
3842
+ --tina-color-grey-7: #565165;
3843
+ --tina-color-grey-8: #433e52;
3844
+ --tina-color-grey-9: #363145;
3845
+ --tina-color-grey-10: #252336;
3846
+ --tina-color-indicator: var(--tina-color-primary);
3847
+
3848
+ --tina-radius-small: 5px;
3849
+ --tina-radius-big: 24px;
3850
+
3851
+ --tina-padding-small: 12px;
3852
+ --tina-padding-big: 20px;
3853
+
3854
+ --tina-font-size-0: 12px;
3855
+ --tina-font-size-1: 13px;
3856
+ --tina-font-size-2: 15px;
3857
+ --tina-font-size-3: 16px;
3858
+ --tina-font-size-4: 18px;
3859
+ --tina-font-size-5: 20px;
3860
+ --tina-font-size-6: 22px;
3861
+ --tina-font-size-7: 26px;
3862
+ --tina-font-size-8: 32px;
3863
+
3864
+ --tina-font-family: 'Inter', sans-serif;
3865
+
3866
+ --tina-font-weight-regular: 400;
3867
+ --tina-font-weight-bold: 600;
3868
+
3869
+ --tina-shadow-big: 0px 2px 3px rgba(0, 0, 0, 0.05),
3870
+ 0 4px 12px rgba(0, 0, 0, 0.1);
3871
+ --tina-shadow-small: 0px 2px 3px rgba(0, 0, 0, 0.12);
3872
+
3873
+ --tina-timing-short: 85ms;
3874
+ --tina-timing-medium: 150ms;
3875
+ --tina-timing-long: 250ms;
3876
+
3877
+ --tina-z-index-0: 0;
3878
+ --tina-z-index-1: 10;
3879
+ --tina-z-index-2: 20;
3880
+ --tina-z-index-3: 30;
3881
+ --tina-z-index-4: 40;
3882
+ --tina-z-index-5: 50;
3883
+
3884
+ --tina-sidebar-width: 340px;
3885
+ --tina-sidebar-header-height: 60px;
3886
+ --tina-toolbar-height: 62px;
3887
+ }
3888
+ `;
3889
+ styled.createGlobalStyle`
3890
+ ${theme};
3891
+ `;
3892
+ const Button = (_g) => {
3893
+ var _h = _g, {
3894
+ variant = "secondary",
3895
+ as: Tag = "button",
3896
+ size = "medium",
3897
+ busy,
3898
+ disabled,
3899
+ rounded = "full",
3900
+ children,
3901
+ className
3902
+ } = _h, props = __objRest(_h, [
3903
+ "variant",
3904
+ "as",
3905
+ "size",
3906
+ "busy",
3907
+ "disabled",
3908
+ "rounded",
3909
+ "children",
3910
+ "className"
3911
+ ]);
3912
+ const baseClasses = "icon-parent inline-flex items-center font-medium focus:outline-none focus:ring-2 focus:shadow-outline text-center inline-flex justify-center transition-all duration-150 ease-out ";
3913
+ const variantClasses = {
3914
+ primary: `shadow text-white bg-blue-500 hover:bg-blue-600 focus:ring-blue-500`,
3915
+ secondary: `shadow text-gray-500 hover:text-blue-500 bg-gray-50 hover:bg-white border border-gray-200`,
3916
+ white: `shadow text-gray-500 hover:text-blue-500 bg-white hover:bg-gray-50 border border-gray-200`,
3917
+ ghost: `text-gray-500 hover:text-blue-500 hover:shadow border border-transparent hover:border-gray-200 bg-transparent`,
3918
+ danger: `shadow text-white bg-red-500 hover:bg-red-600 focus:ring-red-500`
3919
+ };
3920
+ const state = busy ? `busy` : disabled ? `disabled` : `default`;
3921
+ const stateClasses = {
3922
+ disabled: `pointer-events-none opacity-30 cursor-not-allowed`,
3923
+ busy: `pointer-events-none opacity-70 cursor-wait`,
3924
+ default: ``
3925
+ };
3926
+ const roundedClasses = {
3927
+ full: `rounded-full`,
3928
+ left: `rounded-l-full`,
3929
+ right: `rounded-r-full`
3930
+ };
3931
+ const sizeClasses = {
3932
+ small: `text-xs h-8 px-3`,
3933
+ medium: `text-sm h-10 px-4`,
3934
+ custom: ``
3935
+ };
3936
+ return /* @__PURE__ */ React__namespace.createElement(Tag, __spreadValues({
3937
+ className: `${baseClasses} ${variantClasses[variant]} ${sizeClasses[size]} ${stateClasses[state]} ${roundedClasses[rounded]} ${className}`
3938
+ }, props), children);
3939
+ };
3940
+ function CursorPaginator({
3941
+ navigateNext,
3942
+ navigatePrev,
3943
+ hasNext,
3944
+ hasPrev,
3945
+ variant = "secondary"
3946
+ }) {
3947
+ return /* @__PURE__ */ React__default["default"].createElement("div", {
3948
+ className: "w-full flex flex-shrink-0 justify-end gap-2 items-center"
3949
+ }, /* @__PURE__ */ React__default["default"].createElement(Button, {
3950
+ variant,
3951
+ disabled: !hasPrev,
3952
+ onClick: navigatePrev
3953
+ }, /* @__PURE__ */ React__default["default"].createElement(BiLeftArrowAlt, {
3954
+ className: "w-6 h-full mr-2 opacity-70"
3955
+ }), " Previous"), /* @__PURE__ */ React__default["default"].createElement(Button, {
3956
+ variant,
3957
+ disabled: !hasNext,
3958
+ onClick: navigateNext
3959
+ }, "Next ", /* @__PURE__ */ React__default["default"].createElement(BiRightArrowAlt, {
3960
+ className: "w-6 h-full ml-2 opacity-70"
3961
+ })));
3962
+ }
3800
3963
  const TemplateMenu = ({ templates }) => {
3801
3964
  return /* @__PURE__ */ React__default["default"].createElement(react.Menu, {
3802
3965
  as: "div",
@@ -3843,16 +4006,26 @@ This will work when developing locally but NOT when deployed to production.
3843
4006
  collection: collectionName,
3844
4007
  relativePath: ""
3845
4008
  });
4009
+ const [endCursor, setEndCursor] = React.useState("");
4010
+ const [prevCursors, setPrevCursors] = React.useState([]);
4011
+ const loc = reactRouterDom.useLocation();
4012
+ React.useEffect(() => {
4013
+ setEndCursor("");
4014
+ setPrevCursors([]);
4015
+ }, [loc]);
3846
4016
  return /* @__PURE__ */ React__default["default"].createElement(GetCMS, null, (cms) => {
3847
4017
  return /* @__PURE__ */ React__default["default"].createElement(GetCollection, {
3848
4018
  cms,
3849
4019
  collectionName,
3850
- includeDocuments: true
4020
+ includeDocuments: true,
4021
+ startCursor: endCursor
3851
4022
  }, (collection, _loading, reFetchCollection) => {
3852
4023
  var _a, _b;
3853
4024
  const totalCount = collection.documents.totalCount;
3854
4025
  const documents = collection.documents.edges;
3855
4026
  const admin = cms.api.admin;
4027
+ const pageInfo = collection.documents.pageInfo;
4028
+ const useDataFlag = cms.flags.get("experimentalData");
3856
4029
  return /* @__PURE__ */ React__default["default"].createElement(PageWrapper, null, /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, open && /* @__PURE__ */ React__default["default"].createElement(DeleteModal, {
3857
4030
  filename: vars.relativePath,
3858
4031
  deleteFunc: async () => {
@@ -3955,7 +4128,26 @@ This will work when developing locally but NOT when deployed to production.
3955
4128
  }
3956
4129
  ]
3957
4130
  })));
3958
- })))))));
4131
+ }))), useDataFlag && /* @__PURE__ */ React__default["default"].createElement("div", {
4132
+ className: "pt-3"
4133
+ }, /* @__PURE__ */ React__default["default"].createElement(CursorPaginator, {
4134
+ variant: "white",
4135
+ hasNext: pageInfo == null ? void 0 : pageInfo.hasNextPage,
4136
+ navigateNext: () => {
4137
+ const newState = [...prevCursors, endCursor];
4138
+ setPrevCursors(newState);
4139
+ setEndCursor(pageInfo == null ? void 0 : pageInfo.endCursor);
4140
+ },
4141
+ hasPrev: prevCursors.length > 0,
4142
+ navigatePrev: () => {
4143
+ const prev = prevCursors[prevCursors.length - 1];
4144
+ if (typeof prev === "string") {
4145
+ const newState = prevCursors.slice(0, -1);
4146
+ setPrevCursors(newState);
4147
+ setEndCursor(prev);
4148
+ }
4149
+ }
4150
+ }))))));
3959
4151
  });
3960
4152
  });
3961
4153
  };
package/dist/style.css CHANGED
@@ -411,6 +411,9 @@
411
411
  .tina-tailwind .pt-18 {
412
412
  padding-top: 72px;
413
413
  }
414
+ .tina-tailwind .pt-3 {
415
+ padding-top: 12px;
416
+ }
414
417
  .tina-tailwind .pl-18 {
415
418
  padding-left: 72px;
416
419
  }
@@ -10,6 +10,7 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
10
10
  See the License for the specific language governing permissions and
11
11
  limitations under the License.
12
12
  */
13
+ export declare const TINA_HOST = "content.tinajs.io";
13
14
  export interface TinaClientArgs<GenQueries = Record<string, unknown>> {
14
15
  url: string;
15
16
  token?: string;
@@ -19,6 +20,12 @@ export declare type TinaClientRequestArgs = {
19
20
  variables?: Record<string, any>;
20
21
  query: string;
21
22
  } & Partial<Omit<TinaClientArgs, 'queries'>>;
23
+ export declare type TinaClientURLParts = {
24
+ host: string;
25
+ clientId: string;
26
+ branch: string;
27
+ isLocalClient: boolean;
28
+ };
22
29
  export declare class TinaClient<GenQueries> {
23
30
  apiUrl: string;
24
31
  readonlyToken?: string;
@@ -31,5 +38,6 @@ export declare class TinaClient<GenQueries> {
31
38
  data: DataType;
32
39
  query: string;
33
40
  }>;
41
+ parseURL: (overrideUrl: string) => TinaClientURLParts;
34
42
  }
35
43
  export declare function createClient<GenQueries>(args: TinaClientArgs<GenQueries>): TinaClient<GenQueries>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tinacms",
3
- "version": "0.68.6",
3
+ "version": "0.68.7",
4
4
  "main": "dist/index.js",
5
5
  "files": [
6
6
  "dist"
@@ -28,7 +28,7 @@
28
28
  "@react-hook/window-size": "^3.0.7",
29
29
  "@tinacms/schema-tools": "0.0.4",
30
30
  "@tinacms/sharedctx": "0.1.1",
31
- "@tinacms/toolkit": "0.56.29",
31
+ "@tinacms/toolkit": "0.56.30",
32
32
  "crypto-js": "^4.0.0",
33
33
  "fetch-ponyfill": "^7.1.0",
34
34
  "final-form": "4.20.1",