@kkcompany/app-ui 0.1.9 → 0.1.11

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.cjs CHANGED
@@ -197,25 +197,21 @@ const tagBaseStyles = {
197
197
  gap: "0.4em",
198
198
  color: "var(--tag-color)",
199
199
  justifyContent: "var(--tag-justify-content, flex-start)",
200
- fontSize: "0.75rem",
200
+ fontSize: "0.625rem",
201
201
  wordBreak: "keep-all",
202
202
  "> div": {
203
- padding: "4px 6px",
203
+ padding: "0.4em 0.6em",
204
204
  borderRadius: "0.2em",
205
205
  fontWeight: 600,
206
206
  background: "var(--tag-background)",
207
- boxShadow: "0 2px 4px 0 rgba(0,0,0,0.25)",
208
- height: "18px",
209
- lineHeight: "18px"
207
+ boxShadow: "0 2px 4px 0 rgba(0,0,0,0.25)"
210
208
  }
211
209
  }
212
210
  };
213
- const tagTopStyles = { transformOrigin: "left top" };
214
211
  const tagBottomStyles = {
215
212
  "--tag-justify-content": "flex-end",
216
213
  "--tag-color": "#000",
217
- "--tag-background": "#fff",
218
- transformOrigin: "right bottom"
214
+ "--tag-background": "#fff"
219
215
  };
