@remotion/design 4.0.377 → 4.0.379

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/Input.js CHANGED
@@ -2,6 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import React from 'react';
3
3
  import { cn } from './helpers/cn';
4
4
  export const Input = React.forwardRef(({ className, ...props }, ref) => {
5
- return (_jsx("input", { ref: ref, className: cn('w-full dark:bg-[#121212] rounded-lg border-2 border-b-4 border-black outline-none h-14 px-3 fontbrand text-lg box-border', className), ...props }));
5
+ return (_jsx("input", { ref: ref, className: cn('w-full bg-white dark:bg-[#121212] rounded-lg border-2 border-b-4 border-black outline-none h-14 px-3 fontbrand text-lg box-border', className), ...props }));
6
6
  });
7
7
  Input.displayName = 'Input';
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
3
+ export declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
4
+ export {};
@@ -0,0 +1,9 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import React from 'react';
3
+ import { cn } from './helpers/cn';
4
+ export const Textarea = React.forwardRef(({ className, style, ...props }, ref) => {
5
+ return (_jsx("textarea", { ref: ref, className: cn('w-full bg-white dark:bg-[#121212] rounded-lg border-2 border-b-4 border-black outline-none px-3 py-3 fontbrand text-lg box-border field-sizing-content min-h-[90px]', className), style: {
6
+ ...style,
7
+ }, ...props }));
8
+ });
9
+ Textarea.displayName = 'Textarea';
@@ -572,7 +572,7 @@ import { jsx as jsx8 } from "react/jsx-runtime";
572
572
  var Input = React5.forwardRef(({ className, ...props }, ref) => {
573
573
  return /* @__PURE__ */ jsx8("input", {
574
574
  ref,
575
- className: cn("w-full dark:bg-[#121212] rounded-lg border-2 border-b-4 border-black outline-none h-14 px-3 fontbrand text-lg box-border", className),
575
+ className: cn("w-full bg-white dark:bg-[#121212] rounded-lg border-2 border-b-4 border-black outline-none h-14 px-3 fontbrand text-lg box-border", className),
576
576
  ...props
577
577
  });
578
578
  });
@@ -5527,14 +5527,28 @@ var Switch = ({ active, onToggle }) => {
5527
5527
  })
5528
5528
  });
5529
5529
  };
5530
- // src/Triangle.tsx
5530
+ // src/Textarea.tsx
5531
+ import React36 from "react";
5531
5532
  import { jsx as jsx24 } from "react/jsx-runtime";
