@sanity/sdk-react 0.0.0-alpha.3 → 0.0.0-alpha.30

package/src/components/auth/LoginLayout.tsx

@@ -1,81 +0,0 @@
-import {Card, Flex} from '@sanity/ui'
-
-import {LoginFooter} from './LoginFooter'
-
-/**
- * @alpha
- */
-export interface LoginLayoutProps {
-  /** Optional header content rendered at top of card */
-  header?: React.ReactNode
-
-  /** Optional footer content rendered below card. Defaults to an internal login footer */
-  footer?: React.ReactNode
-
-  /** Main content rendered in card body */
-  children?: React.ReactNode
-}
-
-/**
- * Layout component for login-related screens providing consistent styling and structure.
- * Renders content in a centered card with optional header and footer sections.
- *
- * Can be used to build custom login screens for the AuthBoundary component, including:
- * - Login provider selection (LoginComponent)
- * - OAuth callback handling (CallbackComponent)
- * - Error states (LoginErrorComponent)
- *
- * @example
- * ```tsx
- * // Custom login screen using the layout
- * function CustomLogin({header, footer}: LoginLayoutProps) {
- *   return (
- *     <LoginLayout
- *       header={header}
- *       footer={footer}
- *     >
- *       <CustomLoginContent />
- *     </LoginLayout>
- *   )
- * }
- *
- * // Use with AuthBoundary
- * <AuthBoundary
- *   LoginComponent={CustomLogin}
- *   header={<Logo />}
- * >
- *   <ProtectedContent />
- * </AuthBoundary>
- * ```
- *
- * @alpha
- */
-export function LoginLayout({
-  children,
-  footer = <LoginFooter />,
-  header,
-}: LoginLayoutProps): React.ReactNode {
-  return (
-    <div style={{width: '100%', display: 'flex'}}>
-      <Flex direction="column" gap={4} style={{width: '320px', margin: 'auto', display: 'flex'}}>
-        <Card border radius={2} paddingY={4}>
-          <Flex direction="column" gap={4}>
-            {header && (
-              <Card borderBottom paddingX={4} paddingBottom={3}>
-                {header}
-              </Card>
-            )}
-
-            {children && (
-              <Flex paddingX={4} direction="column" style={{minHeight: '154px'}}>
-                {children}
-              </Flex>
-            )}
-          </Flex>
-        </Card>
-
-        {footer}
-      </Flex>
-    </div>
-  )
-}

package/src/components/context/SanityProvider.test.tsx

@@ -1,25 +0,0 @@
-import {createSanityInstance} from '@sanity/sdk'
-import {render} from '@testing-library/react'
-import {describe, expect, it} from 'vitest'
-
-import {useSanityInstance} from '../../hooks/context/useSanityInstance'
-import {SanityProvider} from './SanityProvider'
-
-describe('SanityProvider', () => {
-  const sanityInstance = createSanityInstance({projectId: 'test-project', dataset: 'production'})
-
-  it('provides instance to nested components', () => {
-    const TestComponent = () => {
-      const instance = useSanityInstance()
-      return <div data-testid="test">{instance.identity.projectId}</div>
-    }
-
-    const {getByTestId} = render(
-      <SanityProvider sanityInstance={sanityInstance}>
-        <TestComponent />
-      </SanityProvider>,
-    )
-
-    expect(getByTestId('test')).toHaveTextContent('test-project')
-  })
-})

package/src/components/context/SanityProvider.tsx

@@ -1,42 +0,0 @@
-import {type SanityInstance} from '@sanity/sdk'
-import {createContext, type ReactElement} from 'react'
-
-/**
- * @public
- */
-export interface SanityProviderProps {
-  children: React.ReactNode
-  sanityInstance: SanityInstance
-}
-
-export const SanityInstanceContext = createContext<SanityInstance | null>(null)
-
-/**
- * Top-level context provider that provides a Sanity configuration instance.
- * This must wrap any Sanity SDK React component.
- * @public
- * @param props - Sanity project and dataset configuration
- * @returns Rendered component
- * @example
- * ```tsx
- * import {createSanityInstance} from '@sanity/sdk'
- * import {ExampleComponent, SanityProvider} from '@sanity/sdk-react'
- *
- * const sanityInstance = createSanityInstance({projectId: 'your-project-id', dataset: 'production'})
- *
- * export default function MyApp() {
- *   return (
- *     <SanityProvider sanityInstance={sanityInstance}>
- *      <ExampleComponent />
- *     </SanityProvider>
- *   )
- * }
- * ```
- */
-export const SanityProvider = ({children, sanityInstance}: SanityProviderProps): ReactElement => {
-  return (
-    <SanityInstanceContext.Provider value={sanityInstance}>
-      {children}
-    </SanityInstanceContext.Provider>
-  )
-}

