uikit-react-public 0.44.5 → 0.45.1

package/lib/components/Paragraph/__tests__/Paragraph.test.tsx

@@ -73,4 +73,28 @@ describe('Paragraph', () => {
     const paragraph = screen.getByTestId('custom-test-id');
     expect(paragraph).toBeDefined();
   });
+
+  test('md-numeric uses mono font family', () => {
+    render(
+      <ThemeContextProvider>
+        <Paragraph level='md-numeric'>0123456789</Paragraph>
+      </ThemeContextProvider>
+    );
+
+    expect(document.head.textContent).toContain(
+      'font-family:DM Mono;font-size:16px;font-weight:400;line-height:150%;'
+    );
+  });
+
+  test('md-medium-numeric uses mono font family', () => {
+    render(
+      <ThemeContextProvider>
+        <Paragraph level='md-medium-numeric'>0123456789</Paragraph>
+      </ThemeContextProvider>
+    );
+
+    expect(document.head.textContent).toContain(
+      'font-family:DM Mono;font-size:16px;font-weight:450;line-height:150%;'
+    );
+  });
 });

package/lib/components/Search/__tests__/__snapshots__/Search.test.tsx.snap

@@ -8,7 +8,7 @@ exports[`Search > snapshot: no props 1`] = `
     class="ucl-uikit-input css-1bpb1dw"
   >
     <input
-      class="ucl-uikit-input__input css-r12x3w"
+      class="ucl-uikit-input__input css-q3oxlx"
       data-testid="ucl-uikit-search"
       id=""
       placeholder=""
@@ -87,7 +87,7 @@ exports[`Search > snapshot: testId prop 1`] = `
     class="ucl-uikit-input css-1bpb1dw"
   >
     <input
-      class="ucl-uikit-input__input css-r12x3w"
+      class="ucl-uikit-input__input css-q3oxlx"
       data-testid="test123"
       id=""
       placeholder=""

package/lib/components/Text/Text.tsx

@@ -12,6 +12,7 @@ export type TextLevel =
   | 'md'
   | 'md-medium'
   | 'md-semibold'
+  | 'md-numeric'
   | 'md-medium-numeric'
   | 'sm'
   | 'sm-medium'