5533
+ var Textarea = React36.forwardRef(({ className, style, ...props }, ref) => {
5534
+ return /* @__PURE__ */ jsx24("textarea", {
5535
+ ref,
5536
+ className: cn("w-full bg-white dark:bg-[#121212] rounded-lg border-2 border-b-4 border-black outline-none px-3 py-3 fontbrand text-lg box-border field-sizing-content min-h-[90px]", className),
5537
+ style: {
5538
+ ...style
5539
+ },
5540
+ ...props
5541
+ });
5542
+ });
5543
+ Textarea.displayName = "Textarea";
5544
+ // src/Triangle.tsx
5545
+ import { jsx as jsx25 } from "react/jsx-runtime";
5532
5546
  var Triangle2 = (props) => {
5533
- return /* @__PURE__ */ jsx24("svg", {
5547
+ return /* @__PURE__ */ jsx25("svg", {
5534
5548
  viewBox: "0 0 127 131",
5535
5549
  fill: "none",
5536
5550
  ...props,
5537
- children: /* @__PURE__ */ jsx24("path", {
5551
+ children: /* @__PURE__ */ jsx25("path", {
5538
5552
  d: "M28.5644 0.011261C25.8196 0.159241 23.6077 0.591782 21.3786 1.43413C20.2669 1.84959 18.4446 2.75455 17.4418 3.38062C13.2472 5.993 10.0496 9.9201 8.38209 14.4903C8.04973 15.3953 7.15007 18.2809 6.5713 20.2672C2.71476 33.5453 0.525761 48.0643 0.0558711 63.4312C-0.0186237 65.8785 -0.0186237 71.7066 0.0558711 74.1141C0.371041 84.3018 1.35093 93.4992 3.12735 102.879C3.84937 106.675 5.00691 111.774 5.67736 114.091C7.04692 118.798 9.84334 122.805 13.8202 125.741C16.4848 127.711 19.5105 129.031 22.8627 129.68C24.4787 129.993 26.6104 130.135 28.1805 130.033C30.3523 129.89 34.6616 129.316 38.1628 128.695C53.9442 125.901 68.5223 120.898 81.7422 113.738C90.1143 109.202 97.2715 104.29 104.177 98.3312C111.059 92.4007 116.927 86.0206 122.09 78.8608C123.287 77.2045 123.889 76.237 124.491 75.019C126.038 71.8773 126.766 68.7527 126.76 65.2582C126.76 62.0027 126.141 59.1114 124.806 56.1518C124.164 54.7233 123.551 53.6988 122.176 51.7523C117.11 44.5868 111.489 38.3433 104.635 32.2762C94.011 22.8739 81.3927 15.1619 67.3017 9.45339C64.2474 8.21835 61.239 7.13128 57.6174 5.95315C49.9502 3.46598 40.4607 1.30891 32.4324 0.233231C31.1718 0.0624847 29.4584 -0.0342712 28.5644 0.011261Z",
5539
5553
  fill: "currentcolor"
5540
5554
  })
@@ -5542,6 +5556,7 @@ var Triangle2 = (props) => {
5542
5556
  };
5543
5557
  export {
5544
5558
  Triangle2 as Triangle,
5559
+ Textarea,
5545
5560
  Switch,
5546
5561
  SelectValue2 as SelectValue,
5547
5562
  SelectTrigger2 as SelectTrigger,
package/dist/index.d.ts CHANGED
@@ -6,4 +6,5 @@ export { Input } from './Input';
6
6
  export { PlanePaperIcon } from './PaperPlaneIcon';
7
7
  export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, } from './Select';
8
8
  export { Switch } from './Switch';
9
+ export { Textarea } from './Textarea';
9
10
  export { Triangle } from './Triangle';
package/dist/index.js CHANGED
@@ -6,4 +6,5 @@ export { Input } from './Input';
6
6
  export { PlanePaperIcon } from './PaperPlaneIcon';
7
7
  export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, } from './Select';
8
8
  export { Switch } from './Switch';
9
+ export { Textarea } from './Textarea';
9
10
  export { Triangle } from './Triangle';
package/dist/tailwind.css CHANGED
@@ -276,6 +276,9 @@
276
276
  .inline-flex {
277
277
  display: inline-flex;
278
278
  }
279
+ .field-sizing-content {
280
+ field-sizing: content;
281
+ }
279
282
  .h-\(--radix-select-trigger-height\) {
280
283
  height: var(--radix-select-trigger-height);
281
284
  }
@@ -306,6 +309,9 @@
306
309
  .max-h-96 {
307
310
  max-height: calc(var(--spacing) * 96);
308
311
  }
312
+ .min-h-\[90px\] {
313
+ min-height: 90px;
314
+ }
309
315
  .w-3\.5 {
310
316
  width: calc(var(--spacing) * 3.5);
311
317
  }
@@ -439,6 +445,9 @@
439
445
  .py-1\.5 {
440
446
  padding-block: calc(var(--spacing) * 1.5);
441
447
  }
448
+ .py-3 {
449
+ padding-block: calc(var(--spacing) * 3);
450
+ }
442
451
  .py-5 {
443
452
  padding-block: calc(var(--spacing) * 5);
444
453
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@remotion/design",
3
- "version": "4.0.377",
3
+ "version": "4.0.379",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "module": "dist/esm/index.mjs",
@@ -19,11 +19,11 @@
19
19
  "make": "tsc -d && bun --env-file=../.env.bundle bundle.ts"
20
20
  },
21
21
  "dependencies": {
22
- "@remotion/paths": "4.0.377",
23
- "@remotion/shapes": "4.0.377",
24
- "@remotion/svg-3d-engine": "4.0.377",
22
+ "@remotion/paths": "4.0.379",
23
+ "@remotion/shapes": "4.0.379",
24
+ "@remotion/svg-3d-engine": "4.0.379",
25
25
  "clsx": "^2.1.1",
26
- "remotion": "4.0.377",
26
+ "remotion": "4.0.379",
27
27
  "@radix-ui/react-select": "2.1.1",
28
28
  "lucide-react": "0.439.0"
29
29
  },
@@ -32,7 +32,7 @@
32
32
  "react-dom": ">=16.8.0"
33
33
  },
34
34
  "devDependencies": {
35
- "@remotion/eslint-config-internal": "4.0.377",
35
+ "@remotion/eslint-config-internal": "4.0.379",
36
36
  "eslint": "9.19.0",
37
37
  "react": "19.0.0",
38
38
  "react-dom": "19.0.0",