220
216
  const VideoThumbnail = ({ href, imageUrl, title, progress, topTags = [], bottomTags = [], children, slots = {}, onClick }) => {
221
217
  const components = {
@@ -244,10 +240,7 @@ const VideoThumbnail = ({ href, imageUrl, title, progress, topTags = [], bottomT
244
240
  }),
245
241
  /* @__PURE__ */ (0, __emotion_react_jsx_runtime.jsxs)("div", {
246
242
  css: tagBaseStyles,
247
- children: [/* @__PURE__ */ (0, __emotion_react_jsx_runtime.jsx)("div", {
248
- css: tagTopStyles,
249
- children: topTags?.map((tag) => /* @__PURE__ */ (0, __emotion_react_jsx_runtime.jsx)("div", { children: tag }, tag))
250
- }), bottomTags.length > 0 && /* @__PURE__ */ (0, __emotion_react_jsx_runtime.jsx)("div", {
243
+ children: [/* @__PURE__ */ (0, __emotion_react_jsx_runtime.jsx)("div", { children: topTags?.map((tag) => /* @__PURE__ */ (0, __emotion_react_jsx_runtime.jsx)("div", { children: tag }, tag)) }), bottomTags.length > 0 && /* @__PURE__ */ (0, __emotion_react_jsx_runtime.jsx)("div", {
251
244
  css: [tagBottomStyles, progress >= 0 && { marginBottom: "4px" }],
252
245
  children: bottomTags?.map((tag) => /* @__PURE__ */ (0, __emotion_react_jsx_runtime.jsx)("div", { children: tag }, tag))
253
246
  })]
@@ -301,7 +294,7 @@ const infoStyle = {
301
294
  minWidth: "0"
302
295
  }
303
296
  },
304
- "@media (max-width: 600px)": { "> div:first-of-type > a > div:last-of-type > div": { scale: .6 } }
297
+ "@media (max-width: 600px)": { "> div:first-of-type > a > div:last-of-type > div": { fontSize: "0.45rem" } }
305
298
  };
306
299
  const titleStyle = {
307
300
  display: "-webkit-box",
@@ -319,6 +312,7 @@ const descriptionStyle = {
319
312
  color: "#ccc",
320
313
  textOverflow: "ellipsis",
321
314
  fontSize: "14px",
315
+ "&:empty": { display: "none" },
322
316
  "+ div": {
323
317
  marginTop: "0.25rem",
324
318
  fontSize: "14px",
package/dist/index.d.cts CHANGED
@@ -1,4 +1,4 @@
1
- import * as _emotion_react_jsx_runtime1 from "@emotion/react/jsx-runtime";
1
+ import * as _emotion_react_jsx_runtime0 from "@emotion/react/jsx-runtime";
2
2
  import { CSSObject } from "@emotion/react";
3
3
  import { ElementType, MouseEventHandler, ReactElement, ReactNode } from "react";
4
4
  import Link from "next/link";
@@ -10,7 +10,7 @@ declare const Icon: ({
10
10
  }: {
11
11
  style?: {};
12
12
  src: any;
13
- }) => _emotion_react_jsx_runtime1.JSX.Element;
13
+ }) => _emotion_react_jsx_runtime0.JSX.Element;
14
14
  //#endregion
15
15
  //#region src/SeeMore.d.ts
16
16
  declare const defaultMessages: {
@@ -26,7 +26,7 @@ declare const SeeMore: ({
26
26
  style?: CSSObject;
27
27
  messages?: typeof defaultMessages;
28
28
  children?: ReactNode;
29
- }) => _emotion_react_jsx_runtime1.JSX.Element;
29
+ }) => _emotion_react_jsx_runtime0.JSX.Element;
30
30
  //#endregion
31
31
  //#region src/VideoItem.d.ts
32
32
  type VideoDetail = {
@@ -88,6 +88,6 @@ declare const VideoThumbnail: ({
88
88
  Image?: ElementType;
89
89
  };
90
90
  onClick?: MouseEventHandler<HTMLAnchorElement>;
91
- }) => _emotion_react_jsx_runtime1.JSX.Element;
91
+ }) => _emotion_react_jsx_runtime0.JSX.Element;
92
92
  //#endregion
93
93
  export { Icon, SeeMore, VideoItem, VideoThumbnail };
package/dist/index.mjs CHANGED
@@ -197,25 +197,21 @@ const tagBaseStyles = {
197
197
  gap: "0.4em",
198
198
  color: "var(--tag-color)",
199
199
  justifyContent: "var(--tag-justify-content, flex-start)",
200
- fontSize: "0.75rem",
200
+ fontSize: "0.625rem",
201
201
  wordBreak: "keep-all",
202
202
  "> div": {
203
- padding: "4px 6px",
203
+ padding: "0.4em 0.6em",
204
204
  borderRadius: "0.2em",
205
205
  fontWeight: 600,
206
206
  background: "var(--tag-background)",
207
- boxShadow: "0 2px 4px 0 rgba(0,0,0,0.25)",
208
- height: "18px",
209
- lineHeight: "18px"
207
+ boxShadow: "0 2px 4px 0 rgba(0,0,0,0.25)"
210
208
  }
211
209
  }
212
210
  };
213
- const tagTopStyles = { transformOrigin: "left top" };
214
211
  const tagBottomStyles = {
215
212
  "--tag-justify-content": "flex-end",
216
213
  "--tag-color": "#000",
217
- "--tag-background": "#fff",
218
- transformOrigin: "right bottom"
214
+ "--tag-background": "#fff"
219
215
  };
220
216
  const VideoThumbnail = ({ href, imageUrl, title, progress, topTags = [], bottomTags = [], children, slots = {}, onClick }) => {
221
217
  const components = {
@@ -244,10 +240,7 @@ const VideoThumbnail = ({ href, imageUrl, title, progress, topTags = [], bottomT
244
240
  }),
245
241
  /* @__PURE__ */ jsxs("div", {
246
242
  css: tagBaseStyles,
247
- children: [/* @__PURE__ */ jsx("div", {
248
- css: tagTopStyles,
249
- children: topTags?.map((tag) => /* @__PURE__ */ jsx("div", { children: tag }, tag))
250
- }), bottomTags.length > 0 && /* @__PURE__ */ jsx("div", {
243
+ children: [/* @__PURE__ */ jsx("div", { children: topTags?.map((tag) => /* @__PURE__ */ jsx("div", { children: tag }, tag)) }), bottomTags.length > 0 && /* @__PURE__ */ jsx("div", {
251
244
  css: [tagBottomStyles, progress >= 0 && { marginBottom: "4px" }],
252
245
  children: bottomTags?.map((tag) => /* @__PURE__ */ jsx("div", { children: tag }, tag))
253
246
  })]
@@ -301,7 +294,7 @@ const infoStyle = {
301
294
  minWidth: "0"
302
295
  }
303
296
  },
304
- "@media (max-width: 600px)": { "> div:first-of-type > a > div:last-of-type > div": { scale: .6 } }
297
+ "@media (max-width: 600px)": { "> div:first-of-type > a > div:last-of-type > div": { fontSize: "0.45rem" } }
305
298
  };
306
299
  const titleStyle = {
307
300
  display: "-webkit-box",
@@ -319,6 +312,7 @@ const descriptionStyle = {
319
312
  color: "#ccc",
320
313
  textOverflow: "ellipsis",
321
314
  fontSize: "14px",
315
+ "&:empty": { display: "none" },
322
316
  "+ div": {
323
317
  marginTop: "0.25rem",
324
318
  fontSize: "14px",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kkcompany/app-ui",
3
- "version": "0.1.9",
3
+ "version": "0.1.11",
4
4
  "module": "dist/index.mjs",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.mts",