@@ -44,6 +45,7 @@ const Text = ({
         md,
         mdMedium,
         mdSemibold,
+        mdNumeric,
         mdMediumNumeric,
         sm,
         smMedium,
@@ -103,7 +105,17 @@ const Text = ({
     line-height: ${mdSemibold.lineHeight}%;
   `;
 
+  const mdNumericStyle = css`
+    font-family: ${mdNumeric.fontFamily};
+    font-feature-settings: ${mdNumeric.fontSettings};
+    font-size: ${mdNumeric.fontSize}px;
+    font-weight: ${mdNumeric.fontWeight};
+    line-height: ${mdNumeric.lineHeight}%;
+  `;
+
   const mdMediumNumericStyle = css`
+    font-family: ${mdMediumNumeric.fontFamily};
+    font-feature-settings: ${mdMediumNumeric.fontSettings};
     font-size: ${mdMediumNumeric.fontSize}px;
     font-weight: ${mdMediumNumeric.fontWeight};
     line-height: ${mdMediumNumeric.lineHeight}%;
@@ -149,6 +161,7 @@ const Text = ({
     level === 'md' && mdStyle,
     level === 'md-medium' && mdMediumStyle,
     level === 'md-semibold' && mdSemiboldStyle,
+    level === 'md-numeric' && mdNumericStyle,
     level === 'md-medium-numeric' && mdMediumNumericStyle,
     level === 'sm' && smStyle,
     level === 'sm-medium' && smMediumStyle,

package/lib/components/Text/__tests__/Text.test.tsx

@@ -0,0 +1,41 @@
+import { describe, expect, test } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import Text from '../Text';
+import { ThemeContextProvider } from '../../../theme/useTheme';
+
+describe('Text', () => {
+  test('Test ID: Default', () => {
+    render(
+      <ThemeContextProvider>
+        <Text>This is a test</Text>
+      </ThemeContextProvider>
+    );
+
+    const text = screen.getByTestId('ucl-uikit-text');
+    expect(text).toBeDefined();
+  });
+
+  test('md-numeric uses mono font family', () => {
+    render(
+      <ThemeContextProvider>
+        <Text level='md-numeric'>0123456789</Text>
+      </ThemeContextProvider>
+    );
+
+    expect(document.head.textContent).toContain(
+      'font-family:DM Mono;font-size:16px;font-weight:400;line-height:150%;'
+    );
+  });
+
+  test('md-medium-numeric uses mono font family', () => {
+    render(
+      <ThemeContextProvider>
+        <Text level='md-medium-numeric'>0123456789</Text>
+      </ThemeContextProvider>
+    );
+
+    expect(document.head.textContent).toContain(
+      'font-family:DM Mono;font-size:16px;font-weight:450;line-height:150%;'
+    );
+  });
+});

package/lib/components/Textarea/Textarea.tsx

@@ -41,21 +41,20 @@ const Textarea = forwardRef<Ref, TextareaProps>(
     }, [value, setCharCount]);
 
     const baseStyle = css`
-      line-height: 150%;
       box-sizing: border-box;
       padding: ${theme.padding.p16};
       font-family: ${md.fontFamily};
       font-feature-settings: ${md.fontSettings};
       font-size: ${md.fontSize}px;
       font-weight: ${md.fontWeight};
+      line-height: ${md.lineHeight}%;
       color: ${theme.colour.text.default};
       background-color: ${theme.colour.fill.inverse};
       border: ${theme.border.b1} solid ${theme.colour.speciality.inputDefault};
+      border-radius: ${theme.radius.r4};
       outline: none;
       box-sizing: border-box;
       width: 100%;
-      min-width: 50px;
-      max-width: 660px;
       height: 106px;
       min-height: 64px;
 

package/lib/components/Textarea/__tests__/__snapshots__/Textarea.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`Textarea > snapshot: Disabled 1`] = `
 <textarea
-  class="ucl-uikit-textarea css-yfw4f5"
+  class="ucl-uikit-textarea css-dbajsl"
   data-testid="ucl-uikit-textarea"
   disabled=""
   id=""
@@ -11,7 +11,7 @@ exports[`Textarea > snapshot: Disabled 1`] = `
 
 exports[`Textarea > snapshot: Placeholder 1`] = `
 <textarea
-  class="ucl-uikit-textarea css-1eai1zv"
+  class="ucl-uikit-textarea css-elmoey"
   data-testid="ucl-uikit-textarea"
   id=""
   placeholder="test"
@@ -20,7 +20,7 @@ exports[`Textarea > snapshot: Placeholder 1`] = `
 
 exports[`Textarea > snapshot: custom test id 1`] = `
 <textarea
-  class="ucl-uikit-textarea css-1eai1zv"
+  class="ucl-uikit-textarea css-elmoey"
   data-testid="custom-test-id"
   id=""
 />
@@ -28,7 +28,7 @@ exports[`Textarea > snapshot: custom test id 1`] = `
 
 exports[`Textarea > snapshot: minimal props 1`] = `
 <textarea
-  class="ucl-uikit-textarea css-1eai1zv"
+  class="ucl-uikit-textarea css-elmoey"
   data-testid="ucl-uikit-textarea"
   id=""
 />

package/lib/components/index.ts

@@ -221,9 +221,18 @@ export type { FileInputProps } from './FileInput';
 export { default as Timepicker } from './Timepicker';
 export type { TimepickerProps } from './Timepicker';
 
+/** @deprecated Use CookiesNotice instead. */
 export { default as CookieNotice } from './CookieNotice';
 export type { CookieNoticeProps } from './CookieNotice';
 
+export { default as CookiesNotice } from './CookiesNotice';
+export type {
+  CookieCategory,
+  CookiePreferences,
+  CookiesNoticeBaseProps,
+  CookiesNoticeProps,
+} from './CookiesNotice';
+
 export { default as Search } from './Search';
 export type { SearchProps } from './Search';