package/src/css/css.config.js

@@ -1,220 +0,0 @@
-export default {
-  color: {
-    spots: {
-      'tint-0': 'hsla(0, 0%, 100%, 0.035)',
-      'tint-1': 'hsla(0, 0%, 100%, 0.1)',
-      'tint-2': 'hsla(0, 0%, 100%, 0.19)',
-      'tint-3': 'hsla(0, 0%, 100%, 0.28)',
-      'tint-4': 'hsla(0, 0%, 100%, 0.36)',
-      'tint-5': 'hsla(0, 0%, 100%, 0.45)',
-      'tint-6': 'hsla(0, 0%, 100%, 0.55)',
-      'tint-7': 'hsla(0, 0%, 100%, 0.64)',
-      'tint-8': 'hsla(0, 0%, 100%, 0.73)',
-      'tint-9': 'hsla(0, 0%, 100%, 0.815)',
-      'tint-10': 'hsla(0, 0%, 100%, 0.895)',
-      'tint-11': 'hsla(0, 0%, 100%, 0.94)',
-
-      'shade-0': 'hsla(0, 0%, 0%, 0.94)',
-      'shade-1': 'hsla(0, 0%, 0%, 0.899)',
-      'shade-2': 'hsla(0, 0%, 0%, 0.8)',
-      'shade-3': 'hsla(0, 0%, 0%, 0.69)',
-      'shade-4': 'hsla(0, 0%, 0%, 0.6)',
-      'shade-5': 'hsla(0, 0%, 0%, 0.5)',
-      'shade-6': 'hsla(0, 0%, 0%, 0.41)',
-      'shade-7': 'hsla(0, 0%, 0%, 0.32)',
-      'shade-8': 'hsla(0, 0%, 0%, 0.24)',
-      'shade-9': 'hsla(0, 0%, 0%, 0.16)',
-      'shade-10': 'hsla(0, 0%, 0%, 0.07)',
-      'shade-11': 'hsla(0, 0%, 0%, 0.035)',
-
-      'gray-0': '#000000',
-      'gray-1': '#1a1a1a',
-      'gray-2': '#353535',
-      'gray-3': '#4e4e4e',
-      'gray-4': '#686868',
-      'gray-5': '#808080',
-      'gray-6': '#979797',
-      'gray-7': '#adadad',
-      'gray-8': '#c2c2c2',
-      'gray-9': '#d7d7d7',
-      'gray-10': '#ebebeb',
-      'gray-11': '#ffffff',
-
-      'slate-gray-0': '#0c0c0e',
-      'slate-gray-1': '#26262c',
-      'slate-gray-2': '#403f49',
-      'slate-gray-3': '#595865',
-      'slate-gray-4': '#71707f',
-      'slate-gray-5': '#878697',
-      'slate-gray-6': '#9d9cad',
-      'slate-gray-7': '#b1b0c0',
-      'slate-gray-8': '#c4c4d0',
-      'slate-gray-9': '#d7d6e0',
-      'slate-gray-10': '#e8e8ee',
-      'slate-gray-11': '#fafafb',
-
-      'blue-0': '#060c16',
-      'blue-1': '#122443',
-      'blue-2': '#1f3c6f',
-      'blue-3': '#2e5397',
-      'blue-4': '#3e6aba',
-      'blue-5': '#5180d7',
-      'blue-6': '#6696ec',
-      'blue-7': '#7faaf9',
-      'blue-8': '#99beff',
-      'blue-9': '#b6d2ff',
-      'blue-10': '#d4e4ff',
-      'blue-11': '#f2f7ff',
-
-      'indigo-0': '#0d0a18',
-      'indigo-1': '#271f4b',
-      'indigo-2': '#41337b',
-      'indigo-3': '#5b48a6',
-      'indigo-4': '#735dcc',
-      'indigo-5': '#8a72ea',
-      'indigo-6': '#a088ff',
-      'indigo-7': '#b39eff',
-      'indigo-8': '#c6b3ff',
-      'indigo-9': '#d7c9ff',
-      'indigo-10': '#e8e0ff',
-      'indigo-11': '#f8f6ff',
-
-      'violet-0': '#160a1b',
-      'violet-1': '#3b1a47',
-      'violet-2': '#5e2a72',
-      'violet-3': '#7f3c98',
-      'violet-4': '#9d4eba',
-      'violet-5': '#b662d6',
-      'violet-6': '#cb77eb',
-      'violet-7': '#db8ef8',
-      'violet-8': '#e7a6ff',
-      'violet-9': '#f0c0ff',
-      'violet-10': '#f7daff',
-      'violet-11': '#fdf4ff',
-
-      'magenta-0': '#130811',
-      'magenta-1': '#381831',
-      'magenta-2': '#5c2850',
-      'magenta-3': '#803870',
-      'magenta-4': '#a4488f',
-      'magenta-5': '#c858af',
-      'magenta-6': '#db6ec3',
-      'magenta-7': '#e289ce',
-      'magenta-8': '#e8a4d9',
-      'magenta-9': '#efbfe4',
-      'magenta-10': '#f6daf0',
-      'magenta-11': '#fdf5fb',
-
-      'red-0': '#130707',
-      'red-1': '#3b1516',
-      'red-2': '#632325',
-      'red-3': '#8b3233',
-      'red-4': '#b34042',
-      'red-5': '#db4e51',
-      'red-6': '#f06467',
-      'red-7': '#f28183',
-      'red-8': '#f59d9f',
-      'red-9': '#f8babb',
-      'red-10': '#fbd7d7',
-      'red-11': '#fef3f3',
-
-      'red-orange-0': '#120705',
-      'red-orange-1': '#371410',
-      'red-orange-2': '#5c221a',
-      'red-orange-3': '#813025',
-      'red-orange-4': '#a63e2f',
-      'red-orange-5': '#cc4c3a',
-      'red-orange-6': '#e06150',
-      'red-orange-7': '#e67f70',
-      'red-orange-8': '#eb9c91',
-      'red-orange-9': '#f1b9b1',
-      'red-orange-10': '#f7d6d1',
-      'red-orange-11': '#fdf3f2',
-
-      'orange-0': '#201307',
-      'orange-1': '#43240f',
-      'orange-2': '#693612',
-      'orange-3': '#8f4812',
-      'orange-4': '#b05710',
-      'orange-5': '#d1660c',
-      'orange-6': '#f47603',
-      'orange-7': '#ff8f32',
-      'orange-8': '#ffa960',
-      'orange-9': '#ffc28c',
-      'orange-10': '#ffdab8',
-      'orange-11': '#fff2e7',
-
-      'yellow-0': '#000000',
-      'yellow-1': '#413b15',
-      'yellow-2': '#655c19',
-      'yellow-3': '#857a1a',
-      'yellow-4': '#a1941a',
-      'yellow-5': '#c0b017',
-      'yellow-6': '#eedb0b',
-      'yellow-7': '#feee45',
-      'yellow-8': '#fdf377',
-      'yellow-9': '#fdf8a2',
-      'yellow-10': '#fdfcca',
-      'yellow-11': '#fffff1',
-
-      'green-0': '#011409',
-      'green-1': '#0a311e',
-      'green-2': '#134d33',
-      'green-3': '#1b6846',
-      'green-4': '#238158',
-      'green-5': '#2b9968',
-      'green-6': '#34b379',
-      'green-7': '#45dc8f',
-      'green-8': '#58f19c',
-      'green-9': '#9ef4c4',
-      'green-10': '#c5f9dd',
-      'green-11': '#effff9',
-
-      'teal-0': '#080e0c',
-      'teal-1': '#152621',
-      'teal-2': '#1d3f35',
-      'teal-3': '#25594a',
-      'teal-4': '#2b7560',
-      'teal-5': '#309178',
-      'teal-6': '#48a98e',
-      'teal-7': '#6eb9a1',
-      'teal-8': '#90c9b6',
-      'teal-9': '#b0d8ca',
-      'teal-10': '#d0e8df',
-      'teal-11': '#f0f8f5',
-
-      'cyan-0': '#000000',
-      'cyan-1': '#132223',
-      'cyan-2': '#1b3f41',
-      'cyan-3': '#205e62',
-      'cyan-4': '#237f84',
-      'cyan-5': '#21a2a8',
-      'cyan-6': '#45bbc1',
-      'cyan-7': '#74c9cd',
-      'cyan-8': '#9ad6d9',
-      'cyan-9': '#bde4e6',
-      'cyan-10': '#def2f2',
-      'cyan-11': '#ffffff',
-    },
-  },
-  fonts: {
-    sans: 'Inter, system-ui, Avenir, Helvetica, Arial, sans-serif',
-  },
-  grid: {
-    steps: 12,
-  },
-  spaceScale: {
-    steps: 6,
-    baseMin: 16,
-    baseMax: 16,
-    scaleMin: 'minor-third',
-    scaleMax: 'minor-third',
-  },
-  typeScale: {
-    steps: 6,
-    baseMin: 16,
-    baseMax: 16,
-    scaleMin: 'minor-third',
-    scaleMax: 'minor-third',
-  },
-}