Icon Caption

export default function IconCaption({
  width = 16,
  color = "#333",
  degree = 0,
  style,
  className,
}) {
  return (
    <svg
      className={className}
      width={width}
      viewBox="0 0 372 261"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      style={{ ...style, transform: "rotate(" + degree + "deg)" }}
    >
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M327 36H45C40.0294 36 36 40.0294 36 45V216C36 220.971 40.0294 225 45 225H327C331.971 225 336 220.971 336 216V45C336 40.0294 331.971 36 327 36ZM45 0C20.1472 0 0 20.1472 0 45V216C0 240.853 20.1472 261 45 261H327C351.853 261 372 240.853 372 216V45C372 20.1472 351.853 0 327 0H45Z"
        fill={color}
      />
      <path
        d="M266.153 147.956V148.442C266.153 159.759 259.17 166.424 249.842 166.424C240.515 166.424 234.23 158.925 233.331 148.442C233.331 148.442 232.508 142.957 232.508 131.848C232.454 125.817 232.775 119.788 233.469 113.797C235.129 101.994 240.867 95.8152 250.188 95.8152C259.509 95.8152 266.838 103.869 266.838 116.088V116.435H298C298 101.231 294.197 87.5533 286.529 78.9442C278.861 70.3351 267.529 66.0053 252.47 66.0053C245.444 65.9171 238.447 66.9242 231.728 68.9907C225.463 70.9689 219.835 74.5876 215.425 79.4744C210.88 84.4985 207.342 91.1636 204.828 99.5644C202.314 107.965 201.056 118.499 201.056 131.293C201.056 143.79 202.094 154.204 204.099 162.605C206.104 171.006 209.127 177.671 213.149 182.67C217.031 187.574 222.284 191.201 228.234 193.084C234.31 195.028 241.433 196 249.604 196C266.869 196 279.308 191.582 286.768 183.017C294.229 174.452 297.849 161.98 297.849 145.595H266.014C266.153 145.595 266.153 147.331 266.153 147.956ZM139.134 147.956V148.442C139.134 159.759 132.157 166.424 122.83 166.424C113.503 166.424 107.217 158.925 106.319 148.442C106.319 148.442 105.495 142.957 105.495 131.848C105.441 125.817 105.762 119.788 106.457 113.797C108.116 101.994 113.855 95.8152 123.176 95.8152C132.497 95.8152 139.825 103.875 139.825 116.088V116.435H171C171 101.231 167.229 87.5533 159.53 78.9442C151.83 70.3351 140.517 66.0053 125.457 66.0053C118.431 65.9171 111.434 66.9242 104.716 68.9907C98.4505 70.9689 92.8229 74.5876 88.4121 79.4744C83.849 84.4732 80.3292 91.1383 77.7711 99.5391C75.2131 107.94 74 118.474 74 131.268C74 143.765 75.0371 154.179 77.0421 162.58C79.047 170.981 82.0703 177.646 86.0928 182.645C89.9742 187.549 95.2274 191.176 101.177 193.059C107.257 195.003 114.381 195.975 122.547 195.975C139.819 195.975 152.258 191.557 159.718 182.992C167.179 174.427 170.912 161.955 170.912 145.57H138.996C139.134 145.595 139.134 147.331 139.134 147.956Z"
        fill={color}
      />
    </svg>
  );
}

import IconCaption from "../../element/icon/IconCaption";

export default function TestView() {
  return (
    <div className="test-view">
      <IconCaption color="var(--txt-bright)" width={50} />
    </div>
  );
}