create-mendix-widget-gleam 1.0.1 → 1.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-mendix-widget-gleam",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Scaffold a Mendix Pluggable Widget powered by Gleam",
   "type": "module",
   "license": "Apache-2.0",

package/src/index.mjs

@@ -130,7 +130,7 @@ Gleam 언어로 Mendix Pluggable Widget을 개발하여 "Hello World"를 화면
 ## Tech Stack
 
 - **Gleam** → JavaScript 컴파일 (target: javascript)
-- **Gleam FFI** (\`@external\` 어노테이션 + \`.ffi.mjs\` 파일) — React API를 Gleam에서 직접 호출
+- **Gleam FFI** (\`@external\` 어노테이션 + FFI 파일) — React API와 Mendix API를 Gleam에서 직접 호출
 - **Mendix Pluggable Widget** (React 19)
 - **Package Manager**: ${pm} (npm 의존성은 \`gleam run -m scripts/install\`로 설치)
 - **Build**: \`@mendix/pluggable-widgets-tools\` (Rollup 기반)
@@ -141,7 +141,12 @@ Gleam 언어로 Mendix Pluggable Widget을 개발하여 "Hello World"를 화면
 src/
   widget/                             # 핵심 Gleam 코드 (개발자가 작업하는 곳)
     ${names.snakeCase}.gleam           #   위젯 메인 모듈
-    ${names.snakeCase}_ffi.mjs         #   React FFI 어댑터
+    react_ffi.mjs                     #   React FFI 어댑터 (React 원시 함수)
+    mendix_ffi.mjs                    #   Mendix FFI 어댑터 (Mendix 런타임 타입 접근)
+    react.gleam                       #   핵심 타입 + createElement + fragment/text/none
+    react/                            #   React 모듈 (prop, hook, event, html)
+    mendix.gleam                      #   Mendix 핵심 타입 + Props 접근자
+    mendix/                           #   Mendix API 모듈 (editable_value, action, list_value 등)
     editor_config.gleam               #   Studio Pro 속성 패널 설정
   scripts/                            # 빌드/개발 스크립트 (gleam run -m으로 실행)
     cmd.gleam                         #   셸 명령어 실행 유틸리티
@@ -167,9 +172,9 @@ docs/
 ## Build Pipeline
 
 \`\`\`
-[src/widget/${names.snakeCase}.gleam] + [src/widget/${names.snakeCase}_ffi.mjs]
+[src/widget/*.gleam] + [src/widget/react_ffi.mjs] + [src/widget/mendix_ffi.mjs]
     ↓  gleam run -m scripts/build
-[build/dev/javascript/${names.snakeCase}/widget/${names.snakeCase}.mjs]
+[build/dev/javascript/${names.snakeCase}/widget/*.mjs]
     ↓  src/${names.pascalCase}.js (브릿지)가 import
     ↓  Rollup (pluggable-widgets-tools build:web)
 [dist/1.0.0/mendix.${names.lowerCase}.${names.pascalCase}.mpk]
@@ -192,9 +197,29 @@ gleam format                     # Gleam 코드 포맷팅
 
 ## Gleam FFI Convention
 
-- FFI 파일명: \`<module_name>_ffi.mjs\`
-- \`@external(javascript, "./<module>_ffi.mjs", "<function>")\` 형식으로 바인딩
-- FFI 파일에는 React API 래핑만 작성. 위젯 로직은 반드시 Gleam으로 작성
+- FFI는 도메인별로 분리: \`react_ffi.mjs\` (React 원시 함수), \`mendix_ffi.mjs\` (Mendix 런타임 타입 접근)
+- \`react.gleam\`/\`mendix.gleam\`에서 \`@external(javascript, "./<ffi>.mjs", "<function>")\` 형식으로 바인딩
+- \`react/*.gleam\`에서 \`@external(javascript, "../react_ffi.mjs", "<function>")\` 형식으로 바인딩
+- \`mendix/*.gleam\`에서 \`@external(javascript, "../mendix_ffi.mjs", "<function>")\` 형식으로 바인딩
+- FFI 파일에는 API 래핑만 작성. 위젯 로직은 반드시 Gleam으로 작성
+- \`mendix_ffi.mjs\`에서 JS \`undefined\`/\`null\` ↔ Gleam \`Option\` 변환 자동 처리
+
+## Mendix API Modules
+
+- \`mendix.gleam\` — \`ValueStatus\`, \`ObjectItem\`, Props 접근자 (\`get_prop\`, \`get_string_prop\`)
+- \`mendix/editable_value.gleam\` — \`EditableValue\` (편집 가능한 값)
+- \`mendix/action.gleam\` — \`ActionValue\` (마이크로플로우/나노플로우 실행)
+- \`mendix/dynamic_value.gleam\` — \`DynamicValue\` (동적 읽기 전용 값)
+- \`mendix/list_value.gleam\` — \`ListValue\`, \`FilterCondition\`, \`SortInstruction\`
+- \`mendix/list_attribute.gleam\` — \`ListAttributeValue\` 등 리스트 연결 타입
+- \`mendix/selection.gleam\` — 단일/다중 선택
+- \`mendix/reference.gleam\` — 참조 관계 값
+- \`mendix/date.gleam\` — \`JsDate\` (JS Date opaque 래퍼)
+- \`mendix/big.gleam\` — \`Big\` (Big.js 고정밀 십진수 래퍼)
+- \`mendix/file.gleam\` — 파일/이미지
+- \`mendix/icon.gleam\` — 아이콘
+- \`mendix/formatter.gleam\` — 값 포맷팅/파싱
+- \`mendix/filter.gleam\` — 필터 조건 빌더
 
 ## Mendix Widget Conventions
 
@@ -205,7 +230,7 @@ gleam format                     # Gleam 코드 포맷팅
 ## Code Style
 
 - Gleam 파일: \`gleam format\` 사용
-- FFI 파일(\`.ffi.mjs\`): React API 노출만 담당, 최소한으로 유지
+- FFI 파일(\`react_ffi.mjs\`, \`mendix_ffi.mjs\`): API 노출만 담당, 비즈니스 로직 금지
 - 한국어 주석 사용
 `;
 
@@ -268,7 +293,10 @@ gleam format                    # 코드 포맷팅
 src/
   widget/                          # Gleam 위젯 코드
     ${names.snakeCase}.gleam        #   메인 위젯 모듈
-    ${names.snakeCase}_ffi.mjs      #   React FFI 어댑터
+    react_ffi.mjs                  #   React FFI 어댑터
+    mendix_ffi.mjs                 #   Mendix FFI 어댑터
+    react.gleam + react/           #   React 모듈 계층
+    mendix.gleam + mendix/         #   Mendix API 모듈 계층
     editor_config.gleam            #   Studio Pro 속성 패널
   scripts/                         # 빌드/개발 스크립트
   ${names.pascalCase}.js             # Mendix 브릿지 진입점
@@ -278,7 +306,7 @@ src/
 ## 기술 스택
 
 - **Gleam** → JavaScript 컴파일
-- **Gleam FFI** — React API 직접 바인딩
+- **Gleam FFI** — React/Mendix API 직접 바인딩
 - **Mendix Pluggable Widget** (React 19)
 - **${pm}** — 패키지 매니저
 

package/template/src/widget/__widget_name__.gleam

@@ -1,17 +1,14 @@
 // Mendix Pluggable Widget - "Hello World"
 // React 함수형 컴포넌트: fn(JsProps) -> ReactElement
 
+import widget/mendix
 import widget/react.{type JsProps, type ReactElement}
 import widget/react/html
 import widget/react/prop
 
-// Props에서 문자열 속성값 추출
-@external(javascript, "./react_ffi.mjs", "get_string_prop")
-fn get_string_prop(props: JsProps, key: String) -> String
-
 /// 위젯 메인 함수 - Mendix 런타임이 React 컴포넌트로 호출
 pub fn widget(props: JsProps) -> ReactElement {
-  let sample_text = get_string_prop(props, "sampleText")
+  let sample_text = mendix.get_string_prop(props, "sampleText")
   html.div(prop.new() |> prop.class("widget-hello-world"), [
     react.text("Hello " <> sample_text),
   ])

package/template/src/widget/mendix/action.gleam

@@ -0,0 +1,41 @@
+// Mendix ActionValue 타입 — 실행 가능한 액션 (마이크로플로우, 나노플로우 등)
+
+import gleam/option.{type Option, None, Some}
+
+// === 타입 ===
+
+pub type ActionValue
+
+// === 접근자 ===
+
+/// 실행 가능 여부
+@external(javascript, "../mendix_ffi.mjs", "get_action_can_execute")
+pub fn can_execute(action: ActionValue) -> Bool
+
+/// 현재 실행 중인지 여부
+@external(javascript, "../mendix_ffi.mjs", "get_action_is_executing")
+pub fn is_executing(action: ActionValue) -> Bool
+
+// === 메서드 ===
+
+/// 액션 실행
+@external(javascript, "../mendix_ffi.mjs", "action_execute")
+pub fn execute(action: ActionValue) -> Nil
+
+// === 편의 함수 (순수 Gleam) ===
+
+/// 실행 가능할 때만 실행
+pub fn execute_if_can(action: ActionValue) -> Nil {
+  case can_execute(action) {
+    True -> execute(action)
+    False -> Nil
+  }
+}
+
+/// Option(ActionValue)를 받아 실행 가능하면 실행
+pub fn execute_action(action: Option(ActionValue)) -> Nil {
+  case action {
+    Some(a) -> execute_if_can(a)
+    None -> Nil
+  }
+}

package/template/src/widget/mendix/big.gleam

@@ -0,0 +1,86 @@
+// Mendix Big.js 타입 — 고정밀 십진수 Gleam opaque 래퍼
+// EditableValue<BigJs.Big>에서 반환되는 Big.js 객체를 타입 안전하게 다룸
+
+import gleam/order.{type Order, Eq, Gt, Lt}
+
+// === 타입 ===
+
+pub type Big
+
+// === 생성 ===
+
+/// 문자열로 Big 생성
+@external(javascript, "../mendix_ffi.mjs", "big_from_string")
+pub fn from_string(s: String) -> Big
+
+/// 정수로 Big 생성
+@external(javascript, "../mendix_ffi.mjs", "big_from_int")
+pub fn from_int(n: Int) -> Big
+
+/// 부동소수점으로 Big 생성
+@external(javascript, "../mendix_ffi.mjs", "big_from_float")
+pub fn from_float(f: Float) -> Big
+
+// === 변환 ===
+
+/// 문자열로 변환
+@external(javascript, "../mendix_ffi.mjs", "big_to_string")
+pub fn to_string(b: Big) -> String
+
+/// Float로 변환 (정밀도 손실 가능)
+@external(javascript, "../mendix_ffi.mjs", "big_to_float")
+pub fn to_float(b: Big) -> Float
+
+/// Int로 변환 (소수점 이하 버림)
+@external(javascript, "../mendix_ffi.mjs", "big_to_int")
+pub fn to_int(b: Big) -> Int
+
+/// 고정 소수점 문자열 (소수점 이하 dp자리)
+@external(javascript, "../mendix_ffi.mjs", "big_to_fixed")
+pub fn to_fixed(b: Big, dp: Int) -> String
+
+// === 산술 ===
+
+/// 덧셈
+@external(javascript, "../mendix_ffi.mjs", "big_add")
+pub fn add(a: Big, b: Big) -> Big
+
+/// 뺄셈
+@external(javascript, "../mendix_ffi.mjs", "big_sub")
+pub fn subtract(a: Big, b: Big) -> Big
+
+/// 곱셈
+@external(javascript, "../mendix_ffi.mjs", "big_mul")
+pub fn multiply(a: Big, b: Big) -> Big
+
+/// 나눗셈
+@external(javascript, "../mendix_ffi.mjs", "big_div")
+pub fn divide(a: Big, b: Big) -> Big
+
+/// 절대값
+@external(javascript, "../mendix_ffi.mjs", "big_abs")
+pub fn absolute(b: Big) -> Big
+
+/// 부호 반전
+@external(javascript, "../mendix_ffi.mjs", "big_negate")
+pub fn negate(b: Big) -> Big
+
+// === 비교 ===
+
+/// 비교 (Gleam Order 반환)
+pub fn compare(a: Big, b: Big) -> Order {
+  case cmp(a, b) {
+    x if x < 0 -> Lt
+    x if x > 0 -> Gt
+    _ -> Eq
+  }
+}
+
+/// 동등 비교
+@external(javascript, "../mendix_ffi.mjs", "big_eq")
+pub fn equal(a: Big, b: Big) -> Bool
+
+// === 내부 FFI ===
+
+@external(javascript, "../mendix_ffi.mjs", "big_cmp")
+fn cmp(a: Big, b: Big) -> Int

package/template/src/widget/mendix/date.gleam

@@ -0,0 +1,80 @@
+// Mendix JS Date 타입 — Gleam opaque 래퍼
+// EditableValue<Date>에서 반환되는 JS Date 객체를 타입 안전하게 다룸
+
+// === 타입 ===
+
+pub type JsDate
+
+// === 생성 ===
+
+/// 현재 시각
+@external(javascript, "../mendix_ffi.mjs", "date_now")
+pub fn now() -> JsDate
+
+/// ISO 8601 문자열로 생성
+@external(javascript, "../mendix_ffi.mjs", "date_from_iso")
+pub fn from_iso(iso_string: String) -> JsDate
+
+/// Unix 타임스탬프(밀리초)로 생성
+@external(javascript, "../mendix_ffi.mjs", "date_from_timestamp")
+pub fn from_timestamp(ms: Int) -> JsDate
+
+/// 날짜/시간 요소로 생성 (month: 1-12)
+@external(javascript, "../mendix_ffi.mjs", "date_create")
+pub fn create(
+  year: Int,
+  month: Int,
+  day: Int,
+  hours: Int,
+  minutes: Int,
+  seconds: Int,
+  milliseconds: Int,
+) -> JsDate
+
+// === 변환 ===
+
+/// ISO 8601 문자열로 변환
+@external(javascript, "../mendix_ffi.mjs", "date_to_iso")
+pub fn to_iso(date: JsDate) -> String
+
+/// Unix 타임스탬프(밀리초) 반환
+@external(javascript, "../mendix_ffi.mjs", "date_get_time")
+pub fn to_timestamp(date: JsDate) -> Int
+
+/// 사람이 읽기 쉬운 문자열로 변환
+@external(javascript, "../mendix_ffi.mjs", "date_to_string")
+pub fn to_string(date: JsDate) -> String
+
+// === 접근자 ===
+
+/// 연도 (4자리)
+@external(javascript, "../mendix_ffi.mjs", "date_get_full_year")
+pub fn year(date: JsDate) -> Int
+
+/// 월 (1-12, Gleam 기준 1-based)
+@external(javascript, "../mendix_ffi.mjs", "date_get_month")
+pub fn month(date: JsDate) -> Int
+
+/// 일 (1-31)
+@external(javascript, "../mendix_ffi.mjs", "date_get_date")
+pub fn day(date: JsDate) -> Int
+
+/// 시 (0-23)
+@external(javascript, "../mendix_ffi.mjs", "date_get_hours")
+pub fn hours(date: JsDate) -> Int
+
+/// 분 (0-59)
+@external(javascript, "../mendix_ffi.mjs", "date_get_minutes")
+pub fn minutes(date: JsDate) -> Int
+
+/// 초 (0-59)
+@external(javascript, "../mendix_ffi.mjs", "date_get_seconds")
+pub fn seconds(date: JsDate) -> Int
+
+/// 밀리초 (0-999)
+@external(javascript, "../mendix_ffi.mjs", "date_get_milliseconds")
+pub fn milliseconds(date: JsDate) -> Int
+
+/// 요일 (0=일요일, 1=월요일, ..., 6=토요일)
+@external(javascript, "../mendix_ffi.mjs", "date_get_day")
+pub fn day_of_week(date: JsDate) -> Int

package/template/src/widget/mendix/dynamic_value.gleam

@@ -0,0 +1,30 @@
+// Mendix DynamicValue 타입 — 동적으로 계산되는 읽기 전용 값
+// 사용: 표현식 속성 (expression property)
+
+import gleam/option.{type Option}
+import widget/mendix.{type ValueStatus}
+
+// === 타입 ===
+
+pub type DynamicValue
+
+// === 접근자 ===
+
+@external(javascript, "../mendix_ffi.mjs", "get_status")
+fn get_status_raw(dv: DynamicValue) -> String
+
+/// 현재 상태 (Available, Loading, Unavailable)
+pub fn status(dv: DynamicValue) -> ValueStatus {
+  mendix.to_value_status(get_status_raw(dv))
+}
+
+/// 현재 값 (undefined → None)
+@external(javascript, "../mendix_ffi.mjs", "get_dynamic_value")
+pub fn value(dv: DynamicValue) -> Option(a)
+
+// === 편의 함수 (순수 Gleam) ===
+
+/// 값이 사용 가능한지 확인
+pub fn is_available(dv: DynamicValue) -> Bool {
+  status(dv) == mendix.Available
+}

package/template/src/widget/mendix/editable_value.gleam

@@ -0,0 +1,73 @@
+// Mendix EditableValue 타입 — 편집 가능한 값의 접근자와 메서드
+// 사용: 텍스트, 숫자, 날짜 등 Mendix 속성 편집
+
+import gleam/option.{type Option}
+import widget/mendix.{type ValueStatus}
+import widget/mendix/formatter.{type ValueFormatter}
+
+// === 타입 ===
+
+pub type EditableValue
+
+// === 접근자 ===
+
+@external(javascript, "../mendix_ffi.mjs", "get_status")
+fn get_status_raw(ev: EditableValue) -> String
+
+/// 현재 상태 (Available, Loading, Unavailable)
+pub fn status(ev: EditableValue) -> ValueStatus {
+  mendix.to_value_status(get_status_raw(ev))
+}
+
+/// 현재 값 (undefined → None)
+@external(javascript, "../mendix_ffi.mjs", "get_editable_value")
+pub fn value(ev: EditableValue) -> Option(a)
+
+/// 읽기 전용 여부
+@external(javascript, "../mendix_ffi.mjs", "get_editable_read_only")
+pub fn read_only(ev: EditableValue) -> Bool
+
+/// 유효성 검사 메시지 (없으면 None)
+@external(javascript, "../mendix_ffi.mjs", "get_editable_validation")
+pub fn validation(ev: EditableValue) -> Option(String)
+
+/// 표시용 문자열 (포맷팅 적용된 값)
+@external(javascript, "../mendix_ffi.mjs", "get_editable_display_value")
+pub fn display_value(ev: EditableValue) -> String
+
+/// 값 포매터
+@external(javascript, "../mendix_ffi.mjs", "get_editable_formatter")
+pub fn get_formatter(ev: EditableValue) -> ValueFormatter
+
+/// 가능한 값 목록 (열거형 속성 등)
+@external(javascript, "../mendix_ffi.mjs", "get_editable_universe")
+pub fn universe(ev: EditableValue) -> Option(List(a))
+
+// === 메서드 ===
+
+/// 값 설정 (None → undefined 전달)
+@external(javascript, "../mendix_ffi.mjs", "editable_set_value")
+pub fn set_value(ev: EditableValue, value: Option(a)) -> Nil
+
+/// 텍스트 값 직접 설정 (파싱은 Mendix가 처리)
+@external(javascript, "../mendix_ffi.mjs", "editable_set_text_value")
+pub fn set_text_value(ev: EditableValue, text: String) -> Nil
+
+/// 유효성 검사기 설정 (None → 검사기 제거)
+@external(javascript, "../mendix_ffi.mjs", "editable_set_validator")
+pub fn set_validator(
+  ev: EditableValue,
+  validator: Option(fn(Option(a)) -> Option(String)),
+) -> Nil
+
+// === 편의 함수 (순수 Gleam) ===
+
+/// 값이 사용 가능한지 확인
+pub fn is_available(ev: EditableValue) -> Bool {
+  status(ev) == mendix.Available
+}
+
+/// 편집 가능한 상태인지 확인 (사용 가능 + 읽기 전용 아님)
+pub fn is_editable(ev: EditableValue) -> Bool {
+  is_available(ev) && !read_only(ev)
+}

package/template/src/widget/mendix/file.gleam

@@ -0,0 +1,34 @@
+// Mendix FileValue / WebImage 타입 — 파일 및 이미지 속성
+// FileValue: 일반 파일, WebImage: 이미지 (altText 추가)
+
+import gleam/option.{type Option}
+
+// === 타입 ===
+
+pub type FileValue
+
+pub type WebImage
+
+// === FileValue 접근자 ===
+
+/// 파일 URI
+@external(javascript, "../mendix_ffi.mjs", "get_file_uri")
+pub fn uri(f: FileValue) -> String
+
+/// 파일 이름 (없으면 None)
+@external(javascript, "../mendix_ffi.mjs", "get_file_name")
+pub fn name(f: FileValue) -> Option(String)
+
+// === WebImage 접근자 (FileValue 확장) ===
+
+/// 이미지 URI
+@external(javascript, "../mendix_ffi.mjs", "get_file_uri")
+pub fn image_uri(img: WebImage) -> String
+
+/// 이미지 파일 이름 (없으면 None)
+@external(javascript, "../mendix_ffi.mjs", "get_file_name")
+pub fn image_name(img: WebImage) -> Option(String)
+
+/// 이미지 대체 텍스트 (없으면 None)
+@external(javascript, "../mendix_ffi.mjs", "get_image_alt_text")
+pub fn alt_text(img: WebImage) -> Option(String)

package/template/src/widget/mendix/filter.gleam

@@ -0,0 +1,109 @@
+// Mendix Filter 조건 빌더 — mendix/filters/builders 래핑
+// 사용: ListValue의 필터 조건 프로그래매틱 구성
+
+import widget/mendix/list_value.{type FilterCondition}
+
+// === 타입 ===
+
+/// 필터 표현식 (attribute, literal, association, empty)
+pub type ValueExpression
+
+// === Boolean 조합 ===
+
+/// AND 조합 (모든 조건 충족)
+@external(javascript, "../mendix_ffi.mjs", "filter_and")
+pub fn and_(conditions: List(FilterCondition)) -> FilterCondition
+
+/// OR 조합 (하나 이상 충족)
+@external(javascript, "../mendix_ffi.mjs", "filter_or")
+pub fn or_(conditions: List(FilterCondition)) -> FilterCondition
+
+/// NOT 부정
+@external(javascript, "../mendix_ffi.mjs", "filter_not")
+pub fn not_(condition: FilterCondition) -> FilterCondition
+
+// === 동등 비교 ===
+
+@external(javascript, "../mendix_ffi.mjs", "filter_equals")
+pub fn equals(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_not_equal")
+pub fn not_equal(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+// === 크기 비교 ===
+
+@external(javascript, "../mendix_ffi.mjs", "filter_greater_than")
+pub fn greater_than(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_greater_than_or_equal")
+pub fn greater_than_or_equal(
+  a: ValueExpression,
+  b: ValueExpression,
+) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_less_than")
+pub fn less_than(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_less_than_or_equal")
+pub fn less_than_or_equal(
+  a: ValueExpression,
+  b: ValueExpression,
+) -> FilterCondition
+
+// === 문자열 검색 ===
+
+@external(javascript, "../mendix_ffi.mjs", "filter_contains")
+pub fn contains(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_starts_with")
+pub fn starts_with(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_ends_with")
+pub fn ends_with(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+// === 날짜 비교 ===
+
+@external(javascript, "../mendix_ffi.mjs", "filter_day_equals")
+pub fn day_equals(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_day_not_equal")
+pub fn day_not_equal(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_day_greater_than")
+pub fn day_greater_than(
+  a: ValueExpression,
+  b: ValueExpression,
+) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_day_greater_than_or_equal")
+pub fn day_greater_than_or_equal(
+  a: ValueExpression,
+  b: ValueExpression,
+) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_day_less_than")
+pub fn day_less_than(a: ValueExpression, b: ValueExpression) -> FilterCondition
+
+@external(javascript, "../mendix_ffi.mjs", "filter_day_less_than_or_equal")
+pub fn day_less_than_or_equal(
+  a: ValueExpression,
+  b: ValueExpression,
+) -> FilterCondition
+
+// === 표현식 생성 ===
+
+/// 속성 참조 표현식 (속성 ID로 지정)
+@external(javascript, "../mendix_ffi.mjs", "filter_attribute")
+pub fn attribute(id: String) -> ValueExpression
+
+/// 연관 관계 참조 표현식 (연관 ID로 지정)
+@external(javascript, "../mendix_ffi.mjs", "filter_association")
+pub fn association(id: String) -> ValueExpression
+
+/// 리터럴 값 표현식
+@external(javascript, "../mendix_ffi.mjs", "filter_literal")
+pub fn literal(value: a) -> ValueExpression
+
+/// 빈 값 표현식
+@external(javascript, "../mendix_ffi.mjs", "filter_empty")
+pub fn empty() -> ValueExpression

package/template/src/widget/mendix/formatter.gleam

@@ -0,0 +1,18 @@
+// Mendix ValueFormatter 타입 — 값 포맷팅/파싱
+// 사용: EditableValue, ListAttributeValue 등의 포매터
+
+import gleam/option.{type Option}
+
+// === 타입 ===
+
+pub type ValueFormatter
+
+// === 메서드 ===
+
+/// 값을 표시 문자열로 포맷팅 (None → 빈 값 포맷)
+@external(javascript, "../mendix_ffi.mjs", "formatter_format")
+pub fn format(fmt: ValueFormatter, value: Option(a)) -> String
+
+/// 문자열을 값으로 파싱 (실패 시 Error(Nil))
+@external(javascript, "../mendix_ffi.mjs", "formatter_parse")
+pub fn parse(fmt: ValueFormatter, text: String) -> Result(Option(a), Nil)

package/template/src/widget/mendix/icon.gleam

@@ -0,0 +1,34 @@
+// Mendix WebIcon 타입 — 아이콘 (글리프, 이미지, 아이콘 폰트)
+// Studio Pro에서 설정한 아이콘 속성
+
+// === 타입 ===
+
+pub type WebIcon
+
+pub type IconType {
+  Glyph
+  Image
+  IconFont
+}
+
+// === 접근자 ===
+
+@external(javascript, "../mendix_ffi.mjs", "get_icon_type")
+fn get_icon_type_raw(icon: WebIcon) -> String
+
+/// 아이콘 종류 (Glyph, Image, IconFont)
+pub fn icon_type(icon: WebIcon) -> IconType {
+  case get_icon_type_raw(icon) {
+    "glyph" -> Glyph
+    "image" -> Image
+    _ -> IconFont
+  }
+}
+
+/// 아이콘 CSS 클래스 (Glyph, IconFont에서 사용)
+@external(javascript, "../mendix_ffi.mjs", "get_icon_class")
+pub fn icon_class(icon: WebIcon) -> String
+
+/// 아이콘 이미지 URL (Image에서 사용)
+@external(javascript, "../mendix_ffi.mjs", "get_icon_url")
+pub fn icon_url(icon: WebIcon) -> String